:root{
  --bg:#f5f6f8; --surface:#ffffff; --surface-2:#f0f2f5; --border:#e2e5ea; --text:#1b2330; --muted:#5f6b7a;
  --brand:#1f3864; --accent:#2e75b6; --ok:#1e7b4f; --ok-bg:#e3f3ea; --warn:#a15c00; --warn-bg:#fff1dc;
  --info:#2e5f99; --info-bg:#e6eef8;
  --c-uw:#5b7fb8; --c-duty:#9aa8bd; --c-gst:#c9a45c; --c-inc:#2e9e6b;
  --shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0f141b; --surface:#171d26; --surface-2:#1e2632; --border:#2a3442; --text:#e6ebf2; --muted:#98a4b5;
  --brand:#9db8e6; --accent:#6aa6e0; --ok:#5cc792; --ok-bg:#16342a; --warn:#f0b35a; --warn-bg:#3a2a12;
  --info:#8fb6e6; --info-bg:#1a2a40; --c-uw:#7d9bd0; --c-duty:#7b879a; --c-gst:#d4b06a; --c-inc:#4cc08a; --shadow:none;}}
:root[data-theme="dark"]{
  --bg:#0f141b; --surface:#171d26; --surface-2:#1e2632; --border:#2a3442; --text:#e6ebf2; --muted:#98a4b5;
  --brand:#9db8e6; --accent:#6aa6e0; --ok:#5cc792; --ok-bg:#16342a; --warn:#f0b35a; --warn-bg:#3a2a12;
  --info:#8fb6e6; --info-bg:#1a2a40; --c-uw:#7d9bd0; --c-duty:#7b879a; --c-gst:#d4b06a; --c-inc:#4cc08a; --shadow:none;}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px 48px}
header.top{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40}
header .bar{padding:10px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mark{width:34px;height:34px;border-radius:8px;background:var(--brand);color:var(--surface);display:grid;place-items:center;font-weight:700;font-size:13px}
.title{font-weight:650;font-size:16px}.sub{color:var(--muted);font-size:12.5px}
.spacer{flex:1}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}
.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.warn{background:var(--warn-bg);color:var(--warn)}.pill.info{background:var(--info-bg);color:var(--info)}
select,button{font:inherit}
.period{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:8px;padding:6px 10px}
h2{font-size:15px;margin:28px 0 10px;font-weight:650}
.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:20px;overflow:hidden}
.step{padding:14px 16px;border-right:1px solid var(--border);position:relative}
.step:last-child{border-right:0}
.step .n{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.step .t{font-weight:600;margin:2px 0 6px}
.step.cur{background:var(--warn-bg)}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.kpi{padding:14px 16px}.kpi .l{color:var(--muted);font-size:12.5px}.kpi .v{font-size:22px;font-weight:650;margin-top:2px}
.kpi .h{color:var(--muted);font-size:12px;margin-top:2px}
.kpi.hl{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
table{width:100%;border-collapse:collapse}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border)}
th{font-size:12px;color:var(--muted);font-weight:600;background:var(--surface-2)}
td.r,th.r{text-align:right}
tr.stream{cursor:pointer}tr.stream:hover td{background:var(--surface-2)}
tr.total td{font-weight:650;background:var(--surface-2)}
.caret{display:inline-block;width:14px;color:var(--muted);transition:transform .15s}
.open .caret{transform:rotate(90deg)}
.detail td{background:var(--surface-2);padding:0}
.detail .inner{padding:12px 16px 16px 40px}
.derive{color:var(--muted);font-size:12.5px;margin:0 0 8px}
.jl{width:auto;min-width:520px}.jl td,.jl th{padding:5px 10px;font-size:13px;background:transparent}
.basis{color:var(--muted);font-size:12.5px}
.twocol{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
.pad{padding:16px}
.stack{display:flex;height:28px;border-radius:6px;overflow:hidden;margin:6px 0 12px}
.stack div{height:100%}
.legend{display:grid;grid-template-columns:auto 1fr auto;gap:6px 10px;align-items:center;font-size:13px}
.sw{width:11px;height:11px;border-radius:3px}
.ctl{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:start;padding:10px 16px;border-bottom:1px solid var(--border)}
.ctl:last-child{border-bottom:0}
.ic{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700}
.ic.ok{background:var(--ok-bg);color:var(--ok)}.ic.warn{background:var(--warn-bg);color:var(--warn)}.ic.info{background:var(--info-bg);color:var(--info)}
.ctl .d{color:var(--muted);font-size:12.5px}
.filters{display:flex;gap:6px;margin:0 0 10px}
.fbtn{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:999px;padding:4px 12px;cursor:pointer;font-size:12.5px}
.fbtn.on{background:var(--brand);color:var(--surface);border-color:var(--brand)}
.ex{padding:14px 16px;margin-bottom:10px}
.ex .hd{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ex .what{font-weight:600}
.ex dl{display:grid;grid-template-columns:130px 1fr;gap:4px 12px;margin:10px 0 0;font-size:13px}
.ex dt{color:var(--muted)}.ex dd{margin:0}
.ex.attn{border-left:4px solid var(--warn)}
.outs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.out{padding:14px 16px}.out .t{font-weight:600}.out .d{color:var(--muted);font-size:12.5px;margin:2px 0 10px}
.btn{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:8px;padding:7px 12px;cursor:pointer}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--surface)}
.gate{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;margin-top:12px}
.gate .msg{flex:1;min-width:240px}
.note{color:var(--muted);font-size:12.5px;margin-top:20px}
@media (max-width:900px){.kpis{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}.step{border-right:0;border-bottom:1px solid var(--border)}
 .twocol,.outs{grid-template-columns:1fr}.hide-sm{display:none}.tscroll{overflow-x:auto}}
/* app additions */
nav.main{display:flex;gap:4px;flex-wrap:wrap}
nav.main a{color:var(--text);text-decoration:none;padding:6px 10px;border-radius:8px;font-size:13.5px}
nav.main a.on,nav.main a:hover{background:var(--surface-2)}
a{color:var(--accent)}
.flash{padding:10px 14px;border-radius:8px;margin:16px 0 0;font-size:13.5px}
.flash.err{background:var(--warn-bg);color:var(--warn)}.flash.ok{background:var(--ok-bg);color:var(--ok)}
form.inline{display:flex;gap:10px;align-items:end;flex-wrap:wrap}
form.inline label{display:flex;flex-direction:column;font-size:12.5px;color:var(--muted);gap:4px}
input[type=date],input[type=text],input[type=password],select.in{font:inherit;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;padding:6px 10px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--muted)}
.prob.stop{color:var(--warn);font-weight:600}.prob.warn{color:var(--muted)}
.tag{display:inline-block;border:1px solid var(--border);border-radius:6px;padding:0 6px;margin:1px 4px 1px 0;font-size:11.5px;color:var(--muted)}
pre.console{background:var(--surface-2);padding:12px;border-radius:8px;overflow:auto;font-size:12px;max-height:420px}
.upload-progress{flex-basis:100%;margin-top:10px}
.upload-progress .bar{height:10px;border-radius:6px;background:var(--surface-2);border:1px solid var(--border);overflow:hidden;margin:6px 0}
.upload-progress .bar div{height:100%;width:0;background:var(--accent);transition:width .2s}
.upload-progress .msg,.upload-progress .pct{font-size:13px;color:var(--muted)}
/* upload page */
.daystrip{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px}
.daychip{flex:0 0 auto;min-width:92px;border:1px solid var(--border);border-radius:10px;padding:8px 10px;background:var(--surface);color:var(--text);text-decoration:none;display:flex;flex-direction:column;gap:1px}
.daychip .dname{font-size:11.5px;color:var(--muted)}.daychip .dnum{font-weight:650}.daychip .dstate{font-size:11.5px}
.daychip.done .dstate{color:var(--ok)}.daychip.part .dstate{color:var(--warn)}.daychip.none .dstate{color:var(--muted)}
.daychip.off{opacity:.7}.daychip.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.dayhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.zones{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-bottom:12px}
.zone{border:2px dashed var(--border);border-radius:12px;padding:14px;background:var(--surface);cursor:pointer;transition:border-color .15s,background .15s;margin:0}
.zone:hover,.zone.over{border-color:var(--accent);background:var(--info-bg)}
.zone.have{border-style:solid;border-color:var(--ok)}.zone.stale{border-style:solid;border-color:var(--warn)}
.zone.wide{grid-column:1/-1;margin-bottom:8px}
.zhead{font-weight:650;margin-bottom:4px}.ztick{display:inline-block;width:18px;color:var(--ok)}
.zone.stale .ztick{color:var(--warn)}
.zhint{color:var(--muted);font-size:12.5px;margin-bottom:8px}
.zf{font-size:12.5px;overflow-wrap:anywhere}.zmeta{color:var(--muted);font-size:11.5px}.zempty{color:var(--muted);font-size:12.5px;font-style:italic}
.zwarn{color:var(--warn);font-size:12px;font-weight:600;margin-top:4px}
.zone .upload-progress{margin-top:8px}
.refreshcard{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.refreshcard .basis{flex-basis:100%}.conns{display:flex;gap:8px;flex-wrap:wrap}
.srctag{display:inline-block;font-size:11px;color:var(--info);background:var(--info-bg);border-radius:6px;padding:0 6px;margin-left:4px}
.help{position:relative;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid var(--border);color:var(--muted);font-size:11.5px;font-weight:700;cursor:help;margin-left:4px;vertical-align:1px}
.help .tip{display:none;position:absolute;z-index:20;left:50%;top:24px;transform:translateX(-50%);width:300px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 24px rgba(16,24,40,.18);padding:10px 12px;font-weight:400;font-size:12.5px;text-align:left;cursor:default}
.help:hover .tip,.help:focus .tip,.help:focus-within .tip{display:block}

/* help assistant */
.ask{position:fixed;right:18px;bottom:18px;z-index:50}
.ask-open{box-shadow:0 2px 10px rgba(0,0,0,.15)}
.ask-panel{width:min(420px,calc(100vw - 36px));background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.18);padding:12px}
.ask-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.ask-close{border:0;background:none;color:var(--text);font-size:20px;cursor:pointer;line-height:1}
.ask-msgs{max-height:50vh;overflow:auto;display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.ask-msg{padding:8px 10px;border-radius:8px;white-space:pre-wrap;font-size:14px;color:var(--text)}
.ask-msg.q{background:var(--info-bg);align-self:flex-end;max-width:85%}
.ask-msg.a{background:var(--surface-2)}
.ask-msg.wait{color:var(--muted)}
.ask-msg.warn{background:var(--warn-bg)}
.ask-form textarea{width:100%;box-sizing:border-box;font:inherit;margin-bottom:6px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px}
form.asst-form{display:flex;flex-direction:column;gap:8px;align-items:flex-start}

/* collection progress */
.syncprog{display:flex;align-items:center;gap:8px;margin-top:10px;font-weight:600;color:var(--info)}
.spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--border);border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation:none}}

.refreshcard details.range{display:inline-block;margin-left:10px;font-size:13px}
.refreshcard details.range summary{cursor:pointer;color:var(--accent)}
.refreshcard details.range label{margin-right:8px}
.prob.skip{color:var(--muted)}

details.noreports{margin-top:8px;font-size:13px}details.noreports summary{cursor:pointer;color:var(--accent)}

.zrm{border:0;background:none;color:var(--muted);cursor:pointer;font-size:14px;padding:0 4px;line-height:1}.zrm:hover{color:var(--warn)}

@media (max-width:560px){.ask{right:10px;bottom:10px}.ask-msgs{max-height:60vh}}

/* Today: to-dos with their action buttons and progress shown in place */
.todos .todo{display:grid;grid-template-columns:auto 1fr auto;gap:4px 12px;align-items:start;padding:12px 14px;border-bottom:1px solid var(--border)}
.todos .todo:last-child{border-bottom:0}
.todo .dot{width:10px;height:10px;border-radius:50%;margin-top:6px;background:var(--muted)}
.todo.lvl-stop .dot{background:var(--warn)}.todo.lvl-act .dot{background:var(--accent)}.todo.lvl-warn .dot{background:var(--c-duty,var(--muted))}.todo.lvl-ok .dot{background:var(--ok)}
.todo .tmain{min-width:0}.todo .tt{font-weight:600}.todo .td{font-size:12.5px;color:var(--muted);margin-top:2px}
.todo .tb{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.todo .prog{font-size:12.5px;margin-top:6px;display:flex;flex-direction:column;gap:2px}
.todo.busy .tb{opacity:.5;pointer-events:none}.todo.done .dot{background:var(--ok)}
.todo .step{display:flex;gap:6px;align-items:center}
.todo .sp{width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:todo-spin .8s linear infinite;flex:none}
@keyframes todo-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.todo .sp{animation:none}}
@media (max-width:620px){.todos .todo{grid-template-columns:auto 1fr}.todo .tb{grid-column:2;justify-content:flex-start}}
.todo .tb a.btn{text-decoration:none}
.ask-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.ask-chips .chip,.ask-walk{font:inherit;font-size:12.5px}
.ask-chips .chip{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:999px;padding:3px 10px;cursor:pointer}
.ask-walk{margin-left:8px;vertical-align:middle}
.ask-card{border:1px solid var(--accent);border-radius:8px;padding:8px 10px;background:var(--surface);display:flex;flex-direction:column;gap:6px;font-size:13px}
.ask-card .ct{font-weight:600}.ask-card .prog{font-size:12.5px;display:flex;flex-direction:column;gap:2px}
.ask-card .sp{width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:todo-spin .8s linear infinite;flex:none}
.ask-card .step{display:flex;gap:6px;align-items:center}.ask-card.busy form{opacity:.5;pointer-events:none}
.ask-card a.btn{text-decoration:none;align-self:flex-start}
.hsearch input{font:inherit;font-size:13px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:8px;padding:5px 10px;width:210px}
@media (max-width:700px){.hsearch input{width:150px}}

/* layout (Ben, 20 Oct): menu on the left (wide or icons only), assistant docked on the right, search in the header */
.ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.iconbtn{display:none;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;width:34px;height:34px;place-items:center;cursor:pointer;padding:0}
.askbtn{display:inline-flex;align-items:center;gap:6px}
.askbtn.on{background:var(--brand);border-color:var(--brand);color:var(--surface)}
.hsearch{display:flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface-2);border-radius:8px;padding:0 10px;height:34px;color:var(--muted);margin:0}
.hsearch input,.hsearch input[type=search]{border:0;background:none;padding:0;width:210px;outline:none;font-size:13.5px}
.hsearch:focus-within{border-color:var(--accent)}
body.app{--sw:224px;--aw:0px;--hh:55px}
body.app.collapsed{--sw:64px}
body.app.ask-on{--aw:380px}
body.app .shell{display:grid;grid-template-columns:var(--sw) minmax(0,1fr) var(--aw);align-items:start}
body.app .wrap{width:100%;padding-left:24px;padding-right:24px}
aside.side{display:flex;flex-direction:column;gap:2px;padding:12px 10px;background:var(--surface);border-right:1px solid var(--border);position:sticky;top:var(--hh);height:calc(100vh - var(--hh));overflow:auto}
.side a{position:relative;display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:8px;color:var(--muted);text-decoration:none;white-space:nowrap;font-size:14px}
.side a:hover{background:var(--surface-2);color:var(--text)}
.side a.on{background:var(--info-bg);color:var(--brand);font-weight:600}
.side .grp{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:14px 10px 4px;white-space:nowrap}
.side .foot{margin-top:auto;padding-top:10px;border-top:1px solid var(--border)}
.side .foot button{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;color:var(--muted);font-size:13px;padding:8px 10px;border-radius:8px;cursor:pointer}
.side .foot button:hover{background:var(--surface-2);color:var(--text)}
body.collapsed .side .txt{display:none}
body.collapsed .side .grp{font-size:0;padding:0;margin:8px 8px 4px;border-top:1px solid var(--border)}
body.collapsed .side a,body.collapsed .side .foot button{justify-content:center;padding:10px 0}
body.collapsed .side .foot .ico{transform:rotate(180deg)}
/* docked assistant: the right-hand column */
body.app.ask-on .ask{position:sticky;top:var(--hh);right:auto;bottom:auto;height:calc(100vh - var(--hh));z-index:auto;border-left:1px solid var(--border);background:var(--surface)}
body.app .ask-open{display:none}
body.app.ask-on .ask-panel{display:flex;flex-direction:column;width:auto;height:100%;border:0;border-radius:0;box-shadow:none;padding:14px}
body.app.ask-on .ask-msgs{flex:1;max-height:none;min-height:0}
[hidden]{display:none!important}
.scrim{display:none}
@media (max-width:900px){
  .iconbtn{display:inline-grid}
  body.app .shell{display:block}
  aside.side{position:fixed;left:0;top:0;bottom:0;height:100vh;width:260px;z-index:60;transform:translateX(-102%);transition:transform .2s;box-shadow:0 6px 24px rgba(0,0,0,.2)}
  body.menu-open aside.side{transform:none}
  body.menu-open .scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:55}
  body.collapsed .side .txt{display:inline}
  body.collapsed .side .grp{font-size:11px;padding:14px 10px 4px;margin:0;border:0}
  body.collapsed .side a{justify-content:flex-start;padding:8px 10px}
  .side .foot{display:none}
  body.app.ask-on .ask{position:fixed;top:auto;right:10px;bottom:10px;height:auto;border:0;background:none;z-index:50}
  body.app.ask-on .ask-panel{width:min(420px,calc(100vw - 20px));max-height:75vh;border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.18)}
  body.app .wrap{padding-left:16px;padding-right:16px}
  .hsearch input,.hsearch input[type=search]{width:120px}
  .hide-sm{display:none}
}
/* Today: plain links to the main screens, no figures */
.jump{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.jump a{display:flex;align-items:center;gap:10px;padding:12px 14px;text-decoration:none;color:var(--text);font-weight:600}
.jump a:hover{border-color:var(--accent)}
.jump .ico{color:var(--accent)}
tr.hol td{color:var(--muted);background:var(--surface-2)}
.mswitch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px}
.mswitch .mtitle{margin:0;min-width:150px;text-align:center}
.arrow{width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:var(--surface);color:var(--text);display:inline-grid;place-items:center;font-size:18px;text-decoration:none}
.arrow:hover{border-color:var(--accent)}.arrow.off{opacity:.35}
table.days .tb{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
table.days a.btn{text-decoration:none}
tr.dstate-holiday td,tr.dstate-future td,tr.dstate-none td,tr.dstate-before td{color:var(--muted);background:var(--surface-2)}
table.days .prog{font-size:12.5px;margin-top:4px;display:flex;flex-direction:column;gap:2px}
details.resolve summary{list-style:none;cursor:pointer}details.resolve summary::-webkit-details-marker{display:none}
details.resolve[open]>summary{box-shadow:inset 0 0 0 1px var(--accent);background:var(--surface-2);margin-bottom:6px}
.rform{display:flex;flex-direction:column;gap:6px;min-width:260px}
.rform input[type=text]{width:100%}
.side .badge{margin-left:auto;min-width:18px;padding:0 5px;border-radius:9px;background:var(--warn-bg);color:var(--warn);font-size:11px;font-weight:700;text-align:center}
body.collapsed .side .badge{position:absolute;top:2px;right:6px;margin:0;min-width:16px;font-size:10px}
a.fbtn{text-decoration:none}
.nfu{display:flex;flex-direction:column;gap:10px}.nfu label{display:flex;flex-direction:column;gap:4px}
.nfu input[type=text]{width:100%}.nrow{display:flex;gap:12px;flex-wrap:wrap}
.fnote{border-left:2px solid var(--border);padding-left:8px;margin-top:4px}
.todo .tb details.resolve{position:relative}
a.btn{text-decoration:none}
details.ovadd{border-top:1px solid var(--border);padding:10px 0}details.ovadd:first-of-type{border-top:0}details.ovadd>summary{cursor:pointer;font-weight:600;color:var(--accent)}details.ovadd form{margin-top:10px}
.fugroup{margin-top:16px}.fghead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.fghead h3{margin:0;font-size:14px;font-weight:650}.fghead .bulk{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto;align-items:center}
.fghead .bulk input[type=text]{min-width:220px}.selall input,.fuck{width:16px;height:16px;margin-top:4px}
details.explain{margin-top:6px}details.explain>summary{cursor:pointer;color:var(--accent);font-size:13px}
details.explain .xp{background:var(--surface-2);border-radius:8px;padding:10px 12px;margin-top:6px;font-size:13px}
details.explain .xp p{margin:0 0 6px}details.explain .xp ul{margin:0 0 6px;padding-left:18px}
label.choice{display:flex;gap:8px;align-items:flex-start;font-size:13px;margin-bottom:4px}
.xwhat{margin-top:4px}.linkbtn{border:0;background:none;color:var(--accent);cursor:pointer;font:inherit;font-size:12.5px;padding:0;text-decoration:underline}
details.explain.about{margin:0 0 8px}

/* item actions: compact buttons, one panel under the item (Ben, 21 Oct) */
.todo .apanels{grid-column:2/-1}
.apanel{display:flex;flex-direction:column;gap:8px;margin-top:8px;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;max-width:640px}
.apanel[hidden]{display:none}
.apanel input[type=text]{width:100%}
.apanel .abtns{display:flex;gap:6px}
td .apanel{margin-top:6px}
.btn.on{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--accent)}
.btn.primary.on{background:var(--brand);border-color:var(--brand);color:var(--surface);box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--brand)}
@media (max-width:620px){.todo .apanels{grid-column:1/-1}}
.apanel .amts{display:flex;gap:16px;flex-wrap:wrap;font-size:13px}
.apanel .alloc{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2px 12px}
.apanel .sub{font-size:12.5px;font-weight:600}
.apanel .balance{font-size:12.5px;display:flex;gap:12px;align-items:center}
.apanel [data-left].ok{color:var(--ok)}.apanel [data-left].warn{color:var(--warn)}
.apanel table.jl{min-width:0}.apanel .parts-help summary{cursor:pointer}.apanel .parts-help ul{margin:4px 0 0 18px;padding:0}
.apanel .cf label{min-width:140px}
.apanel table.split tr.tot td{border-top:1px solid var(--border)}
.apanel .linkbtn.del{font-size:16px;line-height:1;color:var(--muted);padding:2px 6px;text-decoration:none}
.apanel .linkbtn.del:hover{color:var(--warn)}
.todo .td.state-action{color:var(--warn);font-weight:600}.todo .td.state-waiting{color:var(--info)}

/* sorting and filtering grid (grid.js) */
.gridwrap{max-height:72vh;overflow:auto}
table.grid thead th{position:sticky;z-index:1}
table.grid thead tr.gh th{top:0}
table.grid thead tr.gf th{padding:4px 6px;font-weight:400}
table.grid th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
table.grid th.sortable:hover{color:var(--text)}
table.grid th[data-dir]::after{content:" " attr(data-dir);color:var(--accent)}
table.grid tr.gf input,table.grid tr.gf select{width:100%;min-width:70px;font:inherit;font-size:12.5px;padding:4px 6px;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text)}
table.grid tfoot td{position:sticky;bottom:0;background:var(--surface-2)}
table.grid th.tick,table.grid td.tick{width:22px;min-width:0;padding-left:8px;padding-right:2px}
table.grid tr.gf th.tick input{width:auto;min-width:0}
table.grid[data-compact]{font-size:12.5px}
table.grid[data-compact] td{padding:6px 7px}
table.grid[data-compact] th{padding:8px 8px}
table.grid[data-compact] tr.gf input,table.grid[data-compact] tr.gf select{min-width:54px;font-size:12px}
.apanel.wide{max-width:none;padding:16px 18px;gap:12px}
.apanel.wide .nrow{gap:14px}
.apanel.wide .jl td,.apanel.wide .jl th{padding:7px 12px}
table.grid[data-compact] td{white-space:nowrap}
/* the tick column stays in view when a wide grid scrolls sideways */
table.grid td.tick{position:sticky;left:0;z-index:1;background:var(--surface)}
table.grid thead th.tick{left:0;z-index:3}
table.grid tfoot td:first-child{position:sticky;left:0;z-index:1}
table.grid td.tick,table.grid thead th.tick{box-shadow:-12px 0 0 var(--surface)}
table.grid thead th.tick{box-shadow:-12px 0 0 var(--surface-2)}
/* Income, Daily */
table.days tr.day[data-day]{cursor:pointer}
table.days tr.day[data-day]:hover td{background:var(--surface-2)}
table.days tr.day.open td{background:var(--surface-2)}
table.days tr.muted td{color:var(--muted)}
table.days .car{display:inline-block;width:12px;color:var(--muted);transition:transform .15s}
table.days tr.open .car{transform:rotate(90deg)}
table.days td.detail{background:var(--surface-2);padding:6px 14px 16px}
.dbox{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:12px 14px;margin-top:12px}
.dbox h4{margin:0 0 8px;font-size:13.5px}
.dgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:12px}
.dgrid .dbox{margin-top:12px}
.ditem{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;border-top:1px solid var(--border);padding:8px 0}
.ditem:first-of-type{border-top:0}
.ditem .t{flex:1;min-width:240px}
@media (max-width:1000px){.dgrid{grid-template-columns:1fr}}
/* Home (Ben, 24 Oct) */
.mhead{display:flex;align-items:center;justify-content:center;gap:18px;margin:14px 0 2px}
.mhead h2{margin:0;font-size:22px}
.mhead .marrow{color:var(--accent);text-decoration:none;font-size:14px;white-space:nowrap}
.mhead .marrow.off{visibility:hidden}.mhead .mclose{margin-left:auto}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 14px}
.badges form{display:inline}
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:5px 12px;font:inherit;font-size:13px;color:var(--text);text-decoration:none;cursor:pointer}
.badge b{font-variant-numeric:tabular-nums}
.badge.lvl-stop{border-color:#c0392b;color:#c0392b}
.badge.lvl-warn{border-color:var(--warn);color:var(--warn)}
.badge.lvl-ok{color:var(--ok)}
table.days .next{display:flex;align-items:center;gap:10px}
table.days .next .what{flex:1}
table.days .next form{margin:0}

.testbar{background:#b45309;color:#fff;font-weight:600;text-align:center;padding:6px 16px;font-size:.9rem}

/* Action panels (Ben, 26 Oct): full width under the item; each row's fields in aligned columns, label above input. */
.apanel{max-width:none}
.apanel .nrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 14px;align-items:end}
.apanel .nrow > label[style*="flex:1"]{grid-column:span 2}
@media (max-width:620px){.apanel .nrow > label[style*="flex:1"]{grid-column:auto}}
.apanel label.sub{display:flex;flex-direction:column;gap:4px;min-width:0}
.apanel label.sub > input:not([type=checkbox]):not([type=radio]),.apanel label.sub > select{width:100%;box-sizing:border-box;min-height:36px}
.apanel > label.sub > input:not([type=checkbox]):not([type=radio]){width:100%}
.apanel .cf label{min-width:0}
.apanel table.jl{width:100%}
.pick .pickhits{display:flex;flex-direction:column;gap:4px;margin-top:6px;max-height:260px;overflow:auto}
.pickhit{text-align:left;font:inherit;font-size:13px;padding:6px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);cursor:pointer}
.pickhit:hover{border-color:var(--accent,#1f3a63)}.pickhit.on{border-color:var(--ok);background:var(--surface-2)}
.pickhit span{color:var(--muted)}
.apanel .effect{border-top:1px dashed var(--border);padding-top:8px}
.apanel .effect tr.uw td{font-weight:600}
.apanel .effect .warnline{color:var(--warn);margin-top:4px}
/* Split parts (Ben, 27 Oct): find what the part is | amount | remove */
.spart{display:grid;grid-template-columns:minmax(0,1fr) 110px auto;gap:6px;align-items:start;margin-bottom:6px}
.spart .spick .pickhits{max-height:200px}.spart .schosen .pickhit{width:100%}
@media (max-width:640px){.spart{grid-template-columns:minmax(0,1fr) auto}.spart .spick,.spart .schosen{grid-column:1/-1}}

/* Compact actions (Ben, 27 Oct): small drop-downs instead of rows of buttons */
.in.sm{padding:3px 6px;font-size:13px;min-height:0;width:auto;max-width:100%}
.dsel .dbar{align-items:center;gap:10px;margin:2px 0 6px;flex-wrap:wrap}
.dsel .dbar .selall{display:flex;align-items:center;gap:4px}
.dsel td.tick{width:24px}
.dsel .dnote{display:block;margin-top:4px;width:170px}
.dmenu{position:relative;display:inline-block}
.dmenu>summary{list-style:none;cursor:pointer}
.dmenu>summary::-webkit-details-marker{display:none}
.dmenu-list{position:absolute;right:0;z-index:20;margin-top:4px;min-width:240px;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.12);padding:4px;display:flex;flex-direction:column}
.dmenu-list>button,.dmenu-list>a,.dmenu-list form>button{all:unset;display:block;padding:7px 10px;border-radius:6px;cursor:pointer;font-size:14px;color:inherit}
.dmenu-list>button:hover,.dmenu-list>a:hover,.dmenu-list form>button:hover{background:var(--surface-2)}
.dmenu-list form{margin:0}
.dmenu.left .dmenu-list{right:auto;left:0}
@media (max-width:640px){.dsel .dnote{width:100%}}
/* Policies grids (Ben, 27 Oct): one size for all, a narrow frozen tick column, and the Record selected bar */
.btn.sm{padding:4px 10px;font-size:13px}
.gact{align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0 6px;padding:6px 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2)}
.gact [data-gact-count]{min-width:110px}
.gact input[name=note]{width:220px}
table.grid[data-compact] th.tick,table.grid[data-compact] td.tick{width:18px;padding-left:6px;padding-right:2px}
table.grid[data-compact] td.tick input,table.grid[data-compact] th.tick input{width:14px;height:14px;margin:0}
table.grid td.tick input:disabled{opacity:.25}
@media (max-width:640px){.gact input[name=note]{width:100%}}

/* Receivable and the queues (Ben, 27-28 Oct): row next step, the line's card, notes and contacts (rowact.js) */
a.card.kpi{color:inherit;text-decoration:none}a.card.kpi:hover{border-color:var(--accent)}
/* row actions */
.btn.sm.qa{white-space:nowrap;padding:2px 9px;font-size:12px}
.btn.sm.qa.strong{border-color:var(--ok);color:var(--ok);background:var(--ok-bg)}
.btn.ghost{background:transparent;border-color:transparent;padding:2px 7px;font-weight:700}
.btn.ghost:hover{border-color:var(--border);background:var(--surface-2)}
td.nx{white-space:nowrap}
tr:has(td.isdone) td{color:var(--muted)}tr:has(td.isdone) td a{color:var(--muted)}
.donetxt{color:var(--ok);font-weight:600}
.lnk{background:none;border:0;color:var(--accent);cursor:pointer;padding:0;font:inherit;text-decoration:underline}
tbody tr[data-row]{cursor:default}
.raev{background:var(--surface-2);color:var(--muted);border-radius:6px;padding:5px 8px;font-size:12px;margin-bottom:6px}
.ralist{display:flex;flex-direction:column}
.raitem{display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:none;border:0;border-radius:6px;padding:5px 8px;cursor:pointer;color:var(--text);font:inherit}
.raitem:hover{background:var(--surface-2)}.raitem.sug{font-weight:600}.raitem .pill{display:inline;padding:0 6px;font-size:10.5px;margin-left:4px}
.raform label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted);margin:6px 0}
.raform .in{width:100%;box-sizing:border-box}.ratitle{font-weight:650;margin:2px 0 4px}
.rarc{border:1px solid var(--border);border-radius:6px;margin:6px 0;padding:4px 8px}.rarc legend{font-size:12px;color:var(--muted)}
.rarc label.rad{flex-direction:row;align-items:center;color:var(--text);margin:3px 0}
.rabtn{display:flex;gap:8px;margin-top:8px}.basis.warn{color:var(--warn)}
.ratoast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--text);color:var(--surface);padding:9px 16px;border-radius:8px;z-index:60;font-size:13px;max-width:90vw;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.ratoast .lnk{color:var(--surface);font-weight:600;margin-left:8px}
.raev.ok{background:var(--ok-bg);color:var(--ok)}
ol.tl{margin:0;padding-left:18px}ol.tl li{margin:2px 0}ol.tl .num{color:var(--muted);margin-right:6px}
.gextra{display:inline-flex;gap:6px}.gextra label{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--muted)}
.rafig{font-size:12px;color:var(--text);margin-top:2px}
table.figs{width:auto;min-width:220px;margin:0 0 8px;border-collapse:collapse}table.figs td{padding:2px 10px 2px 0;border:0;background:none}
table.figs tr.total td{border-top:1px solid var(--border)}
.ppeek{position:fixed;top:0;right:0;bottom:0;width:440px;max-width:100vw;z-index:70;background:var(--surface);border-left:1px solid var(--border);box-shadow:-10px 0 30px rgba(0,0,0,.18);overflow-y:auto;padding:16px 18px;box-sizing:border-box}
.ppeek h3{margin:0 0 2px;font-size:17px}.ppeek .sec{font-weight:650;margin:14px 0 4px;font-size:13px}
.ppeek table{width:100%;border-collapse:collapse;font-size:13px}.ppeek td{padding:3px 0;border-bottom:1px solid var(--border)}
.ppeek td.r{text-align:right}.ppeek .x{position:absolute;top:10px;right:12px}
.ppeek .figrow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.ppeek .figrow div{background:var(--surface-2);border-radius:8px;padding:8px}
.ppeek .figrow .l{font-size:11.5px;color:var(--muted)}.ppeek .figrow .v{font-weight:650;font-size:15px}
.ppeek .figrow .short .v{color:var(--warn)}.ppeek .figrow .over .v{color:var(--accent)}
.ppeek .foot{margin-top:16px;display:flex;justify-content:space-between;align-items:center}

/* the line's card */
.lcard{width:470px}
.lcnav{display:flex;align-items:center;gap:8px;margin:-4px 0 10px}.lcnav .basis{flex:1;text-align:center}
.lwhy{background:var(--surface-2);border-radius:8px;padding:8px 10px;font-size:13px}
.lrec{border:1px solid var(--accent);border-radius:10px;padding:10px 12px;margin:12px 0}.lrec.strong{border-color:var(--ok)}
.lrec.done{border-color:var(--ok);background:var(--ok-bg);color:var(--ok)}
.lrec p{margin:4px 0;font-size:13px}.lrec .pill{font-size:11px;padding:1px 8px}
.lacts{display:flex;flex-direction:column;gap:2px}.lact{border-radius:8px}.lact.open{background:var(--surface-2);padding-bottom:6px}
.lact .raitem{width:100%}.lact .raitem span:first-child{font-weight:600}.lact .raform{padding:0 8px}
.lpol summary{cursor:pointer}.lpol table{margin-bottom:8px}
tr.current td{background:var(--info-bg) !important}
/* notes button, card modes, conversation */
.nbtn{display:inline-flex;align-items:center;gap:2px;margin-left:3px;vertical-align:middle;background:none;border:1px solid transparent;border-radius:6px;padding:2px 5px;color:var(--muted);cursor:pointer;font:inherit;font-size:11.5px;opacity:.55}
.nbtn:hover{border-color:var(--border);opacity:1}.nbtn.has{opacity:1;color:var(--accent)}.nbtn.ask{color:var(--warn);background:var(--warn-bg);font-weight:700}
.cardmode{display:flex;align-items:center;gap:6px;margin:6px 0}
.lccols{display:block}
tr.lcrow>td{background:var(--surface-2) !important;padding:10px 12px !important;white-space:normal;border-left:3px solid var(--accent)}
tr.lcrow .lcbox{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:12px 14px;max-width:1100px}
tr.lcrow .lccols{display:grid;grid-template-columns:1.15fr 1fr;gap:22px}
tr.lcrow .lcnav{justify-content:flex-start}tr.lcrow .lcnav .basis{flex:0 0 auto;padding:0 8px}tr.lcrow .lcnav [data-cclose]{margin-left:auto}
tr.lcrow h3{margin:0 0 2px;font-size:16px}tr.lcrow .figrow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}
tr.lcrow .figrow>div{background:var(--surface-2);border-radius:8px;padding:8px}tr.lcrow .figrow .l{font-size:11.5px;color:var(--muted)}tr.lcrow .figrow .v{font-weight:650;font-size:15px}
tr.lcrow .figrow .short .v{color:var(--warn)}tr.lcrow .sec{font-weight:650;margin:12px 0 4px;font-size:13px}
tr.lcrow table{width:100%}tr.lcrow .foot{margin-top:10px;display:flex;justify-content:space-between}
.lnote textarea{width:100%;box-sizing:border-box;font:inherit;font-size:13px}.lnote .rabtn{justify-content:space-between;align-items:center;margin-top:4px}
ol.thread{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:13px}
ol.thread li{background:var(--surface-2);border-radius:8px;padding:6px 9px}ol.thread li.reply{margin-left:22px;background:var(--info-bg)}
ol.thread li.q{border-left:3px solid var(--warn)}ol.thread .who{font-size:12px}

.gridwrap.lcopen{max-height:none}tr.lcrow .lcbox{position:sticky;left:12px;box-sizing:border-box}
.btn.sm.qa{padding:2px 7px}
tr.lcrow .lcbox,tr.lcrow .lcbox *{white-space:normal}tr.lcrow .lccols{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.nbtn{padding:2px 3px}td.nx{padding-right:4px}

.omore{padding:0 6px;margin-left:2px;line-height:1.4}
td.ispend .pendtxt{color:var(--warn);font-weight:600}
.rexp{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 4px 22px}.rexp label{margin:0}

.cbtn{margin-left:2px}
table.contacts{width:100%;font-size:12.5px;margin-bottom:6px}table.contacts th{text-align:left;font-weight:600;padding:2px 6px 2px 0}
table.contacts td{padding:3px 6px 3px 0;vertical-align:top;border-bottom:1px solid var(--border)}
.nbtn{margin-left:1px;padding:2px 2px}.omore{padding:0 4px;margin-left:0}
/* Policy page (Ben, 28 Oct): title and its action on one line; the policy's facts in a row */
.phead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.pfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px 18px}
.pfacts .l{display:block;font-size:11.5px;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}

/* Feedback while the next page loads or an action runs (app.js, Ben 29 Oct) */
.busybar{position:fixed;top:0;left:0;height:3px;width:0;z-index:1000;background:var(--accent);opacity:0;transition:opacity .15s}
.busybar.on{opacity:1;animation:busybar 8s cubic-bezier(.1,.7,.2,1) forwards}
@keyframes busybar{0%{width:0}20%{width:45%}60%{width:75%}100%{width:92%}}
.busynote{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:1000;background:var(--surface);color:var(--text);
  border:1px solid var(--border);box-shadow:var(--shadow);border-radius:10px;padding:10px 16px;font-size:14px;display:none}
.busynote.on{display:block}