@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&display=swap');
  /* ═══ THEME ═══ Light is the default — desk work happens in light.
     Dark is the same console after dark. Manual toggle only, persisted to mac_theme.
     Every colour below is a token: nothing outside this block knows which theme is on. */
  :root{
    /* Surface ramp mirrors dark's semantics, not its direction:
       bg4 = the least step from bg (hovers), bg2 = cards, bg3 = the most (chips, buttons). */
    --bg:#ffffff;--bg4:#fafaf8;--bg2:#f6f5f2;--bg3:#eceae5;
    --text:#22221f;--text2:#5f5f58;--text3:#8b8a82;
    --line:rgba(34,34,31,0.07);--line2:rgba(34,34,31,0.13);
    --green:#178a67;--red:#cf4342;--amber:#a5670f;--gold:#c9862a;--blue:#2f77c4;--purple:#6f639b;
    --morning:#c9862a;--afternoon:#2f77c4;--dusk:#a5670f;--evening:#6f639b;
    --on:#ffffff;      /* text on a saturated fill */
    --ongold:#1a1407;  /* text on gold — needs to stay dark in both themes */
    --shadow:0 1px 2px rgba(0,0,0,.06);
    --hatch:rgba(34,34,31,.055);   /* locked-formula hatching */
    --popshadow:0 12px 34px rgba(0,0,0,.16);
    --track:rgba(34,34,31,.10);    /* unfilled portion of progress rings */
    --gold-soft:rgba(201,134,42,.85);
    --scrim:rgba(255,255,255,.98); /* full-screen ritual / nav backdrop */
    --r:10px;--rl:14px;
    --font:"Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,Helvetica,Arial,sans-serif;
    --mono:'DM Mono',ui-monospace,monospace;
    --tap:52px;
  }
  html[data-theme="dark"]{
    --bg:#0f0f0e;--bg2:#1c1c1a;--bg3:#272724;--bg4:#141412;
    --text:#f1efe8;--text2:#c8c6be;--text3:#83817a;
    --line:rgba(241,239,232,0.09);--line2:rgba(241,239,232,0.18);
    --green:#1D9E75;--red:#E24B4A;--amber:#BA7517;--gold:#EF9F27;--blue:#378ADD;--purple:#8a7fb0;
    --morning:#EF9F27;--afternoon:#378ADD;--dusk:#BA7517;--evening:#8a7fb0;
    --on:#ffffff;--ongold:#1a1407;
    --shadow:0 1px 2px rgba(0,0,0,.3);
    --hatch:rgba(241,239,232,.03);
    --popshadow:0 12px 34px rgba(0,0,0,.5);
    --track:rgba(241,239,232,.12);
    --gold-soft:rgba(239,159,39,.8);
    --scrim:rgba(15,15,14,.97);
  }
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
  body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 var(--font);
    -webkit-font-smoothing:antialiased;
    padding-bottom:calc(84px + env(safe-area-inset-bottom))}

  /* ═══ TYPE SPLIT ═══ Sans carries prose — task names, labels, notes.
     DM Mono stays on the instrument: counts, indices, times, codes, the quick-add line.
     The console still reads as a sensor where it IS one. */
  .val, .ts, .wcell, .mac table, #mac-table, .qbar input, #q, #qs,
  .rs .rd, .astat .v, #r-rate, #wk-grid td.wtot, .tally, .totals,
  .qpill, .pill, .lab, .sstat, #clock, .date b, .step .val, .dstep .val,
  .tk .cnt, #minitot, .wd .idx, td, th{
    font-family:var(--mono);font-variant-numeric:tabular-nums}

  /* …but never let mono creep back onto prose inside those containers. */
  td.name, th.name, .mac .name{font-family:var(--font)}
  .wrap{max-width:640px;margin:0 auto;padding:16px 14px 20px}
  h1{font-size:13px;letter-spacing:.3em;text-transform:uppercase;margin:0;font-weight:500}
  .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
  .top .sub{color:var(--text3);font-size:10px;letter-spacing:.1em;margin-top:3px;text-transform:uppercase}
  .date{text-align:right;font-size:12px;color:var(--text3)}
  .date b{display:block;color:var(--text2);font-size:14px;font-weight:500}
  .sstat{display:inline-block;font-size:11px;padding:5px 11px;border-radius:20px;background:var(--bg3);color:var(--text3);margin-top:5px}
  .sstat.ok{color:var(--green);background:rgba(29,158,117,.14)}
  .sstat.busy{color:var(--gold);background:rgba(239,159,39,.14)}
  .sstat.off{color:var(--amber);background:rgba(186,117,23,.14)}
  /* today strip */
  .strip{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-bottom:16px;padding:14px 10px;
    background:var(--bg2);border:1px solid var(--line2);border-left:4px solid var(--green);border-radius:var(--rl)}
  .strip .cell{text-align:center}
  .strip .k{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--text3)}
  .strip .v{font-size:24px;font-weight:500;margin-top:3px;font-variant-numeric:tabular-nums}
  .strip .v small{font-size:12px;color:var(--text3)}
  /* cards */
  .card{background:var(--bg2);border:1px solid var(--line2);border-radius:var(--rl);padding:22px;margin-bottom:18px}
  .card.work{border-left:4px solid var(--green)}
  .card.soma{border-left:4px solid var(--gold)}
  .card.sig{border-left:4px solid var(--blue)}
  .hd{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text3);margin:0 0 4px}
  .hd2{font-size:17px;color:var(--text);margin:0 0 16px;letter-spacing:.01em}
  label{display:block;color:var(--text3);font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin:18px 0 8px}
  label:first-of-type{margin-top:0}
  .hint{color:var(--blue);text-transform:none;letter-spacing:0;font-size:11px}
  .req{color:var(--gold);text-transform:none;letter-spacing:0;font-size:11px}
  input,select{width:100%;min-height:var(--tap);background:var(--bg);border:1px solid var(--line2);color:var(--text);
    padding:12px 14px;font:inherit;font-size:16px;border-radius:var(--r)}
  input:focus,select:focus{outline:none;border-color:var(--green)}
  input::placeholder{color:var(--text3)}
  .g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  /* chips */
  .chips{display:flex;flex-wrap:wrap;gap:9px}
  .chip{display:flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line2);
    color:var(--text2);background:var(--bg3);border-radius:24px;font-size:14px;cursor:pointer;user-select:none}
  .chip.on{font-weight:500;color:#fff}
  .chip.eng.on{background:var(--green);border-color:var(--green)}
  .chip.bon.on{background:var(--gold);border-color:var(--gold);color:#1a1407}
  .chip.proj.on{background:var(--blue);border-color:var(--blue)}
  .chip.ship.on{background:var(--purple);border-color:var(--purple)}
  .chip.tag.on{background:var(--bg4);color:var(--text);border-color:var(--text3)}
  .chip.blk.on{background:var(--red);border-color:var(--red)}
  .chip.wk.on{background:var(--text3);border-color:var(--text3);color:var(--bg)}
  .lab.bl{color:var(--red);background:rgba(226,75,74,.15)}
  .lab.wk{color:var(--text2);background:var(--bg3)}
  .chip.sub.on{background:var(--purple);border-color:var(--purple)}
  .chip.ch.on{background:var(--blue);border-color:var(--blue)}
  .chip.bp.on{background:var(--gold);border-color:var(--gold);color:#1a1407}
  .chip.anc.on{background:var(--amber);border-color:var(--amber);color:#fff}
  .chip small{opacity:.7;margin-left:6px;font-size:11px}
  .lab.a{color:var(--amber);background:rgba(186,117,23,.18)}
  .astats{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:14px}
  .astat{background:var(--bg2);border:1px solid var(--line2);border-radius:var(--r);padding:11px 6px;text-align:center}
  .astat .k{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--text3)}
  .astat .v{font-size:20px;font-weight:500;margin-top:2px;font-variant-numeric:tabular-nums}
  .astat .v.g{color:var(--green)}.astat .v.a{color:var(--amber)}.astat .v.r{color:var(--red)}
  .slotlist{display:flex;flex-direction:column;gap:10px}
  .slotc{border:1px solid var(--line2);border-radius:var(--rl);padding:14px 15px;background:var(--bg2)}
  .slotc.filled{border-left:4px solid var(--amber)}
  .slotc.carried{border-left:4px solid var(--red)}
  .slotc.free{border-style:dashed;border-color:rgba(29,158,117,.4);background:rgba(29,158,117,.04);
    text-align:center;color:var(--green);font-size:13px;padding:20px}
  .slotc .sh1{display:flex;align-items:center;gap:9px}
  .slotc .sn{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--text3)}
  .slotc .carry{font-size:8px;color:var(--red);border:1px solid var(--red);padding:1px 6px;border-radius:20px}
  .slotc .an{font-size:15px;color:var(--text);margin-top:5px}
  .slotc .ameta{font-size:12px;color:var(--purple);margin-top:3px}
  .slotc .adr{margin-left:auto;font-size:18px;color:var(--amber);font-weight:500;font-variant-numeric:tabular-nums}
  .slotc .sact{display:flex;gap:8px;margin-top:12px;flex-wrap:nowrap}
  .slotc .sact button{white-space:nowrap}
  .slotc .sact button.rm{flex:0 0 auto;padding:0 12px}
  .slotc .sact button{flex:1;min-height:42px;background:var(--bg3);border:1px solid var(--line2);color:var(--text2);
    border-radius:var(--r);font:inherit;font-size:12px;cursor:pointer}
  .slotc .sact button.cls{color:var(--green);border-color:rgba(29,158,117,.4)}
  .clogi{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--line);font-size:13px}
  .clogi:first-child{border-top:none}
  .clogi .cn{flex:1;color:var(--text2)}.clogi .cd{color:var(--text3);font-size:11px}
  .lab.ch{color:var(--blue);background:rgba(55,138,221,.15)}
  /* toggles (R1/R2) */
  .tog{display:flex;align-items:center;justify-content:center;min-height:var(--tap);flex:1;border:1px solid var(--line2);
    border-radius:var(--r);background:var(--bg3);color:var(--text3);font-size:14px;cursor:pointer}
  .tog.on{background:var(--green);border-color:var(--green);color:#fff}
  /* stepper */
  .step{display:flex;align-items:center;background:var(--bg3);border:1px solid var(--line2);border-radius:var(--r);width:fit-content;overflow:hidden}
  .step button{width:56px;height:var(--tap);background:transparent;border:none;color:var(--text2);font-size:22px;cursor:pointer}
  .step button:active{background:var(--bg4)}
  .step .val{width:64px;text-align:center;font-size:20px;font-weight:500;font-variant-numeric:tabular-nums}
  /* buttons */
  .btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);width:100%;
    background:var(--green);border:none;color:#fff;font:inherit;font-size:13px;letter-spacing:.1em;text-transform:uppercase;
    border-radius:var(--r);cursor:pointer;padding:0 18px}
  .btn:active{filter:brightness(1.15)}
  .btn.big{min-height:58px;font-size:14px}
  .btn.ghost{background:var(--bg3);color:var(--text2);border:1px solid var(--line2)}
  .btn.gold{background:var(--gold);color:#1a1407}
  .btn.row{width:auto;flex:1}
  .btns{display:flex;gap:10px;margin-top:18px}
  /* segmented Work/Somatic */
  .seg{display:flex;gap:8px;margin-bottom:22px}
  .seg button{flex:1;min-height:var(--tap);background:var(--bg2);border:1px solid var(--line2);color:var(--text3);
    border-radius:var(--r);font:inherit;font-size:14px;cursor:pointer}
  .seg button.on.w{background:var(--green);border-color:var(--green);color:#fff}
  .seg button.on.s{background:var(--gold);border-color:var(--gold);color:#1a1407}
  /* day bar */
  .daybar{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line2);
    border-left:4px solid var(--green);border-radius:var(--rl);padding:14px 16px;margin-bottom:14px}
  .daybar.closed{border-left-color:var(--text3)}
  .daybar.stale{border-left-color:var(--red);background:rgba(226,75,74,.08)}
  .daybar.stale .m b{color:var(--red)}
  .datenav{display:flex;align-items:center;gap:8px;margin-bottom:12px}
  .datenav .dlab{flex:1;text-align:center}
  .datenav .dlab b{display:block;font-size:15px;color:var(--text)}
  .datenav .dlab span{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em}
  .datenav .dbtn{min-height:42px;min-width:46px;padding:0 12px;background:var(--bg3);border:1px solid var(--line2);
    color:var(--text2);border-radius:var(--r);font:inherit;font-size:13px;cursor:pointer}
  .datenav .dbtn:hover{color:var(--text);border-color:var(--text3)}
  .datenav .dbtn.today{color:var(--green);border-color:rgba(29,158,117,.4);font-size:11px}
  .datenav.past{background:rgba(55,138,221,.07);border:1px solid rgba(55,138,221,.25);
    border-radius:var(--rl);padding:8px 10px}
  .datenav.past .dlab span{color:var(--blue)}
  .daybar .m{flex:1;font-size:13px;color:var(--text3)}.daybar .m b{color:var(--text2);display:block;font-size:14px}
  .daybar .btn{width:auto;padding:0 16px;min-height:44px;font-size:11px}
  /* task list */
  .titem{display:flex;align-items:center;gap:8px;padding:14px 0;border-top:1px solid var(--line);flex-wrap:wrap}
  .titem:first-child{border-top:none}
  .tname{flex:1;min-width:110px;color:var(--text);font-size:15px}
  .lab{font-size:11px;padding:4px 10px;border-radius:20px}
  .lab.e{color:var(--green);background:rgba(29,158,117,.15)}
  .lab.b{color:var(--gold);background:rgba(239,159,39,.15)}
  .lab.p{color:var(--blue);background:rgba(55,138,221,.15)}
  .lab.sh{color:var(--purple);background:rgba(138,127,176,.18)}
  .dstep{display:flex;align-items:center;background:var(--bg3);border:1px solid var(--line);border-radius:20px;overflow:hidden}
  .dstep button{width:36px;height:36px;background:transparent;border:none;color:var(--text2);font-size:17px;cursor:pointer}
  .dstep b{font-size:13px;padding:0 8px;font-variant-numeric:tabular-nums}
  .x{width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:17px;cursor:pointer}
  .tval{font-size:14px;color:var(--text);font-variant-numeric:tabular-nums;min-width:52px;text-align:right}
  .ebtn{font-size:11px;color:var(--text3);border:1px solid var(--line2);border-radius:20px;
    padding:5px 12px;cursor:pointer;background:var(--bg3)}
  .ebtn:hover{color:var(--text);border-color:var(--text3)}
  .ebtn.done{color:var(--green);border-color:rgba(29,158,117,.45)}
  .titem.editing{background:var(--bg4);border-radius:var(--r);padding-left:10px;padding-right:10px}
  .empty{color:var(--text3);font-size:14px;text-align:center;padding:22px 0}
  .totals{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
  .pill{background:var(--bg3);border-radius:var(--r);padding:9px 13px;min-width:62px;text-align:center}
  .pill .k{font-size:10px;color:var(--text3);text-transform:uppercase}
  .pill .v{font-size:18px;font-weight:500;font-variant-numeric:tabular-nums}
  /* sessions */
  .sess{border:1px solid var(--line2);border-radius:var(--rl);margin-bottom:12px;overflow:hidden;background:var(--bg2)}
  .sess.active{border-color:var(--gold)}
  .sh{display:flex;align-items:center;gap:11px;padding:16px;cursor:pointer;min-height:60px}
  .sh .dot{width:11px;height:11px;border-radius:50%;flex-shrink:0}
  .sh b{flex:1;font-size:16px;font-weight:500}
  .sh .win{font-size:12px;color:var(--text3)}
  .sh .now{font-size:10px;color:var(--gold);border:1px solid var(--gold);padding:3px 8px;border-radius:20px}
  .sh .cnt{font-size:13px;color:var(--text3);font-variant-numeric:tabular-nums}
  .sbody{display:none;padding:0 16px 10px}.sess.open .sbody{display:block}
  .tk{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--line);min-height:62px}
  .tk:first-child{border-top:none}
  .tk .hit{flex:1;display:flex;align-items:center;gap:12px;cursor:pointer}
  .tk .ico{font-size:20px;width:26px;text-align:center}
  .tk .nm{flex:1;font-size:15px;color:var(--text2)}
  .tk.done .nm{color:var(--text)}
  .tk .cnt{font-size:12px;color:var(--gold);background:rgba(239,159,39,.15);padding:4px 10px;border-radius:20px;white-space:nowrap}
  .tk .last{font-size:11px;color:var(--text3);white-space:nowrap}
  .tk .minus{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;
    background:var(--bg3);color:var(--text3);font-size:18px;cursor:pointer;flex-shrink:0}
  /* board */
  .verdict{background:var(--bg2);border:1px solid var(--line2);border-left:4px solid var(--green);border-radius:var(--rl);padding:18px;margin-bottom:14px}
  .verdict.amber{border-left-color:var(--amber)}.verdict.red{border-left-color:var(--red)}
  .verdict .st{font-size:20px}
  .verdict .syn{font-size:14px;color:var(--text2);margin-top:6px}
  .verdict .fl{font-size:12px;color:var(--text3);margin-top:8px}
  .sec-hd{display:flex;align-items:center;gap:10px;margin-bottom:14px}
  .sec-hd b{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--text2)}
  .sd{width:11px;height:11px;border-radius:50%;background:var(--text3)}
  .sd.g{background:var(--green)}.sd.a{background:var(--amber)}.sd.r{background:var(--red)}
  .sec-hd .rt{margin-left:auto;font-size:11px;color:var(--text3)}
  .bar{display:flex;align-items:center;gap:12px;padding:9px 0;font-size:14px}
  .bar .bl{width:56px;color:var(--text2)}
  .bar .track{flex:1;height:10px;background:var(--bg3);border-radius:20px;overflow:hidden}
  .bar .track i{display:block;height:100%;border-radius:20px}
  .bar .bv{width:78px;text-align:right;color:var(--text3);font-size:13px;font-variant-numeric:tabular-nums}
  .bar .bv b{color:var(--text)}
  .hero{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
  .hero .big{font-size:44px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums}
  .hero .cap{font-size:12px;color:var(--text3);text-transform:uppercase;margin-top:4px}
  .drag{background:var(--bg4);border-left:3px solid var(--amber);border-radius:var(--r);padding:13px 15px;margin-top:16px;font-size:14px;color:var(--text2)}
  .drag b{color:var(--amber)}
  .rings{display:flex;gap:18px}
  .ring{display:flex;align-items:center;gap:10px}
  .ring .rl{font-size:12px;color:var(--text3)}.ring .rl b{display:block;color:var(--text);font-size:17px}
  .anchor{display:flex;align-items:center;gap:10px;padding:14px 0;border-top:1px solid var(--line);font-size:14px}
  .anchor:first-of-type{border-top:none}
  .anchor .an{flex:1}.anchor .ad{color:var(--text3);font-size:13px}
  .ship{font-size:10px;padding:4px 9px;border-radius:20px;text-transform:uppercase}
  .ship.built{color:var(--text3);background:var(--bg3)}.ship.sent{color:var(--blue);background:rgba(55,138,221,.15)}
  .ship.invoiced{color:var(--gold);background:rgba(239,159,39,.15)}.ship.paid{color:var(--green);background:rgba(29,158,117,.15)}
  .flg{font-size:10px;color:var(--red);background:rgba(226,75,74,.14);padding:4px 9px;border-radius:20px}
  /* mac preview */
  .mac{overflow-x:auto;border:1px solid var(--line2);border-radius:var(--r);background:var(--bg);-webkit-overflow-scrolling:touch}
  table{border-collapse:collapse;font-size:12px;white-space:nowrap}
  th,td{padding:9px 12px;border-right:1px solid var(--line);text-align:center;font-variant-numeric:tabular-nums}
  th{color:var(--text3);border-bottom:1px solid var(--line2);font-weight:400}
  td.lock{color:var(--text3);background:repeating-linear-gradient(45deg,transparent,transparent 5px,var(--hatch) 5px,var(--hatch) 10px)}
  td.w{color:var(--green)}td.s{color:var(--gold)}td.m{color:var(--text)}
  .note{color:var(--text3);font-size:12px;line-height:1.7;margin-top:12px}
  /* library */
  .lib-item{display:flex;align-items:center;gap:10px;padding:8px 0}
  .lib-item input{flex:1;min-height:46px;font-size:15px}
  .lib-item select{width:auto;min-width:120px;min-height:46px;font-size:14px}
  .lib-item .del{width:44px;height:44px;display:flex;align-items:center;justify-content:center;
    background:var(--bg3);border:1px solid var(--line);border-radius:var(--r);color:var(--text3);font-size:16px;cursor:pointer;flex-shrink:0}
  .addrow{display:flex;gap:10px;margin-top:12px;padding-top:14px;border-top:1px solid var(--line)}
  .addrow input{flex:1;border-style:dashed}
  .addrow select{width:auto;min-width:110px}
  .addrow .add{min-width:72px;background:var(--green);border:none;color:#fff;border-radius:var(--r);font:inherit;font-size:13px;cursor:pointer}
  /* bottom nav */
  .nav{position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--scrim);
    border-top:1px solid var(--line2);padding-bottom:env(safe-area-inset-bottom);z-index:50;backdrop-filter:blur(8px)}
  .nav .n{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    height:70px;color:var(--text3);font-size:11px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
  .nav .n .ic{font-size:19px;line-height:1}
  .nav .n.on{color:var(--text)}
  .nav .n.on .ic{color:var(--green)}

  /* rail — hidden on mobile */
  #rail{display:none}
  .deskonly{display:none}
  .wkbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
  .wkbar .wkt{flex:1;text-align:center}
  .wkbar .wkt b{display:block;font-size:16px}
  .wkbar .wkt span{font-size:11px;color:var(--text3)}
  .btn.sm{min-height:40px;width:auto;padding:0 16px;font-size:10px}
  #wk-grid table{width:100%;border-collapse:collapse;font-size:13px;min-width:720px}
  #wk-grid th{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);
    font-weight:400;padding:0 0 10px;text-align:center}
  #wk-grid th.lbl{text-align:left;width:240px}
  #wk-grid td{padding:0;text-align:center}
  #wk-grid td.lbl{text-align:left;padding:8px 12px 8px 0}
  #wk-grid .an{font-size:13px;color:var(--text);line-height:1.3}
  #wk-grid .am{font-size:10px;color:var(--purple);margin-top:2px}
  .st{display:inline-block;font-size:9px;padding:2px 7px;border-radius:20px;margin-left:6px}
  .st.open{color:var(--amber);background:rgba(186,117,23,.16)}
  .st.closed{color:var(--green);background:rgba(29,158,117,.14)}
  .st.carry{color:var(--red);background:rgba(226,75,74,.14)}
  .wcell{height:42px;border-radius:6px;margin:2px;display:flex;align-items:center;justify-content:center;
    font-variant-numeric:tabular-nums;font-size:14px;color:rgba(131,129,122,.35);background:var(--bg4)}
  .wcell.d1{background:rgba(186,117,23,.14);color:var(--text2)}
  .wcell.d2{background:rgba(186,117,23,.26);color:var(--text)}
  /* Heat ramp: the tint carries the load, the text just stays legible.
     var(--text) reads correctly over the tint in BOTH themes — #fff only worked on dark. */
  .wcell.d3{background:rgba(186,117,23,.42);color:var(--text)}
  .wcell.d4{background:rgba(186,117,23,.60);color:var(--text)}
  .wcell.close{background:rgba(29,158,117,.28);color:var(--text);font-size:12px}
  .wcell.min{background:rgba(138,127,176,.18);color:var(--purple);font-size:11px}
  #wk-grid td.wtot{font-size:15px;color:var(--amber);font-variant-numeric:tabular-nums;padding-left:8px}
  #wk-grid td.wtot.g{color:var(--green)}
  #wk-grid tr.sep td{border-top:1px solid var(--line);padding-top:6px}
  #wk-grid tr.foot td{padding-top:9px;font-size:12px;color:var(--text3)}
  #wk-grid tr.foot td.lbl{color:var(--text2);text-transform:uppercase;font-size:10px;letter-spacing:.08em}
  #wk-grid tr.foot .v{font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}
  #wk-grid tr.foot .v.lo{color:var(--red)}
  #wk-grid tr.foot .v.ok{color:var(--green)}
  .eng{font-size:10px;color:var(--text3);line-height:1.5}.eng b{color:var(--text2)}
  .reads{display:grid;grid-template-columns:1fr;gap:10px}
  .read{border-radius:8px;padding:12px 15px;font-size:12.5px;color:var(--text2)}
  .read b{display:block;margin-bottom:2px}
  .read.bad{background:rgba(226,75,74,.08);border-left:3px solid var(--red)}.read.bad b{color:var(--red)}
  .read.warn{background:rgba(239,159,39,.08);border-left:3px solid var(--gold)}.read.warn b{color:var(--gold)}
  .read.good{background:rgba(29,158,117,.08);border-left:3px solid var(--green)}.read.good b{color:var(--green)}
  .read.info{background:rgba(55,138,221,.07);border-left:3px solid var(--blue)}.read.info b{color:var(--blue)}

  /* ═══════════ DESKTOP ═══════════ */
  @media (min-width:900px){
    body{padding-bottom:24px}
    .wrap{max-width:1000px;padding:36px 46px 64px;margin-left:250px}

    /* anchor rail retired from Today — anchors live on their own tab (styles kept, unused) */
    .deskonly{display:flex}
    .reads{grid-template-columns:1fr 1fr}
    body[data-view="week"] .wrap{max-width:1120px}
    #rail{position:fixed;left:210px;top:0;bottom:0;width:252px;z-index:40;
      flex-direction:column;background:var(--bg2);border-right:1px solid var(--line2);padding:22px 14px 14px}
    #rail .rh{display:flex;justify-content:space-between;align-items:center;font-size:10px;
      letter-spacing:.14em;text-transform:uppercase;color:var(--text3);margin-bottom:12px;padding:0 2px}
    #rail .rh span:last-child{color:var(--amber)}
    #r-slots{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:7px}
    .rs{border:1px solid var(--line2);border-radius:var(--r);padding:10px 11px;cursor:pointer;
      background:var(--bg3);transition:.12s;border-left:3px solid var(--amber)}
    .rs:hover{border-color:var(--text3);background:var(--bg4)}
    .rs.on{border-color:var(--amber);background:rgba(186,117,23,.14)}
    .rs.carried{border-left-color:var(--red)}
    .rs .rn{font-size:12px;color:var(--text);line-height:1.35}
    .rs .rm{display:flex;justify-content:space-between;align-items:center;margin-top:5px}
    .rs .rsub{font-size:10px;color:var(--purple)}
    .rs .rd{font-size:13px;color:var(--amber);font-variant-numeric:tabular-nums}
    .rs.free{border-left-color:var(--green);border-style:dashed;background:transparent;
      color:var(--green);font-size:11px;text-align:center;padding:14px 10px;cursor:default}
    #rail .rf{border-top:1px solid var(--line);padding-top:11px;margin-top:11px;
      font-size:10px;color:var(--text3);display:flex;flex-direction:column;gap:3px}
    #rail .rf #r-rate{font-size:14px;color:var(--text2)}

    /* ── dense rows: read-only, actions on hover (Linear) ── */
    .titem{flex-wrap:nowrap;gap:9px;padding:12px 0}
    .titem .tname{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
    .titem .lab{white-space:nowrap;font-size:10px;padding:3px 8px}
    .titem .ebtn{opacity:0;transition:opacity .12s}
    .titem:hover{background:var(--bg3);border-radius:6px}
    .titem:hover .ebtn{opacity:1}
    .titem.editing .ebtn{opacity:1}

    /* bottom bar becomes a sidebar */
    .nav{top:0;bottom:0;right:auto;width:210px;flex-direction:column;justify-content:flex-start;
      border-top:none;border-right:1px solid var(--line2);padding:26px 0 0;backdrop-filter:none;background:var(--bg4)}
    .nav .n{flex:0 0 auto;height:50px;width:100%;flex-direction:row;justify-content:flex-start;gap:14px;
      padding:0 24px;font-size:12px;border-left:3px solid transparent}
    .nav .n .ic{font-size:17px}
    .nav .n.on{background:var(--bg3);border-left-color:var(--green)}

    /* header + strip span the canvas */
    .strip{grid-template-columns:repeat(5,1fr);padding:18px 22px}
    .strip .v{font-size:28px}

    /* work: form left, log right */
    #work{display:grid;grid-template-columns:1.05fr 1fr;gap:26px;align-items:start}

    /* signals: three across */
    .closegrid{grid-template-columns:1fr 1fr 1fr}

    /* somatic sessions two-up */
    #sessions{display:grid;grid-template-columns:1fr 1fr;gap:16px 34px;align-items:start}
    .sess{margin-bottom:0}

    /* anchors: five slots across, like the board */
    .slotlist{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
    .slotc{min-height:200px;display:flex;flex-direction:column}
    .slotc .sact{margin-top:auto}
    .slotc .sact button{font-size:11px}
    #view-anch .card{max-width:none}

    /* library two-up */
    #optlists,#clusters{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
    #optlists .card,#clusters .card{margin-bottom:0}

    /* mouse doesn't need thumb-sized targets */
    .chip{min-height:38px;padding:0 14px}
    .btn{min-height:46px}
    .btn.big{min-height:50px}
    input,select{min-height:44px}
  }

  @media (min-width:1400px){
    .wrap{max-width:1320px}
    #work{grid-template-columns:1fr 1fr}
  }
/* ═══════════ UI 2 LAYER ═══════════ */
#strip{display:none}
/* week strip */
.wstrip2{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:24px}
.wd2{padding:9px 4px 10px;border-radius:9px;cursor:pointer;text-align:center;border:1px solid transparent;transition:.12s}
.wd2:hover{background:var(--bg2)}
.wd2 .dn{font-size:9px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em}
.wd2 .dd{font-size:16px;margin:3px 0 8px;color:var(--text2);font-variant-numeric:tabular-nums}
.wd2.today{background:var(--bg3);border-color:var(--line2)}
.wd2.today .dd{color:var(--gold);font-weight:500}
.wd2.active:not(.today){background:rgba(55,138,221,.1);border-color:rgba(55,138,221,.35)}
.wd2 .sub{font-size:8.5px;color:var(--text3);margin-top:6px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.ring2{width:19px;height:19px;border-radius:50%;margin:0 auto;position:relative}
.ring2.line{border:2px solid var(--line2)}
.ring2.closed{border:2px solid var(--green);background:rgba(29,158,117,.22)}
.ring2.closed::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--green)}
.ring2.stale{border:2px solid var(--red);box-shadow:0 0 0 3px rgba(226,75,74,.12)}
.ring2.missed{border:2px solid rgba(226,75,74,.55)}
.ring2.off{border:2px dashed var(--line2)}
.ring2.opennow{border:2px solid var(--gold);box-shadow:0 0 0 3px rgba(239,159,39,.13)}
.ring2.pie{border:none;-webkit-mask:radial-gradient(circle at center,transparent 55%,#000 56%);mask:radial-gradient(circle at center,transparent 55%,#000 56%)}
/* mini totals */
#minitot{display:flex;gap:8px;margin:0 0 22px;flex-wrap:wrap}
.mtk{display:flex;align-items:center;gap:7px;background:var(--bg2);border:1px solid var(--line);border-radius:7px;padding:6px 12px;font-size:11px;color:var(--text3)}
.mtk b{color:var(--text2);font-weight:500;font-variant-numeric:tabular-nums}
.mtk .dot{width:7px;height:7px;border-radius:50%}
.mtk.tot{border-color:var(--line2)}.mtk.tot b{color:var(--text);font-size:13px}
.mtk.gold b{color:var(--gold)}
/* quick add */
.qbar{display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--line2);border-radius:9px;padding:4px 6px 4px 14px;transition:.15s;margin-bottom:2px}
.qbar:focus-within{border-color:var(--text3)}
.qbar .plus{color:var(--text3);font-size:15px}
.qbar input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:14px;padding:11px 0;min-height:0}
.qbar input:focus{border:none}
.qbar .go{background:var(--bg3);border:1px solid var(--line2);color:var(--text3);border-radius:6px;padding:8px 14px;cursor:pointer;font:inherit;font-size:11px;width:auto;min-height:0}
.qbar .go:hover{color:var(--text)}
.qprev{display:flex;align-items:center;gap:6px;min-height:24px;padding:2px 14px 10px;flex-wrap:wrap}
.qprev .qt{font-size:12px;color:var(--text2)}
.qprev .qhint{font-size:10px;color:var(--text3);opacity:.8}
.qprev .qerr{font-size:10px;color:var(--red)}
.qprev:empty{display:none}
.qpill{font-size:10px;padding:2px 9px;border-radius:20px;flex:none}
/* Tinted pills — colour is carried by the text token, which flips with the theme.
   These used to hardcode pale-on-dark text and went invisible on white. */
.qp-doro{background:rgba(111,99,155,.14);color:var(--purple)}
.qp-Out{background:rgba(47,119,196,.14);color:var(--blue)}
.qp-Inf{background:rgba(23,138,103,.14);color:var(--green)}
.qp-Onf{background:rgba(201,134,42,.15);color:var(--gold)}
.qp-Vau{background:rgba(165,103,15,.16);color:var(--amber)}
.qp-Lab{background:rgba(111,99,155,.14);color:var(--purple)}
.qp-bon{background:rgba(207,67,66,.13);color:var(--red)}
.qp-anc{background:rgba(165,103,15,.14);color:var(--amber)}
.qp-min{background:rgba(111,99,155,.14);color:var(--purple)}
.qp-sig{background:rgba(201,134,42,.13);color:var(--gold)}
/* task row: engine dot + timestamp */
.edot{width:14px;height:14px;border-radius:5px;flex:none;border:2px solid var(--text3)}
.tts{font-size:10px;color:var(--text3);font-variant-numeric:tabular-nums;white-space:nowrap}
/* collapsible full form */
#wfhead{display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none}
#wfhead .hd{margin:0}
#wfhead .caret{color:var(--text3);font-size:12px;transition:.15s}
#workform.fopen #wfhead .caret{transform:rotate(180deg)}
#wfbody{display:none;margin-top:14px}
#workform.fopen #wfbody{display:block}
/* flat somatic list */
.hrowF{display:flex;align-items:center;gap:11px;padding:9px 4px;border-bottom:1px solid var(--line);min-height:54px}
.hrowF .ico{font-size:17px;width:24px;text-align:center;flex:none}
.hrowF .nm{flex:1;font-size:14px;color:var(--text2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hrowF.done .nm{color:var(--text)}
.hrowF .sg{font-size:9px;color:var(--text3);letter-spacing:.08em;border:1px solid var(--line2);border-radius:4px;padding:1px 6px;flex:none}
.hrowF .cnt2{font-size:11px;color:var(--gold);background:rgba(239,159,39,.15);padding:3px 9px;border-radius:20px;white-space:nowrap}
.hrowF .last2{font-size:10px;color:var(--text3);white-space:nowrap}
.hrowF .stk{font-size:10px;color:var(--text3);font-variant-numeric:tabular-nums;cursor:pointer;user-select:none;white-space:nowrap}
.hrowF .stk:hover{color:var(--gold)}
.hrowF .minus2{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--bg3);color:var(--text3);font-size:16px;cursor:pointer;flex:none}
.hchk2{width:22px;height:22px;border-radius:50%;border:2px solid var(--line2);flex:none;cursor:pointer;position:relative;transition:.15s}
.hchk2:hover{border-color:var(--gold)}
.hchk2.done{border-color:var(--gold);background:rgba(239,159,39,.2)}
.hchk2.done::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--gold)}
/* gate */
#startcard{max-width:560px;margin:26px auto 0}
#startcard .yst{font-size:11px;color:var(--text3);margin:-6px 0 16px}
#startcard .yst b{color:var(--green);font-weight:400}
/* ritual */
#ritual{position:fixed;inset:0;background:var(--scrim);z-index:100;display:none;align-items:flex-start;justify-content:center;padding:36px 20px;overflow-y:auto}
#ritual.show{display:flex}
#ritual .rbox{width:100%;max-width:640px}
#ritual h2{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:500;margin:0 0 4px;text-align:center}
#ritual .rsub2{font-size:10px;color:var(--text3);text-align:center;margin-bottom:22px}
#rsum .miss{color:var(--gold)}
.endcap{text-align:center;padding:56px 0}
.endcap .big{font-size:17px;letter-spacing:.3em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
.endcap p{font-size:11px;color:var(--text3);line-height:1.8}
@media (min-width:900px){
  .wstrip2{max-width:640px}
  .seg{display:inline-flex;width:auto;background:var(--bg2);border:1px solid var(--line);border-radius:9px;padding:3px;gap:2px}
  .seg button{flex:none;min-height:34px;padding:0 26px;border:none;background:transparent;font-size:12px;border-radius:6px}
  #sessions{position:relative;gap:0 44px}
  #sessions::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--line)}
}
/* planned vs logged */
.lgh{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text3);margin:14px 0 2px;display:flex;gap:8px;align-items:center}
.lgh .c{opacity:.6}
.cdo{width:19px;height:19px;border-radius:50%;border:2px solid var(--line2);flex:none;cursor:pointer;position:relative;transition:.12s}
.cdo:hover{border-color:var(--green)}
.cdo.done{border-color:var(--green);background:rgba(29,158,117,.25)}
.cdo.done::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--green)}
.adot{width:20px;height:20px;border-radius:50%;border:1px solid rgba(186,117,23,.55);color:var(--amber);display:inline-flex;align-items:center;justify-content:center;font-size:10px;flex:none;cursor:default}
.lab.car{color:var(--red);background:rgba(226,75,74,.14)}
/* compact day chip (replaces the big day bar in the normal open state) */
#daychip{margin-top:6px;display:flex;gap:6px;justify-content:flex-end;align-items:center}
#daychip .dcs{font-size:10px;color:var(--text3)}
#daychip button{min-height:30px;width:auto;padding:0 12px;font-size:10px;letter-spacing:.08em;background:var(--bg3);color:var(--text2);border:1px solid var(--line2);border-radius:20px;cursor:pointer;font:inherit;text-transform:uppercase}
#daychip button:hover{border-color:var(--text3);color:var(--text)}
#daychip button.warn{color:var(--gold);border-color:rgba(239,159,39,.4)}
/* popover picker (Linear-style) */
#pop{position:absolute;z-index:120;background:var(--bg3);border:1px solid var(--line2);border-radius:9px;min-width:200px;max-width:270px;box-shadow:var(--popshadow);display:none}
#pop.show{display:block}
#pop .pf{padding:8px;border-bottom:1px solid var(--line)}
#pop .pf input{width:100%;min-height:34px;padding:6px 10px;font-size:13px;background:var(--bg);border:1px solid var(--line);border-radius:6px}
#pop .plist{max-height:250px;overflow-y:auto;padding:5px}
#pop .it{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;font-size:12.5px;color:var(--text2);cursor:pointer}
#pop .it:hover,#pop .it.sel{background:var(--bg4);color:var(--text)}
#pop .it .im{margin-left:auto;font-size:10px;color:var(--text3)}
#pop .it .pdot{width:8px;height:8px;border-radius:50%;flex:none}
.lab{cursor:pointer}
.tval{cursor:pointer}
.lab.ghost{opacity:0;transition:.12s;border:1px dashed var(--line2);background:transparent;color:var(--text3)}
.titem:hover .lab.ghost{opacity:.55}
.lab.ghost:hover{opacity:1!important;color:var(--text2)}
.adot.ghost{opacity:0;border-style:dashed;color:var(--text3);transition:.12s;cursor:pointer}
.titem:hover .adot.ghost{opacity:.55}
.adot.ghost:hover{opacity:1!important;color:var(--amber)}
/* sealed day: read-only record */
body[data-ro="1"] #workwrap .qbar,body[data-ro="1"] #workwrap .qprev,
body[data-ro="1"] #soma .qbar,body[data-ro="1"] #soma .qprev,
body[data-ro="1"] #workform{display:none}
body[data-ro="1"] .cdo,body[data-ro="1"] .hchk2,body[data-ro="1"] .minus2,
body[data-ro="1"] .ebtn,body[data-ro="1"] .titem .x,body[data-ro="1"] .hrowF .x{display:none}
body[data-ro="1"] .lab,body[data-ro="1"] .tval,body[data-ro="1"] .adot,body[data-ro="1"] .stk{pointer-events:none}
body[data-ro="1"] .lab.ghost,body[data-ro="1"] .adot.ghost{display:none}
#sealfoot{text-align:center;margin:28px 0 10px}
#sealfoot a{color:var(--text3);font-size:11px;text-decoration:underline;cursor:pointer}
#sealfoot a:hover{color:var(--text2)}

/* ═══════════════════ UI 3 LAYER — the desk ═══════════════════
   Desktop-only. Below 1100px the console stays exactly as UI 2 was: bottom nav,
   single column, tap targets. Nothing here touches the model, the sync, or mobile.
   Four zones: rail(54) · sidebar(228) · working column(660 capped) · detail(430). */
#rail3,#side3{display:none}        /* they only exist on the desk */

@media (min-width:1100px){
  body{padding-bottom:0;background:var(--bg)}
  .nav{display:none}                    /* the rail replaces the bottom/side nav */
  .wrap{max-width:none;margin:0 0 0 282px;padding:26px 34px 70px;margin-right:430px}
  .wrap > *{max-width:660px}      /* reading measure — the column, not the pane */

  /* The detail room belongs to the Desk. Everywhere else it would just be a 430px hole,
     so the column reclaims the space. Somatics has no blocks to detail either. */
  body[data-view="anch"] .wrap,
  body[data-view="week"] .wrap,
  body[data-view="lib"]  .wrap,
  body[data-mode="s"]    .wrap{margin-right:0}

  /* Week is a grid, not prose — it gets the whole desk. */
  body[data-view="week"] .wrap > *{max-width:none}

  /* ── rail ── */
  #rail3{display:flex;position:fixed;left:0;top:0;bottom:0;width:54px;background:var(--bg3);
    flex-direction:column;align-items:center;padding:12px 0;gap:4px;z-index:60}
  .r3{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;
    justify-content:center;font-size:15px;color:var(--text3);cursor:pointer;flex:none;
    user-select:none;transition:.12s}
  .r3:hover{background:var(--bg4);color:var(--text2)}
  .r3.on{background:var(--bg);color:var(--text);box-shadow:var(--shadow)}
  .r3sep{width:20px;height:1px;background:var(--line2);margin:6px 0;flex:none}
  .r3sp{flex:1}
  #r3day{width:30px;height:30px;border-radius:50%;border:2px solid var(--text3);
    display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;
    color:var(--text3);margin-bottom:8px;flex:none;font-family:var(--mono)}
  #r3day.open{border-color:var(--green);color:var(--green)}
  #r3day.closed{border-color:var(--text3);color:var(--text3)}
  #r3day.stale{border-color:var(--red);color:var(--red)}

  /* ── sidebar ── */
  #side3{display:block;position:fixed;left:54px;top:0;bottom:0;width:228px;background:var(--bg2);
    overflow-y:auto;padding:14px 0 20px;z-index:55;border-right:1px solid var(--line)}
  #side3 .s3card{margin:0 12px 14px;padding:10px 12px;background:var(--bg);border-radius:9px;
    box-shadow:var(--shadow)}
  #side3 .s3card .d1{font-size:13px;font-weight:600}
  #side3 .s3card .d2{font-size:11px;color:var(--text3);margin-top:2px;display:flex;align-items:center;gap:5px}
  #side3 .s3dot{width:6px;height:6px;border-radius:50%;background:var(--text3);flex:none}
  #side3 .s3dot.open{background:var(--green)}
  #side3 .s3dot.stale{background:var(--red)}
  #side3 .s3card button{margin-top:9px;width:100%;padding:7px;border:1px solid var(--line2);
    background:transparent;border-radius:6px;font:inherit;font-size:11.5px;color:var(--text2);cursor:pointer}
  #side3 .s3card button:hover{background:var(--bg2);color:var(--text)}
  #side3 .s3sect{margin:16px 0 5px;padding:0 18px;font-size:10px;font-weight:600;
    letter-spacing:.09em;text-transform:uppercase;color:var(--text3)}
  #side3 .s3nav{padding:0 8px}
  #side3 .s3n{display:flex;align-items:center;gap:10px;padding:0 10px;height:32px;border-radius:7px;
    color:var(--text2);font-size:13px;cursor:pointer;user-select:none}
  #side3 .s3n:hover{background:var(--bg3)}
  #side3 .s3n.on{background:var(--bg);color:var(--text);font-weight:600;box-shadow:var(--shadow)}
  #side3 .s3n .g{width:14px;text-align:center;font-size:11px;color:var(--text3);flex:none}
  #side3 .s3n .n{margin-left:auto;font-size:11px;color:var(--text3);font-family:var(--mono);
    font-variant-numeric:tabular-nums}
  #side3 .s3n.sub{padding-left:26px;font-size:12.5px}
  #side3 .s3note{margin:14px 18px 0;font-size:10.5px;color:var(--text3);line-height:1.55}

  /* ── detail room ──
     #workform IS the room. Rather than move it in the DOM (and risk every
     getElementById that points at it), we just fix-position it where it stands.
     Empty = "add a block". Populated by editTask(i) = "editing this block". */
  #workform{position:fixed;right:0;top:0;bottom:0;width:430px;background:var(--bg);
    border-left:1px solid var(--line2);overflow-y:auto;z-index:55;
    padding:20px 22px 40px;margin:0;border-radius:0}
  #workform #wfbody{display:block}            /* in the room it is never collapsed */
  #workform.fopen #wfbody{display:block}
  #wfhead{cursor:default}
  #wfhead .caret{display:none}
  #wfhead .hd{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--text3)}
  #workform .chips{gap:5px}
  #workform label{margin-top:15px;display:block}
  #workform #wbtns{margin-top:22px;position:sticky;bottom:-40px;background:var(--bg);
    padding:12px 0;border-top:1px solid var(--line)}

  /* ── de-box: the boxes are what ate the whitespace ── */
  .card{background:transparent;border:none;border-radius:0;padding:0;margin-bottom:30px}
  .card.sig,.card.work,.card.soma{background:transparent;border:none;padding:0}
  .titem{border-top:none;border-bottom:1px solid var(--line);padding:0 8px;margin:0 -8px;
    height:46px;border-radius:7px;flex-wrap:nowrap}
  .titem:first-child{border-top:none}
  .titem:hover{background:var(--bg4);border-radius:7px}
  .titem.editing{background:var(--bg3)}
  .pill{background:transparent;padding:0;min-width:0;text-align:left}
  .totals{gap:16px;border-top:1px solid var(--line);padding-top:14px}
  /* pale labels on rows — same recession as the chips */
  .lab{font-size:10.5px;padding:2px 7px;border-radius:4px}

  /* ── colour recedes: tints, not fills ── */
  .chip{border-radius:6px}
  .chip.on{color:var(--text);font-weight:600}
  .chip.eng.on{background:rgba(23,138,103,.14);border-color:transparent;color:var(--green)}
  .chip.bon.on{background:rgba(201,134,42,.15);border-color:transparent;color:var(--gold)}
  .chip.proj.on,.chip.ch.on{background:rgba(47,119,196,.14);border-color:transparent;color:var(--blue)}
  .chip.ship.on,.chip.sub.on{background:rgba(111,99,155,.16);border-color:transparent;color:var(--purple)}
  .chip.blk.on{background:rgba(207,67,66,.13);border-color:transparent;color:var(--red)}
  .chip.bp.on{background:rgba(201,134,42,.15);border-color:transparent;color:var(--gold)}
  .chip.anc.on{background:rgba(165,103,15,.15);border-color:transparent;color:var(--amber)}
  .chip.tag.on{background:var(--bg3);border-color:transparent;color:var(--text)}

  /* the one saturated pixel per row: the engine ring on the checkbox */
  .cdo{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--line2)}
  .cdo.done{background:transparent}
  .cdo.done::after{font-size:11px}

  /* ── header restraint ── */
  /* FIX 1: slimmed header — room + sync only; the day lives in the sidebar card */
  .top{margin-bottom:14px}
  h1{font-size:15px;letter-spacing:-.01em;text-transform:none;font-weight:600}
  .top .sub{text-transform:none;letter-spacing:0;font-size:12px}
  .s3card .restamp{cursor:pointer;border-bottom:1px dotted var(--text3)}
  .s3card .restamp:hover{color:var(--text)}
  .qbar{background:transparent;border:none;border-bottom:1px solid var(--line);border-radius:0;
    padding:0 2px;margin-bottom:0}
  .qbar:focus-within{border-color:var(--text3)}
  .qbar .go{opacity:0;transition:.12s}
  .qbar:focus-within .go{opacity:1}
  .lgh{margin:22px 0 2px}
  .seg{display:none}            /* Desk/Somatics now live on the rail, not in the page */

  /* ── buttons recede too ──
     The chips went to tints and .btn didn't, so "+ PLAN TASK" and "+ LOAD INTO SLOT"
     became the loudest thing on every screen — a green slab shouting at a page whose
     whole point is quiet. Same tint treatment; the verb still reads first. */
  .btn{background:rgba(23,138,103,.12);color:var(--green);border:1px solid transparent;
    text-transform:none;letter-spacing:0;font-size:13px;font-weight:600;min-height:38px}
  .btn:hover{background:rgba(23,138,103,.18)}
  .btn.big{min-height:40px}
  .btn.gold{background:rgba(201,134,42,.15);color:var(--gold)}
  .btn.gold:hover{background:rgba(201,134,42,.22)}
  .btn.ghost{background:transparent;color:var(--text2);border:1px solid var(--line2)}
  .btn.ghost:hover{background:var(--bg3);color:var(--text)}
  .addrow .add{background:rgba(23,138,103,.12);color:var(--green);font-weight:600}
  .addrow .add:hover{background:rgba(23,138,103,.18)}

  /* ── Library: it's a form, not prose — let it out of the reading column ── */
  body[data-view="lib"] .wrap > *{max-width:none}
  body[data-view="lib"] #optlists,
  body[data-view="lib"] #clusters{max-width:1000px}
}

/* ═══ PLANNING — a day you can see and arrange, but not work in ═══
   Everything that would constitute LOGGING is removed, not just dimmed. You can add,
   reorder and delete blocks; you cannot tick one, because the day hasn't started. */
body[data-plan="1"] #minitot{display:none}          /* no tallies before a day exists */
body[data-plan="1"] .seg{display:none}
body[data-plan="1"] #soma{display:none}             /* somatics belong to a live day */
body[data-plan="1"] .titem .cdo{visibility:hidden;pointer-events:none}
body[data-plan="1"] #sealfoot{display:none}
body[data-plan="1"] #startcard{border-left:3px solid var(--gold)}
/* a day that hasn't arrived: no signals to read, nothing to start */
body[data-ahead="1"] #sigfields{display:none}
body[data-ahead="1"] #startcard .hd2{color:var(--text3)}
.gwait{font-size:12px;color:var(--text3);line-height:1.6;padding:10px 0 2px}
.restamp{cursor:pointer;border-bottom:1px dotted var(--line2)}
.restamp:hover{color:var(--text2)}
/* the anchor a block is attached to — a name, not a hook in a tooltip */
.alab{font-size:10.5px;padding:2px 8px;border-radius:4px;cursor:pointer;white-space:nowrap;
  max-width:150px;overflow:hidden;text-overflow:ellipsis;flex:none;
  background:rgba(165,103,15,.13);color:var(--amber);font-family:var(--mono)}
.alab:hover{background:rgba(165,103,15,.22)}
/* anchors: the description is the definition of done */
.adesc{font-size:11.5px;color:var(--text2);line-height:1.5;margin-top:7px;
  padding-top:7px;border-top:1px solid var(--line)}
textarea{width:100%;background:var(--bg);border:1px solid var(--line2);color:var(--text);
  border-radius:var(--r);padding:11px 13px;font:inherit;font-size:14px;resize:vertical;
  outline:none;margin-top:6px}
textarea:focus{border-color:var(--text3)}
.planban{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 13px;
  border-radius:var(--r);background:rgba(201,134,42,.10);color:var(--text2);font-size:12px}
.planban b{color:var(--gold);font-weight:600}
body:not([data-plan="1"]) .planban{display:none}
/* the carried stamp — the evidence that something has been dragged */
.carr{font-size:10px;color:var(--red);white-space:nowrap;font-family:var(--mono)}
.carr.old{font-weight:600}

/* ═══ WEEK — the record of days ═══ */
.wkroll{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--text3);
  margin-bottom:16px;font-family:var(--mono);font-variant-numeric:tabular-nums}
.wkroll i{font-style:normal;font-weight:500;color:var(--text2)}
.wkroll .t{color:var(--text2)}
.wkroll .t i{color:var(--text)}
.wkroll s{text-decoration:none;width:5px;height:5px;border-radius:50%;display:inline-block;
  margin-right:6px;vertical-align:1px}
.wkdays{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.wkd{background:var(--bg);padding:13px 11px;min-height:210px}
.wkd.today{background:var(--bg2)}
.wkd.none{opacity:.5}
.wkd .dn{font-size:10px;color:var(--text3);letter-spacing:.06em;text-transform:uppercase}
.wkd .dd{font-size:18px;font-weight:600;letter-spacing:-.02em;margin-top:1px;font-family:var(--mono)}
.wkd.today .dd{color:var(--gold)}
.wkring{width:28px;height:28px;border-radius:50%;border:2px solid var(--line2);margin:9px 0 6px;
  display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--text3);
  font-family:var(--mono);font-variant-numeric:tabular-nums}
/* lifecycle, not size: sealed · live · left open · off day · never opened */
.wkring.closed{border-color:var(--green);color:var(--green)}
/* FIX 5: recorded-but-never-sealed must not wear the sealed green — the record
   and the ritual are different facts. Dashed grey: the sheet knows it, you never closed it. */
.wkring.has{border-style:dashed;border-color:var(--text3);color:var(--text2);background:var(--bg2)}
.wkring.open{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 3px rgba(201,134,42,.14)}
.wkring.stale{border-color:var(--red);color:var(--red);box-shadow:0 0 0 3px rgba(207,67,66,.10)}
.wkring.never{border-color:rgba(207,67,66,.5);color:var(--red)}
.wkring.off{border-style:dashed;border-color:var(--line2);color:var(--text3)}
.wkd .dn em{font-style:normal;color:var(--text2)}
/* ══ E — comparator panel ══ */
#wk-comp{margin:0 0 22px}
.compnone{font-size:12.5px;color:var(--text3);border:1px dashed var(--line2);border-radius:10px;padding:14px 16px}
.comphead{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.compg{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:24px;font-weight:600;flex:0 0 auto}
.compg.gA{background:rgba(29,158,117,.14);color:var(--green)}
.compg.gB{background:rgba(29,158,117,.10);color:var(--green)}
.compg.gC{background:rgba(201,134,42,.14);color:var(--gold)}
.compg.gD{background:rgba(207,67,66,.12);color:var(--red)}
.compg.gF{background:rgba(207,67,66,.20);color:var(--red)}
.compt b{display:block;font-size:13px}
.compt span{font-size:11.5px;color:var(--text3)}
.compt em{font-style:normal}
.compdone{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--green)}
.comphead .btn{margin-left:auto}
.comptab{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:10px}
.comptab th{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);
  text-align:left;padding:5px 8px;border-bottom:1px solid var(--line)}
.comptab td{padding:6px 8px;border-bottom:1px solid var(--line)}
.comptab td b{font-family:var(--mono)}
.comptab td.ok{color:var(--green)} .comptab td.bad{color:var(--red)} .comptab td.mid{color:var(--gold)} .comptab td.hand{color:var(--text3)}
.compbins{margin-top:4px}
.compbin{display:flex;align-items:center;gap:6px;font-size:12px;padding:6px 0;border-bottom:1px solid var(--line);color:var(--text2)}
.compbin .cbv{margin-left:auto;display:flex;gap:6px}
.compbin .ok{color:var(--green);font-family:var(--mono)} .compbin .bad{color:var(--red);font-family:var(--mono)} .compbin .hand{color:var(--text3);font-size:10px}
.cbb{min-height:28px;width:34px;border:1px solid var(--line2);border-radius:7px;background:var(--bg3);color:var(--text2);cursor:pointer;font-family:var(--mono)}
.cbb:hover{border-color:var(--text3);color:var(--text)}
.compexp{margin-top:14px;border-top:1px dashed var(--line2);padding-top:12px}
.compexp textarea{font-family:var(--mono);font-size:11px}
/* ══ WEEK PLAN card ══ */
#wp-card{margin-bottom:16px}
.wplock{font-family:var(--mono);font-size:10px;color:var(--green);margin-left:8px;text-transform:none;letter-spacing:0}
.wplock.warn{color:var(--gold)}
.wpc{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.wpcon{font-size:11.5px;background:var(--bg3);border-radius:6px;padding:4px 9px}
.wpcon b{font-family:var(--mono)}
.wpcon i{font-style:normal;color:var(--text2)}
.wpq{font-size:12px;color:var(--gold);margin:6px 0 10px}
.wpb{margin-top:6px}
.wpbin{font-size:12px;padding:3px 0;color:var(--text2)}
.wpbin i{font-style:normal;color:var(--text3)}
.wprow{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid var(--line)}
.wprow .wpn{font-size:12.5px;min-width:0;flex:1}
.wprow .wpi{width:74px;padding:6px 8px;border:1px solid var(--line2);border-radius:6px;background:var(--bg);font-family:var(--mono)}
.wprow .wpi.wide{flex:2;width:auto;font-family:inherit}
.wprow select{padding:6px 8px;border:1px solid var(--line2);border-radius:6px;background:var(--bg);font-size:12px;flex:1}
/* ══ CALENDAR room — the plan side ══ */
#cal-grid{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg)}
.calhead{display:grid;grid-template-columns:repeat(7,1fr);background:var(--bg2);border-bottom:1px solid var(--line)}
.calhead div{padding:8px 10px;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;color:var(--text3);text-transform:uppercase}
.calrow{display:grid;grid-template-columns:repeat(7,1fr)}
.calday{min-height:112px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px}
.calday:last-child{border-right:none}
.calrow:last-child .calday{border-bottom:none}
.calday.past{background:var(--bg2)}
.calday.today{box-shadow:inset 0 0 0 2px var(--gold)}
.cdh{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.cdd{font-family:var(--mono);font-size:13px;font-weight:600;cursor:pointer}
.cdd:hover{color:var(--gold)}
.cst{font-size:10px}.cst.sealed{color:var(--green)}.cst.open{color:var(--gold)}.cst.stale{color:var(--red)}
.chole{margin-left:auto;font-family:var(--mono);font-size:9px;color:var(--red);border:1px solid rgba(207,67,66,.4);border-radius:10px;padding:1px 7px}
.calblk{display:flex;align-items:center;gap:5px;font-size:11px;background:var(--bg3);border-radius:6px;padding:4px 7px;margin-bottom:4px}
.calblk.hole{opacity:.7;border:1px dashed rgba(207,67,66,.5);background:transparent}
.calblk .ce{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.calblk .cn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calblk .cv{margin-left:auto;font-family:var(--mono);font-size:9.5px;color:var(--text3)}
.calblk .cx{cursor:pointer;color:var(--text3);font-size:10px}
.calblk .cx:hover{color:var(--red)}
.caladd{font-size:10px;color:var(--text3);cursor:pointer;padding:3px 2px;border-radius:5px}
.caladd:hover{color:var(--text2);background:var(--bg3)}
.caladd input{width:100%;font-size:11px;padding:5px 7px;border:1px solid var(--line2);border-radius:6px;background:var(--bg)}
/* per-day note — click to edit, Ctrl+Enter or blur to save, Esc to abandon */
.wkd .wknote{margin-top:9px;padding-top:8px;border-top:1px dashed var(--line);
  font-size:11px;line-height:1.5;color:var(--text2);cursor:text;word-break:break-word}
.wkd .wknote .nhint{color:var(--text3);font-size:10px}
.wkd .wknote textarea{font-size:11px;padding:6px;min-height:52px}
.wkd .wknote a{color:var(--text);text-decoration:underline}
/* task note — its own quiet line under the row */
.tnote{font-size:11px;color:var(--text3);line-height:1.5;padding:2px 8px 10px 30px;
  word-break:break-word}
.tnote a{color:var(--text2);text-decoration:underline}
.wkd .dtot em{font-style:normal;color:var(--gold)}
.wkd .dtot{font-size:10.5px;color:var(--text3)}
.wkbars{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.wkbr{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--text3);
  font-family:var(--mono);font-variant-numeric:tabular-nums}
.wkbr .bk{width:20px;flex:none}
.wkbr .bt{flex:1;height:4px;border-radius:2px;background:var(--track);overflow:hidden}
.wkbr .bf{display:block;height:100%;border-radius:2px}
.wkbr .bv{width:12px;text-align:right}
.wkd .dix{margin-top:11px;padding-top:9px;border-top:1px solid var(--line);
  font-size:10.5px;color:var(--text3)}
.wkd .dix b{color:var(--text2);font-weight:600;font-family:var(--mono)}
@media (max-width:1099px){ .wkdays{grid-template-columns:repeat(2,1fr)} }

/* theme toggle (mobile / UI 2 header — on desktop the rail carries it instead) */
.topr{display:flex;align-items:flex-start;gap:12px}
.themebtn{width:32px;height:32px;border-radius:8px;border:1px solid var(--line2);
  background:var(--bg3);color:var(--text3);font-size:14px;cursor:pointer;flex:none;
  display:flex;align-items:center;justify-content:center;line-height:1}
.themebtn:hover{color:var(--text);border-color:var(--text3)}
@media (min-width:1100px){ .themebtn{display:none} }