:root{
  --bg:#f5f6f4; --panel:#fff; --ink:#15201c; --muted:#66716c; --line:#e3e6e2;
  --accent:#0f6b5c; --accent-soft:#e3f1ed; --warn:#b4570b; --warn-soft:#fbefe2;
  --ok:#1f7a3a; --ok-soft:#e5f4e9; --info:#2f5aa8; --info-soft:#e8eefa;
  --video:#0d1412;
  --l-phase:#0f6b5c; --l-scrub:#7a5bb5; --l-inst:#2f5aa8; --l-event:#b4570b;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}
.mono{font-family:"JetBrains Mono",monospace}
button{font:inherit;cursor:pointer}
.mockbar-unused{background:#15201c;color:#cfe;font-size:12px;padding:6px 16px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.mockbar b{color:#fff}
.mockbar a{color:#9fd;cursor:pointer;text-decoration:underline}
header{display:flex;align-items:center;gap:20px;padding:12px 24px;background:var(--panel);border-bottom:1px solid var(--line)}
.logo{font-weight:700;letter-spacing:-.02em;font-size:16px}
.logo span{color:var(--accent)}
nav{display:flex;gap:4px}
nav button{border:0;background:none;padding:8px 12px;border-radius:8px;color:var(--muted);font-weight:500}
nav button.on{background:var(--accent-soft);color:var(--accent)}
.who{margin-left:auto;display:flex;align-items:center;gap:10px;color:var(--muted)}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:600;font-size:12px}
main{max-width:1320px;margin:0 auto;padding:24px}
.screen{display:none}.screen.on{display:block}
h1{font-size:22px;margin:0 0 4px;letter-spacing:-.01em}
h2{font-size:15px;margin:0}
.sub{color:var(--muted);margin:0 0 20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px}
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap}
.p-ok{background:var(--ok-soft);color:var(--ok)}.p-warn{background:var(--warn-soft);color:var(--warn)}
.p-info{background:var(--info-soft);color:var(--info)}.p-mute{background:#eef0ed;color:var(--muted)}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.btn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 14px;font-weight:500}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn:hover{filter:brightness(.97)}

/* login */
.login{max-width:440px;margin:60px auto;padding:32px}
.login label{display:block;font-size:12px;color:var(--muted);margin:14px 0 6px}
.login input[type=text],.login input[type=password]{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font:inherit}
.ack{background:#f7f8f6;border:1px solid var(--line);border-radius:8px;padding:12px;font-size:12.5px;color:#3d4843;margin-top:18px;line-height:1.5}
.ack label{display:flex;gap:8px;margin:10px 0 0;color:var(--ink);font-size:13px}

/* list */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
.stat{padding:16px}
.stat .k{font-size:12px;color:var(--muted)}.stat .v{font-size:24px;font-weight:600;margin-top:4px}
.stat .d{font-size:12px;color:var(--muted);margin-top:2px}
.filters{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);align-items:center;flex-wrap:wrap}
.filters input{padding:7px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;width:240px}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 11px;font-size:12.5px}
.chip.on{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;padding:10px 16px;border-bottom:1px solid var(--line)}
td{padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
tr.row{cursor:pointer}tr.row:hover td{background:#fafbf9}
.codes{display:flex;gap:4px;flex-wrap:wrap}
.code{font-family:"JetBrains Mono",monospace;font-size:12px;background:#eef0ed;border-radius:5px;padding:2px 6px}
.room{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:7px;background:#eef0ed;font-weight:600;font-size:12px}

/* case */
.crumbs{color:var(--muted);font-size:13px;margin-bottom:8px}.crumbs a{color:var(--accent);cursor:pointer}
.casehead{display:flex;align-items:flex-start;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.casehead .meta{display:flex;gap:14px;color:var(--muted);font-size:13px;margin-top:6px;flex-wrap:wrap}
.casehead .actions{margin-left:auto;display:flex;gap:8px}
.grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px}
.videos{display:grid;grid-template-columns:1.25fr 1fr;gap:8px;padding:8px}
.vid{position:relative;background:var(--video);border-radius:8px;aspect-ratio:16/10;overflow:hidden}
.vid .lbl{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;padding:3px 7px;border-radius:5px}
.vid .tc{position:absolute;right:8px;bottom:8px;color:#cfe;font-size:11px}
.vid svg{width:100%;height:100%;display:block}
.blurtag{position:absolute;right:8px;top:8px;font-size:10.5px;background:rgba(15,107,92,.85);color:#fff;padding:3px 7px;border-radius:5px}
.transport{display:flex;align-items:center;gap:10px;padding:4px 12px 10px}
.transport .play{width:32px;height:32px;border-radius:50%;border:0;background:var(--accent);color:#fff}
.dictate{margin-left:auto;display:flex;gap:8px;align-items:center}
.mic{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;display:flex;align-items:center;gap:6px;font-weight:500}
.mic.rec{background:#fdecec;border-color:#e7a3a3;color:#b3261e}
.mic.rec .dot{animation:blink 1s infinite}
@keyframes blink{50%{opacity:.2}}
.lanes{padding:4px 12px 12px;position:relative}
.lane{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:8px;height:24px;margin-bottom:4px}
.lane .name{font-size:11.5px;color:var(--muted);text-align:right}
.track{position:relative;height:18px;background:#f1f3f0;border-radius:4px;cursor:pointer}
.seg{position:absolute;top:2px;height:14px;border-radius:3px;opacity:.85;font-size:9.5px;color:#fff;overflow:hidden;white-space:nowrap;padding:0 4px;line-height:14px}
.tick{position:absolute;top:1px;width:3px;height:16px;border-radius:2px}
.note-mark{position:absolute;top:-2px;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid #b3261e;transform:translateX(-6px)}
.playhead{position:absolute;top:0;bottom:8px;width:2px;background:#b3261e;pointer-events:none}
.axis{display:grid;grid-template-columns:110px 1fr;gap:8px;font-size:10.5px;color:var(--muted)}
.axis div:last-child{display:flex;justify-content:space-between}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);padding:0 12px}
.tabs button{border:0;background:none;padding:12px 10px;color:var(--muted);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs button.on{color:var(--ink);border-color:var(--accent)}
.tabpane{display:none;padding:16px}.tabpane.on{display:block}
.sec{margin-bottom:14px}
.sec h3{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 6px;font-weight:600}
.sec p,.sec li{margin:0;line-height:1.55;font-size:13.5px}
.sec ol{margin:0;padding-left:18px}
.ts{font-family:"JetBrains Mono",monospace;font-size:11.5px;color:var(--accent);cursor:pointer;background:var(--accent-soft);border-radius:4px;padding:0 4px}
.flag{background:var(--warn-soft);border-left:3px solid var(--warn);padding:8px 10px;border-radius:0 6px 6px 0;font-size:13px;margin:6px 0}
.codetable td{padding:8px 6px;font-size:13px}
.conf{display:inline-block;width:46px;height:5px;border-radius:3px;background:#e6e9e5;position:relative;vertical-align:middle;margin-right:6px}
.conf i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--accent)}
.countsum{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.countsum .card{padding:10px 14px;flex:1;min-width:110px}
.countsum .v{font-size:20px;font-weight:600}
.countsum .k{font-size:11.5px;color:var(--muted)}
.disclaimer{font-size:11.5px;color:var(--muted);background:#f7f8f6;border:1px dashed var(--line);border-radius:8px;padding:8px 10px;margin-top:12px;line-height:1.5}
.notes textarea{width:100%;min-height:70px;border:1px solid var(--line);border-radius:8px;padding:8px;font:inherit;font-size:13px}
.notelist .n{display:flex;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.footer-actions{display:flex;gap:8px;justify-content:flex-end;padding:12px 16px;border-top:1px solid var(--line);align-items:center}
.footer-actions .left{margin-right:auto;color:var(--muted);font-size:12.5px}

/* reports */
.ask{display:flex;gap:8px;padding:16px}
.ask input{flex:1;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:15px}
.suggest{display:flex;gap:8px;padding:0 16px 16px;flex-wrap:wrap}
.report{padding:20px 24px;line-height:1.6}
.report h2{font-size:18px;margin-bottom:4px}
.cite{font-size:11px;color:var(--muted)}
.rgrid{display:grid;grid-template-columns:260px 1fr;gap:16px}
.saved .it{padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;cursor:pointer}
.saved .it small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.saved .it.on{background:var(--accent-soft)}

/* twin */
.twin{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
.twinview{background:radial-gradient(ellipse at center,#203029,#0b110f);border-radius:12px;aspect-ratio:16/10;position:relative;overflow:hidden}
.beta{background:#7a5bb5;color:#fff;font-size:10.5px;padding:2px 7px;border-radius:999px;font-weight:600;letter-spacing:.04em;vertical-align:middle;margin-left:6px}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px}
.tool{border:1px solid var(--line);border-radius:10px;padding:10px;text-align:center;font-size:12px}
.tool svg{width:100%;height:56px}
.tool small{color:var(--muted);display:block}

/* onboarding */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{padding:20px}
.step .n{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:600;margin-bottom:10px}
.step p{color:#3d4843;line-height:1.55;margin:6px 0 0}
.flow{display:flex;align-items:center;gap:10px;margin:20px 0;flex-wrap:wrap}
.flow .box{padding:12px 16px;border-radius:10px;background:#fff;border:1px solid var(--line);font-weight:500}
.flow .arr{color:var(--muted)}
/* ask drawer */
.askbtn{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font-weight:600;display:flex;gap:8px;align-items:center;color:var(--accent)}
.askbtn kbd{font-family:"JetBrains Mono",monospace;font-size:10.5px;background:#eef0ed;border-radius:4px;padding:1px 5px;color:var(--muted);font-weight:400}
.drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:100vw;background:#fff;border-left:1px solid var(--line);box-shadow:-10px 0 30px rgba(0,0,0,.07);transform:translateX(102%);transition:transform .2s;display:flex;flex-direction:column;z-index:20}
body.ask-open .drawer{transform:none}
@media (min-width:1200px){body.ask-open main{max-width:none;margin:0 420px 0 0}}
.dhead{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px}
.dhead .x{margin-left:auto;border:0;background:none;font-size:18px;color:var(--muted)}
.dscope{display:flex;gap:6px;padding:10px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;font-size:12px;color:var(--muted)}
.dscope .chip[disabled]{opacity:.4;cursor:default}
.msgs{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:16px}
.msg.user{align-self:flex-end;background:var(--accent);color:#fff;padding:9px 12px;border-radius:12px 12px 2px 12px;max-width:85%;font-size:13.5px}
.msg.ai{font-size:13.5px;line-height:1.55}
.msg.ai p{margin:0 0 8px}
.msg.ai table{font-size:12.5px}.msg.ai td,.msg.ai th{padding:5px 6px}
.ctxline{font-size:11.5px;color:var(--muted);text-align:center;border:1px dashed var(--line);border-radius:8px;padding:6px}
.stepsl{list-style:none;margin:0 0 8px;padding:0;font-size:12px;color:var(--muted)}
.stepsl li{display:flex;gap:7px;align-items:center;padding:1px 0}
.spin{width:10px;height:10px;border:2px solid #cfd6d3;border-top-color:var(--accent);border-radius:50%;animation:sp .7s linear infinite;flex:none}
@keyframes sp{to{transform:rotate(360deg)}}
.chk{color:var(--ok);font-weight:700;width:10px;flex:none}
.mact{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.mact button{border:1px solid var(--line);background:#fff;border-radius:7px;padding:4px 9px;font-size:12px}
.mact .save{border-color:var(--accent);color:var(--accent);font-weight:600}
.proposal{border:1px solid #cfe3dc;background:#f4faf8;border-radius:10px;padding:10px 12px;margin-top:6px}
.proposal .diff{font-size:12.5px;margin:6px 0 8px}
.proposal del{color:#b3261e;background:#fdecec;padding:0 4px;border-radius:3px}
.proposal ins{color:var(--ok);background:var(--ok-soft);padding:0 4px;border-radius:3px;text-decoration:none}
.dsugg{padding:8px 16px 0;display:flex;gap:6px;flex-wrap:wrap}
.dsugg .chip{font-size:12px;text-align:left}
.dinput{display:flex;gap:8px;padding:10px 16px 16px;align-items:center}
.dinput input{flex:1;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font:inherit}
.dmic{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:#fff;flex:none}
.dmic.rec{background:#fdecec;border-color:#e7a3a3;animation:blink 1s infinite}
.shead{padding:12px 14px;font-weight:600;border-bottom:1px solid var(--line);font-size:13px}
.rtool{display:flex;align-items:flex-start;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.rtool h2{font-size:17px}
.rtool .acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.rtool .acts .btn{font-size:12.5px;padding:6px 10px}
.changed{margin:14px 24px 0;background:var(--info-soft);color:var(--info);padding:8px 12px;border-radius:8px;font-size:12.5px}
.saved .it .sch{color:var(--accent);font-size:11px}
@media (max-width:980px){.grid,.twin,.rgrid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}}

/* ---- app additions ---- */
.vid video{width:100%;height:100%;object-fit:contain;background:#000;display:block}
.vid .nofeed{position:absolute;inset:0;display:grid;place-items:center;color:#8a9;font-size:12px;text-align:center;padding:10px}
.vid .loading{position:absolute;inset:0;display:grid;place-items:center;color:#8a9;font-size:12px}
.tip{position:fixed;z-index:50;background:#15201c;color:#eaf3ef;font-size:12px;padding:7px 9px;border-radius:7px;max-width:320px;pointer-events:none;line-height:1.4;box-shadow:0 6px 18px rgba(0,0,0,.2)}
.tip b{color:#fff}
.seg{cursor:pointer}
.lane .track{overflow:hidden}
.speed{border:1px solid var(--line);background:#fff;border-radius:6px;padding:3px 6px;font-size:12px}
.err{color:#b3261e;font-size:13px;margin-top:10px}
.empty{color:var(--muted);padding:30px;text-align:center}
.md p{margin:0 0 8px}.md ul,.md ol{margin:0 0 8px;padding-left:18px}.md li{margin:2px 0}
.md h1,.md h2,.md h3,.md h4{font-size:14px;margin:10px 0 4px}
.md table{border-collapse:collapse;margin:6px 0;font-size:12.5px}.md th,.md td{border-bottom:1px solid var(--line);padding:4px 8px;text-align:left}
.md code{font-family:"JetBrains Mono",monospace;font-size:12px;background:#eef0ed;border-radius:4px;padding:0 4px}
.chartbox{margin:8px 0;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.chartbox .ct{font-size:12px;font-weight:600;margin-bottom:2px}
.editable{border:1px dashed transparent;border-radius:6px;padding:2px 4px;margin:-2px -4px}
.editable:hover{border-color:var(--line)}
.fieldedit textarea{width:100%;min-height:54px;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font:inherit;font-size:13px}
.edited{font-size:11px;color:var(--info);margin-left:6px}
.interim{color:var(--muted);font-style:italic;font-size:12.5px;padding:0 16px 8px}
.signed-banner{background:var(--ok-soft);color:var(--ok);padding:8px 12px;border-radius:8px;font-size:13px;margin-bottom:10px}
.stepsl li.err .chk{color:#b3261e}
.legend{display:flex;gap:10px;flex-wrap:wrap;font-size:11px;color:var(--muted);padding:0 12px 6px}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px;vertical-align:-1px}