/* TaxApp — brand: navy #0A0F3C, orange #F9A11B->#F15A24, teal #2EE6C8->#1B75FF */
:root{
  --bg:#070C2B; --bg2:#0C1340; --card:#101A4E; --line:#1E2A66;
  --text:#EAF0FF; --text2:#93A0CF; --navy:#0A0F3C;
  --orange:#F9A11B; --orange2:#F15A24; --teal:#2EE6C8; --blue:#1B75FF;
  --ok:#2EE6A0; --warn:#F9A11B; --err:#FF5C7A;
  --accent:#01E9CF; /* v1.46: was referenced 26× but never defined (fell back to currentColor) */
  --hover:rgba(255,255,255,.05); --hover2:rgba(255,255,255,.08);
  --rowline:rgba(30,42,102,.5); --shadow:rgba(4,8,30,.6);
  --font:'Inter',system-ui,sans-serif; --r:14px;
}
/* ── v1.46 THEME: Light mode — same brand, designed surfaces (not an inversion) ── */
/* ── AURORA V3 CUTOVER (2026-08-09) scope 4: light-mode REDESIGN (L8 — a designed porcelain twin
   of the Aurora dark, not an invert and not the old washed-out v1.46 palette). Rationale in the
   brief results doc; token targets from MOCK-SKIN-1C body.light, pushed bolder where the mock's
   values washed out on real content: deeper layered canvas, real indigo-tinted borders, darker
   muted ink, ONE accent family (#5a49f0→#0993c9), mock status colors, confident shadows. ── */
[data-theme="light"]{
  --bg:#dee4f7; --bg2:#f6f8ff; --card:#FFFFFF; --line:#a3aee0;
  --text:#171c33; --text2:#4d5678;
  --teal:#0993c9; --blue:#5a49f0; --accent:#0993c9; /* the Aurora light family — cyan darkened for white, indigo focus rings */
  --hover:rgba(90,73,240,.06); --hover2:rgba(90,73,240,.11);
  --rowline:rgba(78,90,200,.28); --shadow:rgba(38,44,94,.16);
}
/* V3.2.1 QA POLISH item 8 (2026-08-10): --bg deepened (#e9edfb -> #dee4f7, matches aurora.css's
   body-gradient low stop) and --line darkened/saturated (#c9d2ef -> #a3aee0) — the pale original
   sat too close to --card (#FFFFFF) for a card edge to read at a glance on chat/clients/every
   other page still on this pre-Aurora skin (aurora.css's SCOPE LAW comment: non-dashboard pages
   "keep their current skin"). Same "separation over blending" instruction, applied to the other
   token system so the QB's before/after gate (dashboard AND chat) has real substance on both. */
[data-theme="light"] body{background:var(--bg)}
/* v1.47 light-mode QA (Jon): white-on-tint chat rows go navy */
[data-theme="light"] .chat-ch.on,[data-theme="light"] .chat-ch.unread .chlbl{color:var(--navy)}
/* AURORA V3 (2026-08-09): the v1.47.1 DARK RAIL is fully retired — aurora.css's
   [data-theme="light"] .sidebar porcelain re-declaration (L8) is the one light rail now. */
/* v1.47.1 light-mode FONT SWEEP (Jon: "check for ALL white fonts and light fonts") —
   every hardcoded white/pale color outside the dark rail gets a darkened light-mode twin */
[data-theme="light"]{--ok:#0b9e6c; --warn:#b06a00; --err:#d61f63} /* AURORA V3: mock status colors */
[data-theme="light"] .stat .n{background:linear-gradient(135deg,#171c33 30%,#3d4c8f);-webkit-background-clip:text;background-clip:text}
[data-theme="light"] .stat .n.teal{background:linear-gradient(135deg,#067a9a,#0993c9);-webkit-background-clip:text;background-clip:text}
[data-theme="light"] .stat .n.orange{background:linear-gradient(135deg,#b06a00,#d97706);-webkit-background-clip:text;background-clip:text}
[data-theme="light"] .bkc-cell.today .bkc-d{color:var(--text)}
[data-theme="light"] .chadd:hover{color:var(--text)}
[data-theme="light"] .cmsg .body a{color:#1B5FD0}
[data-theme="light"] .sres-body .hit{color:#067A6F}
[data-theme="light"] .mention{color:#A66203}
[data-theme="light"] .pill.info{color:#1B5FD0}
[data-theme="light"] .pill.purple{color:#8A3FD0}
[data-theme="light"] .pill.teal2{color:#067A6F}
[data-theme="light"] .nm0{color:#1273B8}[data-theme="light"] .nm1{color:#0E8F5F}[data-theme="light"] .nm2{color:#A66203}[data-theme="light"] .nm3{color:#8A3FD0}
[data-theme="light"] .nm4{color:#C2542B}[data-theme="light"] .nm5{color:#0B7F7A}[data-theme="light"] .nm6{color:#C23A78}[data-theme="light"] .nm7{color:#6B7A2E}
[data-theme="light"] .chsec[data-k="recent"]{color:#067A6F}
[data-theme="light"] .chsec[data-k="channels"]{color:#1B5FD0}
[data-theme="light"] .chsec[data-k="dms"]{color:#8A3FD0}
[data-theme="light"] .chsec[data-k="clients"]{color:#0E8F5F}
[data-theme="light"] .msg.user{background:linear-gradient(135deg,#E3EBFB,#EDF2FC)}
[data-theme="light"] .cmsg code{background:rgba(30,42,102,.08)}
[data-theme="light"] .bk-proposal.muted-p{background:rgba(30,42,102,.06)}
[data-theme="light"] tr:hover td{background:var(--hover)}
[data-theme="light"] .cmsg:hover{background:var(--hover)}
[data-theme="light"] .nd-row:hover{background:var(--hover)}
@media (hover:hover) and (pointer:fine){
[data-theme="light"] .scrolling::-webkit-scrollbar-thumb{background:rgba(122,138,185,.55)}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:rgba(122,138,185,.85)}
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:15px;min-height:100vh}
a{color:var(--teal);text-decoration:none}
button{font-family:var(--font);cursor:pointer}
input,select,textarea{font-family:var(--font);background:var(--bg2);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:10px 12px;font-size:14px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue)}
label{font-size:12.5px;color:var(--text2);font-weight:600;display:block;margin-bottom:5px}
.btn{border:none;border-radius:10px;padding:10px 18px;font-weight:700;font-size:14px;transition:.15s}
.btn-primary{background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff}
.btn-primary:hover{filter:brightness(1.1)}
/* v1.53: hero-gradient button (teal→blue, like the site heroes) — same scale as .btn-primary */
.btn-hero{background:linear-gradient(135deg,#01E9CF,#0080FB);color:#04123A;font-weight:800;box-shadow:0 6px 18px rgba(0,128,251,.35);transition:transform .15s, box-shadow .15s, filter .15s}
.btn-hero:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 10px 26px rgba(0,128,251,.5)}
.btn-hero:active{transform:translateY(0)}
.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal)}
.btn-sm{padding:6px 12px;font-size:12.5px}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* login */
#login{display:flex;align-items:center;justify-content:center;min-height:100vh;background:radial-gradient(80% 60% at 70% 10%,#122058 0%,var(--bg) 60%)}
.login-card{background:#fff;color:#111;border-radius:20px;padding:44px 40px;width:min(420px,92vw);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.login-card img{width:230px;display:block;margin:0 auto 26px}
.login-card label{color:#556}
.login-card input{background:#f4f6fb;border-color:#dde3f0;color:#111}
.login-note{font-size:12.5px;color:#889;margin-top:16px;text-align:center}
.err{color:var(--err);font-size:13px;margin-top:10px;min-height:18px}

/* shell */
#app{display:none;grid-template-columns:232px 1fr;min-height:100vh}
.sidebar{background:var(--bg2);border-right:1px solid var(--line);padding:22px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;color:var(--text)} /* v1.66: color re-evaluates the DARK-RAIL --text — without it, children with no explicit color rule INHERIT body's computed light-mode dark text onto the navy rail (status-menu bug, Kevin/Charlie meeting) */
.sidebar .brand{padding:2px 8px 24px}
.brand-firm{width:176px;display:block}
.sidebar .brand b{background:linear-gradient(135deg,var(--orange),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}
.nav-item{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:11px;color:var(--text2);font-weight:600;font-size:15.5px;border:none;background:none;width:100%;text-align:left;margin-bottom:4px;position:relative}
.nav-item:hover{color:var(--text);background:rgba(255,255,255,.04)}
.nav-item.active{color:#fff;background:linear-gradient(135deg,rgba(249,161,27,.16),rgba(27,117,255,.14));border:1px solid var(--line)}
.nav-item.active::before{content:"";position:absolute;left:-14px;top:20%;bottom:20%;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--orange),var(--teal))}
/* per-section icon colors — same family, different voices */
.nav-item[data-page="dashboard"] .nico{color:#4EA1FF}
.nav-item[data-page="clients"] .nico{color:#2EE6A0}
.nav-item[data-page="knowledge"] .nico{color:#F9A11B}
.nav-item[data-page="team"] .nico{color:#C77DFF}
.nav-item[data-page="billing"] .nico{color:#01E9CF}
.nav-item[data-page="audit"] .nico{color:#FF5C7A}
.nav-item.active .nico{filter:drop-shadow(0 0 7px currentColor)}
.sidebar .foot{margin-top:auto;padding:10px 8px;font-size:12px;color:var(--text2)}
.main{padding:30px 36px;max-width:1200px;width:100%}
.page{display:none}.page.active{display:block}
h1{font-size:24px;font-weight:800;margin-bottom:4px}
.sub{color:var(--text2);font-size:14px;margin-bottom:24px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.stat .n{font-size:30px;font-weight:800}
.stat .l{color:var(--text2);font-size:12.5px;font-weight:600;margin-top:2px}
.stat .n.teal{color:var(--teal)}.stat .n.orange{color:var(--orange)}
/* D2B (L3 NUMBER+DENOMINATOR+VERDICT, 2026-08-08): denominator text + verdict chip under a stat card's label */
.stat-sub{margin-top:6px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11px;color:var(--text2);font-weight:500}
table{width:100%;border-collapse:collapse}
th{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--text2);text-align:left;padding:9px 10px;border-bottom:1px solid var(--line)}
td{padding:10px;border-bottom:1px solid var(--rowline);font-size:13.5px;vertical-align:middle}
tr:hover td{background:rgba(255,255,255,.02)}
.pill{display:inline-block;padding:3px 10px;border-radius:99px;font-size:11.5px;font-weight:700}
.pill.ok{background:rgba(46,230,160,.14);color:var(--ok)}
.pill.warn{background:rgba(249,161,27,.14);color:var(--warn)}
.pill.info{background:rgba(27,117,255,.16);color:#7FB0FF}
.pill.muted{background:rgba(147,160,207,.12);color:var(--text2)}
.pill.err{background:rgba(255,92,122,.14);color:var(--err)}
.pill.purple{background:rgba(199,125,255,.14);color:#C77DFF}
.pill.teal2{background:rgba(1,233,207,.12);color:#01E9CF}

/* -- D1 WAVE-A (2026-08-08, L2): pill-styled inline-editable <select> (filing status, lead
   status). Real select semantics (click, keyboard, native dropdown) + .pill's shape/color. -- */
.pill-select{border:none;cursor:pointer;font-family:inherit;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:9px}
.pill-select:hover{filter:brightness(1.18)}
.pill-select:focus-visible{outline:2px solid var(--line);outline-offset:1px}
/* v3.6.9 PART B: scan-failure fix bundle (root cause unproven, ships all plausible causes —
   see BRIEF-FIX-BATCH-2026-08-15 Part B). Opaque white quiet zone, theme-proof (hardcoded #fff,
   not a themed var, so it can never go transparent/dark and swallow the module contrast), bigger
   render so phone cameras at arm's length resolve modules cleanly. Belt-and-suspenders with the
   index.html inline style on the same element — CSS survives even if that inline attr is ever
   touched elsewhere. */
#mfa-qr{background:#fff;padding:16px;border-radius:12px}
#mfa-qr svg,#mfa-qr img{width:280px;height:280px;display:block}
tr.rowlink{cursor:pointer}
tr.rowlink:hover td{background:rgba(27,117,255,.07)}
th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
th.sortable:hover{color:var(--text)}
.s-arrow{display:inline-block;width:14px;color:var(--accent);font-size:10px}
table.center-cols th:not(:first-child),table.center-cols td:not(:first-child){text-align:center}
table.center-cols .s-arrow{width:auto;position:absolute;margin-left:2px}
table.center-cols th.sortable{position:relative}
/* ── chat ── */
.nav-item[data-page="chat"] .nico{color:#01E9CF}
.nav-item[data-page="calendar"] .nico{color:#FFC302}
.nav-item[data-page="leads"] .nico{color:#F15A24}
/* v1.59 icon palette expansion — one hue per module, family colors */
.nav-item[data-page="documents"] .nico{color:#7FB8FF}
.nav-item[data-page="proposals"] .nico{color:#8CE99A}
.nav-item[data-page="extensions"] .nico{color:#FF8FA3}
.nav-item[data-page="sales"] .nico{color:#63E6BE}
.nav-item[data-page="marketing"] .nico{color:#FFA94D}
.nav-item[data-page="insights"] .nico{color:#B197FC}
.nav-item[data-page="reviews"] .nico{color:#FFD43B}
.nav-item[data-page="accounting"] .nico{color:#3BC9DB}
/* v1.61 NAV v3 — TaxDome grammar: parent rows w/ inline children on a rule line.
   v1.62 (Jon: "tiny dot practically invisible"): expander = obvious bordered + chip, rotates to × when open */
.nav-caret{margin-left:auto;flex:none;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;line-height:1;color:var(--text2);border:1px solid var(--line);border-radius:7px;background:var(--hover);transition:transform .15s, color .15s, border-color .15s}
.nav-caret:hover{color:var(--text);border-color:var(--accent)}
.nav-caret.open{transform:rotate(45deg);color:var(--accent);border-color:var(--accent)}
/* v1.62 parent icon colors (parents carry data-kids, not data-page) */
.nav-item[data-kids="clients"] .nico{color:#2EE6A0}
.nav-item[data-kids="tax"] .nico{color:#FFD43B}
.nav-item[data-kids="calendar"] .nico{color:#FFC302}
.nav-item[data-kids="sm"] .nico{color:#F15A24}
.nav-item[data-kids="settings"] .nico{color:#C77DFF}
.nav-item[data-kids="documents"] .nico{color:#7FB8FF}
.nav-item.nav-child{margin-left:34px;padding:0;font-size:13.5px;font-weight:500;color:var(--text2);border-left:2px solid var(--line);border-radius:0 8px 8px 0;display:flex;flex:none;max-height:44px;overflow:hidden;transition:max-height .18s ease,opacity .18s ease,margin-bottom .22s ease}
.nav-item.nav-child>.nc-inner{display:flex;align-items:center;gap:12px;padding:7px 12px 7px 15px;overflow:hidden;min-height:0}
.nav-item.nav-child:hover{color:var(--text)}
.nav-item.nav-child.active{color:var(--text)}
/* D1 WAVE-A (2026-08-08): was display:none (binary, no motion) -- now a pure-CSS grid-rows
   collapse (L4). QB HOTFIX 2026-08-08: grid-template-rows 0fr->1fr replaced with a max-height collapse + flex:none. Measured in prod: the sidebar is an overflowing flex column, so nav-child flex items were CRUSHED by flex-shrink (collapsed rows rendered as 14-31px slivers, and any child given overflow:hidden shrank to 0 even when open); separately a 0fr track floors at the item's min-content (the .nc-inner padding), so the collapse never reached 0. flex:none stops the crush (sidebar scrolls instead), max-height 44->0 gives a deterministic, interpolable collapse for uniform-height rows. .nc-inner (JS-wrapped, see wrapNavChildInner in app.js) carries the real
   padding/content so the outer row can animate height via grid-template-rows 1fr<->0fr. */
.nav-child.kid-hidden{max-height:0;opacity:0;margin-bottom:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.nav-item.nav-child{transition:none}}

/* D2B (2026-08-08, L4): engine-room widget accordion. This uses the ORIGINAL grid-template-rows
   QB HOTFIX 2026-08-08: converted to the max-height pattern — the 0fr->1fr grid trick is EMPIRICALLY BROKEN app-wide on this DOM (open track sizes to padding only; measured on sidebar #116, D3 dock menu, live). .eng-body was a plain
   block child of a CSS-grid .card, never a flex item, so it can't hit the sidebar's flex-crush bug
   (QB HOTFIX 2026-08-08, see the comment above) — that bug was specific to an overflowing flex
   column, not a property of grid-rows collapse itself. */
.eng-body{display:block;max-height:0;overflow:hidden;transition:max-height .2s ease}
.eng-body.open{max-height:700px;margin-top:12px}
.eng-inner{}
@media(prefers-reduced-motion:reduce){.eng-body{transition:none}}
.nav-divider{height:1px;background:var(--line);margin:9px 16px;opacity:.7}
/* v1.60 KevinAI side-panel — ✦ bubble + slide-out, page-context aware */
/* v1.76 (Jon): bubble BIGGER, panel smaller — floating card instead of full-height drawer */
#kev-bubble{display:none;position:fixed;bottom:24px;right:24px;z-index:900;width:64px;height:64px;border-radius:50%;align-items:center;justify-content:center;font-size:29px;color:#04123A;background:linear-gradient(135deg,#01E9CF,#0080FB);box-shadow:0 8px 26px rgba(0,128,251,.5);cursor:pointer;transition:transform .15s}
#kev-bubble:hover{transform:scale(1.08)}
#kev-panel{position:fixed;top:auto;right:24px;bottom:24px;z-index:901;width:min(92vw,420px);height:min(74vh,620px);background:var(--bg2);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 60px rgba(0,0,0,.45);display:flex;flex-direction:column;transform:translateX(115%);transition:transform .22s ease;overflow:hidden}
#kev-panel.open{transform:none}
.kp-head{display:flex;align-items:center;gap:9px;padding:13px 14px;border-bottom:1px solid var(--line)}
.kp-head #kp-ctx{flex:1;font-size:11px;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#kp-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;min-height:0}
#kp-msgs .msgrow{display:flex}
#kp-msgs .msgrow.user{justify-content:flex-end}
#kp-msgs .msg{max-width:88%;font-size:13px}
.kp-compose{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line)}
.kp-compose input{flex:1}
/* v1.59 update toast */
#upd-toast{display:none;position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:9999;background:linear-gradient(135deg,#01E9CF,#0080FB);color:#04123A;font-size:13.5px;font-weight:600;padding:10px 18px;border-radius:24px;box-shadow:0 8px 24px rgba(0,128,251,.45);cursor:pointer}
#upd-toast.on{display:block;animation:updpop .25s ease}
@keyframes updpop{from{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
/* D4 2026-08-06: subtle send confirmation pulse — button only, respects reduced-motion via
   the media query (no-op, not a JS branch) */
@media (prefers-reduced-motion: no-preference){
  #chat-send-btn.sendfly{animation:sendfly .15s ease}
}
@keyframes sendfly{0%{transform:scale(1)}50%{transform:scale(1.14)}100%{transform:scale(1)}}
.navbadge{margin-left:auto;background:#FF5C7A;color:#fff;border-radius:999px;font-size:10.5px;font-weight:800;line-height:1;padding:3px 7px;flex:none}
/* ═══ TEAM CHAT v2 — fixed box, internal scroll, readable + colorful ═══
   .tchat-wrap is chat's OWN wrapper — .chat-wrap belongs to KevinAI.
   min-height:0 everywhere = THE fix for whole-window scrolling (flex children
   default to min-height:auto and grow instead of scrolling internally). */
/* v1.39 fit-to-viewport: the chat PAGE is a flex column pinned to the viewport, the
   chat grid takes the leftover — compose bar always visible, zero page scroll (Jon) */
#page-chat.active{display:flex;flex-direction:column;height:calc(100vh - 60px);overflow:hidden}
#page-chat h1{flex:none}#page-chat .sub{flex:none;margin-bottom:14px}#page-chat #chat-search{flex:none}
.tchat-wrap{display:grid;grid-template-columns:var(--chside,300px) 6px 1fr;gap:10px;flex:1 1 auto;min-height:320px;height:auto} /* v1.45: wider sidebar (300 default), drag the divider to taste */
.chat-side{overflow-y:auto;min-height:0}
.chat-ch{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:10px;font-size:14px;color:var(--text2);cursor:pointer;margin-bottom:3px;transition:.12s}
.chat-ch:hover{background:var(--hover);color:var(--text)}
.chat-ch.on{background:linear-gradient(135deg,rgba(27,117,255,.22),rgba(46,230,200,.10));color:#fff;font-weight:700;box-shadow:inset 0 0 0 1px rgba(46,230,200,.25)}
.chat-main{display:flex;flex-direction:column;min-height:0;overflow:hidden}
#tc-msgs{flex:1;min-height:0;overflow-y:auto;padding:16px 8px;display:flex;flex-direction:column;gap:2px}/* v3: no smooth — open lands at bottom instantly */
.cmsg{display:flex;gap:12px;align-items:flex-start;padding:5px 10px;border-radius:12px;transition:background .12s;position:relative}
.cmsg:hover{background:rgba(255,255,255,.035)}
.cmsg.first{margin-top:14px}
.cmsg .avatar{width:38px;height:38px;flex:none;margin-top:2px}
.cmsg .avspace{width:38px;flex:none}
.cmsg .who{font-weight:800;font-size:14.5px;letter-spacing:.01em}
.cmsg .when{font-size:11px;color:#6B76AD;margin-left:9px;font-weight:500}
.cmsg .body{font-size:15px;line-height:1.55;color:var(--text);white-space:pre-wrap;word-break:break-word;margin-top:1px}
.cmsg .body a{color:#6FD6FF}
.cmsg img.chat-img{max-width:260px;max-height:200px;/* v3.6.15 Part L (Jon 08-22): smaller inline preview */border-radius:12px;border:1px solid var(--line);margin-top:6px;display:block;cursor:pointer}
.cmsg .chat-filelink{display:inline-flex;align-items:center;gap:8px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:8px 14px;margin-top:6px;font-size:13.5px;font-weight:600}
.day-div{display:flex;align-items:center;gap:12px;margin:20px 4px 6px;color:var(--text2);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.day-div::before,.day-div::after{content:"";flex:1;height:1px;background:var(--line)}
/* v1.54: feedback triage — handled messages strike through, action row under open ones */
.cmsg .body.struck{opacity:.45;text-decoration:line-through}
.fbact{display:flex;gap:6px;margin-top:7px;flex-wrap:wrap}
.fbdone{font-size:12px;color:var(--text2);margin-top:6px}
/* hover reactions + reaction chips */
.ract{position:absolute;top:-12px;right:14px;display:none;gap:2px;background:var(--card);border:1px solid var(--line);border-radius:99px;padding:3px 6px;box-shadow:0 6px 18px var(--shadow)}
.cmsg:hover .ract{display:inline-flex}
.ract button{background:none;border:none;font-size:15px;padding:2px 5px;border-radius:8px;transition:.1s}
.ract button:hover{background:var(--hover2);transform:scale(1.25)}
.rchips{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
.rchip{display:inline-flex;align-items:center;gap:5px;background:rgba(27,117,255,.12);border:1px solid rgba(27,117,255,.3);border-radius:99px;padding:2px 9px;font-size:12.5px;cursor:pointer;color:var(--text)}
.rchip.mine{background:rgba(46,230,200,.14);border-color:rgba(46,230,200,.4)}
.rchip:hover{filter:brightness(1.2)}
/* composer */
.chat-compose{display:flex;flex-wrap:wrap;gap:10px;padding-top:12px;border-top:1px solid var(--line)} /* v1.68.1: wrap so the reply chip gets its own row */
.chat-compose input{flex:1;font-size:15px;padding:12px 14px}
/* CH-12 2026-08-06: composer is now a textarea (was input) — auto-grow via JS sets inline
   height; this is the cap + baseline so it never grows unbounded or looks like a input on load */
.chat-compose textarea{flex:1;font-size:15px;padding:12px 14px;font-family:inherit;resize:none;line-height:1.4;height:44px;max-height:150px;overflow-y:hidden}
.chat-toolbar{display:flex;align-items:center;gap:6px;padding-top:8px}
.tbtn{background:transparent;border:1px solid var(--line);color:var(--text2);border-radius:9px;padding:5px 11px;font-size:12.5px;font-weight:700;transition:.12s}
.tbtn:hover{color:var(--teal);border-color:var(--teal)}
.tsep{width:1px;height:18px;background:var(--line);margin:0 4px}
.ebtn{background:none;border:none;font-size:17px;padding:2px 4px;border-radius:8px;transition:.1s}
.ebtn:hover{transform:scale(1.3)}
/* colored sender names (assigned by hash) */
.nm0{color:#6FD6FF}.nm1{color:#7EE8B2}.nm2{color:#FFC302}.nm3{color:#C99BFF}
.nm4{color:#FF9E7A}.nm5{color:#68E5E0}.nm6{color:#F492C4}.nm7{color:#B8C97E}
@media(max-width:800px){.tchat-wrap{grid-template-columns:1fr;height:auto}.chat-side{max-height:180px}}
/* ═══ CHAT v3 — DMs, unread, search, header, mentions ═══ */
#chat-search{width:100%;margin-bottom:12px;padding:10px 14px;font-size:13.5px}
#chat-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:800;font-size:16px;padding-bottom:12px;border-bottom:1px solid var(--line);min-height:38px}
.chh-l{display:flex;align-items:baseline;gap:10px;min-width:0}
.chh-title{font-weight:800;font-size:16px;white-space:nowrap}
.chh-desc{font-size:12.5px;font-weight:500;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chh-actions{display:flex;gap:6px;flex:none;align-items:center}
.chsec{display:flex;justify-content:space-between;align-items:center;margin:16px 4px 7px;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--text2)}
.chsec:first-child{margin-top:2px}
.chadd{background:none;border:1px solid var(--line);color:var(--text2);border-radius:7px;width:20px;height:20px;line-height:1;font-size:13px;cursor:pointer;transition:.12s}
.chadd:hover{color:#fff;border-color:var(--accent)}
.chat-ch .chlbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:700;font-size:14.5px;color:var(--text)} /* v1.46.1: Jon — names bold + bigger, easier to scan */
.chat-ch.unread{color:var(--text)}
.chat-ch.unread .chlbl{font-weight:800;color:#fff}
.udot{width:8px;height:8px;border-radius:50%;background:#01E9CF;flex:none;box-shadow:0 0 7px rgba(1,233,207,.8)}
.chhash{color:var(--text2);font-weight:800;width:14px;text-align:center}
.chat-ch .chat-av,.nd-row .chat-av{width:20px;height:20px}
.chavwrap{display:inline-flex;flex:none}
.chempty{font-size:12px;color:var(--text2);padding:4px 10px;line-height:1.5}
.unread-div{display:flex;align-items:center;gap:10px;margin:14px 4px 4px;color:#F86300;font-size:10.5px;font-weight:800;letter-spacing:.12em}
.unread-div::before,.unread-div::after{content:"";flex:1;height:1px;background:rgba(248,99,0,.55)}
.cmsg .who.dmable,.cmsg .avatar.dmable{cursor:pointer}
.cmsg .who.dmable:hover{text-decoration:underline}
.mention{background:rgba(255,195,2,.16);color:#FFC302;border-radius:5px;padding:0 4px;font-weight:700}
.cmsg.flash{background:rgba(1,233,207,.14);transition:background 1.2s}
.sres{padding:10px 14px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;cursor:pointer;transition:.12s}
.sres:hover{border-color:var(--accent);background:rgba(255,255,255,.03)}
.sres-top{font-size:11.5px;color:var(--text2);margin-bottom:3px;font-weight:700}
.sres-body{font-size:13.5px;line-height:1.5;word-break:break-word}
.sres-body .hit{color:#01E9CF}
.chat-main.dropover{outline:2px dashed #01E9CF;outline-offset:-8px}
.nd-row{display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:8px;cursor:pointer;font-size:14px}
/* v1.52.1 (Jon): sidebar avatars — DMs show the person, groups show a split pair */
.chat-ch .chavwrap.sb{width:20px;height:20px;flex:none;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(1,233,207,.25),rgba(0,128,251,.35));border:1px solid rgba(1,233,207,.3);position:static}
.chat-ch .chavwrap.sb img{width:100%;height:100%;object-fit:cover}
.chat-ch .chavwrap.sb .avatar-init{font-size:8.5px;font-weight:800}
.chsplit{display:inline-flex;flex:none;align-items:center}
.chsplit .chavwrap.sb:nth-child(2){margin-left:-9px;box-shadow:0 0 0 1.5px var(--bg2)}
/* v1.51: people-picker avatars were unconstrained raw <img> (Jon: "HUGE") — clamp to avatar size */
.nd-row .chavwrap{width:26px;height:26px;flex:none;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(1,233,207,.25),rgba(0,128,251,.35));border:1.5px solid rgba(1,233,207,.3)}
.nd-row .chavwrap img{width:100%;height:100%;object-fit:cover}
.nd-row .chavwrap .avatar-init{font-size:10px;font-weight:800}
.nd-row:hover{background:rgba(255,255,255,.04)}
.nd-row input[type=checkbox]{width:auto;flex:none;margin:0}
/* v1.52.1: clipped "What" text — CLICK toggles the full text inline (native title tooltips
   proved unreliable on re-rendered rows; click is instant and always works) */
.ai-what{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.ai-what.open{white-space:normal;overflow:visible;text-overflow:clip}
/* dashboard action items: ~13 rows visible, then internal scroll (sticky header) */
.ai-scroll{max-height:330px;overflow-y:auto} /* v1.49: Jon — ~8 rows then scroll */
.ai-scroll thead th{position:sticky;top:0;background:var(--card);z-index:2}
.ract{flex-wrap:wrap;max-width:340px;justify-content:flex-end}
/* ═══ BOOKING v2 — month calendar ═══ */
.bkc-head{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--text2);margin-bottom:6px;text-align:center}
.bkc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.bkc-cell{min-height:86px;border:1px solid var(--line);border-radius:10px;padding:6px;font-size:11.5px;overflow:hidden}
.bkc-cell.off{border:none;background:none}
.bkc-cell.today{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.bkc-d{font-weight:800;color:var(--text2);margin-bottom:4px}
.bkc-cell.today .bkc-d{color:#fff}
.bkc-item{border:1px solid var(--line);border-radius:6px;padding:2px 5px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:default;background:rgba(255,255,255,.03)}
.bkc-item.ctp{border:1px dashed rgba(126,140,255,.55);background:rgba(126,140,255,.08);color:var(--text2)} /* 08-19 SHIP 2: federal statutory deadlines — display-only */
@media(max-width:800px){.bkc-cell{min-height:56px}}

/* ── nav icons (flex-aligned: gap does the spacing, no margins) ── */
.nico{width:20px;height:20px;margin:0;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none} /* AURORA V3 scope 3: one stroke weight app-wide */
/* AURORA V3 scope 3: .wico = widget-title / inline-label Lucide glyph — same vendored set + license
   notice as .nico (see app.js ICONS). Sized for h3s/labels, currentColor so the text color carries. */
.wico{width:16px;height:16px;margin:0 4px -3px 0;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none;display:inline-block;vertical-align:-3px}
.nico-img{width:22px;height:22px;margin:0;flex:none;filter:drop-shadow(0 0 6px rgba(46,230,200,.35))}

/* -- D1 WAVE-A (2026-08-08): inline chrome icons -- buttons/headers/placeholders, Lucide-sourced
   same as .nico (see app.js ICONS notice for license). Sits mid-text via vertical-align, sized to
   the surrounding text rather than a fixed nav-row box. -- */
.ico-inline{width:1em;height:1em;margin:0 2px -2px 0;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-2px} /* AURORA V3: 1.75 everywhere */
.search-wrap{position:relative;display:block}
.search-wrap-ico{position:absolute;left:12px;top:50%;width:15px;height:15px;margin:0;transform:translateY(-50%);color:var(--text2);pointer-events:none}
.search-wrap-input.search-wrap-input{padding-left:34px}

/* ── sidebar footer ── */
.foot-user{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;margin-bottom:10px;cursor:pointer;padding:10px 8px;border-radius:11px;transition:.15s}
.foot-user:hover{background:var(--hover)}
.foot-user .avatar{width:44px;height:44px}
.nudge{display:flex;justify-content:center;font-size:11.5px;color:var(--orange);background:rgba(249,161,27,.1);border:1px solid rgba(249,161,27,.3);border-radius:99px;padding:6px 10px;margin-bottom:10px;cursor:pointer;transition:.15s}
.nudge:hover{background:rgba(249,161,27,.18)}
/* v1.33 — booking availability wizard day-pills + reschedule proposal banner */
.daypick{display:inline-flex;gap:6px;flex-wrap:wrap}
.daypick label{display:inline-flex;gap:5px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 11px;font-size:12.5px;cursor:pointer;user-select:none;transition:.13s}
.daypick label:hover{border-color:var(--accent)}
.daypick label:has(input:checked){border-color:var(--accent);color:var(--accent);background:rgba(46,230,200,.07)}
.daypick input{width:auto;margin:0;accent-color:var(--accent)}
.bk-proposal{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border:1px solid rgba(249,161,27,.5);background:rgba(249,161,27,.08);border-radius:11px;padding:10px 14px;font-size:13px;margin-bottom:12px}
.bk-proposal.muted-p{border-color:var(--line);background:rgba(30,42,102,.25)}
/* v1.39 chat wave — sidebar v2 + jump bubble + markdown-lite */
/* v1.45: markup order is now side → resizer → main; the old order:-1 hack retired */
.chsec{cursor:pointer;user-select:none}
.chsec .caret{width:14px;display:inline-block;color:var(--text2);font-size:10px}
/* v1.41.1: section headers = centered colored BUBBLES that stick while scrolling (Jon) */
/* v1.42.2: Jon saw centered, hated it — LEFT-aligned bubbles */
.chat-side .chsec{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:flex-start;gap:7px;margin:10px 0 5px;padding:9px 15px;border-radius:999px;font-size:13px;font-weight:900;letter-spacing:.07em;text-transform:uppercase} /* v1.52.1: Jon — darker, bigger, bolder */
.chsec .caret{position:static;color:inherit;opacity:.75}
.chsec .chadd{position:absolute;right:6px}
.chsec[data-k="recent"]{color:#01E9CF;background:linear-gradient(rgba(1,233,207,.22),rgba(1,233,207,.22)),var(--bg);border:1px solid rgba(1,233,207,.55)}
.chsec[data-k="channels"]{color:#4EA1FF;background:linear-gradient(rgba(78,161,255,.22),rgba(78,161,255,.22)),var(--bg);border:1px solid rgba(78,161,255,.55)}
.chsec[data-k="dms"]{color:#C77DFF;background:linear-gradient(rgba(199,125,255,.22),rgba(199,125,255,.22)),var(--bg);border:1px solid rgba(199,125,255,.55)}
.chsec[data-k="clients"]{color:#2EE6A0;background:linear-gradient(rgba(46,230,160,.22),rgba(46,230,160,.22)),var(--bg);border:1px solid rgba(46,230,160,.55)}
.chsec[data-k="favs"]{color:#FFC302;background:linear-gradient(rgba(255,195,2,.2),rgba(255,195,2,.2)),var(--bg);border:1px solid rgba(255,195,2,.5)}
[data-theme="light"] .chsec[data-k="recent"]{color:#067A6F}
[data-theme="light"] .chsec[data-k="channels"]{color:#1B5FD0}
[data-theme="light"] .chsec[data-k="dms"]{color:#8A3FD0}
[data-theme="light"] .chsec[data-k="clients"]{color:#0E8F5F}
[data-theme="light"] .chsec[data-k="favs"]{color:#A66203}
.chat-ch.rec{align-items:center}
/* v1.40 glitch fix: long channel names (velocity-tax-group-internal) must CLIP in
   Recent rows, not overlap the timestamp — block + hidden overflow inside the flex col */
.chat-ch.rec .chlbl{display:block;flex:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-ch .chprev{display:block;font-size:10.5px;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}
.chat-ch .chwhen{font-size:10px;color:var(--text2);flex:none;margin-left:4px}
.chat-main{position:relative}
#jump-bottom{position:absolute;right:16px;bottom:104px;z-index:6;display:flex;gap:6px;align-items:center;border:none;border-radius:999px;padding:9px 14px;font-weight:800;font-size:13px;cursor:pointer;background:linear-gradient(135deg,#01E9CF,#0080FB);color:#04123a;box-shadow:0 6px 18px rgba(0,128,251,.4)}
#jump-bottom:hover{filter:brightness(1.08)}
#jb-count{background:#FF5C7A;color:#fff;border-radius:999px;font-size:10.5px;padding:2px 7px}
.cmsg code{background:rgba(30,42,102,.55);border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px}
/* v1.40: your Google Calendar events on the 📆 bookings calendar */
.bkc-item.gcal{background:rgba(199,125,255,.1);border:1px solid rgba(199,125,255,.35);color:#C77DFF}
/* v1.40: Slack-style compact reaction bar + collapsed composer emoji row */
.ract .ract-more{display:none;gap:2px}
.ract.open .ract-more{display:inline-flex}
.ract-plus{color:var(--text2);font-weight:800}
#emoji-row .erow-more{display:none;gap:2px}
#emoji-row.open .erow-more{display:inline-flex}
/* v1.41 — setup wizard dots + spotlight tour (v1.41.1: 4-panel mask, gradient ring, glow) */
.sudot{width:9px;height:9px;border-radius:50%;background:var(--line)}
.sudot.on{background:var(--accent)}
.sudot.done{background:rgba(46,230,200,.45)}
.tour-mask{position:fixed;z-index:2000;background:rgba(3,7,26,.84);backdrop-filter:blur(1.5px);transition:all .3s ease;cursor:pointer}
#tour-hl{position:fixed;z-index:2001;border-radius:16px;pointer-events:none;border:2.5px solid transparent;background:linear-gradient(135deg,#01E9CF,#0080FB) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;box-shadow:0 0 34px rgba(1,233,207,.45);transition:all .3s ease;animation:tourpulse 1.8s ease-in-out infinite}
@keyframes tourpulse{0%,100%{box-shadow:0 0 22px rgba(1,233,207,.35)}50%{box-shadow:0 0 44px rgba(0,128,251,.6)}}
#tour-tip{position:fixed;z-index:2002;width:356px;max-width:92vw;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:0 18px 16px;box-shadow:0 18px 50px rgba(3,7,26,.7);overflow:hidden;transition:all .3s ease}
#tour-tip .tt-bar{height:4px;margin:0 -18px 14px;background:linear-gradient(90deg,#01E9CF,#0080FB,#F9A11B,#F15A24)}
#tour-tip b{font-size:15.5px}
#tour-tip p{font-size:13px;color:var(--text2);line-height:1.6;margin:8px 0 14px}
#tour-tip .tt-dots{display:inline-flex;gap:5px}
/* v1.45: Jon — text flush LEFT everywhere in the chat sidebar (icon slots removed);
   Notes-to-self pinned row; drag-to-resize divider; user block moved to sidebar TOP */
.chat-ch .chlbl{text-align:left}
.selfnote{border:1px dashed var(--line);margin:2px 0 8px}
.selfnote:hover{border-color:var(--accent)}
#ch-resizer{cursor:col-resize;border-radius:3px;transition:.15s}
#ch-resizer:hover,#ch-resizer:active{background:linear-gradient(180deg,#01E9CF,#0080FB)}
.sidebar{overflow-y:auto} /* v1.45: HR tab pushed the foot below the fold — sidebar scrolls now */
#side-top .foot-user{margin-bottom:2px;padding:6px 8px}
#side-top .mystatus{margin-bottom:10px}
#page-accounting .card{overflow-x:auto} /* v1.45: wide run tables scroll in-card, not off-page */
/* v1.42 — presence dots, status picker, @mention pop, notes/favorites */
.pdot{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none;border:1.5px solid var(--card)}
.pdot.on{background:#2EE6A0}.pdot.busy{background:#FF5C7A}.pdot.ooo{background:#F9A11B}.pdot.off{background:#5a6285}
.chavwrap{position:relative;display:inline-flex}
.chavwrap .pdot{position:absolute;right:-2px;bottom:-2px}
.mystatus{display:flex;justify-content:center;align-items:center;gap:6px;font-size:11.5px;color:var(--text2);cursor:pointer;padding:4px 10px;border-radius:99px;margin-bottom:8px}
.mystatus:hover{background:var(--hover)}
#status-menu{position:absolute;top:100%;left:0;right:0;z-index:60;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 10px 30px var(--shadow)} /* v1.45: anchored under the top user block */
#status-menu .mopt,#mention-pop .mopt{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;font-size:13px;cursor:pointer}
#status-menu .mopt:hover,#mention-pop .mopt:hover{background:var(--hover2)}
#mention-pop{position:absolute;bottom:100%;left:0;margin-bottom:6px;min-width:240px;z-index:40;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 10px 30px var(--shadow)}
#mention-pop .avatar{width:22px;height:22px}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start;max-width:1100px}
@media(max-width:1000px){.pf-grid{grid-template-columns:1fr}}
.powered{display:flex;flex-direction:column;align-items:center;gap:3px;margin-top:14px;opacity:.9}
.powered-label{font-size:10px;color:var(--text2);letter-spacing:.6px;text-transform:uppercase}
.ver{font-size:10px;color:var(--text2);opacity:.65;margin-top:2px}
.lockup-md{font-size:31px} /* v1.51: Jon — bigger still */
.lockup-md .lockup-x{width:17px;height:17px;margin:0 1px 3px 1px}

/* ── D1 lockup: ta[x]app in Space Grotesk, hand-kerned ── */
.lockup{display:inline-flex;align-items:baseline;font-family:'Space Grotesk',Inter,sans-serif;color:var(--text);letter-spacing:-.03em;line-height:1}
.lockup b{font-weight:700}
.lockup span{font-weight:400}
.lockup .lockup-x{flex:none;align-self:flex-end}
.lockup-lg{font-size:44px}
.lockup-lg .lockup-x{width:23px;height:23px;margin:0 1px 4px 2px}
.lockup-sm{font-size:14px;color:var(--text)}
.lockup-sm .lockup-x{width:8px;height:8px;margin:0 .5px 2px .5px}
@media(max-width:1100px){.dash2{grid-template-columns:1fr !important}}
.foot-role{font-size:11px;color:var(--text2);text-transform:capitalize}
.avatar{width:38px;height:38px;border-radius:50%;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(1,233,207,.25),rgba(0,128,251,.35));border:2px solid rgba(1,233,207,.35);cursor:pointer;transition:.15s}
.avatar:hover{border-color:var(--accent);box-shadow:0 0 12px rgba(1,233,207,.25)}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar-init{font-size:13px;font-weight:800;color:var(--text);letter-spacing:.5px}
.avatar-lg{width:72px;height:72px;cursor:default}
.avatar-lg .avatar-init{font-size:22px}
.foot-btns{display:flex;gap:8px;margin-bottom:12px}
.pillbtn{flex:1;padding:7px 10px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text2);font-size:12px;font-weight:700;cursor:pointer;transition:.15s;font-family:inherit}
.pillbtn:hover{color:var(--text);border-color:var(--accent);background:rgba(1,233,207,.06)}
.foot-links{display:flex;gap:7px;align-items:center;justify-content:center;white-space:nowrap;font-size:11.5px}
.foot-links a{color:var(--text2);text-decoration:none;position:relative}
.foot-links a:hover{color:var(--accent)}
.foot-links span{color:var(--line)}
/* v1.53.2: old ::after tooltips clipped by the sidebar's overflow (Jon screenshot) — footer
   data-tips now ride the global #tt layer (position:fixed, never clipped) */

/* ── chat avatars ── */
.msgrow{display:flex;gap:8px;align-items:flex-end;margin-bottom:10px}
.msgrow.user{justify-content:flex-end}
.msgrow .msg{margin-bottom:0}
.chat-av{width:28px;height:28px;border-radius:50%;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(1,233,207,.25),rgba(0,128,251,.35));border:1.5px solid rgba(1,233,207,.3)}
.chat-av img{width:100%;height:100%;object-fit:cover}
/* v1.37: bots are rounded squares, humans are circles (the Slack pattern) — the tile
   is an app icon; circling it clipped its corners and looked broken (Jon) */
.chat-av.bot{background:transparent;padding:0;border:none;border-radius:8px}
.chat-av.bot img{object-fit:contain;border-radius:8px}
.chat-av .avatar-init{font-size:10.5px;font-weight:800;color:var(--text)}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.toolbar input{max-width:280px}
.drop{border:2px dashed var(--line);border-radius:var(--r);padding:34px;text-align:center;color:var(--text2);transition:.15s;margin-bottom:16px}
.drop.over{border-color:var(--teal);color:var(--teal);background:rgba(46,230,200,.05)}
.modal-bg{display:none;position:fixed;inset:0;background:rgba(4,7,24,.72);z-index:50;align-items:center;justify-content:center}
.modal-bg.open{display:flex}
.modal{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px;width:min(480px,94vw);max-height:90vh;overflow:auto}
.modal h3{margin-bottom:16px}
.frow{margin-bottom:13px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* kevin chat */
.chat-wrap{display:grid;grid-template-columns:1fr 320px;gap:16px}
.chat{display:flex;flex-direction:column;height:calc(100vh - 210px);min-height:420px}
.chat .msgs{flex:1;overflow-y:auto;padding:6px 2px;display:flex;flex-direction:column;gap:12px}
.msg{max-width:85%;padding:12px 15px;border-radius:14px;font-size:14px;line-height:1.55;white-space:pre-wrap}
.msg.user{align-self:flex-end;background:linear-gradient(135deg,#173070,#12245c);border:1px solid var(--line)}
.msg.kevin{align-self:flex-start;background:var(--bg2);border:1px solid var(--line)}
.msg.kevin .src{margin-top:8px;font-size:11.5px;color:var(--text2)}
.chat .compose{display:flex;gap:10px;padding-top:12px}
.kb-item{padding:11px 0;border-bottom:1px solid var(--rowline)}
.kb-item b{font-size:13.5px}.kb-item .meta{font-size:11.5px;color:var(--text2);margin-top:2px}
.banner{background:rgba(249,161,27,.1);border:1px solid rgba(249,161,27,.35);color:var(--warn);border-radius:10px;padding:10px 14px;font-size:13px;font-weight:600;margin-bottom:18px}
.crumb{font-size:13px;color:var(--text2);margin-bottom:10px;cursor:pointer}
.crumb:hover{color:var(--teal)}
.spin{display:inline-block;width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--teal);border-radius:50%;animation:sp .7s linear infinite;vertical-align:-2px}
@keyframes sp{to{transform:rotate(360deg)}}
@media(max-width:900px){.grid4{grid-template-columns:1fr 1fr}.chat-wrap{grid-template-columns:1fr}.main{padding:20px}} /* v1.79: sidebar-as-horizontal-strip RETIRED (unusable on phones, Jon field test) — the mobile shell lives in the v1.79 block at end of file */

/* ═══ v1.3 visual polish — lightboxes, glow, motion ═══ */
body{background:radial-gradient(90% 70% at 80% -10%,#101d55 0%,var(--bg) 55%),var(--bg)}
.card{transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.card:hover{transform:translateY(-2px);border-color:#2a3a7e;box-shadow:0 12px 34px rgba(4,8,30,.45)}
.glow-accent{border-color:rgba(249,161,27,.45);box-shadow:0 0 0 1px rgba(249,161,27,.15), 0 10px 30px rgba(249,161,27,.07)}
.stat .n{background:linear-gradient(135deg,#fff 30%,#9fb4ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .n.teal{background:linear-gradient(135deg,var(--teal),#7FE7FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .n.orange{background:linear-gradient(135deg,var(--orange),#FFD37F);-webkit-background-clip:text;background-clip:text;color:transparent}
.btn-primary{box-shadow:0 6px 18px rgba(241,90,36,.35);transition:transform .15s, box-shadow .15s, filter .15s}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(241,90,36,.5)}
.btn-primary:active{transform:translateY(0)}
.nav-item{transition:all .15s}
.nav-item.active{box-shadow:inset 0 0 0 1px rgba(46,230,200,.18), 0 4px 14px rgba(4,8,30,.4)}
tr{transition:background .12s}
tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 var(--teal)}
.pill.ok{box-shadow:0 0 12px rgba(46,230,160,.15)}
.pill.warn{box-shadow:0 0 12px rgba(249,161,27,.15)}
.modal-bg{backdrop-filter:blur(6px)}
.modal-bg.open .modal, .modal-bg.open .lightbox{animation:pop .22s cubic-bezier(.2,.9,.3,1.2)}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.drop{background:linear-gradient(180deg,rgba(27,117,255,.04),transparent)}
.drop:hover{border-color:var(--blue);color:var(--text)}
.msg.kevin{border-left:2px solid var(--teal)}
.msg.user{border-right:2px solid var(--orange)}
.chat .compose input:focus{box-shadow:0 0 0 3px rgba(27,117,255,.18)}
/* document lightbox */
.lightbox{background:var(--card);border:1px solid var(--line);border-radius:16px;width:min(980px,96vw);height:min(86vh,900px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 40px 100px rgba(0,0,0,.6)}
.lightbox-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-bottom:1px solid var(--line)}
.lightbox iframe{flex:1;border:none;background:#fff}
/* v1.49: scrollbars invisible when idle (Jon) — thumb fades in WHILE scrolling (.scrolling
   toggled by a global listener in app.js, macOS-overlay feel) and under the cursor */
@media (hover:hover) and (pointer:fine){
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-corner{background:transparent}
::-webkit-scrollbar-thumb{background:transparent;border-radius:99px}
.scrolling::-webkit-scrollbar-thumb{background:rgba(94,110,170,.5)}
::-webkit-scrollbar-thumb:hover{background:rgba(94,110,170,.8)}
}
@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:rgba(94,110,170,.4) transparent}}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px rgba(27,117,255,.14)}
h1{letter-spacing:-.02em}
.sidebar .brand img{filter:drop-shadow(0 2px 8px rgba(46,230,200,.25))}

/* ═══ Accounting v1.43 ═══ */
.ac-prog{width:110px;height:7px;background:rgba(147,160,207,.18);border-radius:99px;display:inline-block;vertical-align:middle;margin-right:8px;overflow:hidden}
.ac-prog-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),#01E9CF)}
.ac-locked{opacity:.45}
.ac-late td{background:rgba(255,92,122,.05)}
.ac-latecell{color:var(--err);font-weight:700}
.ac-sel{width:auto;max-width:150px;padding:4px 8px;font-size:12px}
.ac-note{width:auto;min-width:120px;max-width:260px;display:block;margin-top:4px;padding:3px 8px;font-size:11.5px;background:transparent;border:1px solid transparent;color:var(--text2)}

/* ═══ D2A (2026-08-08, L1/L2/L4/L8): Cockpit calm-density + morphing toolbar dock. Visual/
   density only -- reuses D1's max-height accordion mechanics (not grid-template-rows 0fr,
   which floors at min-content -- see the D1 QB hotfix comment on .nav-child above) instead
   of inventing new motion. Both themes ride the existing --bg2/--line/--text2/--accent tokens,
   so light mode gets the same airy hairline-grid treatment (L8) with zero extra overrides. ═══ */
#page-accounting .dock{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px}
#page-accounting .dock-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--hover);color:var(--text2);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer;transition:color .15s,border-color .15s,background .15s;flex:none}
#page-accounting .dock-pill:hover{color:var(--text);border-color:var(--accent);background:var(--bg2)}
#page-accounting .dock-pill .dock-caret{display:inline-block;transition:transform .18s ease;font-size:14px;line-height:1}
#page-accounting .dock.open .dock-pill .dock-caret{transform:rotate(45deg)}
#page-accounting .dock-hint{font-size:11px;color:var(--text2);background:var(--bg2);border:1px dashed var(--line);border-radius:8px;padding:5px 10px;flex:none}
#page-accounting .dock-hint button{background:none;border:none;color:var(--text2);cursor:pointer;text-decoration:underline;font-size:11px;padding:0;margin-left:4px}
#page-accounting .dock-body{flex-basis:100%;max-height:0;overflow:hidden;opacity:0;transition:max-height .2s ease,opacity .18s ease,margin-top .2s ease}
#page-accounting .dock.open .dock-body{max-height:600px;opacity:1;margin-top:2px}
#page-accounting .dock-body-inner{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:10px;border-top:1px solid var(--line)}
@media(prefers-reduced-motion:reduce){#page-accounting .dock-body,#page-accounting .dock-pill .dock-caret{transition:none}}

/* calm-density: tighter row rhythm + quieter hover for the Cockpit's own tables only (scoped
   to #page-accounting -- the bare table/th/td rule above is untouched, so D2B's dashboard/
   Costs/engine-room tables and D3's client-page tables are unaffected). */
#page-accounting th{padding:7px 10px}
#page-accounting td{padding:7px 10px}
#page-accounting tr:hover td{background:rgba(255,255,255,.025)}
[data-theme="light"] #page-accounting tr:hover td{background:rgba(10,15,60,.03)}
#page-accounting table.center-cols td.num,#page-accounting table.center-cols th.num{text-align:right}

/* L2: delta/status cells that used to be bare colored text (.ac-latecell applied to the <td>
   itself) are now a chip on the value (see app.js call sites) -- .ac-latecell rule above is
   left in place, harmless, no longer referenced from JS after this diff. */
.ac-note:hover,.ac-note:focus{border-color:rgba(147,160,207,.3);background:rgba(147,160,207,.06)}
.ac-params{padding:12px 16px;font-size:12.5px;color:var(--text2);margin-bottom:14px;line-height:1.55}
.ac-params b{color:var(--text)}

/* v1.53.1: instant tooltip layer (replaces slow native titles app-wide) */
#tt{position:fixed;z-index:5000;display:none;background:#1A2150;color:#EAF0FF;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:12px;max-width:280px;line-height:1.45;pointer-events:none;box-shadow:0 8px 22px var(--shadow)}
/* v1.67 quote-reply */
.cquote{border-left:3px solid var(--accent);background:var(--hover);border-radius:0 8px 8px 0;padding:4px 10px;margin:2px 0 4px;font-size:12.5px;color:var(--text2);cursor:pointer;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cquote:hover{background:var(--hover2)}
.cquote b{color:var(--text)}
#reply-chip{flex-basis:100%;display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:10px;background:var(--hover);border:1px solid var(--line);font-size:12.5px;color:var(--text2)} /* v1.68.1: full row ABOVE the input, not beside it (Jon screenshot) */
#reply-chip b{color:var(--text)}
#reply-chip button{background:none;border:none;color:var(--text2);cursor:pointer;font-size:13px;padding:0 2px}
#reply-chip button:hover{color:var(--text)}
/* CH-2: composer file staging strip (own row above the input, like the reply chip) */
#chat-staged{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px;padding:8px 6px 2px}
.cs-chip{display:inline-flex;align-items:center;gap:6px;max-width:220px;padding:4px 6px;background:var(--bg2);border:1px solid var(--line);border-radius:10px}
.cs-chip img{width:34px;height:34px;object-fit:cover;border-radius:7px;flex:0 0 auto}
.cs-doc{font-size:20px}
.cs-name{font-size:12px;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-x{border:0;background:transparent;color:var(--text2);cursor:pointer;font-size:13px;line-height:1;padding:2px 4px;border-radius:6px}
.cs-x:hover{background:var(--hover2);color:var(--text)}
/* v1.69 🎤 voice input */
.mic-btn.rec{background:var(--err) !important;color:#fff !important;animation:micpulse 1.1s ease-in-out infinite}
@keyframes micpulse{0%,100%{opacity:1}50%{opacity:.55}}
[data-theme="light"] #tt{background:#0C1340}
/* v1.53.1: dashboard edit mode — drag, remove, add */
#dash-widgets.editing>[data-widget]{outline:2px dashed rgba(94,110,170,.55);outline-offset:-2px;cursor:grab;position:relative}
#dash-widgets.editing>[data-widget]:active{cursor:grabbing}
.dw-x{position:absolute;top:8px;right:8px;z-index:5;background:var(--card);border:1px solid var(--line);color:var(--err);border-radius:99px;width:26px;height:26px;font-weight:800;cursor:pointer;line-height:1}
.dw-x:hover{border-color:var(--err)}
#dw-add{border:2px dashed var(--line);background:transparent}

/* ═══ v1.48 persona dashboards: widget grid ═══ */
#dash-widgets{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
#dash-widgets>.dw-full{grid-column:1/-1}
#dash-widgets>.grid4{margin-bottom:0}
.dw-off{display:none !important}
@media(max-width:1100px){#dash-widgets{grid-template-columns:1fr}}

/* ═══ v1.44: HR + nav prefs + chat left/full-width ═══ */
.np-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;background:rgba(255,255,255,.02)}
/* Jon: chat felt like a centered floating box on wide monitors — chat + accounting use the full width now */
.main:has(#page-chat.active),.main:has(#page-accounting.active){max-width:none}
/* BK-10 (Charlie, channel 7/15): "Calendar pane uses far less desktop space than chat." Scoped to
   the calendar sub-view specifically (body.bk-cal-open, set by setBookingCal()) rather than the
   whole Bookings page via :has() like Chat/Accounting — the List view is a 5-column table that
   hasn't been rendered-checked at full width and risks looking sparse/broken; not gambling on it
   unverified. Not rendered this session either (no browser tool available) — owed: a live
   screenshot of the calendar at >1200px before/after. */
body.bk-cal-open .main{max-width:none}
/* Jon: "left align it all" — date/unread dividers hug left instead of centering */
.day-div{justify-content:flex-start}
.day-div::before{display:none}
.day-div::after{flex:1}

/* ═══ v1.56: offboard stepper — question wizard, no checkbox grid ═══ */
.fw-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:3px 10px;border-radius:20px;background:var(--hover);border:1px solid var(--line);margin:4px 5px 0 0;color:var(--text)}
.fw-row{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;background:var(--hover);font-size:13px;line-height:1.45}
.fw-row.off{opacity:.45}
.fw-row .fw-skip{margin-left:auto;flex:none;font-size:11.5px;color:var(--text2);cursor:pointer;text-decoration:underline;padding-top:1px}
.fw-opt{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px;cursor:pointer;background:var(--hover);transition:border-color .12s, box-shadow .12s}
.fw-opt.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.fw-opt input{width:auto;margin-top:3px;accent-color:var(--accent)}
/* ═══ v1.76 NOTIFICATIONS WAVE — in-app banners + prefs card ═══ */
#banner-host{position:fixed;top:16px;right:16px;z-index:9998;display:flex;flex-direction:column;gap:9px;width:min(92vw,340px)}
.nbanner{background:var(--bg2);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:12px;padding:11px 14px;box-shadow:0 10px 32px rgba(0,0,0,.4);cursor:pointer;animation:nbin .22s ease}
.nbanner:hover{border-color:var(--accent)}
.nbanner.out{opacity:0;transform:translateX(12px);transition:.35s}
.nbanner .nb-t{font-weight:700;font-size:13.5px;margin-bottom:2px;color:var(--text)}
.nbanner .nb-b{font-size:12.5px;color:var(--text2);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
@keyframes nbin{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
.np-row{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:13.5px;color:var(--text)}
.np-row input[type=checkbox]{width:auto;accent-color:var(--accent)}
/* ═══ v1.77 POP-OUT WINDOWS — chat only, nothing else (Jon) ═══
   v1.77.2 (Jon): whitespace purge — page header row GONE in pop-outs (big Create-new + a
   pointless ⧉ were holding the top open); compact ＋ New lives in the slim bar instead. */
html.popout .sidebar{display:none!important}
html.popout #au-head,html.popout #wf-bar,html.popout #wf-peek{display:none!important} /* QA-2026-08-19 #6: chrome-less means the header + tab strip too */
html.popout #app{grid-template-columns:1fr}
html.popout .main{padding:12px 16px;max-width:none}
html.popout #kev-bubble,html.popout #kev-panel,html.popout #banner-host{display:none!important}
html.popout #page-chat.active{height:calc(100vh - 24px)}
html.popout #page-chat h1,html.popout #page-chat .sub{display:none}
html.popout .chat-topbar{display:none!important}
html.popout #chat-search{margin-bottom:8px}
#popout-bar{display:none;align-items:center;gap:8px;padding:2px 2px 8px;font-weight:800;font-size:15.5px}
#popout-bar .po-new{margin-left:auto}
#popout-bar .po-x{font-size:15px;line-height:1}
html.popout #popout-bar{display:flex}
html.popout-single #chat-search,html.popout-single .chat-topbar,html.popout-single .po-new{display:none!important}
html.popout-single .po-x{margin-left:auto}
html.popout-single .tchat-wrap{grid-template-columns:1fr}
html.popout-single .chat-side,html.popout-single #ch-resizer{display:none!important}

/* BK-9 2026-08-06: chrome-less Bookings/Calendar pop-out (?popout=calendar) — same base rules
   above (.sidebar/#app/#kev-*/#banner-host) already apply to any page; these are the
   bookings-specific parts of the chrome that #page-chat's own rules didn't reach. */
#popout-bar-bk{display:none;align-items:center;gap:8px;padding:2px 2px 8px;font-weight:800;font-size:15.5px}
#popout-bar-bk .po-x{margin-left:auto;font-size:15px;line-height:1}
html.popout #popout-bar-bk{display:flex}
html.popout #page-calendar>h1,html.popout #page-calendar>.sub,html.popout #page-calendar>.toolbar,html.popout #page-calendar>p{display:none!important}
html.popout #page-calendar.active{height:calc(100vh - 24px)}
html.popout #bk-cal{border:none;box-shadow:none;padding:0}

/* ── v1.78 🔔 Recent activity feed + sidebar group tints ── */
/* sidebar entry point — rides under Notes to self; red count = open notifications */
.actrow{border:1px solid var(--line);margin:0 0 10px}
.actrow:hover{border-color:var(--accent)}
.acount{flex:none;background:#ff5470;color:#fff;border-radius:999px;font-size:10.5px;font-weight:800;padding:2px 8px;line-height:1.4}
/* feed items in the main pane: click = jump+clear · hover reveals ✕ (Jon: NOT bare-hover dismiss) */
.actitem{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;margin:0 0 8px;cursor:pointer;transition:.12s}
.actitem:hover{background:var(--hover);border-color:var(--accent)}
.act-mid{flex:1;min-width:0}
.act-t{font-weight:800;font-size:14px;color:var(--text)}
.act-b{font-size:13px;color:var(--text2);margin-top:2px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.act-when{flex:none;font-size:11.5px;color:var(--text2);margin-top:2px}
.act-x{flex:none;opacity:0;border:none;background:var(--hover);color:var(--text2);border-radius:8px;width:24px;height:24px;cursor:pointer;font-size:12px;line-height:1;transition:.12s;padding:0}
.actitem:hover .act-x{opacity:1}
.act-x:hover{background:rgba(255,84,112,.22);color:#ff5470}
@media (hover:none){.act-x{opacity:.6}} /* touch devices can't hover — ✕ stays visible */
.act-empty{text-align:center;padding:60px 0;color:var(--text2);font-size:15px}
.chat-main.actmode .chat-compose,.chat-main.actmode .chat-toolbar,.chat-main.actmode #jump-bottom{display:none!important}
/* group tints (Jon: sections hard to scan) — same hue as each section's header pill, whisper-quiet */
.chgrp{border-radius:14px;padding:2px 4px 4px;margin-bottom:8px}
.chgrp .chsec{margin-top:2px}
.chgrp.g-favs{background:rgba(255,195,2,.055)}
.chgrp.g-recent{background:rgba(1,233,207,.05)}
.chgrp.g-channels{background:rgba(78,161,255,.065)}
.chgrp.g-dms{background:rgba(199,125,255,.065)}
.chgrp.g-clients{background:rgba(46,230,160,.055)}
[data-theme="light"] .chgrp.g-favs{background:rgba(166,98,3,.06)}
[data-theme="light"] .chgrp.g-recent{background:rgba(6,122,111,.06)}
[data-theme="light"] .chgrp.g-channels{background:rgba(27,95,208,.06)}
[data-theme="light"] .chgrp.g-dms{background:rgba(138,63,208,.06)}
[data-theme="light"] .chgrp.g-clients{background:rgba(14,143,95,.06)}

/* ═══════════ v1.79 MOBILE WAVE — phone shell (Jon field test 2026-07-09) ═══════════
   Bottom tab bar (Dashboard·Chat·Meetings·Leads·More) + sidebar becomes the ☰ More
   drawer + single-column everything + chat list→conversation drill-down + touch sizing.
   Desktop untouched: everything below is scoped to ≤820px except the login-logo fix. */

/* login card is WHITE — the lockup inherited the dark-rail near-white text and vanished */
.login-card .lockup{color:#0A0F3C}

#mchat-back{display:none} /* 08-19: #mnav retired */

@media(max-width:820px){
  /* ── 08-19 CALENDAR IA SHIP: #mnav bar + off-canvas drawer RETIRED — the rare ?full=1 phone
     user gets the desktop rail, squeezed but reachable (Jon-accepted fallback; phones redirect
     to companion.html before any of this matters). ── */
  .sidebar{width:180px;overflow-y:auto;padding-bottom:calc(14px + env(safe-area-inset-bottom))}
  #app{grid-template-columns:180px 1fr}
  .main{padding:16px 14px calc(24px + env(safe-area-inset-bottom));max-width:none}
  h1{font-size:22px}
  .page .sub{font-size:13px}

  /* (bottom tab bar removed — 08-19 #mnav retirement) */

  /* ── touch ergonomics ── */
  input,select,textarea{font-size:16px} /* ≥16px or iOS zooms the viewport on focus */
  .btn{padding:11px 16px}
  .modal{width:100vw;max-width:100vw;min-height:100dvh;max-height:100dvh;border-radius:0}
  .page table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

  /* ── KevinAI bubble + panel clear the bar ── */
  #kev-bubble{bottom:calc(16px + env(safe-area-inset-bottom));right:14px;width:54px;height:54px;font-size:24px}
  #kev-panel{left:10px;right:10px;width:auto;bottom:calc(16px + env(safe-area-inset-bottom));height:min(68vh,560px)}

  /* ── in-app notification banners fit the screen ── */
  .nbanner{max-width:calc(100vw - 20px)}

  /* ── chat: full-screen list → tap → full-screen conversation with ‹ back ── */
  .tchat-wrap{grid-template-columns:1fr;height:auto}
  #ch-resizer{display:none}
  #page-chat .chat-side{max-height:none;height:calc(100dvh - 285px);overflow-y:auto}
  body:not(.mchat-open) #page-chat .chat-main{display:none}
  body.mchat-open #page-chat .chat-side{display:none}
  body.mchat-open #page-chat .chat-topbar,body.mchat-open #chat-search{display:none}
  body.mchat-open #page-chat .chat-main{height:calc(100dvh - 118px - env(safe-area-inset-bottom));display:flex;flex-direction:column}
  body.mchat-open #mchat-back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;
    color:var(--teal);font-family:inherit;font-size:14px;font-weight:800;padding:2px 0 8px;cursor:pointer}
  #page-chat .chat-topbar .btn-ghost{display:none} /* pop-out button — meaningless on a phone */

  /* dashboard widgets already stack ≤1100px; stat pairs stay 2-up (grid4 rule above) */
}

/* ── v1.79.1: kill pinch-zoom-out — grid/flex blowout containment (Jon: "zooms out to whole dashboard") ──
   Root cause: grid/flex children default to min-width:auto, so one wide table/row forces the
   layout wider than the viewport and iOS lets you zoom out to fit. Clamp everything.
   v2.56 M1 fix: was max-width:820px, but #dash-widgets stacks to a single column at
   max-width:1100px (see the @media(max-width:1100px) rule above) — an 821-1100px viewport
   (an iPhone in LANDSCAPE is ~844-926px CSS width; also whatever a mid-resize/rotate/PWA-resume
   frame briefly reports) got the single-column stack WITHOUT this containment, so one wide
   intrinsic-content child could still force #dash-widgets — and .main/.app with it — wider than
   the viewport. That's the best-fit match for M1's "home-screen right-column buttons stretched
   off-page... next login fine" (viewport/scale race, not a static rule): whichever width the
   layout settled on for that load determined whether this block was even in scope. Widened to
   match the 1100px breakpoint so containment is never narrower than the stacking rule it's
   protecting. */
@media(max-width:1100px){
  html,body{overflow-x:clip;max-width:100vw}
  .main{overflow-x:clip}
  .main>*,.page>*,#dash-widgets>*,.grid4>*,.card{min-width:0}
  .card{overflow-x:auto;-webkit-overflow-scrolling:touch} /* anything still wide scrolls inside its card */
  #page-dashboard .rowlink,td,th{word-break:normal}
}

/* ── v1.80 MOBILE HOME (mobile.js) — the phone landing. Desktop never routes here. ── */
#page-mhome #mh-hi h1{margin-bottom:2px}
.mh-tasks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 18px}
.mh-task{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 14px;font-family:inherit;font-size:14.5px;font-weight:700;color:var(--text);cursor:pointer;text-align:left}
.mh-task span{font-size:20px;flex:none}
.mh-task:active{transform:scale(.98)}
.mh-card{margin-bottom:14px;padding:16px}
.mh-card h3{font-size:14px;margin-bottom:10px}
.mh-item{display:flex;align-items:center;gap:10px;padding:10px 2px;border-top:1px solid var(--line);cursor:pointer}
.mh-item:first-of-type{border-top:none}
.mh-mid{flex:1;min-width:0}
.mh-t{font-size:13.5px;font-weight:700}
.mh-b{font-size:12.5px;color:var(--text2);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mh-when{font-size:11px;color:var(--text2);flex:none}
.mh-x{flex:none;background:none;border:0;color:var(--text2);font-size:14px;padding:6px;cursor:pointer}
.mh-empty{font-size:13px;color:var(--text2);padding:6px 2px}

/* ── v1.81 🏠 Chat Home/INBOX + ＠ Mentions + ⭐ Starred (Google-Chat benchmark, master list §3) ── */
/* sidebar shortcuts rail — same bordered-row language as 🔔 Recent activity */
.railrow{border:1px solid var(--line);margin:0 0 6px;font-weight:800}
.railrow:hover{border-color:var(--accent)}
.railrow.on{border-color:var(--accent);background:var(--hover)}
.actrow{margin-bottom:10px}
/* full-pane conversation rows */
.home-list{display:flex;flex-direction:column;gap:8px}
.homeitem{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid var(--line);border-radius:12px;cursor:pointer;transition:.12s}
.homeitem:hover{background:var(--hover);border-color:var(--accent)}
.homeitem .chavwrap.sb,.hi-ico{flex:none}
.hi-ico{width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:17px;background:var(--hover);border-radius:50%}
.hi-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hi-name{font-weight:700;font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hi-in{font-weight:600;color:var(--text2);font-size:12.5px}
.hi-prev{font-size:13px;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hi-prev .mention{font-weight:700}
.hi-when{flex:none;font-size:11.5px;color:var(--text2)}
.homeitem.unread{border-color:var(--accent)}
.homeitem.unread .hi-name,.homeitem.unread .hi-prev{font-weight:900;color:var(--text)}
.homeitem.unread .hi-when{color:var(--accent);font-weight:800}
/* Unread filter chip state on the Home header button */
.uflt-on{border-color:var(--accent)!important;color:var(--accent)!important;font-weight:800}
/* v1.81 fix (caught in live visual test): Home/Mentions rows aren't .chat-ch — size their avatars explicitly */
.homeitem .chavwrap.sb{width:30px;height:30px;flex:none;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(1,233,207,.25),rgba(0,128,251,.35));border:1px solid rgba(1,233,207,.3)}
.homeitem .chavwrap.sb img{width:100%;height:100%;object-fit:cover}
.homeitem .chavwrap.sb .avatar-init{font-size:11px;font-weight:800}
.homeitem .chsplit{display:inline-flex;flex:none}
.homeitem .chsplit .chavwrap.sb:nth-child(2){margin-left:-11px;box-shadow:0 0 0 1.5px var(--bg2)}
/* ═══ v1.84 · ADAM FEEDBACK: chat had "too much floating white/gray tint" — give each sidebar
   section a real border (matches its v1.78 tint) and frame the conversation pane as a card.
   Desktop only (≥821px): phones keep the v1.82.3 full-bleed chat, zero frames. ═══ */
@media(min-width:821px){
  .chgrp.g-favs{border:1px solid rgba(255,195,2,.30)}
  .chgrp.g-recent{border:1px solid rgba(1,233,207,.28)}
  .chgrp.g-channels{border:1px solid rgba(78,161,255,.32)}
  .chgrp.g-dms{border:1px solid rgba(199,125,255,.32)}
  .chgrp.g-clients{border:1px solid rgba(46,230,160,.30)}
  [data-theme="light"] .chgrp.g-favs{border-color:rgba(166,98,3,.32)}
  [data-theme="light"] .chgrp.g-recent{border-color:rgba(6,122,111,.32)}
  [data-theme="light"] .chgrp.g-channels{border-color:rgba(27,95,208,.32)}
  [data-theme="light"] .chgrp.g-dms{border-color:rgba(138,63,208,.32)}
  [data-theme="light"] .chgrp.g-clients{border-color:rgba(14,143,95,.32)}
  #page-chat .chat-main{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
}

/* v2.86 — C-41/X2 chat typing-perf fix: all .page sections stay mounted (page-clients alone = ~12.7k
   nodes hidden at display:none); every keystroke's style recalc swept those subtrees (~290ms/keystroke
   measured live, compounding into 15s+ full-app hangs). content-visibility+contain excludes inactive
   pages from style/layout entirely (measured: 289ms -> 1ms/keystroke, full DOM present). Pages render
   normally the moment .active is applied (regression-verified live on the Clients page). */
.page:not(.active){content-visibility:hidden;contain:strict}

/* ── D3 S-02 Entity Hero (2026-08-08) ─────────────────────────────────────
   Client-page header + body-block accordion. Follows D1's exported two-layer
   pattern (outer owns the height animation, inner owns real padding/content)
   rather than reusing .nav-child directly — that class is DOM/JS-coupled to
   the sidebar's nav-prefs reorder logic (see BRIEF-D1-WAVE-A-COHERENCE
   results, work item B) and isn't a drop-in body-block utility. Colors are
   all existing CSS custom properties, which already flip correctly under
   [data-theme="light"] (same precedent PR #112 documents for pipelines.js) —
   both themes ship from the same rules, no separate light palette needed. */
.cd-hero{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:16px}
.cd-hero-top{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.cd-avatar{flex:none;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#01E9CF,#0080FB);color:#04123A;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px}
.cd-hero-id{flex:1;min-width:220px}
.cd-hero-name-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cd-hero-name-row h1{margin:0}
.cd-rec-dot{width:9px;height:9px;border-radius:50%;flex:none;display:inline-block}
.cd-rec-dot.on{background:var(--ok);box-shadow:0 0 0 3px rgba(46,230,160,.18)}
.cd-rec-dot.off{background:var(--err)}
.cd-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.cd-contact-pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.cd-cpill{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:4px 9px;border-radius:20px;background:var(--hover);border:1px solid var(--line);color:var(--text2);cursor:pointer;transition:border-color .12s,color .12s}
.cd-cpill:hover{border-color:var(--accent);color:var(--text)}
.cd-cpill.copied{border-color:var(--ok);color:var(--ok)}
.cd-hero-verdict{flex:none;align-self:center}
.cd-verdict-chip{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 14px;border-radius:12px;background:var(--hover);border:1px solid var(--line);min-width:84px}
.cd-verdict-chip .cvc-num{font-size:17px;font-weight:700}
.cd-verdict-chip .cvc-label{font-size:10.5px;color:var(--text2);text-transform:uppercase;letter-spacing:.03em}
.cd-verdict-chip.ok{border-color:var(--ok)}
.cd-verdict-chip.warn{border-color:var(--warn)}
.cd-verdict-chip.bad{border-color:var(--err)}
.cd-hero-actions{flex:none;display:flex;align-items:center;gap:8px;position:relative}
.cd-dock{position:relative}
.cd-dock-trigger{font-size:18px;line-height:1;padding:8px 14px}
.cd-dock-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;background:var(--bg2);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 34px rgba(0,0,0,.35);min-width:220px;
  display:block;max-height:0;overflow:hidden;opacity:0;transition:max-height .18s ease,opacity .15s ease}
.cd-dock-menu.open{max-height:440px;opacity:1}
.cd-dock-menu .cd-acc-inner{display:flex;flex-direction:column;gap:2px;padding:8px}
.cd-dock-menu .btn{justify-content:flex-start;width:100%}
.cd-hero-bottom{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
@media(prefers-reduced-motion:reduce){.cd-dock-menu{transition:none}}

/* generic body-block accordion — same two-layer trick as D1's nav pattern (outer=track, inner=content) */
.cd-acc{display:block;max-height:0;overflow:hidden;transition:max-height .18s ease}
.cd-acc.open{max-height:900px}
.cd-acc>.cd-acc-inner{}
@media(prefers-reduced-motion:reduce){.cd-acc{transition:none}}

.cd-block{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:16px}
.cd-block-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.cd-block-head h3{margin:0}
.cd-mismatch-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;background:var(--hover);border:1px solid var(--warn);margin-bottom:6px;font-size:13px;flex-wrap:wrap}
.cd-fact-row{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:9px;background:var(--hover);border:1px solid var(--line);margin-bottom:6px;font-size:13px}
.cd-fact-row .cf-prov{font-size:11px;color:var(--text2);flex:none;white-space:nowrap}
.cd-fact-row .cf-pin{cursor:pointer;flex:none}
.cd-work-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:9px;background:var(--hover);border:1px solid var(--line);margin-bottom:5px;font-size:13px;flex-wrap:wrap}
.cd-rel-count-chip{cursor:pointer}
.cd-rel-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:9px;background:var(--hover);border:1px solid var(--line);margin-bottom:5px;font-size:13px}
/* ══════════════════════════════════════════════════════════════════════════
   D4 — WAYFINDING COMBO (2026-08-08): tab strip + ⌘K palette + peek + overflow
   UI-LANGUAGE-LOCK-2026-08-07: L2 chips (status dots), L4 pure-CSS motion only,
   L8 both themes at equal attention (all colors below are existing --vars, so
   dark/light both inherit automatically — no theme-specific overrides needed).
   ══════════════════════════════════════════════════════════════════════════ */
.wf-bar{position:sticky;top:0;z-index:40;display:flex;align-items:flex-end;gap:8px;
  margin:-30px -36px 20px;padding:10px 36px 0;background:var(--bg);border-bottom:1px solid var(--line)}
.wf-tabs{display:flex;align-items:flex-end;gap:2px;flex:1;overflow:hidden;min-width:0}
.wf-tab{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-bottom:none;
  background:var(--bg2);border-radius:9px 9px 0 0;padding:7px 11px;font-size:12.5px;color:var(--text2);
  cursor:pointer;white-space:nowrap;position:relative;top:1px;max-width:190px;flex:none}
.wf-tab .wf-lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wf-tab.on{background:var(--card);color:var(--text);font-weight:700;box-shadow:0 2px 0 0 var(--card)}
.wf-tab .wf-pin{opacity:.5;font-size:10.5px;flex:none}
.wf-tab .wf-pin.pinned{opacity:1}
.wf-tab.wf-place .wf-lbl{font-style:italic;opacity:.82}
.wf-tab.wf-place.on .wf-lbl{opacity:.95}
.wf-tab .wf-x{opacity:0;color:var(--text2);font-size:11px;padding:0 2px;border-radius:4px;flex:none}
.wf-tab:hover .wf-x{opacity:.7}
.wf-tab .wf-x:hover{opacity:1;color:var(--err);background:rgba(255,92,122,.14)}
.wf-dot{width:7px;height:7px;border-radius:50%;flex:none}
.wf-dot.ok{background:var(--ok)}.wf-dot.warn{background:var(--warn)}.wf-dot.alert{background:var(--err)}
.wf-more{display:flex;align-items:center;gap:5px;border:1px dashed var(--line);border-bottom:none;
  border-radius:9px 9px 0 0;padding:7px 11px;font-size:12px;color:var(--text2);cursor:pointer;
  position:relative;top:1px;flex:none}
.wf-more b{color:var(--accent)}
.wf-summon{flex:none;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;
  padding:7px 12px;margin-bottom:6px;background:var(--bg2);color:var(--text2);font-size:12.5px;cursor:pointer;
  max-width:260px}
.wf-summon svg{stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wf-summon:hover{border-color:var(--accent);color:var(--text)}
.wf-kbd{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:0 6px;
  font-size:10.5px;color:var(--text2);margin-left:auto}

/* overflow panel — pure-CSS reveal (L4), no JS-per-frame */
.wf-overflow-panel{display:none;position:absolute;top:100%;left:0;min-width:280px;max-width:340px;
  background:var(--card);border:1px solid var(--line);border-radius:0 12px 12px 12px;
  box-shadow:0 18px 44px rgba(0,0,0,.28);padding:8px;z-index:45;max-height:min(60vh,420px);overflow:auto}
.wf-overflow-panel.open{display:block}
.wf-of-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:12.5px}
.wf-of-row:hover{background:var(--hover)}
.wf-of-row .wf-lbl{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}

/* peek card (L7 trust line) — pure-CSS reveal, no JS-per-frame */
.wf-peek{display:none;position:absolute;top:100%;left:0;width:280px;background:var(--card);
  border:1px solid var(--line);border-radius:0 14px 14px 14px;box-shadow:0 18px 44px rgba(0,0,0,.3);
  padding:14px 16px;font-size:12.5px;color:var(--text2);z-index:46;cursor:default}
.wf-peek.open{display:block}
.wf-peek .wf-peek-nm{font-weight:700;color:var(--text);font-size:14px;margin-bottom:8px}
.wf-peek .wf-peek-row{display:flex;justify-content:space-between;gap:10px;padding:4px 0}
.wf-peek .wf-peek-foot{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);font-size:11px;color:var(--text2)}

/* ⌘K palette overlay */
.wf-palette-wrap{display:none;position:fixed;inset:0;background:rgba(4,7,26,.55);z-index:200;
  align-items:flex-start;justify-content:center;padding-top:12vh}
.wf-palette-wrap.open{display:flex}
[data-theme="light"] .wf-palette-wrap{background:rgba(20,26,54,.35)}
.wf-palette{width:min(600px,92vw);background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 30px 80px rgba(0,0,0,.45);overflow:hidden}
.wf-palette-input{width:100%;border:none;border-bottom:1px solid var(--line);background:transparent;
  color:var(--text);font-size:16px;padding:16px 18px;outline:none;box-sizing:border-box}
.wf-palette-list{max-height:52vh;overflow:auto;padding:8px}
.wf-palette-sec{padding:6px 10px 2px;font-size:10.5px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--text2)}
.wf-palette-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer;
  font-size:13.5px;color:var(--text)}
.wf-palette-row.sel{background:rgba(1,233,207,.12)}
.wf-palette-row .wf-pr-sub{margin-left:auto;font-size:11.5px;color:var(--text2)}
.wf-palette-answer{margin:4px 8px 10px;padding:10px 12px;border-radius:10px;background:rgba(1,233,207,.08);
  border:1px solid var(--line);font-size:12.5px;color:var(--text2)}
.wf-palette-answer .wf-pa-q{font-size:11px;color:var(--text2);margin-bottom:6px}
.wf-palette-empty{padding:22px;text-align:center;color:var(--text2);font-size:12.5px}
@media(max-width:820px){.wf-bar{margin:-20px -20px 16px;padding:8px 20px 0}.wf-summon span:not(.wf-kbd){display:none}}

/* ═══ NAV POLISH (Jon 08-19, rendered-QA wave with the re-parent): ═══
   1) every parent icon carries a color (Marketing/Migration/Vault/Engine were --text2 grey;
      Settings old rule was cascade-buried — re-asserted here at end-of-file so it wins);
   2) children NEVER show icons (Jon law) — kills static Organizers/Extensions svgs + every
      chunk-injected child icon uniformly;
   3) view-setter trios (Bookings, Accounting) share one data-page so go() marked ALL of them
      .active — .nc-dim (set in go()) strips the pill from all but the clicked one. */
.nav-item[data-kids="mkt"] .nico{color:#FFA94D}
.nav-item[data-kids="migration"] .nico{color:#4DABF7}
.nav-item[data-kids="engine"] .nico{color:#01E9CF}
#nav-vault .nico{color:#E8B84B}
.nav-item[data-kids="settings"] .nico{color:#C77DFF}
.nav-item[data-kids="accounting"] .nico{color:#3BC9DB}
.nav-item.nav-child .nico,.nav-item.nav-child svg{display:none}
.nav-item.nav-child.active.nc-dim{background:none;border:none;box-shadow:none;color:var(--text2)}
.nav-item.nav-child.active.nc-dim::before{display:none}

/* ═══ F3 R-ACTION-ITEMS-WIDGET-POLISH (2026-09-16): completion feedback + toast ═══ */
.ai-row-done{transition:opacity .25s ease,transform .25s ease}
.ai-row-done td{text-decoration:line-through;opacity:.55}
.ai-row-done.ai-row-fade{opacity:0;transform:translateX(6px)}
.ai-check{display:inline-block;width:14px;height:14px;margin-right:4px;vertical-align:-2px}
.ai-check path{stroke-dasharray:20;stroke-dashoffset:20;animation:ai-check-draw .25s ease forwards}
@media(prefers-reduced-motion:reduce){
  .ai-row-done{transition:none}
  .ai-row-done.ai-row-fade{opacity:1;transform:none}
  .ai-check path{animation:none;stroke-dashoffset:0}
}
@keyframes ai-check-draw{to{stroke-dashoffset:0}}
#toastbox{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
#toastbox .toast{pointer-events:auto;display:flex;align-items:center;gap:12px;background:#1b1f2a;color:#fff;font-size:13px;font-weight:600;padding:10px 16px;border-radius:24px;box-shadow:0 8px 24px rgba(0,0,0,.35);animation:pop .2s ease}
#toastbox .toast button{background:none;border:none;color:#01E9CF;font-weight:700;font-size:13px;cursor:pointer;padding:0}
@media(prefers-reduced-motion:reduce){#toastbox .toast{animation:none}}