/* Bifröst — la passerelle. Palette « givre et fjord » : fonds froids, encre
   bleu-nuit, un seul accent chaud (l'or de Draupnirr) et l'arc-en-ciel du pont
   réservé au rail de progression. */
/* IBM Plex embarqué (ui/vendor/fonts, OFL) : sous-ensemble latin, le reste retombe sur la police système. */
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(./vendor/fonts/ibm-plex-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(./vendor/fonts/ibm-plex-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(./vendor/fonts/ibm-plex-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url(./vendor/fonts/ibm-plex-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(./vendor/fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(./vendor/fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}
:root{
  --bg:#EEF1F5;--surface:#FFFFFF;--sunk:#F6F8FB;--ink:#121821;--mut:#556275;--line:#D6DCE5;--line-strong:#C3CBD7;
  --night:#0F1A2B;--night-2:#1C2B44;--night-ink:#E8EDF4;--night-mut:#B8C5D6;--night-line:#2B3B55;
  --pop-shadow:0 12px 32px -12px rgba(15,26,43,.35),0 2px 6px rgba(15,26,43,.08);
  --fjord:#1F3B63;--fjord-ink:#FFFFFF;--fjord-soft:#E5ECF6;
  --gold:#8C640E;--gold-soft:#F6ECCF;
  --ok:#1D7A46;--ok-soft:#DFF2E6;--sim:#4F9A6C;--sim-soft:#EDF7F1;--rv:#5B44B0;--rv-soft:#ECE8F8;--run:#2F5D9E;--run-soft:#EEF4FC;--warn:#8A5A0B;--warn-soft:#FBF0D5;--err:#A32D2D;--err-soft:#F9E1E1;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:10px;--shadow:0 1px 2px rgba(20,26,34,.06),0 8px 24px -12px rgba(20,26,34,.18);
  --rainbow:linear-gradient(90deg,#C94E6B,#D99A3E,#C9C04A,#52A77A,#3E8ED0,#7B6BD6);
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0F141B;--surface:#171D26;--sunk:#121820;--ink:#E8ECF1;--mut:#94A0B1;--line:#283240;--line-strong:#3A4656;
  --fjord:#8DB8EA;--fjord-ink:#0E1724;--fjord-soft:#1C2A3C;
  --gold:#E3BB4F;--gold-soft:#3A3014;
  --ok:#5DC487;--ok-soft:#17311F;--sim:#9AD8B1;--sim-soft:#1A2A21;--rv:#B9A8F2;--rv-soft:#272042;--run:#9CC5F2;--run-soft:#1A2A40;--warn:#E0B04C;--warn-soft:#3A2E12;--err:#F08080;--err-soft:#3F1C1C;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px -16px rgba(0,0,0,.6);
  --night:#0A111C;--night-2:#172338;--night-line:#24324A;
  --pop-shadow:0 16px 40px -12px rgba(0,0,0,.7),0 0 0 1px #283240;
}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 var(--sans);font-variant-numeric:tabular-nums;padding-top:59px}
[hidden]{display:none!important}
h1,h2,h3,p{margin:0}
h1{font-size:22px;font-weight:650;letter-spacing:-.02em;line-height:1.2}
h2{font-size:13px;font-weight:650;letter-spacing:.02em;text-transform:uppercase;color:var(--mut)}
a{color:var(--fjord)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mut{color:var(--mut)}.pre{white-space:pre-line}
.mono{font-family:var(--mono);font-size:13px}
.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.grow{flex:1 1 auto;min-width:0}

/* ---- en-tête fixe ---- */
/* Bandeau de nuit, et l'arc-en-ciel du pont en filet dessous. */
.top{position:fixed;inset:0 0 auto 0;height:56px;z-index:20;display:flex;align-items:center;gap:14px;padding:0 20px;background:var(--night);color:var(--night-ink)}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:var(--rainbow)}
.top .brand .ver{color:var(--night-mut)}
.top .who{color:var(--night-mut);border-color:var(--night-line)}
.top button.ghost{color:var(--night-ink)}.top button.ghost:hover{background:var(--night-2)}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;margin-right:auto}
.brand:has(+.views:not([hidden])){margin-right:12px}
.brand .mark{width:30px;height:30px;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.brand .name{font-size:18px;font-weight:700;letter-spacing:-.03em}
.brand .ver{font-family:var(--mono);font-size:11px;color:var(--mut);padding-top:3px}
.who{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--mut);padding:6px 12px;border:1px solid var(--line);border-radius:999px;white-space:nowrap;max-width:50vw;overflow:hidden;text-overflow:ellipsis}
.who .i{width:16px;height:16px}

/* ---- boutons et champs ---- */
button,.btn{font:inherit;font-weight:550;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);height:40px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .15s,border-color .15s,transform .05s}
button:hover,.btn:hover{background:var(--sunk);border-color:var(--mut)}
button:active{transform:translateY(1px)}
button.primary{background:var(--fjord);border-color:var(--fjord);color:var(--fjord-ink)}
button.primary:hover{filter:brightness(1.08)}
button.ghost{background:transparent;border-color:transparent}
button.ghost:hover{background:var(--sunk);border-color:transparent}
button:disabled{opacity:.45;cursor:not-allowed;transform:none;filter:none}
button.busy{position:relative;color:transparent!important}
button.busy::after{content:"";position:absolute;width:16px;height:16px;border:2px solid var(--mut);border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
button.primary.busy::after{border-color:var(--fjord-ink);border-right-color:transparent}
@keyframes spin{to{transform:rotate(360deg)}}
:focus-visible{outline:2px solid var(--fjord);outline-offset:2px}

label,.label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:550;color:var(--mut);min-width:0}
.lbl{font-size:12px;font-weight:550;color:var(--mut);margin-bottom:5px}
input,select,textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);height:40px;padding:0 12px;width:100%;min-width:0}
@media (min-width:640px){input,select,textarea{font-size:14px}}
input.mono,textarea{font-family:var(--mono)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--fjord);outline-offset:-1px;border-color:var(--fjord)}
textarea{height:280px;padding:10px 12px;resize:vertical;line-height:1.45;font-size:13px}
textarea.short{height:120px}
.with-icon{position:relative;display:flex;align-items:center}
.with-icon .i{position:absolute;left:11px;color:var(--mut);pointer-events:none}
.with-icon input{padding-left:36px}
.switch{flex-direction:row;align-items:center;gap:8px;font-size:13px;color:var(--ink);font-weight:500;cursor:pointer;white-space:nowrap}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch span{width:34px;height:20px;border-radius:999px;background:var(--line-strong);position:relative;flex:none;transition:background .15s}
.switch span::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.switch input:checked+span{background:var(--fjord)}
.switch input:checked+span::after{transform:translateX(14px)}
.switch input:focus-visible+span{outline:2px solid var(--fjord);outline-offset:2px}

.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.row.end{justify-content:flex-end}
.row>label.switch{align-self:center;padding-bottom:0}
.stack{display:flex;flex-direction:column;gap:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}

/* segmenté : onglets dossier / client, source locale / ssh */
.seg{display:inline-flex;background:var(--sunk);border:1px solid var(--line);border-radius:var(--r);padding:3px;gap:2px}
.seg>button,.seg>label{height:32px;border:0;background:transparent;border-radius:7px;padding:0 12px;font-size:13px;font-weight:550;color:var(--mut);display:inline-flex;align-items:center;gap:7px;cursor:pointer;flex-direction:row}
.seg>button.on,.seg>label:has(input:checked){background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.seg input{position:absolute;opacity:0;width:0;height:0}
.seg .i{width:16px;height:16px}

/* ---- bandeaux ---- */
.banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 20px;border-bottom:1px solid var(--line);font-size:13px}
.banner.warn{background:var(--warn-soft);color:var(--ink)}.banner.warn>.i{color:var(--warn)}
.banner.info{background:var(--fjord-soft)}.banner.info>.i{color:var(--fjord)}
.banner button{height:34px}

/* ---- rail du pont : la signature ---- */
main{max-width:980px;margin:0 auto;padding:20px 16px 60px}
/* Onglets de vue dans le bandeau de nuit ; icônes seules sur téléphone. */
.views{display:flex;gap:2px;margin-right:auto}
.views button{height:40px;border:0;background:transparent;color:var(--night-mut);padding:0 12px;border-radius:8px;font-weight:500}
.views button:hover{background:var(--night-2);color:var(--night-ink);border:0}
.views button.on{background:var(--night-2);color:#FFFFFF;font-weight:600}
.bridge{position:relative;margin:8px 0 24px;padding:0 4px}
.list.tbl .x{display:grid;grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr) 150px;gap:10px;align-items:center;padding:8px 12px}
.list.tbl .x.h{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em;background:var(--sunk);position:sticky;top:0;z-index:1}
.list.tbl .x.none{opacity:.55}
.list.tbl .b{display:grid;grid-template-columns:18px minmax(0,1.3fr) 72px minmax(0,1fr) 28px;gap:12px;align-items:center;padding:9px 12px}
.list.tbl .b.h{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em;background:var(--sunk);position:sticky;top:0;z-index:1}
.bdg.wait{background:var(--line);color:var(--mut)}.bdg.run{background:var(--run-soft);color:var(--run)}.bdg.pub{background:var(--ok-soft);color:var(--ok)}.bdg.sim{background:var(--sim-soft);color:var(--sim)}.bdg.rev{background:var(--warn-soft);color:var(--warn)}.bdg.rv{background:var(--rv-soft);color:var(--rv)}.bdg.err{background:var(--err-soft);color:var(--err)}.bdg.dup{background:var(--gold-soft);color:var(--gold)}.bdg.ign{background:var(--sunk);color:var(--mut);border:1px solid var(--line)}
.grid .span2{grid-column:span 2}
.list.tbl .x .ok{color:var(--ok)}.list.tbl .x .err{color:var(--err)}
@media (max-width:800px){.list.tbl .x{grid-template-columns:minmax(0,1fr) 110px}.list.tbl .x>:nth-child(2),.list.tbl .x>:nth-child(3){display:none}}
.bridge ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.bridge .span{position:absolute;left:12.5%;right:12.5%;top:13px;height:2px;background:var(--line-strong);border-radius:2px;overflow:hidden}
.bridge .fill{height:100%;width:0;background:var(--rainbow);opacity:.9;transition:width .5s cubic-bezier(.4,0,.2,1)}
.bridge li button{height:auto;padding:0;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;color:var(--mut);font-weight:550;font-size:13px}
.bridge li button:hover{background:transparent}
.bridge li button:disabled{opacity:.6;cursor:default}
.bridge li button i{font-style:normal;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--bg);border:2px solid var(--line-strong);font-family:var(--mono);font-size:12px;transition:border-color .2s,background .2s;position:relative;z-index:1}
.bridge li.done button i{background:var(--fjord);border-color:var(--fjord);color:var(--fjord-ink)}
.bridge li.on button{color:var(--ink)}
.bridge li.on button i{border-color:var(--gold);background:var(--surface);color:var(--ink);box-shadow:0 0 0 4px var(--gold-soft)}
.bridge li.reach:not(.on) button:hover i{border-color:var(--fjord)}
@media (max-width:640px){.bridge li button span{font-size:11px;text-align:center;line-height:1.2}}

/* ---- panneau d'étape ---- */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:22px;display:flex;flex-direction:column;gap:16px}
.ph{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.ph .eyebrow{margin-bottom:4px}
.pf{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--line)}
/* Barre d'action collée au bas de l'écran tant que le panneau dépasse : le bouton de l'étape reste toujours visible, pas besoin de descendre. */
.pf{position:sticky;bottom:0;z-index:5;margin:0 -22px -22px;padding:14px 22px;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(8px);border-top:1px solid var(--line);border-radius:0 0 14px 14px;box-shadow:0 -10px 24px -16px rgba(0,0,0,.35)}
@media (max-width:640px){.pf{margin:0 -16px -16px;padding:12px 16px}}
.focus{display:grid;place-items:center;min-height:calc(100vh - 140px)}
.focus .card{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:28px;width:min(440px,100%);display:flex;flex-direction:column;gap:14px}
.glyph{width:44px;height:44px;border-radius:12px;background:var(--fjord-soft);color:var(--fjord);display:grid;place-items:center}
.glyph .i{width:22px;height:22px}
.field-err{color:var(--err);font-size:13px;min-height:1em}
.field-err:empty{display:none}
.note{font-size:13px;color:var(--mut);padding:8px 12px;background:var(--sunk);border-radius:var(--r)}
.note.err{color:var(--err);background:var(--err-soft)}

/* ---- listes : dossier et client ---- */
.list{border:1px solid var(--line);border-radius:var(--r);max-height:420px;overflow:auto;background:var(--surface)}
.list .empty{padding:28px;text-align:center;color:var(--mut);display:flex;flex-direction:column;align-items:center;gap:8px}
.list .empty .i{width:28px;height:28px;opacity:.5}
.list .e{display:flex;gap:10px;padding:9px 12px;border-top:1px solid var(--line);cursor:pointer;align-items:center;min-height:44px}
.list .e:first-child{border-top:0}
.list .e:hover{background:var(--sunk)}
.list .e.sel{background:var(--fjord-soft);box-shadow:inset 3px 0 0 var(--fjord)}
.list .e>.i{color:var(--mut)}.list .e.dir>.i{color:var(--gold)}
.list .e .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:13px}
.list .e .sz{color:var(--mut);font-size:12px;white-space:nowrap}
.list.tbl .b.pk{cursor:pointer;user-select:none}.list.tbl .b.pk:hover{background:var(--sunk)}
.list.tbl .b input[type=checkbox]{flex:none;width:16px;height:16px;padding:0;margin:0;accent-color:var(--fjord);cursor:pointer}
.list.tbl .b.off .nm b{color:var(--mut);text-decoration:line-through}
.list .e .enter{height:28px;width:28px;padding:0;border-radius:7px;opacity:0}
.list .e:hover .enter,.list .e.sel .enter{opacity:1}
@media (hover:none){.list .e .enter{opacity:1}}

.list.tbl .e{display:grid;grid-template-columns:minmax(0,1fr) 90px 130px 150px;gap:10px;padding:8px 12px}
.list.tbl .h{position:sticky;top:0;z-index:1;background:var(--sunk);border-bottom:1px solid var(--line);cursor:default;min-height:0;padding:0 12px}
.list.tbl .h:hover{background:var(--sunk)}
.list.tbl .h button{height:34px;padding:0;border:0;background:transparent;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);justify-content:flex-start;gap:5px}
.list.tbl .h button .i{width:13px;height:13px;opacity:.45}
.list.tbl .h button.on{color:var(--ink)}.list.tbl .h button.on .i{opacity:1}
.list.tbl .h button.on.desc .i{transform:scaleY(-1)}
.list.tbl .nm{font-family:var(--mono);font-size:13px;overflow:hidden;min-width:0}
.list.tbl .nm b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.list.tbl .nm small{display:block;color:var(--mut);font-family:var(--sans);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.list.tbl .r{text-align:right;color:var(--mut);font-size:12px}
.list.tbl .e.dim{opacity:.55}
.list.tbl .e.dim.sel{opacity:1}
@media (max-width:640px){
  .list.tbl .e{grid-template-columns:minmax(0,1fr) auto;row-gap:4px}
  .list.tbl .h>:nth-child(n+3){display:none}
  .list.tbl .e:not(.h)>:nth-child(3){grid-column:1/-1}
  .list.tbl .e:not(.h)>:nth-child(4){grid-column:1/-1}
  .list.tbl .dash{display:none}
}
.bdg{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;white-space:nowrap;line-height:1.5}
.bdg .i{width:12px;height:12px}
.bdg.seed{background:var(--ok-soft);color:var(--ok)}.bdg.part{background:var(--warn-soft);color:var(--warn)}
.bdg.dead{background:var(--err-soft);color:var(--err)}.bdg.x{background:var(--sunk);color:var(--mut);border:1px solid var(--line)}
.bdg.site{background:var(--gold-soft);color:var(--gold)}

/* préparation */
.prep{display:flex;flex-direction:column;gap:10px}
.stages{display:flex;gap:6px;flex-wrap:wrap}
.stages span{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;border:1px solid var(--line);color:var(--mut)}
.stages span.on{border-color:var(--gold);color:var(--ink);background:var(--gold-soft)}
.stages span.done{border-color:var(--ok);color:var(--ok)}
.stages span.err{border-color:var(--err);color:var(--err)}
.bar{height:6px;background:var(--line);border-radius:3px;overflow:hidden}
.bar div{height:100%;width:0;background:var(--rainbow);transition:width .3s}
.bar.indet div{width:40%;animation:slide 1.2s ease-in-out infinite alternate}
@keyframes slide{from{transform:translateX(-100%)}to{transform:translateX(250%)}}

/* ---- TMDB ---- */
.tmdb{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.tmdb .c{display:flex;justify-content:flex-start;gap:12px;padding:10px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:var(--surface);text-align:left;height:auto;align-items:flex-start;font-weight:400;white-space:normal;min-height:100px}
.tmdb .c:hover{border-color:var(--fjord)}
.tmdb .c.sel{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
.tmdb .c img{width:56px;height:84px;object-fit:cover;border-radius:6px;background:var(--sunk);flex:none}
.tmdb .c b{display:block;font-weight:600}
.tmdb .c .mut{font-size:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tmdb .empty{grid-column:1/-1;color:var(--mut);padding:16px;text-align:center}
/* ---- musique : éditions MusicBrainz, types, pistes ---- */
.tmdb.mb .c img{width:64px;height:64px}
.tmdb.mb .c .bdg{margin-top:6px}
.types{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.types .lbl{margin:0 4px 0 0}
.types button{height:28px;padding:0 10px;border-radius:999px;font:500 12px var(--mono);color:var(--mut)}
.types button.on{background:var(--fjord-soft);color:var(--fjord);border-color:var(--fjord)}
.tracks{list-style:none;margin:0;padding:0;font-size:13px;max-height:260px;overflow:auto;columns:2 280px;column-gap:24px}
.tracks li{display:flex;gap:8px;break-inside:avoid;padding:1px 0}
.tracks li .d{margin-left:auto;padding-left:8px}

/* fiche */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{padding:3px 10px;border-radius:999px;font-size:12px;background:var(--sunk);border:1px solid var(--line);font-family:var(--mono)}
.chip.probed{background:var(--ok-soft);color:var(--ok);border-color:transparent}
.chip.declared{background:var(--fjord-soft);color:var(--fjord);border-color:transparent}
.legend{display:flex;gap:6px;font-size:11px}.legend .chip{font-family:var(--sans);font-size:11px;padding:1px 8px}
.built{background:var(--sunk);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;position:relative}
.built.loading::after{content:"";position:absolute;inset:0;border-radius:12px;background:color-mix(in srgb,var(--surface) 60%,transparent)}
.big{font-size:15px;word-break:break-all;font-weight:500}
.warn-text{color:var(--warn);font-size:13px}.warn-text:empty{display:none}
.msgs{display:flex;flex-direction:column;gap:6px}
.msg{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border-radius:var(--r);font-size:13px}
.msg .i{margin-top:1px}
.msg.ok{background:var(--ok-soft);color:var(--ok)}.msg.warn{background:var(--warn-soft);color:var(--warn)}.msg.err{background:var(--err-soft);color:var(--err)}.msg.info{background:var(--fjord-soft);color:var(--fjord)}
.msg .mono{word-break:break-all}

/* présentation */
/* éditeur assisté + aperçu en temps réel */
.editor{display:flex;flex-direction:column;gap:10px}
.editor .tabs{align-self:flex-start}
.editor[data-tab=edit] .pv,.editor[data-tab=preview] .ed{display:none}
.ed{display:flex;flex-direction:column;gap:0;position:relative}
.tb{display:flex;flex-wrap:wrap;gap:2px;align-items:center;padding:6px;background:var(--sunk);border:1px solid var(--line-strong);border-bottom:0;border-radius:var(--r) var(--r) 0 0}
.tb button{height:32px;width:32px;padding:0;border:0;background:transparent;border-radius:7px;color:var(--mut)}
.tb button:hover{background:var(--surface);color:var(--ink)}
.tb .sep{width:1px;height:20px;background:var(--line-strong);margin:0 4px}
.tb select{height:32px;font-size:13px;width:auto;max-width:220px;margin-left:auto;padding:0 8px;border-color:transparent;background:transparent;color:var(--mut)}
.tb select:hover{color:var(--ink)}
.ed textarea{border-radius:0 0 var(--r) var(--r);height:360px;margin:0}
.pop{position:fixed;inset:auto;margin:0;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);box-shadow:var(--shadow);padding:8px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;max-width:calc(100% - 12px)}
.pop:not(:popover-open){display:none}
.pop input{height:34px;font-size:14px;width:260px;max-width:100%}
.pop button{height:34px;padding:0 12px}
.pop .sw{width:28px;height:28px;padding:0;border-radius:50%;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line-strong)}
.pop .sw:hover{transform:scale(1.1)}
.pv{display:flex;flex-direction:column;min-width:0}
.pvh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;margin-bottom:5px}
.pvh .lbl{margin:0}
.preview{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;height:404px;overflow:auto;font-size:14px;line-height:1.55;word-break:break-word}
.preview:empty::before{content:"L'aperçu suit ce que tu écris.";color:var(--mut)}
@media (min-width:1000px){.editor{display:grid;grid-template-columns:1fr 1fr;gap:12px}.editor .tabs{display:none}.editor .pv,.editor .ed{display:flex!important}}
/* rendu « fiche » : mêmes classes que RichText côté Draupnirr */
.rt img{max-width:100%;height:auto;border-radius:6px;margin:4px 0}
.rt .rt-h2,.rt h2{font:650 18px/1.3 var(--sans);letter-spacing:-.01em;text-transform:none;color:var(--ink);margin:14px 0 6px;padding-bottom:4px;border-bottom:1px solid var(--line)}
.rt .rt-h3,.rt h3{font:600 15px/1.3 var(--sans);margin:12px 0 4px}
.rt blockquote{margin:8px 0;padding:8px 12px;border-left:3px solid var(--gold);background:var(--sunk);border-radius:0 6px 6px 0;color:var(--mut)}
.rt pre,.rt .bbcode-code{font:12px/1.4 var(--mono);background:var(--sunk);border:1px solid var(--line);border-radius:6px;padding:10px;overflow:auto;white-space:pre}
.rt code{font:12px var(--mono);background:var(--sunk);padding:1px 5px;border-radius:4px}
.rt pre code{padding:0;background:none}
.rt details{border:1px solid var(--line);border-radius:6px;padding:6px 10px;margin:6px 0;background:var(--sunk)}
.rt summary{cursor:pointer;font-weight:600;color:var(--fjord)}
.rt ul,.rt ol{padding-left:22px;margin:6px 0}
.rt hr{border:0;border-top:1px solid var(--line-strong);margin:12px 0}
.rt a{color:var(--fjord);text-decoration:underline}
.rt table{border-collapse:collapse;margin:8px 0}.rt td{border:1px solid var(--line);padding:4px 8px}
.rt center,.rt div{max-width:100%}
.imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:8px}
.imgs button{height:auto;padding:0;border:3px solid transparent;border-radius:10px;overflow:hidden;background:var(--sunk);position:relative}
.imgs button img{width:100%;height:70px;object-fit:cover;display:block}
.imgs button.sel{border-color:var(--gold)}
.imgs button.sel::after{content:"";position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;background:var(--gold)}

/* ---- tiroir des réglages ---- */
.drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(560px,100%);height:100dvh;max-height:100dvh;max-width:100%;border:0;border-left:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0;display:flex;flex-direction:column;box-shadow:var(--shadow)}
.drawer:not([open]){display:none}
.drawer::backdrop{background:rgba(10,14,20,.45);backdrop-filter:blur(2px)}
.drawer>header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line);flex:none}
.drawer>header h1{font-size:17px;display:flex;align-items:center;gap:10px}
.drawer .body{overflow:auto;padding:4px 20px 40px;display:flex;flex-direction:column}
.drawer section{padding:20px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.drawer section:last-child{border-bottom:0}
.status{font-size:13px;display:flex;gap:8px;align-items:flex-start}.status:empty{display:none}
.status.ok{color:var(--ok)}.status.err{color:var(--err)}.status.warn{color:var(--warn)}
.status code{font-family:var(--mono);background:var(--sunk);padding:1px 5px;border-radius:4px;word-break:break-all}
.steps{display:flex;flex-direction:column;gap:4px;font-size:13px}.steps div{display:flex;gap:8px;align-items:flex-start}
.steps .ok{color:var(--ok)}.steps .err{color:var(--err)}
.callout{padding:12px 14px;border-radius:var(--r);display:flex;flex-direction:column;gap:10px;font-size:13px}
.callout.warn{background:var(--warn-soft);color:var(--ink)}
.callout button{align-self:flex-start}

/* ---- toasts ---- */
@keyframes rise{from{opacity:0;transform:translateY(8px)}}

@media (max-width:640px){
  .top{padding:0 14px;gap:8px}
  .top #gear span{display:none}
  .top #gear{padding:0 10px}
  .who{max-width:40vw}
  .brand .name,.brand .ver,.views span,.top .who{display:none}
  .views button{padding:0 12px;min-width:44px;height:44px}
  main{padding:14px 12px 50px}
  .panel{padding:16px;border-radius:12px}
  .ph .seg{width:100%}.ph .seg>button{flex:1;justify-content:center}
  .banner{padding:10px 14px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* ---- lot : onglets d'état, recherche, loupe ---- */
.batch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:760px){.batch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:460px){.batch-grid{grid-template-columns:1fr}.batch-grid .span2{grid-column:auto}}
.pathgrp{display:flex;min-width:0}
.pathgrp input{border-radius:var(--r) 0 0 var(--r);font-family:var(--mono);font-size:13px}
.pathgrp button{border-radius:0 var(--r) var(--r) 0;margin-left:-1px;flex:none;color:var(--ink)}
.pathgrp .pick{border-radius:var(--r) 0 0 var(--r);margin:0 -1px 0 0;padding:0 12px}.pathgrp .pick+input{border-radius:0}
@media (max-width:520px){.pathgrp button span{display:none}}
.seg.wide{display:flex;height:40px;padding:3px}
.seg.wide>button{flex:1;justify-content:center;padding:0 6px}
/* Un picto par état ; l'onglet ouvert déplie son nom et son nombre, Publié reste à droite. */
.btabs{display:flex;border-bottom:1px solid var(--line);align-items:stretch}
.btabs .scroll{display:flex;gap:2px;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:thin}
.btabs .pinned{flex:none;display:flex;border-left:1px solid var(--line);padding-left:6px;margin-left:6px}
.btabs button{height:44px;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;padding:0 5px;margin-bottom:-1px;flex:none}
.btabs button:hover{background:transparent}
.btabs button.on{border-bottom-color:var(--gold)}
.btabs .pil{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 8px;border-radius:999px;background:var(--sunk);color:var(--mut);border:1px solid var(--line);font-size:13px}
.btabs button:hover .pil{border-color:var(--line-strong)}
.btabs .pil .i{width:16px;height:16px}
.btabs .pil.pub{background:var(--ok-soft);color:var(--ok);border-color:transparent}.btabs .pil.sim{background:var(--sim-soft);color:var(--sim);border-color:transparent}.btabs .pil.rev{background:var(--warn-soft);color:var(--warn);border-color:transparent}.btabs .pil.rv{background:var(--rv-soft);color:var(--rv);border-color:transparent}.btabs .pil.err{background:var(--err-soft);color:var(--err);border-color:transparent}.btabs .pil.run{background:var(--run-soft);color:var(--run);border-color:transparent}.btabs .pil.wait{background:var(--line);color:var(--mut);border-color:transparent}.btabs .pil.dup{background:var(--gold-soft);color:var(--gold);border-color:transparent}
.btabs .help{color:var(--mut);padding:0 8px}.btabs .help:hover{color:var(--ink)}.btabs .help .i{width:18px;height:18px}
.stlegend{display:grid;grid-template-columns:auto 1fr;gap:8px 10px;align-items:start;margin:0}.stlegend dd{margin:0;color:var(--mut)}
.btabs .lab{font-weight:600;white-space:nowrap}
.btabs .cnt{font:600 11px/1 var(--mono);opacity:.75}
.btools{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.bsearch{flex:1 1 160px;min-width:140px;max-width:340px}
@media (max-width:520px){.bsearch,.bact{flex-basis:100%}}
.bsum{flex:1 1 240px;min-width:0}
.bsum b{color:var(--ink);font-weight:600}
#pB .pf>button{flex:none}
#pB .pf{align-items:center}
mark{background:var(--gold-soft);color:inherit;border-radius:3px;padding:0 1px}
/* tableau : case, release, taille, [état], détail, loupe */
.list.tbl.all .b{grid-template-columns:18px minmax(0,1.3fr) 72px 96px minmax(0,1fr) 28px}
.list.tbl .b.h{height:38px;padding-block:0}
.list.tbl .b.h .det{line-height:38px}
.list.tbl .b.h small{font-family:var(--sans);text-transform:none;letter-spacing:0;font-size:11px;margin-left:8px;opacity:.85}
.list.tbl .b input[type=checkbox]{width:18px;height:18px}
.list.tbl .b .nm b,.list.tbl .b .nm small{display:flex;gap:6px;align-items:center;min-width:0}
.list.tbl .b .nm .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.list.tbl .b .nm .i{width:14px;height:14px;color:var(--mut)}
.list.tbl .b.off>:not(:first-child){opacity:.5}
.list.tbl .b.off .nm b{text-decoration:none}
.list.tbl .b .det{font-size:12px;color:var(--mut);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}
.list.tbl .b .lock{display:grid;place-items:center;color:var(--ok)}.list.tbl .b .lock .i{width:16px;height:16px}
.zoom{height:28px;width:28px;padding:0;border:0;background:transparent;color:var(--mut);border-radius:7px}
.zoom:hover{color:var(--fjord);background:var(--fjord-soft)}
.zoom .i{width:16px;height:16px}
@media (max-width:760px){.list.tbl .b,.list.tbl.all .b{grid-template-columns:18px minmax(0,1fr) 64px 28px}.list.tbl .b>.st,.list.tbl .b.h>.det{display:none}
  /* Le détail passe en seconde ligne : il ouvre la feuille du bas. */
  .list.tbl .b>.zoom{grid-row:1;grid-column:4}.list.tbl .b:not(.h)>.det{grid-row:2;grid-column:2/-1}}
/* fenêtre de détail (loupe) */
.bdlg{border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);padding:0;width:min(760px,calc(100dvw - 24px));max-height:calc(100dvh - 32px);box-shadow:var(--shadow);flex-direction:column}
.bdlg[open]{display:flex}
.bdlg::backdrop{background:rgba(10,14,20,.55);backdrop-filter:blur(2px)}
.bdlg>header{display:flex;gap:12px;align-items:flex-start;padding:14px 18px;border-bottom:1px solid var(--line)}
.bdlg>header .nm{min-width:0;overflow:hidden}
.bdlg>header .nm b{display:block;font:500 14px var(--mono);word-break:break-all}
.bdlg>header .nm small{display:block;color:var(--mut);font-size:12px;word-break:break-all}
.bdlg>header button{height:32px;width:32px;padding:0;flex:none}
.bdlg .body{overflow:auto;padding:16px 18px;display:flex;flex-direction:column;gap:14px}
/* Les blocs ne rétrécissent pas : un .also (overflow:hidden) se faisait écraser et couper au lieu de laisser défiler le corps. */
.bdlg .body>*{flex-shrink:0}
.bdlg>footer{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:12px 18px;border-top:1px solid var(--line)}
.kv{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;font-size:13px;margin:0}
.kv dt{color:var(--mut)}.kv dd{margin:0;min-width:0;word-break:break-word}
.kv .mono{font-size:12px}
.bdlg .msg.rv{background:var(--rv-soft);color:var(--rv)}
.bdlg .srch{display:flex;flex-wrap:wrap;gap:8px}
.bdlg .srch input{flex:1 1 180px;width:auto}.bdlg .srch select{flex:0 0 120px;width:auto}
.bdlg .tmdb{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.bdlg .tmdb .c{min-height:0}
.bdlg .cur{display:flex;gap:12px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--sunk);font-size:13px}
.bdlg .cur img{width:40px;height:60px;object-fit:cover;border-radius:5px;background:var(--line);flex:none}
#bdFiche.loading{opacity:.55;pointer-events:none;transition:opacity .2s}
.bdlg h2:has(+#bdFiche:empty){display:none}
/* loupe : arborescence repliée de la release */
.ftree{border:1px solid var(--line);border-radius:12px;padding:8px 12px;font-size:13px}
.ftree summary{cursor:pointer;display:flex;align-items:center;gap:6px;min-width:0}
.ftree>summary{font-weight:600;color:var(--mut)}
.ftree .ft{padding-left:18px;display:flex;flex-direction:column;gap:3px;margin-top:4px;border-left:1px solid var(--line);margin-left:8px}
.ftree .f,.ftree .ft summary{display:flex;align-items:center;gap:6px;min-width:0;font-family:var(--mono);font-size:12px}
.ftree .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}
.ftree .sz{color:var(--mut);flex:none;font-family:var(--sans)}
.ftree .i{width:14px;height:14px}
#advFacets{margin-top:10px}
.ftree pre{font:12px/1.45 var(--mono);background:var(--sunk);border:1px solid var(--line);border-radius:8px;padding:10px;margin:6px 0 0;max-height:260px;overflow:auto;white-space:pre;color:var(--ink)}
.ftree .mih{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ftree>summary .sz{font-weight:400;font-family:var(--mono);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
/* revue en série : file de la loupe, autres lignes du même titre, mode groupe */
.bact{display:flex;gap:10px;align-items:center;flex-wrap:wrap;flex:1 1 auto;min-width:0}
.bdlg .bq{display:flex;align-items:center;gap:8px;padding:8px 18px;border-bottom:1px solid var(--line);background:var(--sunk)}
.bdlg .bq[hidden]{display:none}
.bdlg .bq button{height:30px;width:30px;padding:0}
.bdlg .bq .pos{font:600 12px/1 var(--mono);color:var(--mut);min-width:64px;text-align:center}
.bdlg .bq .bar{flex:1;height:4px}
.bdlg .also{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.bdlg .also .ah{display:flex;gap:8px;align-items:center;padding:9px 12px;background:var(--rv-soft);color:var(--rv);font-size:13px}
.bdlg .also label{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 12px;border-top:1px solid var(--line);cursor:pointer;flex-direction:row;font-weight:400}
.bdlg .also input{width:16px;height:16px;margin:0;accent-color:var(--fjord)}
.bdlg .also .n{font:12.5px var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.bdlg .ep{font:600 11px/1 var(--mono);padding:3px 7px;border-radius:5px;background:var(--sunk);border:1px solid var(--line)}
.bdlg .keys{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--mut);width:100%}
.bdlg kbd{font:600 11px/1 var(--mono);border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:4px;padding:2px 5px;background:var(--sunk)}
.bdlg .endq{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:24px 8px}
.bdlg .body:focus{outline:none}
/* sélecteur de dossier du lot */
.dirdlg .bq input{flex:1;min-width:0;font-size:13px}
.dirdlg .body{padding:0;min-height:240px}
.dirdlg .list{border:0;border-radius:0;max-height:none}
/* Lot : explication repliable ; repliée, le tableau s'allonge */
.intro{display:flex;flex-direction:column;gap:10px}
.intro>summary{cursor:pointer;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--mut);list-style:none;width:max-content}
.intro>summary::-webkit-details-marker{display:none}
.intro>summary::after{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);margin:0 0 3px 2px;transition:transform .15s}
.intro[open]>summary::after{transform:rotate(-135deg);margin:3px 0 0 2px}
.intro>summary:hover{color:var(--ink)}
.intro p{margin:10px 0 0}
#pB:has(#batchIntro:not([open])) #batchList{max-height:calc(420px + var(--intro,0px))}
.intro.measure>summary::after{transition:none}

/* SweetAlert2 aux couleurs de Bifröst (sweetalert2.min.css chargé avant). */
.swal2-container.swal2-backdrop-show{background:rgba(15,26,43,.55)}
.swal2-popup.bf-alert{width:min(440px,calc(100vw - 32px));border-radius:18px;background:var(--surface);color:var(--ink);font-family:var(--sans);padding:28px 24px 20px;box-shadow:0 24px 64px -16px rgba(15,26,43,.5)}
.bf-alert .swal2-title{font-size:21px;font-weight:700;letter-spacing:-.01em;color:var(--ink);padding:0}
.bf-alert .swal2-html-container{font-size:14px;color:var(--mut);margin:10px 0 0;padding:0}
.bf-alert .swal2-footer{font-size:12.5px;color:var(--mut);border-top-color:var(--line);margin:16px 0 0;padding-top:12px}
.bf-actions{gap:10px;margin-top:18px}
.bf-actions button{height:44px;padding:0 18px}
button.ghost-line{background:var(--surface);border-color:var(--line-strong)}
.swal2-icon.swal2-warning{border-color:#E7C66A;color:var(--gold)}
.swal2-icon.swal2-success{border-color:#9BD3B0}.swal2-icon.swal2-success [class^=swal2-success-line]{background:var(--ok)}.swal2-icon.swal2-success .swal2-success-ring{border-color:rgba(29,122,70,.3)}
.swal2-icon.swal2-error{border-color:#EBA3A3;color:var(--err)}.swal2-icon.swal2-error [class^=swal2-x-mark-line]{background:var(--err)}
.swal2-icon.swal2-info{border-color:#A9C6EC;color:var(--run)}
.swal2-popup.bf-toast{background:var(--surface);color:var(--ink);font-family:var(--sans);border-radius:12px;box-shadow:var(--pop-shadow);padding:10px 14px}
.bf-toast .swal2-title{font-size:13.5px;font-weight:500;color:var(--ink);margin:0 0 0 10px}
.bf-toast .swal2-timer-progress-bar{background:var(--line-strong)}
/* Sous le bandeau de nuit (56 px + le filet), pas par-dessus. */
body.swal2-toast-shown .swal2-container.swal2-top-end{top:64px}
@media (prefers-color-scheme:dark){.swal2-container.swal2-backdrop-show{background:rgba(0,0,0,.6)}}

/* Popover natif des détails (#bfPop) : posé en JS sous son ancre. */
.npop{position:fixed;inset:auto;margin:0;width:min(360px,calc(100vw - 16px));padding:14px 16px;border:1px solid var(--line-strong);border-radius:12px;background:var(--surface);color:var(--ink);box-shadow:var(--pop-shadow);font-size:13px}
.npop:popover-open{display:flex;flex-direction:column;gap:10px}
.npop b{font-weight:600;word-break:break-all}.npop p{color:var(--mut)}
/* Ancres : une puce de facette, le détail d'une ligne du lot. */
button.chip{height:auto;font-weight:400;cursor:pointer;font-size:12px;padding:3px 10px;border-radius:999px}
button.chip:hover{border-color:var(--mut)}
button.det-pop{all:unset;cursor:pointer;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;border-radius:4px}
button.det-pop:hover{color:var(--ink);text-decoration:underline dotted;text-underline-offset:3px}
button.det-pop:focus-visible{outline:2px solid var(--fjord);outline-offset:2px}
/* Téléphone : le popover des détails devient une feuille du bas, poignée et fond assombri. */
@media (max-width:760px){
  .npop{inset:auto 0 0 0;width:100%;max-width:none;border-width:1px 0 0;border-radius:18px 18px 0 0;padding:10px 18px calc(24px + env(safe-area-inset-bottom));font-size:14px}
  .npop:popover-open::before{content:"";align-self:center;width:40px;height:4px;border-radius:999px;background:var(--line-strong)}
  .npop::backdrop{background:rgba(15,26,43,.5)}
  .npop .row.end button{width:100%;height:48px}
}
