/* Kronos /next/ — Beeline's schedule look (beeline-app/vendor/cec_schedule/static/app.css
   tokens), with the Kronos K. Phone first; a wide mouse window gets the week calendar. */
@font-face{font-family:"KN Tag";src:url("../fonts/cormorant/CormorantGaramond-VF.ttf") format("truetype");font-weight:300 700;font-display:swap}
/* Rob Carlton 2026-10-12: Helvetica Neue falls back to Inter, shipped with Kronos so it also works offline. */
@font-face{font-family:"KN Inter";src:url("../fonts/inter/Inter-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"KN Num";src:url("../fonts/jetbrains/JetBrainsMono-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"KN Num";src:url("../fonts/jetbrains/JetBrainsMono-Medium.ttf") format("truetype");font-weight:500;font-display:swap}

:root{
  --bone:#F3F0E9;--bone-deep:#E9E4D9;--paper:#FAF8F3;--field:#FFFFFF;
  --ink:#141210;--ink-soft:#3D3933;--ink-quiet:#6A6459;
  --line:#DAD4C7;--line-soft:#E6E1D6;
  --accent:#A8663F;--accent-deep:#8A5233;--tint:#FBF1E8;
  --sage:#7D8A6F;--sage-deep:#4E5A42;--added:#EEF1EA;--blue:#5A6E84;
  --ghost:rgba(218,212,199,.38);--ghost-line:#C9C1B1;--scrim:rgba(35,33,29,.38);--on-accent:#FFFFFF;
  --ui:"helvetica-neue-lt-pro","Helvetica Neue","KN Inter",Inter,Helvetica,Arial,sans-serif;
  --tag:"KN Tag","Cormorant",Georgia,"Times New Roman",serif;
  --num:"KN Num","JetBrains Mono",ui-monospace,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bone:#262420;--bone-deep:#2E2B26;--paper:#1A1917;--field:#211F1C;
  --ink:#F8F5EE;--ink-soft:#D3CCBE;--ink-quiet:#A8A194;
  --line:#3D3A33;--line-soft:#2E2C27;
  --accent:#D59468;--accent-deep:#E7B48D;--tint:#3A2C22;
  --sage:#9DAA8E;--sage-deep:#C3CFB3;--added:#28301F;--blue:#94A8BF;
  --ghost:rgba(120,112,98,.22);--ghost-line:#5A554B;--scrim:rgba(0,0,0,.55);--on-accent:#1A1917;
  color-scheme:dark}}

*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bone);color:var(--ink);font:16px/1.45 var(--ui);-webkit-text-size-adjust:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.num{font-family:var(--num);font-variant-numeric:tabular-nums}
.tag{font-family:var(--tag);font-weight:400}

/* ---------- shell ---------- */
.kn{height:100%;display:flex;flex-direction:column;overflow:hidden}
.brand{display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 8px;background:var(--paper);border-bottom:1px solid var(--line-soft)}
.brand .word{font-family:var(--tag);font-size:26px;line-height:1;flex:1}
.badge{font:500 12px var(--num);letter-spacing:.08em;padding:3px 8px;border-radius:4px;border:1px solid var(--line);color:var(--ink-quiet)}
.badge.live{border-color:var(--accent);color:var(--accent)}
.iconbtn{min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:22px;background:var(--field);display:inline-flex;align-items:center;justify-content:center;font-size:22px;color:var(--accent)}
.main{flex:1;min-height:0;display:flex;flex-direction:column}

/* ---------- day header ---------- */
.dayhead{display:flex;flex-direction:column;gap:6px;padding:10px 16px;background:var(--paper);border-bottom:1px solid var(--line)}
.dayrow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.dayname{display:flex;flex-direction:column;align-items:center;text-align:center}
.dayname .tag{font:600 16px/22px var(--ui)}
.dayname small{font-size:13px;color:var(--ink-quiet)}
.totals{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:15px;flex-wrap:wrap}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:13px;font-weight:600;padding:2px 9px;border-radius:10px;white-space:nowrap}
.chip.wait{background:var(--tint);color:var(--accent-deep)}
.chip.saved{background:var(--added);color:var(--sage-deep)}
.chip.sub{background:var(--bone-deep);color:var(--ink-soft)}
.chip.warn{background:var(--tint);color:var(--accent-deep);border:1px solid var(--accent)}

/* ---------- the timeline ---------- */
.tl-wrap{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;position:relative;touch-action:pan-y}
.tl{position:relative;margin:14px 0 24px}
.hour{position:absolute;left:0;right:0;border-top:1px solid var(--line-soft)}
.hour span{position:absolute;left:8px;top:-9px;font:400 12px var(--num);color:var(--ink-quiet);background:var(--bone);padding:0 3px}
.nowline{position:absolute;left:48px;right:0;border-top:2px solid var(--accent);z-index:3;pointer-events:none}
/* Line heights are fixed so ui.js can tell how many lines fit (blkFit, and 42
   for a two-line ghost: 1+4+17+15+4+1). Change them and those numbers together. */
.ghost{position:absolute;border:1px dashed var(--ghost-line);background:var(--ghost);border-radius:6px;padding:4px 8px;font-size:14px;line-height:17px;color:var(--ink-soft);overflow:hidden;cursor:pointer;z-index:1;text-align:left}
.ghost .gl{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ghost small{display:block;font-size:12px;line-height:15px;color:var(--ink-quiet);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ghost.g1 .gl{flex:0 1 auto;min-width:0}
/* In a narrow lane the time gives way first, and goes when there is no room for all
   of it, so the event's name stays readable (the full name and time are its tooltip). */
.ghost.g1{display:flex;align-items:center;gap:6px;padding-top:0;padding-bottom:0;container-type:inline-size}
.ghost.g1 small{flex:0 1000 auto;min-width:0;margin-left:auto}
@container (max-width:180px){.ghost.g1 small{display:none}}
.ghost:hover{border-color:var(--accent)}
.blk{position:absolute;border-radius:6px;background:var(--accent);color:var(--on-accent);padding:4px 10px;overflow:hidden;z-index:2;user-select:none;-webkit-user-select:none;touch-action:pan-y;box-shadow:0 1px 3px rgba(35,33,29,.18);cursor:grab;display:flex;flex-direction:column}
.blk .t1{font-size:14px;font-weight:600;line-height:18px;flex:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk .t2{font-size:13px;line-height:17px;flex:none;opacity:.92;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk .t2:empty{display:none}
.blk .t3{font:400 12px/16px var(--num);flex:none;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* A shorter block drops the note (fit2), then puts title and hours on one row (fit1). */
.blk.fit2 .t2,.blk.fit1 .t2{display:none}
.blk.fit1{flex-direction:row;align-items:center;gap:8px;padding-top:0;padding-bottom:0}
.blk.fit1 .t1{flex:1;min-width:0;font-size:13px;line-height:16px}
.blk.fit1 .t3{line-height:16px}
.blk.saved{background:var(--added);color:var(--sage-deep);border:1px solid var(--sage);box-shadow:none}
.blk.needs{background:var(--tint);color:var(--accent-deep);border:1px dashed var(--accent);box-shadow:none}
.blk.draft{opacity:.75}
.blk.sel{outline:3px solid var(--blue);outline-offset:1px;z-index:4}
.blk.dragging{opacity:.85;z-index:5;cursor:grabbing;box-shadow:0 6px 16px rgba(35,33,29,.3)}
.h{position:absolute;left:0;right:0;height:16px;z-index:3;cursor:ns-resize;touch-action:none}
/* edge-top, not top: the desktop header is .top, and its style painted over every block's top. */
.h.edge-top{top:-4px}.h.edge-bot{bottom:-4px}
.h::after{content:"";position:absolute;left:50%;top:50%;width:40px;height:8px;margin:-4px 0 0 -20px;border-radius:4px;background:var(--field);border:2px solid currentColor;opacity:0}
.blk.sel .h::after,.blk:hover .h::after{opacity:1}
.blk.saved .h{display:none}
.preview{position:absolute;border:2px dashed var(--accent);border-radius:6px;background:var(--tint);z-index:4;pointer-events:none}

/* ---------- bars ---------- */
.savebar{display:flex;gap:8px;padding:8px 16px;background:var(--paper);border-top:1px solid var(--line)}
.btn{min-height:48px;padding:0 16px;border-radius:8px;border:1px solid var(--line);background:var(--field);font-weight:600;font-size:16px}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.ghostbtn{background:transparent}
.btn.wide{flex:1}
.btn:disabled{opacity:.5;cursor:default}
.linkbtn{background:none;border:0;padding:8px 4px;color:var(--accent);text-decoration:underline;min-height:44px}
.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--paper);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
.tab{min-height:60px;border:0;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:14px;color:var(--ink-soft);border-top:3px solid transparent}
.tab.on{color:var(--accent);font-weight:600;border-top-color:var(--accent)}
.tab .plus{width:40px;height:40px;border-radius:20px;background:var(--accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1}

/* ---------- entry panel ---------- */
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:20}
.sheet{position:fixed;left:0;right:0;bottom:0;max-height:88%;overflow-y:auto;background:var(--paper);border-radius:16px 16px 0 0;z-index:21;padding:10px 16px calc(16px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:12px;box-shadow:0 -4px 18px rgba(35,33,29,.25)}
.grab{width:44px;height:5px;border-radius:3px;background:var(--line);align-self:center}
.sheet h2,.side h2{margin:0;font-family:var(--tag);font-weight:400;font-size:26px;line-height:1.1}
.seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{min-height:44px;border:0;background:var(--field)}
.seg button.on{background:var(--accent);color:var(--on-accent);font-weight:600}
.fld{display:flex;flex-direction:column;gap:4px}
.fld>span:first-child{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-quiet)}
.fld>.notebox{font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink)}
.fld input,.fld select,.fld textarea{min-height:48px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--field);font-size:17px;width:100%;min-width:0}
.fld textarea{min-height:88px;resize:vertical}
.fld input.num{font-family:var(--num)}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.notebox{display:flex;gap:8px;align-items:stretch}
.notebox textarea{flex:1}
.mic{width:52px;border-radius:8px;border:1px solid var(--accent);background:var(--field);color:var(--accent);display:flex;align-items:center;justify-content:center}
.mic.on{background:var(--accent);color:var(--on-accent)}
.problem{font-size:14px;color:var(--accent-deep);background:var(--tint);border-radius:6px;padding:8px 10px}
.okmsg{font-size:14px;color:var(--sage-deep);background:var(--added);border-radius:6px;padding:8px 10px}
.btnrow{display:flex;gap:8px}
.hint{font-size:14px;color:var(--ink-quiet)}

/* ---------- capture ---------- */
.capture{flex:1;min-height:0;display:flex;flex-direction:column}
.caplist{flex:1;min-height:0;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-quiet)}
.erow{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--field);text-align:left;width:100%}
.erow .l{display:flex;flex-direction:column;gap:2px;min-width:0}
.erow .l b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.erow .l span{font-size:14px;color:var(--ink-quiet);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.erow.reading{border-style:dashed}
.ask{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--accent);border-radius:8px;background:var(--tint)}
.ask .opts{display:flex;gap:8px;flex-wrap:wrap}
.ask .opts button{min-height:44px;padding:0 14px;border-radius:22px;border:1px solid var(--accent);background:var(--field)}
.composer{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;background:var(--paper);border-top:1px solid var(--line)}
.smallmic{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:22px;border:1px solid var(--line);background:var(--field);color:var(--ink-soft);font-size:15px}
.smallmic svg{color:var(--accent)}
.smallmic.on{background:var(--tint);border-color:var(--accent);color:var(--accent-deep)}
.bigmic{width:84px;height:84px;border-radius:42px;border:0;background:var(--accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(168,102,63,.35)}
.bigmic.on{background:var(--accent-deep);box-shadow:0 0 0 6px var(--tint)}
.typebox{display:flex;gap:8px;width:100%}
.typebox input{flex:1;min-width:0;min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:24px;background:var(--field);font-size:17px}
.send{width:48px;height:48px;border-radius:24px;border:0;background:var(--accent);color:var(--on-accent);font-size:20px}

/* ---------- submit ---------- */
.submit{flex:1;min-height:0;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:14px}
.weekhead{display:flex;align-items:center;justify-content:space-between;gap:8px}
.weekhead .mid{display:flex;flex-direction:column;align-items:center;text-align:center}
.weekhead .tag{font-size:24px;line-height:1.1}
.days{border:1px solid var(--line);border-radius:8px;background:var(--field);overflow:hidden}
.drow{display:grid;grid-template-columns:76px minmax(0,1fr) 64px;align-items:center;gap:8px;min-height:48px;padding:4px 12px;border:0;border-bottom:1px solid var(--line-soft);background:none;width:100%;text-align:left}
.drow:last-child{border-bottom:0}
.drow .d{font-weight:600}
.drow.quiet{color:var(--ink-quiet)}
.drow.attn{background:var(--tint)}
.check{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--field)}
.check.gold{border-color:var(--accent);background:var(--tint)}
.check .btn{min-height:44px}
.result{font-size:15px;padding:10px 12px;border-radius:8px;background:var(--bone-deep)}
.result.good{background:var(--added);color:var(--sage-deep)}
.result.bad{background:var(--tint);color:var(--accent-deep)}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;top:calc(76px + env(safe-area-inset-top,0px));transform:translateX(-50%);max-width:calc(100% - 32px);background:var(--ink);color:var(--bone);padding:10px 14px;border-radius:8px;font-size:15px;z-index:30}

/* ---------- desktop ---------- */
.desk .top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:10px 20px;background:var(--paper);border-bottom:1px solid var(--line)}
.desk .top .left,.desk .top .mid,.desk .top .right{display:flex;align-items:center;gap:12px}
.desk .word{font-family:var(--tag);font-size:30px;line-height:1}
.nav{display:flex;gap:4px}
.nav button{min-height:40px;padding:0 14px;border-radius:6px;border:1px solid transparent;background:none;font-size:15px}
.nav button.on{border-color:var(--accent);color:var(--accent);font-weight:600;background:var(--field)}
.desk .iconbtn{min-width:40px;min-height:40px;font-size:20px}
.desk .body{flex:1;min-height:0;display:flex}
.wk{flex:1;min-width:0;display:flex;flex-direction:column;padding:8px 12px 0}
.wkhead{display:grid;grid-template-columns:52px repeat(7,minmax(0,1fr));border-bottom:1px solid var(--line)}
.wkhead .dh{padding:6px 6px 8px;display:flex;flex-direction:column;gap:3px;min-width:0;border-radius:6px 6px 0 0}
.wkhead .dh.today{background:var(--paper)}
.wkhead .dh b{font-size:14px}
.wkhead .dh.today b{color:var(--accent)}
.wkhead .dh .line2{font-size:13px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.wkhead .dh button{align-self:flex-start;min-height:30px;padding:0 8px;border-radius:5px;border:1px solid var(--accent);background:var(--field);color:var(--accent);font-size:13px;font-weight:600}
.wkscroll{flex:1;min-height:0;overflow-y:auto;position:relative}
.wkgrid{display:grid;grid-template-columns:52px repeat(7,minmax(0,1fr));position:relative;margin-top:12px}
.wkcol{position:relative;border-left:1px solid var(--line-soft)}
.wkcol.today{background:var(--paper)}
.wkcol:last-child{border-right:1px solid var(--line-soft)}
.axis{position:relative}
.axis span{position:absolute;right:6px;font:400 12px var(--num);color:var(--ink-quiet);transform:translateY(-8px)}
.hl{position:absolute;left:0;right:0;border-top:1px solid var(--line-soft);pointer-events:none}
.desk .blk{padding:2px 8px}
.desk .blk .t1{font-size:13px;line-height:16px}
.desk .blk .t2{font-size:12px;line-height:15px}
.desk .blk .t3{line-height:15px}
.desk .blk.fit1{padding-top:0;padding-bottom:0;gap:6px}
.desk .blk.fit1 .t1{font-size:12px;line-height:14px}
/* A quarter hour packed against the next block is 11-14px tall: one small line. */
.kn .blk.tiny .t1,.kn .blk.tiny .t3{font-size:11px;line-height:11px}
.side{width:380px;flex:none;border-left:1px solid var(--line);background:var(--paper);overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:14px}
.desk .sheet{position:static;max-height:none;box-shadow:none;border-radius:0;padding:0;background:none}
.desk .grab{display:none}
.desk .fld input,.desk .fld select,.desk .fld textarea{min-height:40px;font-size:15px}
.desk .btn{min-height:42px;font-size:15px}
.desk .toast{top:auto;bottom:24px}
.desk .submit{padding:16px 24px;max-width:860px}
@media (max-width:1100px){.side{width:320px}}

/* ---------- phone: record and approve (2026-10-13, canvas Ref* boards) ---------- */
.ph{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.brand .word:empty{flex:1}
.phead{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:2px 16px 8px;background:var(--paper);border-bottom:1px solid var(--line)}
/* Rob 2026-10-21: the day and date as small as the hours beside them. */
.phead h1,.thead h1{margin:0;font:600 16px/22px var(--ui)}
.hrs{font-size:15px;line-height:20px;color:var(--ink-quiet);white-space:nowrap}
.hrs b{font-weight:500;color:var(--ink)}
.pmain{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:8px 16px}
.since{margin:0;display:flex;align-items:center;gap:6px;font-size:14px;line-height:18px;color:var(--ink-quiet)}
.ptiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ptile{display:flex;flex-direction:column;padding:7px 8px;border:1px solid var(--line);border-radius:10px;background:var(--field);text-align:left;color:var(--ink);min-height:48px;min-width:0}
.ptile.dash{border:1px dashed var(--accent)}
.ptile .tid{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:14px;line-height:18px;color:var(--ink-quiet)}
.ptile .tid .num{font-weight:500}
.ptile b{font-size:16px;line-height:20px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ptile .tph{font-size:14px;line-height:18px;color:var(--ink-quiet);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ptile .hb{padding:0 7px;border-radius:11px;border:1px solid var(--accent);background:var(--tint);color:var(--accent-deep);font-size:14px;font-weight:500}
.ptile .hb.ok{border-color:var(--sage);background:var(--added);color:var(--sage-deep)}
.ptile .pend{font-size:13px;font-weight:600;color:var(--accent-deep)}
.earlier{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.nrow{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;border:1px dashed var(--accent);border-radius:10px;background:var(--field);color:var(--ink);text-align:left;width:100%;font-size:15px;line-height:20px}
.nrow svg{flex:none;color:var(--accent-deep)}
.nrow .l{flex:1;min-width:0}
.nrow .q{color:var(--ink-quiet)}
.nrow.ready{border-style:solid}
.nrow.ready .s{font-weight:600;color:var(--accent-deep)}
.nrow.ok{border:1px solid var(--sage)}
.nrow.ok svg,.nrow.ok .s{color:var(--sage-deep)}
.dock{flex:none;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;background:var(--paper);border-top:1px solid var(--line)}
/* Capture: the day and the two folded lists above, the typing box docked
   below (2026-10-21). The box is outside the part that repaints. */
.capbody{flex:1;min-height:0;display:flex;flex-direction:column}
.dock.row{flex-direction:row;justify-content:center;gap:12px;padding:10px 16px}
.dl{font-size:16px;line-height:20px;font-weight:600}
.recbtn{width:112px;height:112px;border-radius:56px;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 8px var(--tint),0 4px 12px rgba(35,33,29,.25)}
.recbtn.small{width:72px;height:72px;border-radius:36px;box-shadow:0 0 0 6px var(--tint)}
.typeline{width:100%;display:flex;align-items:center;gap:8px;min-height:48px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--bone)}
.typeline .pen{display:flex;color:var(--ink-quiet)}
.typeline input{flex:1;min-width:0;height:44px;border:0;padding:0;background:transparent;font-size:16px;outline:none}
.spin{animation:knspin 1s linear infinite}
@keyframes knspin{to{transform:rotate(360deg)}}

/* saved */
.gotit{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--sage);border-radius:12px;background:var(--added)}
.gotit .ok{flex:none;width:40px;height:40px;border-radius:20px;background:var(--sage-deep);color:#fff;display:flex;align-items:center;justify-content:center}
.gotit>span:last-child{display:flex;flex-direction:column}
.gotit b{font-size:24px;line-height:28px;font-weight:400}
.gotit b+span{font-size:15px;line-height:20px;color:var(--sage-deep)}
.ncard{display:flex;flex-direction:column;gap:8px;padding:10px 12px 12px;border:1px solid var(--line);border-radius:12px;background:var(--field)}
.nhead{display:flex;align-items:center;gap:10px}
.nhead .ic{flex:none;width:44px;height:44px;border-radius:22px;background:var(--tint);color:var(--accent-deep);display:flex;align-items:center;justify-content:center}
.nhead .l{flex:1;display:flex;flex-direction:column}
.nhead .l b{font-size:16px;line-height:20px}
.nhead .l span{font-size:14px;line-height:18px;color:var(--ink-quiet)}
.onph{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--sage-deep)}
.onph svg{width:14px;height:14px}
.steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:15px;line-height:20px}
.steps li{display:flex;align-items:center;gap:10px;min-height:26px}
.steps li.done svg{color:var(--sage-deep)}
.steps li.now{font-weight:600;color:var(--accent-deep)}
.steps li.todo{color:var(--ink-quiet)}
.ncard .linkbtn{align-self:flex-start;font-weight:600;color:var(--accent-deep)}

/* recording */
.recov{position:fixed;inset:0;z-index:40;background:#8A5233;color:#fff;display:flex;flex-direction:column;padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
.rtop{flex:none;display:flex;align-items:center;justify-content:center;gap:10px;padding:28px 16px 0;font-size:17px;line-height:22px;font-weight:600;letter-spacing:.08em}
.rtop .dot{width:14px;height:14px;border-radius:7px;background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.3);animation:knpulse 1.2s ease-in-out infinite}
@keyframes knpulse{50%{box-shadow:0 0 0 9px rgba(255,255,255,.12)}}
.rmid{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:0 16px}
.rings{width:240px;height:240px;border-radius:120px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;animation:knring 1.6s ease-in-out infinite}
.rings>div{width:196px;height:196px;border-radius:98px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center}
.rings .core{width:152px;height:152px;border-radius:76px;background:#A8663F;border:3px solid #fff;display:flex;align-items:center;justify-content:center}
@keyframes knring{50%{transform:scale(1.04)}}
.rtime{font-size:64px;font-weight:500;line-height:70px}
.bars{display:flex;align-items:center;gap:5px;height:48px}
.bars i{width:6px;height:14px;border-radius:3px;background:#fff;transition:height .1s}
.rph{margin:0;display:flex;align-items:center;gap:8px;font-size:16px;line-height:22px}
.rbot{flex:none;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 16px 28px}
.stopbtn{width:100%;height:96px;border-radius:48px;border:0;background:#fff;color:#8A5233;display:flex;align-items:center;justify-content:center;gap:14px;font-size:24px;font-weight:600}
.stopbtn .sq{width:24px;height:24px;border-radius:3px;background:#8A5233}
.cancel{min-height:44px;min-width:120px;border:0;background:none;color:#fff;font-size:15px;text-decoration:underline;text-underline-offset:3px}

/* today */
.thead{display:flex;flex-direction:column;background:var(--paper);border-bottom:1px solid var(--line)}
.thead .dayrow{padding:2px 16px 0}
.thead .iconbtn{width:44px;height:44px;color:var(--accent-deep)}
.thead .back{align-self:center;min-height:32px;padding:0 4px 6px}
.barrow{display:flex;align-items:center;gap:10px;padding:8px 16px}
.dbar{flex:1;min-width:0;height:20px;display:flex;border:1px solid var(--line);border-radius:10px;background:var(--bone);overflow:hidden}
.dbar .a{flex:none;background:var(--sage)}
.dbar .r{flex:none;background:var(--accent)}
.dbar .q{flex:none;width:22px;border:1.5px dashed var(--accent);background:var(--tint);color:var(--accent-deep);font-size:13px;font-weight:500;line-height:15px;text-align:center}
.tlist{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:6px;padding:0 16px 12px}
.ghead{display:flex;align-items:center;gap:8px;min-height:44px;margin-top:4px;color:var(--ink-quiet)}
.ghead .gl{flex:1;font-size:13px;line-height:16px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.ghead .op{flex:none;min-height:44px;font-size:14px;font-weight:600;color:var(--accent-deep);text-decoration:none}
.erow2{display:flex;gap:10px;padding:10px 12px;border:1px solid var(--accent);border-radius:10px;background:var(--field)}
.erow2 .body{flex:1;min-width:0;display:flex;flex-direction:column;border:0;background:none;padding:0;text-align:left;color:var(--ink)}
.erow2 .nm{font-size:13px;line-height:18px;font-weight:500;color:var(--ink-quiet)}
.erow2 b{font-size:16px;line-height:20px;font-weight:600}
.erow2 .meta{font-size:14px;line-height:18px;color:var(--ink-quiet)}
.erow2 .meta .hh{color:var(--ink);font-weight:500}
.erow2 .nt{margin-top:4px;font-size:15px;line-height:20px;white-space:pre-wrap;overflow-wrap:anywhere}
.erow2.saved{border-color:var(--sage);background:var(--added)}
.erow2.saved .nm,.erow2.saved .meta{color:var(--sage-deep)}
.erow2.needs{flex-direction:column;gap:4px;background:var(--tint);cursor:pointer}
.erow2.needs .top{display:flex;justify-content:space-between;gap:10px}
.erow2.needs .nm,.erow2.needs .nd{color:var(--accent-deep)}
.erow2.needs .nd{font-size:13px;line-height:18px;font-weight:600}
.erow2.needs .why{font-size:14px;line-height:19px;color:var(--accent-deep)}
.erow2 .why,.erow2 .mv{display:block;margin-top:4px;font-size:14px;line-height:19px}
.erow2 .why{color:var(--accent-deep)}
.erow2 .mv{color:var(--ink-quiet)}
.moved{font-size:14px;line-height:19px;color:var(--ink-soft);background:var(--bone-deep);border-radius:6px;padding:8px 10px}
.miss{color:var(--accent-deep)}
.qh{margin-top:2px;display:flex;gap:8px;flex-wrap:wrap}
.qh button{min-height:44px;padding:0 12px;border-radius:22px;border:1px solid var(--accent);background:var(--field);font-size:16px;font-weight:500}
.apv{flex:none;width:60px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:0;border:0;background:transparent;font-size:14px;line-height:18px;font-weight:600;color:var(--accent-deep)}
.apv .c{width:44px;height:44px;box-sizing:border-box;border-radius:22px;border:2px solid var(--accent);background:transparent;color:var(--accent-deep);display:flex;align-items:center;justify-content:center}
/* Reject: Approve's shape, in the quiet colour, so Approve stays the one that stands out. */
.apv.rjv{color:var(--ink-quiet)}
.apv.rjv .c{border-color:var(--ghost-line);color:var(--ink-quiet)}
.apv.done .c{color:#fff}
.ndel{align-self:flex-end;min-height:44px;padding:0 12px;border:0;background:transparent;color:var(--accent-deep);font-size:14px;text-decoration:underline}
.apv.done{color:var(--sage-deep);cursor:default}
.apv.done .c{border-color:var(--sage);background:var(--sage)}
.apv:disabled:not(.done){opacity:.4}
.apv.busy .c{animation:knpulse2 .9s ease-in-out infinite}
@keyframes knpulse2{50%{opacity:.5}}
.allbar{padding:8px 16px;border-top:1px solid var(--line);background:var(--paper)}
.allbtn{width:100%;min-height:48px;border-radius:10px;border:0;background:var(--accent-deep);color:#fff;font-size:17px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px}
.allbtn:disabled{opacity:.6}
.allbtn svg{width:20px;height:20px}
.empty{color:var(--ink-quiet);text-align:center;margin-top:40px}

/* detail */
.dsheet{background:var(--field);gap:8px;max-height:94%;padding-top:8px}
.dtop{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px}
.dtop .x{flex:none;width:44px;height:44px;color:var(--ink);font-size:24px}
.dname{flex:1;min-width:0;font-size:20px;line-height:26px;font-weight:500}
.st{flex:none;padding:2px 10px;border:1px solid var(--accent);border-radius:11px;color:var(--accent-deep);font-size:13px;line-height:16px;font-weight:600}
.st.ok{border-color:var(--sage);background:var(--added);color:var(--sage-deep)}
.st.nd{background:var(--tint)}
.said{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-left:3px solid var(--accent);border-radius:0 10px 10px 0;background:var(--bone)}
.play{display:flex;align-items:center;gap:10px}
.pbtn{flex:none;width:44px;height:44px;border-radius:22px;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;padding:0}
.wave{flex:1;min-width:0;display:flex;align-items:center;gap:3px;height:24px}
.wave i{width:4px;border-radius:2px;background:var(--accent)}
.len{flex:none;font-size:14px;line-height:18px;color:var(--ink-quiet)}
.q{margin:0;font-family:var(--tag);font-style:italic;font-size:21px;line-height:27px;color:var(--ink);white-space:pre-wrap}
.q.full{font-size:20px}
.dgrp{display:flex;flex-direction:column;gap:6px}
.dgrp textarea{display:block;width:100%;min-height:56px;padding:10px 12px;border:1px solid var(--accent);border-radius:10px;background:var(--field);resize:vertical;font-size:17px;line-height:22px}
.dtiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dtile{min-height:44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:4px 8px;border:1px solid var(--line);border-radius:10px;background:var(--field);text-align:left;min-width:0}
.dtile .num{font-size:13px;line-height:16px;color:var(--ink-quiet)}
.dtile span:last-child{font-size:15px;line-height:19px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtile.on{border-color:var(--accent);background:var(--accent);color:#fff}
.dtile.on .num{color:#fff;font-weight:500}
.dtile.on span:last-child{font-weight:600}
.dtile.other:not(.on){border:1px dashed var(--accent);color:var(--accent-deep);flex-direction:row;align-items:center}
.dphases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dph{min-height:48px;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:var(--field);text-align:left;font-size:16px;line-height:20px;font-weight:600}
.dph.on{border:2px solid var(--accent);background:var(--tint)}
.dph.miss{border:2px dashed var(--accent);background:var(--tint);color:var(--accent-deep)}
.stepper{display:flex;align-items:center;gap:10px}
.stp{flex:none;width:48px;height:48px;border-radius:24px;border:1px solid var(--accent);background:var(--field);color:var(--accent);font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center}
.hv{flex:1;display:flex;flex-direction:column;align-items:center}
.hv output{font-size:30px;line-height:34px;font-weight:500}
.hv output small{font:400 16px var(--ui);color:var(--ink-quiet)}
.hv span{font-size:13px;line-height:18px;color:var(--ink-quiet)}
.dfoot{flex:none;display:flex;align-items:center;gap:12px;padding-top:4px;border-top:1px solid var(--line)}
.dfoot .l{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.dfoot .linkbtn{font-size:15px;font-weight:600;color:var(--accent-deep);text-align:left}
.dfoot .linkbtn.del{font-weight:400;color:var(--ink-quiet);min-height:36px;padding-top:0}
.nlink{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--field);color:var(--ink)}
.typeline.big{min-height:60px;border-color:var(--accent)}
.typeline.big input{font-size:18px}
.typeline .send{flex:none;width:44px;height:44px;margin-right:-8px;border:0;background:transparent;display:flex;align-items:center;justify-content:center;padding:0;color:#fff;font-size:15px;line-height:1}
.typeline .send::before{content:"";position:absolute}
.mday{position:relative;flex:1;min-width:0;height:30px;border-bottom:1px solid var(--line)}
.mday .tk{position:absolute;bottom:0;width:1px;height:6px;background:var(--line)}
.mday .tk.lab{height:10px;background:var(--ink-quiet)}
.mday .tk.lab{font-size:11px;line-height:11px;color:var(--ink-quiet)}
.mday .tk.lab{text-indent:3px;white-space:nowrap;overflow:visible}
.mday .sg{position:absolute;top:2px;height:14px;border-radius:3px;opacity:.9}
.mday .sg.a{background:var(--sage)}
.mday .sg.r{background:var(--accent)}
.mday .sg.q{background:var(--tint);border:1.5px dashed var(--accent);box-sizing:border-box}

/* 2026-10-20, Rob's walk: a Done button that is easy to see, in a header that
   stays put; the Project / Overhead switch; overhead lines in two groups; the
   Capture project drop-down; earlier notes folded into one line.
   2026-10-21: Done drawn like Kronos's other buttons (the black pill "looks
   like it belongs somewhere else"), and the switch a ribbon, not two tall boxes. */
.dtop{position:sticky;top:-8px;z-index:3;background:var(--field);margin:-8px -16px 0;padding:8px 16px;border-bottom:1px solid var(--line)}
.dtop .dname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.donebtn{flex:none;min-height:40px;min-width:76px;padding:0 16px;border:1px solid var(--accent);border-radius:8px;background:var(--field);color:var(--accent-deep);font-size:16px;font-weight:600}
.dgrp textarea{overflow-y:hidden}
/* The card scrolls; nothing in it may be squeezed to fit (a long note once
   crushed the Project / Overhead switch, which clips its overflow, to a line). */
.dsheet>*{flex-shrink:0}
.seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--accent);border-radius:8px;overflow:hidden}
.seg button{min-height:34px;padding:0 8px;border:0;background:var(--field);color:var(--accent-deep);font-size:16px;line-height:20px;font-weight:600}
.seg button[aria-pressed=true]{background:var(--accent);color:#fff}
.ohlab{margin-top:2px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-quiet)}
/* Capture's two lists, Recent projects and Earlier notes: one shape, one
   typeface, one size (Rob 2026-10-20: "the typography is all over the place"). */
details.cmenu{display:block;margin:0}
.cmenu summary{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--field);color:var(--ink);font:400 16px/1.3 var(--ui);cursor:pointer;list-style:none}
.cmenu summary::-webkit-details-marker{display:none}
.cmenu .ct{font-weight:600}
.cmenu .cq{color:var(--ink-quiet);font:400 15px/1.3 var(--ui);font-variant-numeric:tabular-nums}
.cmenu .cflag{color:var(--accent-deep);font-weight:600}
.cmenu .echev{margin-left:auto;display:inline-flex;color:var(--ink-quiet);transition:transform .15s}
.cmenu[open] .echev{transform:rotate(90deg)}
.cmenu .clist{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.citem,.cmenu .nrow{display:flex;align-items:center;gap:10px;min-height:48px;width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--field);color:var(--ink);text-align:left;font:400 16px/1.3 var(--ui)}
.citem .ci{flex:1;min-width:0}
.citem .cq{flex:none}
.cmenu .nrow .cq{font-size:16px}
.cmenu .nrow.ready .s,.cmenu .nrow.needs .s{font-weight:600}
.dph{overflow-wrap:anywhere}
.hold{color:var(--accent-deep);font-weight:600}
.dph .hold{display:block;margin-top:2px;font-size:13px;line-height:16px}
.dph.held{border-style:dashed}
/* 2026-10-21, Rob: repeats flagged and a way to reject. The other-project box
   without its label; the time on Earlier notes in the serif italic he likes. */
.fproj{display:block;width:100%;min-width:0;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--field);font-size:17px}
.tsig{font-family:var(--tag);font-style:italic;font-size:21px;line-height:24px;color:var(--ink-quiet);font-variant-numeric:tabular-nums}
.btn.sm{min-height:36px;padding:0 14px;font-size:15px}
.rr{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}
.cmenu .nrow.needs{border-color:var(--accent);background:var(--tint)}
.cmenu .nrow.needs .s{color:var(--accent-deep)}
.nact{display:flex;justify-content:flex-end;gap:4px;margin-top:-4px}
.nact .ndel{align-self:auto;min-height:36px}
.dsheet>.linkbtn{align-self:flex-start;font-size:15px;font-weight:600;color:var(--accent-deep)}
.dsheet>.linkbtn.del{font-weight:400;color:var(--ink-quiet)}
.dfoot .l .linkbtn+.linkbtn{min-height:36px;padding-top:0}
.toast{display:flex;align-items:center;gap:12px}
.toast[hidden]{display:none}
.tundo{flex:none;min-height:36px;padding:0 12px;border:1px solid var(--bone);border-radius:8px;background:transparent;color:var(--bone);font-size:15px;font-weight:600}
/* 2026-10-21, Rob, from JobTread's phone bar: one slim bar that does things.
   Search, the day by the hour, what needs you, the menu. */
.tbar{gap:2px;padding:calc(6px + env(safe-area-inset-top,0px)) 6px 6px 16px}
.tbar>svg{flex:none;margin-right:10px}
.tbar .badge{flex:none;margin-right:6px}
.tsearch{flex:1;min-width:0;height:40px;display:flex;align-items:center;gap:8px;margin-right:4px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:var(--field);color:var(--ink-quiet);font-size:16px;text-align:left}
.tsearch svg{flex:none}
.tsearch span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tbtn{position:relative;flex:none;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:22px;background:transparent;color:var(--ink-soft)}
.tbtn.on{background:var(--tint);color:var(--accent-deep)}
.tcount{position:absolute;top:3px;right:2px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--accent-deep);color:var(--paper);font:600 12px/19px var(--ui);text-align:center;font-variant-numeric:tabular-nums}
.tcount[hidden]{display:none}
.tmenu{gap:8px}
/* The two sheets the bar opens. */
.ssheet{min-height:70%}
.sq{flex:1;min-width:0;display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;border:1px solid var(--accent);border-radius:8px;background:var(--field);color:var(--ink-quiet)}
.sq svg{flex:none}
.sq input{flex:1;min-width:0;height:100%;border:0;padding:0;background:transparent;color:var(--ink);font-size:17px;outline:none;-webkit-appearance:none;appearance:none}
.sres{display:flex;flex-direction:column;gap:6px}
.sres .eyebrow{margin-top:6px}
.sres .cq{flex:none;color:var(--ink-quiet);font:400 15px/1.3 var(--ui)}
.sres .tsig{font-size:19px}
.needs{display:flex;flex-direction:column;gap:6px}
.need{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;padding:8px 10px 8px 12px;border:1px solid var(--accent);border-radius:10px;background:var(--tint);color:var(--ink);text-align:left}
.need .nd{flex:none;width:52px;font-size:14px;line-height:18px;font-weight:600;color:var(--accent-deep)}
.need .l{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.need b{font-size:16px;line-height:20px;font-weight:600}
.need .why{font-size:14px;line-height:19px;color:var(--accent-deep);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.need svg{flex:none;color:var(--accent-deep)}
.dtop .dname .cq{color:var(--ink-quiet);font-size:16px}
/* 2026-10-21: the once-only offer to put Kronos on the home screen. */
.inst{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 12px;border:1px solid var(--accent);border-radius:10px;background:var(--tint);font-size:15px;line-height:20px;color:var(--ink)}
.inst span{flex:1 1 100%}
.inst .linkbtn{min-height:36px;padding:0 4px;color:var(--ink-quiet)}
.tmenu>.btn.primary{align-self:flex-start}
/* 2026-10-21: the day's round-up. The tray on the top row (a dot when one is
   ready), and its sheet: where Kronos looked, the day in time order, and the
   text it will send. */
.tdot{position:absolute;top:8px;right:8px;width:10px;height:10px;border-radius:5px;background:var(--accent);box-shadow:0 0 0 2px var(--paper)}
.tdot[hidden]{display:none}
.rbtn{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:40px;border-color:var(--accent);color:var(--accent-deep)}
.rbtn .tdot{top:-4px;right:-4px}
.rday{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rday .tag{font:600 16px/22px var(--ui);text-align:center}
.rday .iconbtn[disabled]{opacity:.35}
.rbusy{display:flex;align-items:center;gap:10px;padding:16px 4px;color:var(--ink-soft)}
.rsrc{display:flex;flex-direction:column;gap:4px}
.rs{position:relative;padding-left:16px;font-size:15px;line-height:21px;color:var(--ink-soft)}
.rs::before{content:"";position:absolute;left:2px;top:7px;width:8px;height:8px;border-radius:4px;background:var(--sage-deep)}
.rs.off{color:var(--ink-quiet)}
.rs.off::before{background:var(--line)}
.rs.bad::before{background:var(--accent)}
.rtl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rtl li{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--field)}
.rt{font-size:13px;line-height:18px;color:var(--ink-quiet)}
.rb{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:16px;line-height:22px}
.rb b{font-weight:600}
.rd{font-size:15px;line-height:21px;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rw{font-size:15px;line-height:21px;color:var(--accent-deep)}
.rx{font-size:13px;line-height:18px;color:var(--ink-quiet)}
.rtl .ri.in{border-color:var(--accent);background:var(--tint)}
.rtl .ri.ns{border-style:dashed}
.ri.ns .rb b{font-weight:500;color:var(--ink-soft)}
.rx .sug{font-weight:600;color:var(--sage-deep)}
.rhead{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rhead .linkbtn{font-size:15px;font-weight:600;color:var(--accent-deep)}
.rdet summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:14px;font-weight:600;color:var(--accent-deep)}
.rdet .rd{display:block;-webkit-line-clamp:unset}
.rtg{flex:none;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--field);font-size:14px;font-weight:600;color:var(--ink-soft)}
.rtg{display:inline-flex;align-items:center;gap:4px}
.rtg svg{width:16px;height:16px}
.rtg.on{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}
.rtl .rg{background:transparent;border-style:dashed;color:var(--ink-quiet)}
.rtl .rk{background:var(--bone);color:var(--ink-soft)}
.rtext summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:15px;color:var(--ink-soft)}
.rfix ul{margin:4px 0 0;padding-left:18px;font-size:14px;line-height:20px;color:var(--ink-soft)}
.rfix li{margin-bottom:6px}
.rtext pre{margin:6px 0 0;max-height:220px;overflow:auto;padding:8px 10px;border-radius:6px;background:var(--bone);white-space:pre-wrap;font:400 13px/1.45 var(--num)}
.rfoot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px}
.rsched{display:flex;align-items:center;gap:10px;min-height:44px;font-size:15px;line-height:21px;color:var(--ink-soft)}
.rsched input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--accent)}
.side .dtop{top:-16px;margin:-16px -20px 0;padding:12px 20px}
/* 2026-10-21: billable (B) and not billable (NB), in place of "X of 8". */
.bill{display:inline-flex;align-items:baseline;gap:3px;white-space:nowrap;font-size:15px;line-height:20px;color:var(--ink-quiet)}
.bill b{font-weight:600;color:var(--ink)}
.bill b.ok{color:var(--sage-deep)}
.bill .bl{margin-right:8px;font-size:13px;font-weight:600;letter-spacing:.04em}
.bill .bl:last-child{margin-right:0}
.wkhead .dh .bill{font-size:13px}
.wkhead .dh .bill .bl{font-size:12px;margin-right:6px}
.wkbill .bill{font-size:15px}
.rx .dupt{font-weight:600;color:var(--accent-deep)}
/* 2026-10-26, Rob: to-dos and suggestions, kept like a time note. */
#j-text{display:block;width:100%;min-height:64px;padding:10px 12px;border:1px solid var(--accent);border-radius:10px;background:var(--field);resize:vertical;font-size:17px;line-height:22px;overflow-y:hidden}
.dsheet>.btn.primary[data-act="jsave"]{align-self:flex-start}
.jrow{display:flex;align-items:center;gap:6px;min-height:48px;padding:2px 2px 2px 4px;border:1px solid var(--line);border-radius:10px;background:var(--field)}
.jrow .jt{flex:1;min-width:0;padding:8px 0;font-size:16px;line-height:21px;white-space:pre-wrap;overflow-wrap:anywhere}
.jrow .jd{flex:none;font-size:13px;line-height:16px;color:var(--ink-quiet);font-variant-numeric:tabular-nums}
.jrow.done .jt{color:var(--ink-quiet);text-decoration:line-through}
.jbox{flex:none;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent}
.jbox .c{width:26px;height:26px;box-sizing:border-box;border-radius:13px;border:2px solid var(--accent);display:inline-flex;align-items:center;justify-content:center;color:#fff}
.jbox .c svg{width:16px;height:16px}
.jbox.on .c{border-color:var(--sage);background:var(--sage)}
.jbulb{flex:none;width:44px;display:inline-flex;align-items:center;justify-content:center;color:var(--accent-deep)}
.jx{flex:none;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--ink-quiet)}
.jx svg{width:16px;height:16px}
/* Five buttons beside it: the word goes before it would be cut to "Se...". */
.tsearch{container-type:inline-size;padding:0 10px;gap:6px}
@container (max-width:92px){.tsearch span{display:none}}
/* 2026-11-04, Rob: each card reads in three lines -- the account, then the
   phase or overhead line, then the time of day and the hours. One note is one
   card: when it was typed or recorded sits on the card's top line, with Open
   note as a real button beside it, and the note's entries inside the card. */
.erow2 .ln{display:flex;flex-direction:column;min-width:0}
.erow2 .l1{font-size:16px;line-height:20px;font-weight:600;overflow-wrap:anywhere}
.erow2 .l2{font-size:15px;line-height:19px;color:var(--ink-soft)}
.erow2 .l3{font-size:14px;line-height:18px;color:var(--ink-quiet)}
.erow2 .l3 .hh{color:var(--ink);font-weight:500}
.erow2 .l2.miss,.erow2 .l3 .hh.miss{color:var(--accent-deep);font-weight:600}
.erow2.saved .l2,.erow2.saved .l3,.erow2.saved .l3 .hh{color:var(--sage-deep)}
.ngrp{flex-shrink:0;display:flex;flex-direction:column;border:1px solid var(--accent);border-radius:12px;background:var(--field);overflow:hidden}
.ngrp.loose{border-color:var(--line)}
.ngtop{display:flex;align-items:center;gap:8px;min-height:44px;padding:2px 6px 2px 12px;background:var(--paper);border-bottom:1px solid var(--line-soft);color:var(--ink-quiet)}
.ngtop svg{flex:none;color:var(--accent-deep)}
.ngtop .gl{flex:1;min-width:0;font-size:14px;line-height:18px;font-weight:600}
.ngtop .opbtn{flex:none;min-height:38px;padding:0 12px;border-color:var(--accent);color:var(--accent-deep);font-size:14px}
.ngrp>.nrow{min-height:40px;border:0;border-radius:0;background:none}
.ngrp>.erow2{border:0;border-radius:0}
.ngrp>.erow2+.erow2,.ngrp>.nrow+.erow2{border-top:1px solid var(--line-soft)}
/* The open note, compact on a phone: less padding, the note in a smaller
   serif, and each entry one short row, so the note and its entries show
   together without scrolling. */
.nsheet{gap:6px;padding-left:12px;padding-right:12px}
.nsheet .dtop{min-height:40px;margin:-8px -12px 0;padding:6px 12px}
.side .nsheet .dtop{margin:-16px -20px 0;padding:12px 20px}  /* the desk side panel keeps its edge-to-edge bar */
.nsheet .dname{font-size:17px;line-height:22px}
.nsheet .donebtn{min-height:36px}
.nsheet .said{padding:6px 10px}
.nsheet .q.full{font-size:18px;line-height:23px}
.nsheet .eyebrow{margin-top:2px}
.nsheet .nent{min-height:0;padding:6px 10px;gap:8px;text-align:left}
.nsheet .nent .nl{flex:1;min-width:0;display:flex;flex-direction:column}
.nsheet .nent .ln{display:flex;flex-direction:column}
.nsheet .nent .l1{font-size:15px;line-height:19px;font-weight:600}
.nsheet .nent .l2{font-size:14px;line-height:18px;color:var(--ink-soft)}
.nsheet .nent .l3{font-size:13px;line-height:17px;color:var(--ink-quiet)}
.nsheet .nent .miss{color:var(--accent-deep)}
.nsheet>.linkbtn{min-height:36px;padding-top:4px;padding-bottom:4px}
.nsheet>.allbtn{min-height:44px}
/* 2026-11-04: the version line at the top of the menu, with a dot that is green while the server answers. */
.vline{display:flex;align-items:center;gap:8px}
.vdot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--ink-quiet)}
.vdot.ok{background:var(--sage-deep)}
/* Desk Week: 1/3/7 days and hour zoom (Rob, 2026-11-02; on /next 2026-11-05) */
.desk .top .mid .seg.span{grid-template-columns:repeat(3,auto);margin-left:8px}
.desk .top .mid .seg.span button{min-height:30px;padding:0 10px;font-size:13px}
.desk .top .mid .zoom{display:flex;gap:4px}
.desk .top .mid .zoom button[disabled]{opacity:.35}