/* v1c.css — Spotsheet v1.1 "the column". Ported from Claude Design DH #580
   (CD project 019e3049, v1c/v1c.css) 2026-07-26.

   Rides tokens + v1w.css (which still supplies the shared atoms: .w-chip,
   .w-spot, .w-seg2, .w-ucs, .w-ta, .w-cmt, .w-ovl/.w-sheet, .w-sw, .w-kbd).
   The design's harness (.c-desk, .c-gap, .c-cap-note, .c-two, .c-figlab and
   the .h-iv writeup classes) is showcase scaffolding and is NOT ported.

   Amendment 2: the coverage strip is CUT — the design recommended it and the
   founder asked what to drop. Its rules stay in v1w.css unused. */

.c-app { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--bg-app); font-family: var(--ui); color: var(--fg); user-select: none; overflow: hidden; }
.c-win { flex: 1; min-height: 0; display: flex; flex-direction: column; background: var(--bg-app); position: relative; overflow: hidden; }

/* row 1 — identity only */
/* The shell uses a transparent full-size title bar, so THIS ROW SITS UNDER THE
   OS traffic lights. Reserve their gutter (3 lights + margins ~ 76px) and give
   the row the height of a real title bar so nothing collides. The row is also
   the window's drag handle — the OS title bar is transparent, not absent, but
   the controls inside it must stay clickable. */
.c-title{height:38px;flex-shrink:0;display:flex;align-items:center;gap:8px;padding:0 8px 0 78px;background:var(--titlebar-grad,linear-gradient(180deg,#34373d,#2c2f34));border-bottom:1px solid var(--line)}
.c-mk{width:16px;height:16px;border-radius:3px;flex-shrink:0;background:var(--mark-grad,linear-gradient(150deg,#2a2d33,#1a1c20));border:1px solid var(--line-strong);display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:6.5px;font-weight:700;color:var(--fg-strong);position:relative;overflow:hidden}
.c-mk::after{content:'';position:absolute;inset:0;background:linear-gradient(140deg,rgba(53,197,199,.18),transparent 60%)}
.c-proj{display:inline-flex;align-items:center;gap:5px;height:21px;min-width:0;padding:0 5px 0 7px;border:1px solid transparent;border-radius:var(--r-2);background:transparent;cursor:pointer;font-family:var(--ui);font-size:11.5px;color:var(--fg-strong)}
.c-proj:hover{background:var(--bg-sub);border-color:var(--line)}
.c-proj .lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-proj .reel{font-family:var(--mono);font-size:8.5px;letter-spacing:.08em;color:var(--fg-dim);flex-shrink:0}
.c-proj svg{color:var(--fg-dim);flex-shrink:0}
.c-av{width:17px;height:17px;border-radius:50%;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:7.5px;font-weight:600;color:rgba(0,0,0,.68);background:var(--as-teal);cursor:pointer;margin-left:auto}

/* row 2 — the PT rail. the clock is the window's title. */
.c-rail{height:30px;flex-shrink:0;display:flex;align-items:center;gap:8px;padding:0 7px 0 10px;background:var(--bg-deep);border-bottom:1px solid var(--line);box-shadow:inset 0 1px 3px rgba(0,0,0,.45);position:relative}
.c-rail .k{font-family:var(--mono);font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--fg-faint);flex-shrink:0}
.c-tc{font-family:var(--mono);font-size:15px;font-weight:500;letter-spacing:.04em;color:var(--tc-green);font-feature-settings:"tnum" 1,"zero" 1;flex-shrink:0;line-height:1}
.c-tc.dead{color:var(--fg-dim)}
.c-tc.rolling{color:#9dc4a6}
.c-roll{font-family:var(--mono);font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--fg-dim);display:inline-flex;align-items:center;gap:5px;flex-shrink:0}
.c-roll::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--fg-faint)}
.c-roll.live{color:var(--teal)}
.c-roll.live::before{background:var(--teal);box-shadow:0 0 0 3px var(--teal-glow);animation:w-pulse 1.6s ease-in-out infinite}
.c-sess{display:inline-flex;align-items:center;gap:6px;height:22px;min-width:0;margin-left:auto;padding:0 6px;border:1px solid transparent;border-radius:var(--r-2);background:transparent;cursor:pointer;flex-shrink:1}
.c-sess:hover{border-color:var(--line);background:var(--bg-sub)}
.c-sess .d{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--st-resolved)}
.c-sess .nm{font-family:var(--mono);font-size:8.5px;letter-spacing:.01em;color:var(--fg-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-sess.nolink .d{background:var(--st-flagged)}
.c-sess.bad .d{background:var(--st-danger);animation:w-pulse 1.6s ease-in-out infinite}
.c-sess.bad .nm{color:var(--st-danger)}
.c-sess.down .d{background:transparent;border:1px dashed var(--line-strong)}
.c-sess.driving .d{background:var(--teal);box-shadow:0 0 0 3px var(--teal-glow)}
.c-pop{position:absolute;z-index:45;right:6px;top:28px;width:min(300px,calc(100% - 12px));background:var(--bg-panel);border:1px solid var(--line-strong);border-radius:var(--r-3);box-shadow:var(--float);padding:10px 11px 11px}

/* bands — one at a time, actions on their own line */
.c-band{flex-shrink:0;display:flex;flex-direction:column;gap:6px;padding:7px 9px 8px 10px;border-bottom:1px solid var(--line);font-size:11.5px;line-height:1.4}
.c-band .bh{display:flex;align-items:center;gap:8px}
.c-band .k{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;flex-shrink:0}
.c-band .msg{color:var(--fg);text-wrap:pretty}
.c-band .msg b{color:var(--fg-strong);font-weight:500;font-family:var(--mono);font-size:10.5px}
.c-band .acts{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.c-band .q{margin-left:auto;display:inline-flex;align-items:center;gap:5px;height:17px;padding:0 5px;border:1px solid var(--line);border-radius:var(--r-2);background:transparent;color:var(--fg-dim);font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;flex-shrink:0}
.c-band .q:hover{color:var(--fg);border-color:var(--line-strong)}
.c-band .xb{width:17px;height:17px;flex-shrink:0;border:1px solid transparent;border-radius:var(--r-2);background:transparent;color:var(--fg-dim);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.c-band .xb:hover{color:var(--fg);border-color:var(--line)}
.c-band.bad{background:rgba(180,104,104,.11);border-bottom-color:rgba(180,104,104,.32)}
.c-band.bad .k{color:var(--st-danger)}
.c-band.warn{background:rgba(193,147,85,.09);border-bottom-color:rgba(193,147,85,.28)}
.c-band.warn .k{color:var(--st-flagged)}
.c-band.sync{background:var(--bg-sub)}
.c-band.sync .k{color:var(--teal)}
.c-band .prog{flex:1;height:3px;border-radius:2px;background:var(--bg-deep);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
.c-band .prog i{display:block;height:100%;background:var(--teal);transition:width .18s linear}
.c-band .mono{font-family:var(--mono);font-size:9.5px;color:var(--fg-mute);flex-shrink:0}

/* toolbar — three controls, nothing wraps */
.c-tb{height:32px;flex-shrink:0;display:flex;align-items:center;gap:6px;padding:0 8px;background:var(--bg-app);border-bottom:1px solid var(--line)}
.c-search{display:flex;align-items:center;gap:6px;height:22px;flex:1 1 auto;min-width:0;padding:0 7px;border:1px solid var(--line);border-radius:var(--r-2);background:var(--bg-deep);box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}
.c-search input{border:0;background:transparent;outline:none;color:var(--fg);font-family:var(--ui);font-size:11px;width:100%;min-width:0}
.c-search input::placeholder{color:var(--fg-faint)}
.c-search svg{color:var(--fg-dim);flex-shrink:0}
.c-fsheet{flex-shrink:0;background:var(--bg-panel);border-bottom:1px solid var(--line);padding:9px 10px 10px}
.c-fsheet .fh{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.c-fsheet .fk{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-faint)}
.c-fsheet .fr{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:9px}
.c-fsheet .ff{display:flex;align-items:center;gap:8px;padding-top:9px;border-top:1px solid var(--line-soft);font-size:10.5px;color:var(--fg-dim)}

/* hero — the selected note, pinned over the sheet */
.c-hero{position:relative;flex-shrink:0;display:flex;flex-direction:column;gap:4px;padding:8px 9px 9px 12px;background:var(--bg-panel);border-bottom:1px solid var(--line);box-shadow:0 8px 16px rgba(0,0,0,.26)}
.c-hero::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2.5px;background:var(--catc)}
.c-hero.none{flex-direction:row;align-items:center;gap:8px;padding:5px 8px 5px 12px;box-shadow:none}
.c-hero.none::before{background:var(--line)}
.c-hero .hk{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-faint)}
.c-hero .hh{display:flex;align-items:center;gap:8px;min-height:20px}
.c-hero .t{font-family:var(--mono);font-size:19px;font-weight:500;letter-spacing:.035em;color:var(--tc-green);font-feature-settings:"tnum" 1,"zero" 1;line-height:1;cursor:pointer;flex-shrink:0}
.c-hero .t:hover{color:#a5cfae}
.c-hero .t.weak{text-decoration:underline dashed;text-underline-offset:5px;text-decoration-color:var(--st-flagged);color:#b09a78}
.c-hero .pos{font-family:var(--mono);font-size:8.5px;letter-spacing:.08em;color:var(--fg-dim);font-feature-settings:"tnum" 1;flex-shrink:0}
.c-hero .xb{width:18px;height:18px;flex-shrink:0;border:1px solid transparent;border-radius:var(--r-2);background:transparent;color:var(--fg-dim);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.c-hero .xb:hover{color:var(--fg);border-color:var(--line)}
.c-hero .hs{font-family:var(--mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-hero .hb{background:var(--bg-deep);border:1px solid var(--line);border-radius:var(--r-2);color:var(--fg-strong);font-family:var(--ui);font-size:12.5px;line-height:1.45;padding:7px 9px;outline:none;resize:none;height:58px;box-shadow:inset 0 1px 2px rgba(0,0,0,.4);width:100%;margin-top:2px}
.c-hero .hb:focus{border-color:var(--teal-line);box-shadow:inset 0 1px 2px rgba(0,0,0,.4),0 0 0 3px var(--teal-glow)}
.c-hero .hm{display:flex;align-items:center;gap:8px;margin-top:1px}
.c-hero .ex{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 5px;flex-shrink:0;border:1px solid var(--line);border-radius:var(--r-2);background:var(--bg-deep);color:var(--fg-dim);font-family:var(--mono);font-size:9px;cursor:pointer}
.c-hero .ex:hover{color:var(--fg);border-color:var(--line-strong)}
.c-hero .ex.on{color:var(--teal);border-color:var(--teal-line);background:var(--teal-bg)}
.c-hero .hx{display:flex;flex-direction:column;gap:10px;margin-top:5px;padding-top:9px;border-top:1px solid var(--line-soft);max-height:320px;overflow-y:auto}
.c-hero .hx::-webkit-scrollbar{width:8px}
.c-hero .hx::-webkit-scrollbar-thumb{background:#464a51;border-radius:4px;border:2px solid var(--bg-panel)}

/* list */
.c-list{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden}
.c-list::-webkit-scrollbar{width:8px}
.c-list::-webkit-scrollbar-thumb{background:#4a4e55;border-radius:4px;border:2px solid var(--bg-app)}
.c-list::-webkit-scrollbar-track{background:transparent}
.c-grp{display:flex;align-items:center;gap:8px;height:22px;padding:0 9px 0 10px;position:sticky;top:0;z-index:3;background:#2b2e32;border-bottom:1px solid var(--line-soft);border-top:1px solid var(--line-soft);font-family:var(--mono);font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--fg-dim);cursor:pointer}
.c-grp:hover{color:var(--fg-mute)}
.c-grp .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-grp .n{margin-left:auto;color:var(--fg-faint);flex-shrink:0}
.c-grp .cv{flex-shrink:0;color:var(--fg-faint);transition:transform .14s;display:inline-flex}
.c-grp.shut .cv{transform:rotate(-90deg)}
.c-row{position:relative;display:flex;flex-direction:column;gap:3px;padding:7px 10px 8px 12px;border-bottom:1px solid var(--line-soft);cursor:pointer;background:var(--bg-row)}
.c-row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2.5px;background:var(--catc);opacity:.85}
.c-row:hover{background:var(--bg-row-hover)}
.c-row.sel{background:var(--bg-row-sel)}
.c-row.cur::after{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--teal);opacity:.55}
.c-r1{display:flex;align-items:center;gap:7px;min-height:15px}
.c-r1 .sp{flex:1}
.c-rtc{font-family:var(--mono);font-size:10.5px;font-feature-settings:"tnum" 1,"zero" 1;letter-spacing:.01em;color:var(--tc-green);flex-shrink:0}
.c-rtc:hover{color:#a5cfae}
.c-rtc.weak{text-decoration:underline dashed;text-underline-offset:3px;text-decoration-color:var(--st-flagged);color:#a08a6a}
.c-mkr{width:13px;height:13px;border-radius:50%;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}
.c-mkr.res{color:var(--st-resolved);border:1px solid var(--st-resolved);background:var(--st-resolved-bg)}
.c-mkr.flg::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--st-flagged)}
.c-cmt{font-family:var(--mono);font-size:8.5px;color:var(--fg-dim);display:inline-flex;align-items:center;gap:3px;flex-shrink:0}
.c-bd{font-size:11.5px;line-height:1.4;color:var(--fg);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}
.c-row.done .c-bd{-webkit-line-clamp:1;color:var(--fg-dim)}
.c-row.done .c-rtc{color:#6e7d73}
.c-holdbar{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--teal);opacity:.1;pointer-events:none}
.c-row.holding .c-holdbar{width:100%;transition:width .42s linear}
.c-row.holding{background:var(--bg-row-hover)}
.c-newflag{position:absolute;right:0;top:0;bottom:0;width:2px;background:var(--teal);opacity:.7}

.c-meta{display:grid;grid-template-columns:38px 1fr;gap:9px 9px;align-items:center;font-size:11.5px;margin-top:13px}
.c-meta>.k{font-family:var(--mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-faint)}
.c-wrap{display:flex;gap:5px;flex-wrap:wrap;align-items:center}
.c-dfoot{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:11px;border-top:1px solid var(--line-soft)}
.c-id{margin-left:auto;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint)}

/* capture — the whole column, not a modal in a hole */
.c-capt{position:absolute;inset:0;z-index:60;display:flex;flex-direction:column;background:var(--bg-panel);animation:c-up .16s cubic-bezier(.25,.9,.35,1)}
@keyframes c-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.c-capt-h{flex-shrink:0;display:flex;align-items:center;gap:8px;height:30px;padding:0 6px 0 10px;background:var(--bg-sub);border-bottom:1px solid var(--line)}
.c-capt-h .k{font-family:var(--mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal)}
.c-capt-b{flex:1;min-height:0;overflow-y:auto;padding:11px;display:flex;flex-direction:column;gap:9px}
.c-capt-tc{display:flex;align-items:baseline;gap:8px}
.c-capt-tc .t{font-family:var(--mono);font-size:22px;font-weight:500;letter-spacing:.03em;color:var(--tc-green);font-feature-settings:"tnum" 1,"zero" 1;line-height:1}
.c-capt-tc .at{font-size:10px;color:var(--fg-dim);line-height:1.3}
.c-capt-f{flex-shrink:0;display:flex;align-items:center;gap:7px;padding:9px 10px;border-top:1px solid var(--line);background:var(--bg-sub)}
.c-capt-f .note{font-size:9.5px;color:var(--fg-dim);line-height:1.35;flex:1;min-width:0}
.c-capt-f .note b{font-family:var(--mono);font-size:9px;color:var(--fg-mute);font-weight:400}

/* status bar */
.c-status{flex-shrink:0;height:22px;display:flex;align-items:center;gap:9px;padding:0 8px 0 10px;background:var(--bg-panel);border-top:1px solid var(--line);font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-dim);overflow:hidden;white-space:nowrap}
.c-status b{color:var(--fg-mute);font-weight:400}
.c-status .sp{flex:1}
.c-status a{color:var(--fg-dim);text-decoration:none;border-bottom:1px dotted var(--line-strong);flex-shrink:0;cursor:pointer}
.c-status a:hover{color:var(--teal);border-bottom-color:var(--teal-line)}
.c-flash{color:var(--teal);overflow:hidden;text-overflow:ellipsis}

/* empty */
.c-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;padding:24px 22px;text-align:center}
.c-empty .t{font-size:13px;color:var(--fg-mute)}
.c-empty .s{font-size:11.5px;color:var(--fg-dim);line-height:1.6;text-wrap:pretty}
.c-empty .r{display:flex;flex-direction:column;gap:7px;width:100%;margin-top:5px}
.c-empty .r .w-chip{justify-content:center}


/* full-window clock blocker — a mismatch stops every write, so it stops the
   window too (founder 2026-07-26). Per field, two ways out, no dismiss. */
.c-block{position:absolute;inset:0;z-index:70;display:flex;flex-direction:column;background:rgba(20,15,15,.97);animation:c-up .16s cubic-bezier(.25,.9,.35,1)}
.c-block-h{flex-shrink:0;padding:14px 14px 12px;border-bottom:1px solid rgba(180,104,104,.35);background:rgba(180,104,104,.11)}
.c-block-h .k{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--st-danger);margin-bottom:5px}
.c-block-h .sub{font-size:11.5px;color:var(--fg);line-height:1.45;text-wrap:pretty}
.c-block-b{flex:1;min-height:0;overflow-y:auto;padding:12px}
.c-block-row{border:1px solid var(--line);border-radius:var(--r-3);padding:11px;margin-bottom:11px;background:var(--bg-panel)}
.c-block-row .ttl{font-size:12.5px;color:var(--st-flagged);margin-bottom:9px}
.c-block-row .vals{display:flex;gap:9px;margin-bottom:11px}
.c-block-row .vals span{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;background:var(--bg-deep);border:1px solid var(--line-soft);border-radius:var(--r-2);padding:7px 8px}
.c-block-row .vals i{font-family:var(--mono);font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-faint);font-style:normal}
.c-block-row .vals b{font-family:var(--mono);font-size:12px;font-weight:500;color:var(--tc-green);font-feature-settings:"tnum" 1;overflow:hidden;text-overflow:ellipsis}
.c-block-row .btns{display:flex;gap:7px}
.c-block-row .btns>*{flex:1;justify-content:center;height:26px}
.c-block-f{flex-shrink:0;display:flex;flex-direction:column;gap:5px;padding:10px 12px;border-top:1px solid var(--line);background:var(--bg-sub);font-size:10.5px;color:var(--fg-dim);line-height:1.45}

/* the category, readable on the row itself — the edge colour says there IS one,
   not which one. Uses the project's own tag, never a hardcoded set. */
.c-rcat{font-family:var(--mono);font-size:8px;letter-spacing:.13em;text-transform:uppercase;flex-shrink:0;opacity:.9}

/* when selection is NOT driving PT the rail says so — otherwise a stopped
   playhead reads as a broken link rather than a chosen mode */
.c-nodrive{font-family:var(--mono);font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--st-flagged);border:1px solid rgba(193,147,85,.4);border-radius:2px;padding:1px 4px;flex-shrink:0}

/* ══════════════════════════════════════════════════════════════════════════
   v1.2 · RECONCILE — ported from Claude Design DH #581 (CD 019e3049, v1r/).

   The design ships these as a separate `.r-*` sheet that redefines a handful
   of tokens at :root. THAT WOULD REACH THE BROWSER, which shares --as-*,
   .w-as and .w-cov with this window. Everything that is a token override or
   an atom override is therefore SCOPED TO .c-app here — the reconcile is a
   change to the column, not to Spotsheet.

   Superseded by this block and now unused: .c-rcat (the row category chip is
   .r-cat), .c-block* (the blocker is .r-blk and takes the sheet, not the
   window), .c-nodrive (the rail's flag merged into .r-state), .c-pop (the
   column has no floaters left), and .w-cov on the ROW (the hero still has it).
   They stay in the file rather than being deleted so a diff against 1.1 reads.
   ═══════════════════════════════════════════════════════════════════════════ */

/* three label steps. The 8px mono labels were on --fg-faint over panel greys —
   1.2 to 1.8 : 1, which is decoration, not text. Disabled states keep
   --fg-faint, because there low contrast IS the message. */
.c-app{--lab:#8d9299;--lab-lo:#7a7f87;--lab-hi:#a1a6ad}
.c-app .r-shk,.c-app .r-mgrp,.c-app .r-kv .k,.c-app .r-hucs .k,.c-app .r-vs .b .who,.c-app .c-hero .hk,.c-app .c-meta>.k,.c-app .c-rail .k,.c-app .c-hero .pos,.c-app .c-id,.c-app .r-mrow .mn{color:var(--lab)}
.c-app .r-grp,.c-app .r-grp b,.c-app .r-mfoot,.c-app .r-note,.c-app .r-blk-f,.c-app .r-fail-f,.c-app .r-sweep .n,.c-app .r-sid,.c-app .r-hucs .p,.c-app .r-hucs .no,.c-app .r-untag .go,.c-app .r-srow .tg,.c-app .r-state,.c-app .c-grp,.c-app .c-status,.c-app .c-empty .s,.c-app .c-cmt,.c-app .c-hero .hs,.c-app .c-hero .ex,.c-app .r-sessw .nm,.c-app .r-crumb .ver,.c-app .r-ucs{color:var(--lab-lo)}
.c-app .c-status b{color:var(--fg)}
.c-app .r-sid b{color:var(--lab-lo);opacity:.7}
.c-app .c-search input::placeholder{color:var(--lab-lo)}

/* assignee · OUTLINE circle. A solid fill on every row competed with the
   timecode; the ring keeps the identity colour and drops the mass. */
.c-app .w-as.teal,.c-app .w-as.amber,.c-app .w-as.lilac,.c-app .w-as.sky,.c-app .w-as.sage,.c-app .w-as.rose,.c-app .w-as.clay,.c-app .c-av{background:none;box-shadow:inset 0 0 0 1px currentColor;font-weight:600}
.c-app .c-av,.c-app .w-as.teal{color:#4c9ea0}
.c-app .w-as.amber{color:#a67c50}
.c-app .w-as.lilac{color:#8175ad}
.c-app .w-as.sky{color:#6289ab}
.c-app .w-as.sage{color:#6b8a79}
.c-app .w-as.rose{color:#a97180}
.c-app .w-as.clay{color:#9a6a5b}
.c-app .w-as.none{box-shadow:none;border:1px dashed var(--line-strong)}

/* ── row 1 · ONE breadcrumb where two menus used to be ─────────── */
/* row 1 is the positioned ancestor for BOTH row-1 menus (the breadcrumb and
   the notification panel), so they can span the column's full width instead
   of being popovers on a technicality. */
.c-title{position:relative}
.r-crumb{display:inline-flex;align-items:center;gap:5px;height:21px;min-width:0;padding:0 5px 0 7px;border:1px solid transparent;border-radius:var(--r-2);background:transparent;cursor:pointer;font-family:var(--ui);font-size:11.5px;color:var(--fg-strong)}
.r-crumb:hover{background:var(--bg-sub);border-color:var(--line)}
/* the project truncates first; THE VERSION NEVER TRUNCATES, because the
   version is the safety-critical half */
.r-crumb .lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.r-crumb .sl{color:var(--fg-faint);flex-shrink:0}
.r-crumb .ver{font-family:var(--mono);font-size:10px;letter-spacing:.04em;flex-shrink:0}
.r-crumb svg{color:var(--fg-dim);flex-shrink:0}
.r-title-sp{flex:1;min-width:4px;align-self:stretch}

/* ── row 1 menus ───────────────────────────────────────────────── */
.r-anchor{position:static;display:inline-flex;min-width:0;flex-shrink:1}
.r-mscrim{position:absolute;inset:0;z-index:44}
.r-menu{position:absolute;z-index:46;top:calc(100% + 4px);left:78px;width:max-content;min-width:196px;max-width:min(250px,calc(100% - 84px));max-height:302px;overflow-y:auto;overflow-x:hidden;background:var(--bg-panel);border:1px solid var(--line-strong);border-radius:var(--r-3);box-shadow:var(--float);padding:4px;display:flex;flex-direction:column}
.r-menu::-webkit-scrollbar{width:8px}
.r-menu::-webkit-scrollbar-thumb{background:#464a51;border-radius:4px;border:2px solid var(--bg-panel)}
.r-msearch{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:6px;height:25px;flex-shrink:0;margin-bottom:3px;padding:0 7px;border:1px solid var(--line);border-radius:var(--r-2);background:var(--bg-deep);box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}
.r-msearch svg{color:var(--lab-lo);flex-shrink:0}
.r-msearch input{border:0;background:transparent;outline:none;color:var(--fg);font-family:var(--ui);font-size:11px;width:100%;min-width:0}
.r-mnone{font-size:11px;color:var(--lab-lo);padding:7px 8px}
.r-mgrp{font-family:var(--mono);font-size:7.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-faint);padding:7px 8px 5px}
.r-mrow{display:flex;align-items:center;gap:8px;min-height:24px;padding:0 8px;border-radius:var(--r-2);cursor:pointer;color:var(--fg-mute);font-size:11.5px}
.r-mrow:hover{background:var(--bg-row-hover);color:var(--fg-strong)}
.r-mrow .tk{width:10px;flex-shrink:0;color:var(--teal);display:inline-flex}
.r-mrow .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.r-mrow.on .nm{color:var(--fg-strong)}
.r-mrow .mn{font-family:var(--mono);font-size:8.5px;letter-spacing:.06em;margin-left:auto;flex-shrink:0}
.r-mrow.on .mn{color:var(--teal)}
.r-mfoot{border-top:1px solid var(--line-soft);margin-top:4px;padding:7px 4px 3px}
/* the version's session at the foot of the picker. One session and it is just
   a name; more than one and the arrows appear — the power-user case, in place. */
.r-mses{display:flex;align-items:center;margin-top:5px;padding:7px 2px 1px;border-top:1px solid var(--line-soft)}
.r-mses .box{flex:1;min-width:0;display:flex;align-items:center;gap:7px;height:26px;padding:0 3px 0 8px;border:1px solid var(--line);border-radius:var(--r-2);background:var(--bg-deep);box-shadow:inset 0 1px 2px rgba(0,0,0,.35)}
.r-mses .box .k{font-family:var(--mono);font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--lab);flex-shrink:0}
.r-mses .box .nm{font-size:11px;color:var(--fg-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}
.r-mses .box .lk{width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px var(--teal-glow);flex-shrink:0}
.r-mses .st{display:inline-flex;flex-shrink:0;margin-left:auto;border:1px solid var(--line);border-radius:var(--r-2);overflow:hidden;background:var(--bg-sub)}
.r-mses .st button{border:0;background:transparent;width:19px;height:20px;color:var(--lab-lo);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.r-mses .st button+button{border-left:1px solid var(--line)}
.r-mses .st button:hover{color:var(--fg-strong);background:var(--bg-row-hover)}

/* ── row 2 · ONE state slot, and the session as a switcher ─────── */
.r-state{font-family:var(--mono);font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;display:inline-flex;align-items:center;gap:5px;flex-shrink:0}
.r-state::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--fg-faint);flex-shrink:0}
.r-state.live{color:var(--teal)}
.r-state.live::before{background:var(--teal);box-shadow:0 0 0 3px var(--teal-glow);animation:w-pulse 1.6s ease-in-out infinite}
.r-state.on{color:var(--teal)}
.r-state.on::before{background:var(--teal)}
.r-state.warn{color:var(--st-flagged)}
.r-state.warn::before{background:var(--st-flagged)}
.r-sessw{display:inline-flex;align-items:center;gap:6px;height:22px;min-width:0;margin-left:auto;padding:0 4px 0 7px;border:1px solid var(--line);border-radius:var(--r-2);background:var(--bg-sub);cursor:pointer;flex-shrink:1}
.r-sessw:hover{border-color:var(--line-strong)}
.r-sessw.on{border-color:var(--teal-line);background:var(--teal-bg)}
.r-sessw .d{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--st-resolved)}
.r-sessw .nm{font-family:var(--mono);font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.r-sessw svg{color:var(--fg-dim);flex-shrink:0}
.r-sessw.nolink .d{background:var(--st-flagged)}
.r-sessw.bad .d{background:var(--st-danger);animation:w-pulse 1.6s ease-in-out infinite}
.r-sessw.down .d{background:transparent;border:1px dashed var(--line-strong)}
.r-sessw.driving .d{background:var(--teal);box-shadow:0 0 0 3px var(--teal-glow)}
/* the on-ramp for the editor who already drops memory locations */
.r-mkb{flex-shrink:0;height:18px;padding:0 6px;border:1px solid var(--teal-line);border-radius:var(--r-2);background:var(--teal-bg);color:var(--teal);font-family:var(--mono);font-size:8.5px;letter-spacing:.06em;cursor:pointer}
.r-mkb:hover{background:rgba(53,197,199,.16)}

/* ── in-flow sheets · the column's rule is sheets, not popovers ── */
.r-sheet{flex-shrink:0;background:var(--bg-panel);border-bottom:1px solid var(--line);display:flex;flex-direction:column;max-height:66%;overflow-y:auto}
.r-sheet::-webkit-scrollbar{width:8px}
.r-sheet::-webkit-scrollbar-thumb{background:#464a51;border-radius:4px;border:2px solid var(--bg-panel)}
.r-sh{display:flex;align-items:center;gap:8px;padding:9px 8px 8px 10px;position:sticky;top:0;background:var(--bg-panel);z-index:2}
.r-shk{font-family:var(--mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase}
.r-grp{display:flex;align-items:center;gap:7px;padding:11px 10px 5px;font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;border-top:1px solid var(--line-soft)}
.r-grp b{font-weight:400;text-transform:none;letter-spacing:.02em}
.r-body{padding:0 10px 10px;display:flex;flex-direction:column;gap:7px}
.r-kv{display:grid;grid-template-columns:auto 1fr;gap:5px 10px;align-items:baseline}
.r-kv .k{font-family:var(--mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase}
.r-kv .v{font-family:var(--mono);font-size:9.5px;color:var(--fg-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.r-kv .v.bad{color:var(--st-danger)}
.r-note{font-size:10.5px;line-height:1.5;text-wrap:pretty}
.r-srow{display:flex;align-items:center;gap:8px;height:26px;padding:0 10px;cursor:pointer;border-bottom:1px solid rgba(0,0,0,.16);position:relative}
.r-srow:hover{background:var(--bg-row-hover)}
.r-srow .rd{width:11px;height:11px;border-radius:50%;flex-shrink:0;border:1px solid var(--line-strong);display:inline-flex;align-items:center;justify-content:center}
.r-srow.on{background:var(--bg-row-sel)}
.r-srow.on .rd{border-color:var(--teal)}
.r-srow.on .rd::after{content:'';width:5px;height:5px;border-radius:50%;background:var(--teal)}
.r-srow .nm{font-size:11.5px;color:var(--fg-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.r-srow.on .nm{color:var(--fg-strong)}
.r-srow .tg{font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;margin-left:auto;flex-shrink:0}
.r-srow.on .tg{color:var(--teal)}
.r-line{display:flex;align-items:center;gap:8px;min-height:22px}
.r-line .lb{font-size:11px;color:var(--fg-mute);min-width:0}
.r-line .w-sw,.r-line .w-kbd{margin-left:auto}
.r-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
/* set-active is the ONE confirmed verb here — it moves the clock, the
   selection and every write */
.r-confirm{background:var(--st-flagged-bg);border:1px solid rgba(193,147,85,.35);border-radius:var(--r-2);padding:8px 9px;display:flex;flex-direction:column;gap:7px}
.r-confirm .t{font-size:11px;color:var(--fg);line-height:1.45;text-wrap:pretty}

/* ── markers ⇄ notes · two directions under one label ──────────── */
.r-swap{font-family:var(--mono);color:var(--fg-mute);padding:0 1px}
.r-dirh{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--lab);margin:2px 0 6px}
.r-dirh.mk{margin-top:11px;padding-top:9px;border-top:1px solid var(--line-soft)}
.r-dirh .ar{font-size:10px;color:var(--fg-mute);letter-spacing:0}
.r-dirh b{margin-left:auto;font-weight:400;color:var(--teal);letter-spacing:.1em}
.r-scan{display:flex;flex-direction:column;gap:5px;padding:8px 9px;border:1px solid var(--line);border-radius:var(--r-2);background:var(--bg-deep);margin-bottom:2px;min-width:0;overflow:hidden}
.r-scan .ln{font-size:10.5px;color:var(--fg-mute);line-height:1.4;display:flex;align-items:baseline;gap:5px;flex-wrap:wrap}
.r-scan .ln.big{color:var(--fg)}
.r-scan .ln b{font-family:var(--mono);font-size:11px;color:var(--fg-strong);font-weight:500}
.r-scan .ln .d{color:var(--lab-lo)}
.r-scan .pv{display:flex;flex-direction:column;gap:3px;margin:2px 0 3px;padding-top:6px;border-top:1px solid var(--line-soft);min-width:0}
.r-scan .pr{display:flex;align-items:baseline;gap:7px;min-width:0}
.r-scan .pr .t{font-family:var(--mono);font-size:9px;color:var(--tc-green);flex-shrink:0}
.r-scan .pr .c{font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;flex-shrink:0}
.r-scan .pr .c.bare{color:var(--lab-lo)}
.r-scan .pr .u{font-family:var(--mono);font-size:8.5px;letter-spacing:.02em;color:var(--fg-mute);flex-shrink:0}
.r-scan .pr .b{font-size:10.5px;color:var(--fg-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.r-scan .pr.more{font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--lab-lo)}

/* ── the row · category is BARE colour, the UCS tag is a boxed grey chip ──
   The two axes must never look like one system: the category asks WHO DOES
   THIS, the tag asks WHAT IS IT. */
.r-cat{font-family:var(--mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;flex-shrink:0;opacity:.92;border:0;background:none;padding:0}
.r-cat.lg{font-size:8.5px}
.r-ucs{font-family:var(--mono);font-size:8.5px;letter-spacing:.01em;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;height:14px;padding:0 5px;border:1px solid var(--line);border-radius:2px;background:var(--bg-deep);box-shadow:inset 0 1px 1px rgba(0,0,0,.28);display:inline-flex;align-items:center}
.r-ucs:hover{color:var(--fg);border-color:var(--line-strong);background:var(--bg-sub)}
.r-ucs.on{color:var(--teal);border-color:var(--teal-line);background:var(--teal-bg);box-shadow:none}
.c-row.done .r-ucs{color:#4c5258;border-color:var(--line-soft);background:none;box-shadow:none}
/* the hero carries the readable path and the confidence read */
.r-hucs{display:flex;align-items:center;gap:7px;min-width:0;margin-top:1px}
.r-hucs .k{font-family:var(--mono);font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;flex-shrink:0}
.r-hucs .id{font-family:var(--mono);font-size:10px;letter-spacing:.01em;color:var(--fg-mute);flex-shrink:0;height:15px;padding:0 5px;border:1px solid var(--line);border-radius:2px;background:var(--bg-deep);box-shadow:inset 0 1px 1px rgba(0,0,0,.28);display:inline-flex;align-items:center;cursor:pointer}
.r-hucs .id:hover{border-color:var(--line-strong);background:var(--bg-sub);color:var(--fg)}
.r-hucs .p{font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-bottom:1px dotted transparent;padding-bottom:1px}
.r-hucs .p:hover{color:var(--fg);border-bottom-color:var(--fg-dim)}
.r-hucs .p i{color:var(--fg-faint);font-style:normal}
.r-hucs .cf{display:flex;gap:2px;flex-shrink:0}
.r-hucs .cf i{width:3px;height:3px;border-radius:1px;background:#3f434a}
.r-hucs .cf.w2 i:nth-child(-n+2),.r-hucs .cf.w3 i{background:var(--fg-dim)}
.r-hucs.low .id{color:var(--fg-dim)}
.r-hucs.low .p{color:var(--fg-faint)}
.r-hucs .no{margin-left:auto;flex-shrink:0;background:none;border:0;padding:0;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.r-hucs .no:hover{color:var(--fg)}

/* created + assigned · two rings, linked like olympic rings. The author sits
   behind and is punched out where the assignee crosses it, so both outlines
   read as solid objects without either ring changing size. */
.r-who{display:inline-flex;align-items:center;flex-shrink:0}
.r-who .w-as{width:16px;height:16px;font-size:7px}
.r-who>span+span{margin-left:-5px}
.r-who .w-as.by{opacity:.62;-webkit-mask-image:radial-gradient(circle 9.2px at 19px 50%,rgba(0,0,0,0) 99%,#000 100%);mask-image:radial-gradient(circle 9.2px at 19px 50%,rgba(0,0,0,0) 99%,#000 100%)}

/* ── the row's left rail is the ASSIGNEE, and it fades ──────────
   The first question an editor asks a sheet is "which of these are mine" —
   not "which of these are FOLEY". Category kept its tag on line 1, so the
   edge is spent on ownership. Five hard hues read as a legend you have to
   learn; ONE hue that fades reads as a margin mark. */
.c-row::before,.c-hero::before{width:3px;opacity:1;background:linear-gradient(180deg,var(--asc,var(--line-strong)) 0%,color-mix(in srgb,var(--asc,var(--line-strong)) 34%,transparent) 58%,transparent 100%)}
.c-row::before{opacity:.62}
.c-row.mine::before{opacity:1}
.c-row.mine{background-image:linear-gradient(90deg,color-mix(in srgb,var(--asc) 9%,transparent),transparent 52px)}
/* unassigned is neutral and dimmest — nobody owes it yet, which is itself
   worth seeing while scanning */
.c-row.noone::before,.c-hero.noone::before{opacity:.34;background:linear-gradient(180deg,var(--line-strong) 0%,transparent 66%)}
.c-row.done::before{opacity:.3;filter:saturate(.22)}
.c-row.done.mine::before{opacity:.5}
.c-row.done.mine{background-image:none}
/* a finished sheet reads grey, and the open work is the only colour left */
.c-row.done .r-cat,.c-row.done .r-who{filter:saturate(.2) opacity(.72)}
/* "teal in the list means Pro Tools is here". With driving off there is no
   current-frame hairline, because it would be a claim about a playhead that
   is not following. Selection still highlights. */
.r-nodrive .c-row.cur::after{display:none}
.r-nd{font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--st-flagged);flex-shrink:0}

/* ── the sweep · a tag filter is a MODE, so it gets a full-width strip ──
   LEDGER CORRECTION, DH #583 (design default, founder did not object, 2026-07-27):
   this strip used to be TEAL. Teal is THE ONE CREATE ACTION per surface and
   nothing else — a mode that is ON is not a second create-coloured object. It
   is neutral-BRIGHT now, and the merged browser surface reads the same rule, so
   the two surfaces cannot disagree about what teal means.
   ⚠ This changes the already-shipped 1.0.11 column. Called out on walk #1078
   so it is not a surprise. Literal brightness values on purpose: the --att-*
   ledger tokens ship with the merged Notes surface and the column can render
   without it. */
.r-sweep{position:relative;flex-shrink:0;display:flex;flex-direction:column;gap:6px;padding:7px 8px 8px 12px;background:var(--bg-sub);border-bottom:1px solid var(--line-strong)}
.r-sweep::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2.5px;background:#ebedf0}
.r-sweep .sh{display:flex;align-items:center;gap:8px;min-width:0}
.r-sweep .k{font-family:var(--mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:#d4d7dc;flex-shrink:0}
.r-sweep .fam{font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--fg-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.r-sweep .n{font-family:var(--mono);font-size:8.5px;letter-spacing:.06em;margin-left:auto;flex-shrink:0}
.r-sweep .xb{width:17px;height:17px;flex-shrink:0;border:1px solid transparent;border-radius:var(--r-2);background:transparent;color:var(--fg-mute);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.r-sweep .xb:hover{color:var(--fg-strong);border-color:var(--line)}
.r-sweep .msg{font-size:10.5px;color:var(--fg-mute);line-height:1.45;text-wrap:pretty}
.r-sweep .msg b{color:var(--fg);font-weight:500}
.r-sweep .ids{display:flex;gap:5px;flex-wrap:wrap}
.r-sid{display:inline-flex;align-items:center;gap:5px;height:17px;padding:0 5px;flex-shrink:0;border:1px solid var(--line);border-radius:2px;background:var(--bg-deep);font-family:var(--mono);font-size:8.5px;letter-spacing:.02em;cursor:pointer}
.r-sid:hover{color:var(--fg)}
.r-sid.on{border-color:var(--teal-line);color:var(--teal);background:var(--teal-bg)}
.r-sid.on b{color:var(--teal);opacity:.7}
/* the ask · the SAME strip the mode will occupy, one state earlier and with
   no teal in it — so a question never reads as a mode already on. */
.r-sweep.ask{background:var(--bg-sub);border-bottom-color:var(--line)}
.r-sweep.ask::before{background:var(--line-strong)}
.r-sweep.ask .k{color:var(--fg-mute)}
.r-sweep.ask .w-sw{margin-left:auto}
.r-sweep.ask.tight{padding:6px 8px 7px 12px;gap:4px}
.r-sweep.ask.tight .msg{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:10px}
/* the untagged view is AMBER, not teal: it is a caveat, not a mode you work in */
.r-sweep.untag{background:var(--st-flagged-bg);border-bottom-color:rgba(193,147,85,.32)}
.r-sweep.untag::before{background:var(--st-flagged)}
.r-sweep.untag .k{color:var(--st-flagged)}
.r-sweep.tight{gap:5px}
.r-sweep.tight .r-untag{align-items:center;padding-top:5px}
.r-sweep.tight .msg{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* clear nine doors, feel finished, and three untagged doors still in the
   sheet is a filter no one uses twice */
.r-untag{display:flex;align-items:flex-start;gap:7px;padding-top:6px;border-top:1px solid rgba(53,197,199,.2);font-size:10.5px;color:var(--fg-mute);line-height:1.45;text-wrap:pretty}
.r-untag .wk{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--st-flagged);flex-shrink:0;padding-top:2px}
.r-untag .go{flex-shrink:0;background:none;border:0;padding:0;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;border-bottom:1px dotted var(--line-strong);margin-left:auto}
.r-untag .go:hover{color:var(--fg-strong)}
/* at the floor the mode wins the pixels */
.r-floor .r-sweep .ids{display:none}

/* ── the clock blocker · it takes the SHEET, and it is AMBER ──────
   Red and full-window is this product's vocabulary for a REFUSED WRITE. A
   project and a session disagreeing about start timecode is not a fault, it
   is setup that has not happened yet, and this product's word for that is
   amber. Chrome stays; the list is what the cards replace. */
.r-blk{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--bg-app);overflow:hidden}
.r-blk-h{flex-shrink:0;padding:11px 11px 11px 12px;background:var(--st-flagged-bg);border-bottom:1px solid rgba(193,147,85,.3);display:flex;flex-direction:column;gap:7px;position:relative}
.r-blk-h .k{font-family:var(--mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--st-flagged);display:flex;align-items:center;gap:8px}
.r-blk-h .k .n{margin-left:auto;color:var(--fg-dim);letter-spacing:.1em}
.r-blk-h .s{font-size:11.5px;color:var(--fg);line-height:1.45;text-wrap:pretty}
.r-blk-h .s b{font-family:var(--mono);font-size:10.5px;color:var(--fg-strong);font-weight:500}
/* the header, the resolve-alls and the footer do not scroll; the cards do */
.r-blk-b{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:10px;display:flex;flex-direction:column;gap:9px}
.r-blk-b::-webkit-scrollbar{width:8px;height:0}
.r-blk-b::-webkit-scrollbar-thumb{background:#464a51;border-radius:4px;border:2px solid var(--bg-app)}
.r-card{background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--r-3);padding:8px 9px 9px;display:flex;flex-direction:column;gap:7px;min-width:0}
.r-card>.k{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-mute);display:flex;align-items:center;gap:7px}
.r-card>.k i{width:3px;height:9px;border-radius:1px;background:var(--st-flagged);flex-shrink:0}
/* sample rate is marked no-time-shift so it stops competing with the two
   fields that actually move audio */
.r-card>.k i.soft{background:var(--line-strong)}
.r-vs{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.r-vs .b{background:var(--bg-deep);border:1px solid var(--line);border-radius:var(--r-2);padding:5px 7px 6px;display:flex;flex-direction:column;gap:3px;min-width:0;box-shadow:inset 0 1px 2px rgba(0,0,0,.35)}
.r-vs .b .who{font-family:var(--mono);font-size:7.5px;letter-spacing:.14em;text-transform:uppercase}
.r-vs .b .val{font-family:var(--mono);font-size:12.5px;letter-spacing:.02em;line-height:1.25;color:var(--fg-strong);font-feature-settings:"tnum" 1,"zero" 1;overflow-wrap:anywhere}
.r-vs .b.pt .val{color:var(--tc-green)}
/* the editor is being asked to arbitrate: give them the stake, not the schema */
.r-why{font-size:11px;color:var(--fg-mute);line-height:1.45;text-wrap:pretty}
/* NEITHER BUTTON IS PRIMARY — the product does not know which side is right,
   and the only teal in this window is CUE */
.r-card .r-acts .w-chip{flex:1;justify-content:center}
.r-blk-f{flex-shrink:0;padding:7px 11px 8px;border-top:1px solid var(--line);background:var(--bg-panel);font-size:9.5px;line-height:1.45;text-wrap:pretty}
.r-blk-f b{font-family:var(--mono);font-size:9.5px;color:var(--fg-mute);font-weight:400}
/* Match to PT rewrites the PROJECT clock, so it is the owner's call — with
   the reason named, the owner named, and one press to ask */
.r-own{display:flex;align-items:flex-start;gap:7px;padding-top:7px;margin-top:1px;border-top:1px solid rgba(193,147,85,.22);font-size:10.5px;color:var(--fg-mute);line-height:1.45;text-wrap:pretty}
.r-own .wk{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--st-flagged);flex-shrink:0;padding-top:2px}
.r-own b{color:var(--fg);font-weight:500}
.r-own .go{flex-shrink:0;margin-left:auto;background:none;border:0;padding:0;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-mute);cursor:pointer;border-bottom:1px dotted var(--line-strong)}
.r-own .go:hover{color:var(--fg-strong)}
.r-own .done{flex-shrink:0;margin-left:auto;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--st-resolved)}

/* ── the render failure · keep the window a window ─────────────── */
.r-fail{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--bg-app);overflow-y:auto}
.r-fail-b{flex:1;display:flex;flex-direction:column;justify-content:center;gap:11px;padding:20px 14px}
.r-fail .k{font-family:var(--mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--st-flagged);display:flex;align-items:center;gap:7px}
.r-fail .k i{width:3px;height:9px;background:var(--st-flagged);border-radius:1px}
.r-fail h4{font-size:13.5px;color:var(--fg-strong);font-weight:500;letter-spacing:-.005em;line-height:1.35;margin:0}
.r-fail p{font-size:11.5px;color:var(--fg-mute);line-height:1.55;margin:0;text-wrap:pretty}
.r-fail p b{color:var(--fg);font-weight:500}
/* selectable, and never behind a disclosure — the person who needs the stack
   is the person we are asking to send it */
.r-pre{background:var(--bg-deep);border:1px solid var(--line);border-radius:var(--r-2);padding:8px 9px;font-family:var(--mono);font-size:9px;line-height:1.65;color:var(--fg-mute);white-space:pre-wrap;overflow-x:auto;max-height:150px;overflow-y:auto;user-select:text;box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}
.r-pre::-webkit-scrollbar{width:8px;height:8px}
.r-pre::-webkit-scrollbar-thumb{background:#464a51;border-radius:4px;border:2px solid var(--bg-deep)}
.r-fail-acts{display:flex;flex-direction:column;gap:7px}
.r-fail-acts .w-spot,.r-fail-acts .w-chip{justify-content:center;height:26px}
.r-fail-f{flex-shrink:0;padding:9px 11px;border-top:1px solid var(--line);font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;line-height:1.8}

/* ── notifications · off the avatar, zero new width ─────────────
   Quiet by construction: the count is a mono numeral in a ring, unread is
   carried by BRIGHTNESS, and nothing animates. The clock blocker owns
   "stop everything"; this owns "findable". Teal stays on CUE. */
.r-nbell{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;background:none;border:0;padding:0;cursor:pointer;margin-left:auto}
.r-nbell .n{font-family:var(--mono);font-size:8px;letter-spacing:.02em;color:var(--fg-mute);min-width:14px;height:14px;padding:0 3px;border:1px solid var(--line);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:var(--bg-deep);font-feature-settings:"tnum" 1}
.r-nbell.has .n{color:var(--fg);border-color:var(--line-strong)}
.r-nbell:hover .n{color:var(--fg-strong)}
.r-nbell:hover .c-av,.r-nbell.open .c-av{color:#6cbcbe}
.r-nbell.open .n{color:var(--fg-strong);border-color:var(--fg-dim)}
.r-nbell .c-av{margin-left:0}
/* full-width under row 1 — a 250px popover inside a 360px window is a popover
   on a technicality */
.r-ntpanel{position:absolute;z-index:46;top:calc(100% + 1px);left:6px;right:6px;max-height:430px;display:flex;flex-direction:column;background:var(--bg-panel);border:1px solid var(--line-strong);border-radius:var(--r-3);box-shadow:var(--float);overflow:hidden}
.r-nthead{flex-shrink:0;display:flex;align-items:center;gap:8px;height:26px;padding:0 5px 0 9px;background:var(--bg-sub);border-bottom:1px solid var(--line)}
.r-nthead .k{font-family:var(--mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--lab-hi)}
.r-nthead .n{font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-mute)}
.r-nthead .sp{flex:1}
.r-nthead .w-chip{height:17px;padding:0 6px}
.r-nthead .xb{width:17px;height:17px;flex-shrink:0;border:1px solid transparent;border-radius:var(--r-2);background:none;color:var(--fg-dim);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.r-nthead .xb:hover{color:var(--fg);border-color:var(--line)}
.r-ntbody{flex:1 1 auto;min-height:0;overflow-y:auto}
.r-ntbody::-webkit-scrollbar{width:8px}
.r-ntbody::-webkit-scrollbar-thumb{background:#464a51;border-radius:4px;border:2px solid var(--bg-panel)}
/* the section headers only exist when both kinds are present — one kind
   needs no taxonomy */
.r-ntgrp{font-family:var(--mono);font-size:7.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--lab-lo);padding:8px 9px 5px;background:var(--bg-panel)}
.r-ntrow{display:flex;gap:7px;padding:7px 9px 8px 6px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.r-ntrow:hover{background:var(--bg-row-hover)}
.r-ntrow.unread{background:var(--bg-sub)}
.r-ntrow.unread:hover{background:var(--bg-row-hover)}
.r-ntrow .dot{width:4px;height:4px;border-radius:50%;background:transparent;flex-shrink:0;margin-top:6px}
.r-ntrow.unread .dot{background:var(--fg-mute)}
.r-ntrow .w-as{margin-top:1px}
.r-ntrow .bd{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.r-ntrow .ln{font-size:11.5px;line-height:1.42;color:var(--fg-mute);text-wrap:pretty}
.r-ntrow.unread .ln{color:var(--fg)}
.r-ntrow .ln b{color:var(--fg-strong);font-weight:500}
.r-ntrow .mt{display:flex;align-items:center;gap:7px}
.r-ntrow .mt .sp{flex:1}
.r-ntrow .tc{font-family:var(--mono);font-size:9.5px;font-feature-settings:"tnum" 1,"zero" 1;color:var(--tc-green)}
.r-ntrow .cat{font-family:var(--mono);font-size:8px;letter-spacing:.13em;text-transform:uppercase}
.r-ntrow .ago,.r-ntask .ago{font-family:var(--mono);font-size:8px;letter-spacing:.1em;color:var(--lab-lo);flex-shrink:0}
.r-ntrow .st{font-family:var(--mono);font-size:9px;color:var(--fg-mute)}
.r-ntrow .st.ok{color:var(--st-resolved)}
/* the one row that is NOT a press-anywhere row: a note on another project
   cannot park this clock, and says so */
.r-ntrow.away{cursor:default}
.r-ntrow .els{display:flex;flex-direction:column;gap:6px;align-items:flex-start;margin-top:4px;padding-top:6px;border-top:1px dashed var(--line);font-size:10.5px;color:var(--fg-dim);line-height:1.45;text-wrap:pretty}
.r-ntrow .els b{font-family:var(--mono);font-size:10px;color:var(--fg-mute)}
/* NEEDS YOU · the ask, the two values, the reason, and Accept/Decline on the
   notification itself */
.r-ntask{display:flex;flex-direction:column;gap:6px;padding:8px 9px 9px 10px;border-bottom:1px solid var(--line-soft);border-left:2px solid rgba(193,147,85,.5);background:rgba(193,147,85,.06)}
.r-ntask .hd{display:flex;align-items:center;gap:8px}
.r-ntask .hd .sp{flex:1}
.r-ntask .wk{font-family:var(--mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--st-flagged)}
.r-ntask .ln{font-size:11.5px;line-height:1.42;color:var(--fg);text-wrap:pretty}
.r-ntask .ln b{color:var(--fg-strong);font-weight:500}
.r-ntask .vals{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;font-feature-settings:"tnum" 1}
.r-ntask .vals svg{color:var(--fg-dim)}
.r-ntask .was{color:var(--fg-mute)}
.r-ntask .to{color:var(--fg-strong)}
.r-ntask .why{font-size:10.5px;color:var(--fg-dim);line-height:1.45;text-wrap:pretty}
.r-ntask .acts{display:flex;align-items:center;gap:6px}
.r-ntempty{padding:22px 16px;text-align:center;display:flex;flex-direction:column;gap:7px}
.r-ntempty .t{font-size:12.5px;color:var(--fg-mute)}
.r-ntempty .s{font-size:11px;color:var(--fg-dim);line-height:1.55;text-wrap:pretty}
/* the footer states which of the two it is doing BEFORE you press anything */
.r-ntfoot{flex-shrink:0;display:flex;align-items:center;gap:8px;height:20px;padding:0 9px;background:var(--bg-sub);border-top:1px solid var(--line);font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--lab-lo);overflow:hidden;white-space:nowrap}
.r-floor .r-ntask .why,.r-floor .r-ntrow .els span{display:none}
.r-floor .r-ntpanel{max-height:330px}
