/* ==========================================================================
   Fonts (local, OFL-1.1: see fonts/LICENSE-*.txt). Fontsource's "cyrillic"
   subset has no digits or punctuation, so every face is a cyrillic + latin pair.
   Without these files the system fonts in --font-* take over.
   ========================================================================== */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;
  src:url(/static/fonts/ibm-plex-sans-cyrillic-400-normal.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;
  src:url(/static/fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;
  src:url(/static/fonts/ibm-plex-sans-cyrillic-500-normal.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;
  src:url(/static/fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;
  src:url(/static/fonts/ibm-plex-sans-cyrillic-600-normal.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;
  src:url(/static/fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url(/static/fonts/ibm-plex-mono-cyrillic-400-normal.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url(/static/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Literata;font-style:normal;font-weight:400;font-display:swap;
  src:url(/static/fonts/literata-cyrillic-400-normal.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Literata;font-style:normal;font-weight:400;font-display:swap;
  src:url(/static/fonts/literata-latin-400-normal.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* ==========================================================================
   Tokens. Dark theme by default; light by the OS setting or data-theme="light".
   The light block appears twice and must stay identical (tests/test_static.py).
   ========================================================================== */
:root{
  color-scheme:dark;
  --bg:#141210; --s1:#1d1a17; --s2:#262220; --s3:#312c27;
  --line:#3a342d; --line2:#4b443b; --field:#6f665a;
  --tx:#ede7dd; --mu:#a89f92;
  --ac:#eb9a7f; --acf:#e08a6f; --on-acf:#1e120d; --run-bg:#3a2620;
  --ok:#8fcf9c; --ok-bg:#1c2b20; --warn:#e8bd66; --warn-bg:#33291a; --err:#ff9787; --err-bg:#3a201c;
  --danger:#b8452f;
  --hl:#3b321f; --hl-ring:#5b4a2a; --mark:#5c4a24;
  --focus:var(--ac); --shadow:0 14px 36px rgb(0 0 0/.5);
  --spk-ink:#141210;
  --spk-1:#e9b95c; --spk-2:#7fb2f0; --spk-3:#8fd19e; --spk-4:#f08a7a; --spk-5:#c79bf0;
  --spk-6:#6fd0c4; --spk-7:#f0a35e; --spk-8:#b6c0cc; --spk-9:#f28fb8; --spk-10:#a7c76a;
  --font-ui:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-read:Literata,Georgia,"Times New Roman",serif;
  --font-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --r-sm:7px; --r:8px; --r-lg:12px;
}
:root[data-theme=light]{
  color-scheme:light; --bg:#f6f3ee; --s1:#ffffff; --s2:#f1ece4; --s3:#e7e0d5; --line:#e3ddd3; --line2:#cfc6b8; --field:#8f8679;
  --tx:#22201c; --mu:#655f56; --ac:#8a3b2e; --acf:#9c4332; --on-acf:#ffffff; --run-bg:#f6e3dc;
  --ok:#1f6b36; --ok-bg:#e3f1e6; --warn:#7a5200; --warn-bg:#faefd6; --err:#b42318; --err-bg:#fbe7e4;
  --hl:#fff1c7; --hl-ring:#e8cf7a; --mark:#ffe08a; --shadow:0 14px 36px rgb(60 40 20/.18); --spk-ink:#ffffff;
  --spk-1:#8a5a00; --spk-2:#1f5fa8; --spk-3:#23733a; --spk-4:#b03a2e; --spk-5:#7a3fa8;
  --spk-6:#12706a; --spk-7:#a04f00; --spk-8:#4f5b6b; --spk-9:#a8326e; --spk-10:#556b12;
}
@media (prefers-color-scheme:light){
  :root:not([data-theme=dark]){
    color-scheme:light; --bg:#f6f3ee; --s1:#ffffff; --s2:#f1ece4; --s3:#e7e0d5; --line:#e3ddd3; --line2:#cfc6b8; --field:#8f8679;
    --tx:#22201c; --mu:#655f56; --ac:#8a3b2e; --acf:#9c4332; --on-acf:#ffffff; --run-bg:#f6e3dc;
    --ok:#1f6b36; --ok-bg:#e3f1e6; --warn:#7a5200; --warn-bg:#faefd6; --err:#b42318; --err-bg:#fbe7e4;
    --hl:#fff1c7; --hl-ring:#e8cf7a; --mark:#ffe08a; --shadow:0 14px 36px rgb(60 40 20/.18); --spk-ink:#ffffff;
    --spk-1:#8a5a00; --spk-2:#1f5fa8; --spk-3:#23733a; --spk-4:#b03a2e; --spk-5:#7a3fa8;
    --spk-6:#12706a; --spk-7:#a04f00; --spk-8:#4f5b6b; --spk-9:#a8326e; --spk-10:#556b12;
  }
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.5 var(--font-ui)}
h1{margin:0;font-size:26px;line-height:1.25;font-weight:600;letter-spacing:-.01em}
h2{margin:0;font-size:18px;line-height:1.3;font-weight:600}
h3{margin:0;font-size:15px;font-weight:600}
p{margin:0}
a{color:var(--ac);text-decoration:none} a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
::placeholder{color:var(--mu);opacity:1}
.muted{color:var(--mu)} .small{font-size:13px} .xs{font-size:12.5px}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.row{display:flex;align-items:center;gap:var(--gap,8px)}
.stack{display:flex;flex-direction:column;gap:var(--gap,8px)}
.wrap{flex-wrap:wrap} .grow,.spacer{flex:1;min-width:0}
.icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.icon-sm{width:15px;height:15px} .ok{color:var(--ok)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- buttons (bare <button> too, so old markup keeps working) ---------- */
button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 14px;
  border-radius:var(--r);border:1px solid var(--line2);background:var(--s2);color:var(--tx);
  font:500 14px/1 var(--font-ui);white-space:nowrap;cursor:pointer;text-decoration:none}
button:hover,.btn:hover{background:var(--s3);text-decoration:none}
button:disabled,.btn[aria-disabled=true]{opacity:.45;cursor:not-allowed}
.btn-primary,button.primary{background:var(--acf);border-color:var(--acf);color:var(--on-acf)}
.btn-primary:hover,button.primary:hover{background:var(--ac);border-color:var(--ac)}
.btn-ghost{background:transparent;border-color:transparent}
.btn-danger,button.danger{background:transparent;color:var(--err);border-color:color-mix(in srgb,var(--err) 45%,transparent)}
.btn-danger-fill{background:var(--danger);border-color:var(--danger);color:#fff}
.btn-sm{height:30px;padding:0 10px;font-size:13px;border-radius:var(--r-sm)}
.btn-icon{width:36px;padding:0} .btn-sm.btn-icon{width:30px}
.btn[aria-pressed=true],button.on{background:var(--s3);box-shadow:inset 0 0 0 1px var(--line2)}
@media (pointer:coarse){button,.btn{min-height:44px}.btn-icon{min-width:44px}}

/* ---------- fields ---------- */
input[type=text],input[type=password],input[type=number],input[type=search],select,textarea,.input{height:36px;padding:0 12px;
  border-radius:var(--r);border:1px solid var(--field);background:var(--bg);color:var(--tx);font:14px/1.4 var(--font-ui);min-width:0}
textarea{height:auto;min-height:72px;width:100%;padding:8px 12px;font:12.5px/1.5 var(--font-mono);resize:vertical}
input:disabled,select:disabled,textarea:disabled{opacity:.55}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--acf)}
input[type=checkbox],input[type=radio]{width:16px;height:16px;margin:0}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.label{font-size:13px;font-weight:500;color:var(--mu)}
input.switch{appearance:none;-webkit-appearance:none;width:38px;height:22px;border-radius:99px;background:var(--s3);
  border:1px solid var(--field);position:relative;cursor:pointer;flex:none}
input.switch::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--mu);transition:left .15s}
input.switch:checked{background:var(--acf);border-color:var(--acf)}
input.switch:checked::after{left:19px;background:var(--on-acf)}

/* ---------- containers and labels ---------- */
.card{background:var(--s1);border:1px solid var(--line);border-radius:var(--r-lg)}
.card-pad{padding:18px 20px}
.card-head{display:flex;align-items:baseline;gap:8px;padding:12px 16px 10px}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;background:var(--s3);
  color:var(--mu);font-size:12.5px;font-weight:500;white-space:nowrap}
.chip-run{background:var(--run-bg);color:var(--ac)} .chip-ok{background:var(--ok-bg);color:var(--ok)}
.chip-warn{background:var(--warn-bg);color:var(--warn)} .chip-err{background:var(--err-bg);color:var(--err)}
.note{display:flex;gap:12px;padding:12px 14px;border-radius:var(--r);background:var(--s2);font-size:14px;overflow-wrap:anywhere}
.note-info{background:var(--run-bg)} .note-warn{background:var(--warn-bg);color:var(--warn)}
.note-err{background:var(--err-bg)} .note-err>.icon{color:var(--err)}
.kbd{font:11.5px var(--font-mono);padding:1px 6px;border-radius:5px;border:1px solid var(--line2);border-bottom-width:2px;background:var(--s2);white-space:nowrap}
.path{font:12.5px/1.5 var(--font-mono);padding:6px 10px;border-radius:6px;background:var(--bg);border:1px solid var(--line);overflow-wrap:anywhere}
.where{display:inline-flex;align-items:center;gap:5px}

/* ---------- progress and steps ---------- */
.bar{height:6px;border-radius:99px;background:var(--s3);overflow:hidden}
.bar>i,.bar>div{display:block;height:100%;width:0;border-radius:inherit;background:var(--acf);transition:width .5s}
.bar-thin{height:4px} .bar-muted>i{background:var(--mu)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:12px}
.steps li{display:flex;flex-direction:column;gap:4px;padding-top:10px;border-top:2px solid var(--line2);font-size:13.5px}
.steps .name{display:flex;align-items:center;gap:6px;font-weight:500}
.steps .meta{font-size:12px;color:var(--mu)}
.steps .dot{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--line2);flex:none}
.steps li[data-state=done]{border-top-color:var(--ok)}
.steps li[data-state=done] .meta{font-family:var(--font-mono)}
.steps li[data-state=current]{border-top-color:var(--acf)}
.steps li[data-state=current] .name{color:var(--ac);font-weight:600}
.steps li[data-state=current] .meta{color:var(--tx)}
.steps li[data-state=current] .dot{background:var(--acf);border-color:var(--acf);box-shadow:0 0 0 4px var(--run-bg)}
.steps li[data-state=todo] .name{color:var(--mu);font-weight:400}

/* ---------- view switches and option cards ---------- */
.seg{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:var(--bg);border:1px solid var(--line)}
.seg>button,.seg>a{height:30px;padding:0 12px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--mu);font-size:13.5px}
.seg>button:hover,.seg>a:hover{background:var(--s2);color:var(--tx)}
.seg>[aria-pressed=true],.seg>[aria-current=page],.seg>[aria-selected=true],.seg>label:has(input:checked){background:var(--s3);color:var(--tx);box-shadow:inset 0 0 0 1px var(--line2)}
.seg>label{display:inline-flex;align-items:center;height:30px;padding:0 10px;border-radius:var(--r-sm);color:var(--mu);font-size:13px;cursor:pointer}
.seg>label input{position:absolute;opacity:0}
.seg>label:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:1px}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));gap:8px}
.opt{position:relative;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid var(--line2);border-radius:10px;background:var(--bg);cursor:pointer}
.opt input{position:absolute;opacity:0;pointer-events:none}
.opt b{font-size:14px;font-weight:600} .opt span{font-size:12.5px;color:var(--mu)}
.opt:has(input:checked){border-color:var(--acf);background:var(--run-bg)}
.opt:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}

/* ---------- speakers, time codes ---------- */
.spk{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--c);color:var(--spk-ink);font-size:12px;font-weight:600;flex:none}
.spk-sm{width:18px;height:18px;border-radius:5px;font-size:10.5px}
.ts{height:auto;padding:2px 4px;border:0;border-radius:4px;background:none;color:var(--mu);font:12.5px/1.4 var(--font-mono);font-variant-numeric:tabular-nums}
.ts:hover{background:var(--s2);color:var(--ac)}

/* ---------- menus, dialogs, notifications ---------- */
.menu{position:fixed;inset:auto;margin:0;min-width:220px;max-width:320px;padding:6px;border-radius:10px;
  border:1px solid var(--line2);background:var(--s2);color:var(--tx);box-shadow:var(--shadow)}
.menu-item{display:flex;align-items:center;gap:10px;width:100%;height:auto;min-height:34px;padding:6px 10px;border:0;border-radius:6px;
  background:transparent;justify-content:flex-start;text-align:left;font-weight:400;font-size:13.5px;white-space:normal;color:var(--tx)}
.menu-item:hover,.menu-item:focus-visible,.menu-item[aria-selected=true]{background:var(--s3);outline:none;text-decoration:none}
.menu-item small{display:block;color:var(--mu);font-size:12px}
.menu-item.danger{color:var(--err)}
.menu-sep{height:1px;margin:4px 2px;background:var(--line2)}
.dialog{width:min(460px,calc(100vw - 32px));padding:22px 24px;border:1px solid var(--line2);border-radius:14px;background:var(--s2);color:var(--tx);box-shadow:0 24px 60px rgb(0 0 0/.6)}
.dialog::backdrop{background:rgb(8 7 6/.62)}
.dialog .actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.drawer{margin:0 0 0 auto;width:min(540px,100vw);height:100dvh;max-height:none;border-radius:0;border-width:0 0 0 1px;padding:22px 26px;background:var(--s1)}
.toasts{position:fixed;z-index:50;left:50%;bottom:20px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;max-width:calc(100vw - 32px)}
.toast{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;background:var(--s3);border:1px solid var(--line2);box-shadow:var(--shadow);font-size:13.5px}
.toast::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none}
.toast-err::before{background:var(--err)}

/* ---------- page frame ---------- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:20px;height:56px;padding:0 24px;background:var(--s1);border-bottom:1px solid var(--line)}
.tabs{display:flex;gap:4px;align-self:stretch}
.tab{display:inline-flex;align-items:center;padding:0 12px;color:var(--mu);font-size:14px;font-weight:500;white-space:nowrap;border-bottom:2px solid transparent}
.tab:hover{color:var(--tx);text-decoration:none} .tab[aria-current]{color:var(--tx);border-bottom-color:var(--acf)}
.project-btn{font-weight:600;background:transparent;border-color:transparent;max-width:280px}
.project-btn[aria-disabled=true]{opacity:1;cursor:default}
.project-btn[aria-disabled=true]:hover{background:transparent}
.page{max-width:1120px;margin:0 auto;padding:28px 32px 64px;display:flex;flex-direction:column;gap:28px}
.page-wide{max-width:1400px}
.page-head{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.page-head>.grow{flex:1 1 280px}
@media (max-width:720px){.topbar{gap:8px;padding:0 8px;overflow-x:auto;scrollbar-width:thin}.page{padding:16px 16px 48px;gap:20px}}

/* ---------- background jobs (jobBlock) ---------- */
.job{display:flex;flex-direction:column;gap:6px;min-width:0}
.job-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px}
.job-head b{font-weight:600}

/* ==========================================================================
   Pages
   ========================================================================== */
/* ---------- main page ---------- */
.add-ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:12px}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:auto;min-height:136px;padding:20px;
  border:2px dashed var(--line2);border-radius:var(--r-lg);background:var(--bg);color:var(--tx);white-space:normal;text-align:center;
  font-weight:400;line-height:1.45;transition:border-color .15s,background .15s}
.drop:hover,.drop.over{border-color:var(--acf);background:var(--run-bg)}
.drop>.icon{width:24px;height:24px;color:var(--ac)}
.drop b{font-weight:600}
.disk-way{display:flex;flex-direction:column;gap:10px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg)}
.disk-way .icon{color:var(--ac)}
.picked{display:flex;flex-direction:column;gap:10px;padding:12px 14px;border:1px solid var(--line2);border-radius:var(--r-lg);background:var(--s2)}
.picked-head{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500}
.picked-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;max-height:240px;overflow:auto}
.picked-list li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:4px 12px;padding:3px 4px 3px 10px;border-radius:6px;font-size:13px}
.picked-list .name{font-size:12.5px}
.picked-list .size{font-size:12.5px;white-space:nowrap}
.picked-list li .bar{grid-column:1 / -1}
.picked-list li[data-state] button{visibility:hidden}
.picked-list li[data-state=done] .size{color:var(--ok)}
.picked-list li[data-state=current]{background:var(--run-bg)}
.picked-list li[data-state=current] .size{color:var(--ac);font-family:var(--font-mono)}
.picked-list li[data-state=todo] .name{color:var(--mu)}
.add-fields{display:grid;grid-template-columns:minmax(0,1fr) 190px auto;gap:12px;align-items:end}
.add-fields .btn-primary{min-width:190px}
@media (max-width:640px){.add-fields{grid-template-columns:1fr}}
.more>summary{cursor:pointer;color:var(--mu);font-size:13.5px;width:max-content;max-width:100%}
.more>summary:hover{color:var(--tx)}
.more[open]>summary{margin-bottom:12px}
.session-row{display:flex;flex-direction:column;gap:12px;padding:14px 16px}
.session-row.is-running{border-color:color-mix(in srgb,var(--acf) 50%,var(--line))}
.session-row .title{font-weight:600;font-size:15.5px;color:var(--tx);overflow-wrap:anywhere}
.session-row .where[title]{cursor:help}
.session-row .grip{flex:none;align-self:flex-start;margin:-4px -8px 0 -8px;color:var(--mu);cursor:grab;touch-action:none}
#list.single .grip{display:none}
.session-row.dragging{position:relative;z-index:5;box-shadow:var(--shadow);border-color:var(--line2)}
.session-row.dragging .grip{cursor:grabbing;color:var(--tx)}
body.is-dragging{user-select:none;-webkit-user-select:none;cursor:grabbing}
.session-row .pick{flex:none;align-self:flex-start;width:18px;height:18px;margin:2px 0 0}
#list:not(.selecting) .pick,#list.selecting .grip{display:none}
#list.selecting .session-row{cursor:pointer}
.session-row.picked{border-color:var(--acf);background:color-mix(in srgb,var(--run-bg) 45%,var(--s1))}
.select-bar{position:sticky;bottom:12px;z-index:10;display:flex;align-items:center;gap:10px;padding:10px 12px 10px 16px;box-shadow:var(--shadow);border-color:var(--line2)}
.select-bar #sel-count{font-weight:500}
.pub-ok a{color:var(--ok)} .pub-err{color:var(--err)} .pub-run{color:var(--ac)}
.session-row .title-box{display:flex;min-width:0;max-width:100%}
.session-row .rename-form{flex:1 1 360px;max-width:560px}
#list .session-row.renaming .head-line{flex-wrap:nowrap;flex:1 1 auto}
.session-row.renaming .title-box{flex:1 1 auto}
.session-row .rename-form input{min-width:200px}
.session-row.renaming .ren{display:none}
.session-row .ren{display:none}
/* compact view: one line per session, rows inside one card */
#list.compact{gap:0}
#list.compact:has(.session-row){border:1px solid var(--line);border-radius:var(--r-lg);background:var(--s1)}
#list.compact .session-row{gap:0;padding:4px 10px 4px 12px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}
#list.compact .session-row:first-child{border-radius:var(--r-lg) var(--r-lg) 0 0}
#list.compact .session-row:last-child{border-bottom:0;border-radius:0 0 var(--r-lg) var(--r-lg)}
#list.compact .session-row:only-child{border-radius:var(--r-lg)}
#list.compact .session-row.picked{background:color-mix(in srgb,var(--run-bg) 45%,var(--s1))}
#list.compact .session-row.dragging{background:var(--s1);border-radius:var(--r);box-shadow:var(--shadow);outline:1px solid var(--line2)}
#list.compact .session-row>.row:first-child{--gap:10px!important;min-height:36px}
#list.compact .session-row>.row:first-child>.grow{flex-direction:row;align-items:center;gap:14px;min-width:0}
#list.compact .head-line{flex-wrap:nowrap;min-width:0;flex:0 1 auto}
#list.compact .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14.5px}
#list.compact .st-chip{height:22px;font-size:12px}
#list.compact .meta-line{flex-wrap:nowrap;white-space:nowrap;margin-left:auto}
#list.compact .meta-line>:not(.date):not(.pub),#list.compact .open-btn,#list.compact .steps,#list.compact .progress,
#list.compact .note-err,#list.compact .subjob{display:none!important}
#list.compact .grip,#list.compact .pick{align-self:center;margin-top:0}
#list.compact .ren{display:inline-flex;opacity:0}
#list.compact .session-row:hover .ren,#list.compact .ren:focus-visible{opacity:1}
@media (pointer:coarse){#list.compact .ren{opacity:1}}
@media (max-width:640px){
  /* the row's buttons go under the title instead of squeezing it into a column */
  .session-row>.row:first-child{flex-wrap:wrap;--gap:10px}
  .session-row>.row:first-child>.grow{flex:1 1 calc(100% - 50px)}
  .select-bar{flex-wrap:wrap}
  .select-bar .spacer{display:none}
  /* compact on a phone: title first; renaming stays in the «…» menu, retry is an icon */
  #list.compact .meta-line,#list.compact .ren,#list.compact .chip-ok,#list.compact [data-retry] .lbl{display:none}
  #list.compact [data-retry]{width:30px;padding:0}
  #list.compact .session-row>.row:first-child{flex-wrap:nowrap}
  #list.compact .session-row>.row:first-child>.grow{flex:1 1 auto}
  #list.compact .head-line{flex:1 1 auto}
  #list.compact .st-chip{flex:none}
}
.subjob{padding:10px 12px;border-radius:var(--r);background:var(--s2)}
.subjob .job-head .icon{color:var(--mu)}

/* ---------- session page ---------- */
.h3{margin:0;font-size:15px;font-weight:600}
.session-grid{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:32px;align-items:start}
.session-aside{position:sticky;top:72px;display:flex;flex-direction:column;gap:16px;max-height:calc(100dvh - 88px);overflow:auto;overscroll-behavior:contain}
.player{display:flex;flex-direction:column;gap:8px}
.player video,.player audio{width:100%;display:block;border-radius:10px}
.player video{background:#000}
.mtabs{display:none}
.t-tools{position:sticky;top:56px;z-index:5;display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:8px 0 12px;background:var(--bg)}
.t-tools input[type=search]{flex:1 1 200px;max-width:320px}
.t-tools select{max-width:220px}
.to-current{position:sticky;bottom:16px;align-self:center;border-radius:99px;box-shadow:var(--shadow)}
.para{display:grid;grid-template-columns:24px minmax(0,1fr);gap:4px 14px;padding:12px 14px;margin:0 -14px;border-radius:10px}
.para .head{grid-column:2;display:flex;align-items:baseline;gap:8px;font-size:14px}
.para .name{font-weight:600;color:var(--c)}
.para .text{grid-column:2;font:17px/1.7 var(--font-read)}
.para .text span{cursor:pointer;border-radius:3px}
.para .text span:hover{background:var(--s2)}
.para.active{background:var(--hl);box-shadow:inset 0 0 0 1px var(--hl-ring)}
.para .text span.active{background:var(--mark);box-shadow:0 0 0 2px var(--mark)}
::highlight(search){background-color:var(--mark);color:var(--tx)}
.spk-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:10px 16px;border-top:1px solid var(--line)}
.spk-row .spk-name{font-weight:600;color:var(--c)}
.spk-row .status{font-size:12.5px;color:var(--mu)} .spk-row .status.auto{color:var(--warn)}
.spk-row .extra{grid-column:2 / 4;display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.who-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;width:100%}
.who-form .input{flex:1 1 150px;height:30px;font-size:13px}
.edit-row{display:grid;grid-template-columns:78px 176px minmax(0,1fr) 34px;gap:10px;align-items:start;padding:8px 10px;border-radius:var(--r)}
.edit-row.active{background:var(--hl)} .edit-row:focus-within{background:var(--s2)}
.edit-row .ts-cell{padding-top:4px}
.edit-row.edited .ts-cell::after{content:"изменено";display:inline-block;margin-top:4px;padding:0 6px;border-radius:99px;background:var(--s3);color:var(--mu);font-size:11px}
.who-btn{width:100%;justify-content:flex-start;background:transparent;border-color:var(--line);color:var(--c)}
.who-btn .ellipsis{font-weight:600}
.etext{font:16px/1.65 var(--font-read);padding:4px 8px;border-radius:6px;outline:none;min-height:1.6em}
.etext:hover{background:var(--s1)} .etext:focus{background:var(--s1);box-shadow:0 0 0 2px var(--acf)}
.edit-row .cut{visibility:hidden} .edit-row:hover .cut,.edit-row:focus-within .cut{visibility:visible}
@media (max-width:640px){.edit-row{grid-template-columns:auto 1fr auto}.edit-row .etext{grid-column:1 / -1;grid-row:2}}
#who-pop .menu-item{color:var(--tx)}
.file-row{display:flex;flex-direction:column;gap:6px;padding:14px 0;border-top:1px solid var(--line)}
.file-row:first-child{border-top:0}
.file-row .size{color:var(--mu)}
.files-big{font-size:26px;font-weight:500;letter-spacing:-.01em}
#files{display:flex;flex-direction:column;gap:4px}
.danger-zone{margin-top:12px;padding:14px;gap:10px;border:1px solid color-mix(in srgb,var(--err) 35%,var(--line));border-radius:var(--r)}
.danger-zone .btn{align-self:flex-start;max-width:100%;height:auto;min-height:30px;padding:6px 10px;white-space:normal;text-align:left;line-height:1.3}
.keys{border-collapse:collapse;font-size:13px} .keys td{padding:4px 10px 4px 0;vertical-align:top} .keys td:first-child{white-space:nowrap}
@media (max-width:1023px){
  .session-grid{grid-template-columns:1fr} .session-aside{position:static;max-height:none;overflow:visible;order:-1}
  .player{position:sticky;top:56px;z-index:10;background:var(--bg);padding-bottom:8px} .player video{max-height:28vh}
  .mtabs{display:inline-flex;align-self:flex-start}
  .t-tools{position:static}
  body[data-tab=text] #speakers-card,body[data-tab=text] #files-card,
  body[data-tab=speakers] .session-grid>main,body[data-tab=files] .session-grid>main,
  body[data-tab=speakers] #files-card,body[data-tab=files] #speakers-card{display:none}
}

/* ---------- settings ---------- */
.settings-grid{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;align-items:start}
.side-nav{position:sticky;top:84px;display:flex;flex-direction:column;gap:2px}
.side-nav a{padding:7px 12px;border-radius:var(--r-sm);color:var(--mu);font-size:14px;border-left:2px solid transparent}
.side-nav a:hover{color:var(--tx);background:var(--s2);text-decoration:none}
.side-nav a[aria-current]{color:var(--tx);border-left-color:var(--acf);border-radius:0 var(--r-sm) var(--r-sm) 0}
section[id^=s-]{scroll-margin-top:72px}
.set{display:flex;flex-direction:column;gap:10px;padding:18px 20px;border-top:1px solid var(--line)}
.set:first-child{border-top:0}
.hint{font-size:13.5px;color:var(--mu)}
.opts-wide{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.more p{font-size:13.5px;color:var(--mu);max-width:72ch}
code.tech{display:block;font:12px/1.5 var(--font-mono);color:var(--mu);background:var(--bg);border:1px dashed var(--line2);border-radius:6px;
  padding:4px 8px;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.hide-tech code.tech{display:none}
input[type=range]{width:100%;margin:0}
.range-wrap{position:relative;display:flex;align-items:center}
.range-zone{position:absolute;top:50%;height:12px;margin-top:-6px;border-radius:4px;background:color-mix(in srgb,var(--ok) 35%,transparent);pointer-events:none}
.range-ends{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--mu)}
output{font-size:14px}
.dirty-bar{position:sticky;bottom:16px;z-index:15;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 14px;
  border:1px solid var(--line2);border-radius:var(--r-lg);background:var(--s2);box-shadow:var(--shadow);font-size:14px}
.dot-warn{width:8px;height:8px;border-radius:50%;background:var(--warn);flex:none}
.trial-row{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px;padding:12px 16px;border-top:1px solid var(--line)}
.trial-row .title{font-weight:600;overflow-wrap:anywhere}
.err-text{color:var(--err)}
.avatar{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--s3);color:var(--tx);font-weight:600;flex:none}
.avatar-sm{width:22px;height:22px;font-size:12px}
.count-line{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center}
.count-bar{display:flex;gap:2px;height:10px;border-radius:99px;overflow:hidden;background:var(--s3)}
.count-bar>i{display:block;min-width:4px}
.crows{display:flex;flex-direction:column}
.crow{display:grid;grid-template-columns:56px minmax(0,1fr) minmax(0,1fr);gap:4px 14px;padding:6px 8px;border-radius:6px;font-size:14px}
.crow .who{color:var(--c);font-weight:600}
.crow.diff{background:var(--warn-bg)}
.crow-head{font-size:12.5px;font-weight:600;color:var(--mu);padding-bottom:2px}
.crows.only-diff .crow:not(.diff):not(.crow-head){display:none}
@media (max-width:900px){.settings-grid{grid-template-columns:1fr}.side-nav{display:none}}
@media (max-width:640px){.crow{grid-template-columns:44px minmax(0,1fr)}.crow>:last-child{grid-column:2}}

/* ---------- voices ---------- */
.voice-row{display:grid;grid-template-columns:36px minmax(0,1fr) 200px auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.voice-row:first-child{border-top:0}
.voice-row .vname{min-width:0;font-size:15px}
.voice-row .vname input{min-width:140px}
.hf-steps,.empty-steps{margin:0;padding-left:20px;color:var(--mu);font-size:14px;display:flex;flex-direction:column;gap:4px}
@media (max-width:640px){.voice-row{grid-template-columns:36px minmax(0,1fr) auto}.voice-row>:nth-child(3){grid-column:2;grid-row:2}}