/* Kept — "Clear Intelligence" shell tokens (R1-a, doc 29 §4/§6).
   --k- prefix on purpose: nothing here may collide with the legacy --terra/--paper
   tokens tokens.css still serves to every existing page body. Values copied verbatim
   from the amazeai-design skill / design/screens/kept-login.html — do not hand-tune. */
:root {
  /* surfaces */
  --k-white:#FFFFFF;
  --k-tint:#F7FAF9;
  --k-zebra:#F7FAF9;
  --k-shade-3:#F0F6F4;
  --k-hairline:#E3EDEA;
  --k-hairline-2:#D8E6E2;

  /* ink */
  --k-ink:#012A38;
  --k-ink-secondary:#47605F;
  --k-ink-muted:#7C908E;

  /* the ✳ + primary actions ONLY — never decorative */
  --k-orange:#FF4A1E;
  --k-orange-hover:#E43A12;
  --k-orange-wash:#FFE8E0;

  /* signature washes */
  --k-mint-a:#DFF3EF;
  --k-mint-b:#F2FAF8;
  --k-aqua-soft:#9CC8C2;

  /* semantic — honesty colors, never decorative */
  --k-success:#1F8A5D;
  --k-success-wash:#E3F3EB;
  --k-attention:#B7791F;
  --k-attention-wash:#FBF0DC;
  --k-alert:#C03D2E;
  --k-alert-wash:#FBE5E0;
  --k-info:#0E7490;
  --k-info-wash:#E0F2F7;

  /* type */
  --k-font-display: ui-rounded, 'SF Pro Rounded', 'Arial Rounded MT Bold', 'Nunito', -apple-system, sans-serif;
  --k-font-body: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', Roboto, sans-serif;

  /* radii + shadow */
  --k-radius-lg:22px;
  --k-radius-md:18px;
  --k-radius-pill:999px;
  --k-shadow-card: 0 2px 4px rgba(1,42,56,.04), 0 16px 40px -20px rgba(1,42,56,.18);

  /* F (briefs/F-outstanding-v2-dates-type.md, part 3) — ONE type scale, defined once,
     never hand-tuned per screen. Balaji (2026-09-11): "fonts the same size across all."
     Named by ROLE, not by pixel value, so a screen picks the token that matches what the
     text IS (an eyebrow, a title, a body line, a meta caption, a hero/tile number) —
     never a bespoke px value. Mapping a raw size to the nearest token (audit rule):
       <=10.5px  -> --k-fs-micro   (eyebrows/microlabels, uppercase, letter-spaced)
       11-12.5px -> --k-fs-small   (meta/captions, chip text, table headers)
       13-15px   -> --k-fs-body    (row titles, body copy, table cells — 14px base)
       16-20px   -> --k-fs-h2      (section headings, stat-tile numbers)
       21-28px   -> --k-fs-h1      (page/record headline)
       >=29px    -> --k-fs-display (the one hero number per screen — Outstanding $, etc.)
     Line-heights follow the same two-tier split every card in the design system already
     uses: tight for display/headline numbers, relaxed for reading copy. */
  --k-fs-micro:10.5px;
  --k-fs-small:12px;
  --k-fs-body:14px;
  --k-fs-h2:18px;
  --k-fs-h1:24px;
  --k-fs-display:32px;
  --k-lh-tight:1.1;
  --k-lh-body:1.55;

  /* shell geometry */
  --k-rail-height:52px;
}

/* tabular-nums on any digit (law) */
.k-tnum { font-variant-numeric:tabular-nums; font-feature-settings:'tnum' 1,'lnum' 1; }

/* ---------- the shell rail (kept-shell.mjs mounts this) ----------
   White, hairline bottom border — never a dark panel. One dark ink panel per screen
   max is reserved for the assistant's insight elsewhere; the shell itself is not it. */
html.kept-shell-on body { padding-top: var(--k-rail-height) !important; }

.kept-rail {
  position:fixed; top:0; left:0; right:0; height:var(--k-rail-height); z-index:9999;
  display:flex; align-items:center; gap:18px; padding:0 20px; box-sizing:border-box;
  background:var(--k-white); border-bottom:1px solid var(--k-hairline);
  font-family:var(--k-font-body); font-size:12.5px; color:var(--k-ink);
}
.kept-rail * { box-sizing:border-box; }

.kept-rail__brand {
  display:flex; align-items:center; gap:6px; flex:0 0 auto;
  font-family:var(--k-font-display); font-weight:800; font-size:17px; color:var(--k-ink);
  letter-spacing:-.01em; white-space:nowrap;
}

.kept-rail__doors { display:flex; align-items:center; gap:2px; margin:0 auto; flex:1 1 auto; justify-content:center; }
.kept-door {
  appearance:none; -webkit-appearance:none; border:none; background:none; text-decoration:none;
  font-family:var(--k-font-body); font-size:12.5px; font-weight:600; line-height:1; white-space:nowrap;
  color:var(--k-ink-secondary); padding:7px 13px; border-radius:var(--k-radius-pill); cursor:pointer;
}
.kept-door:hover:not([disabled]) { background:var(--k-tint); color:var(--k-ink); }
.kept-door.is-active { background:var(--k-tint); color:var(--k-ink); font-weight:700; }
.kept-door[disabled] { color:var(--k-ink-muted); opacity:.55; cursor:default; }
.kept-door:focus-visible { outline:2px solid var(--k-aqua-soft); outline-offset:2px; }

.kept-rail__right { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.kept-client {
  font-size:12px; font-weight:600; color:var(--k-ink-secondary);
  max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.kept-lens {
  font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--k-ink-secondary); background:var(--k-tint); border:1px solid var(--k-hairline);
  border-radius:var(--k-radius-pill); padding:4px 10px; white-space:nowrap;
}
.kept-signout {
  font-family:var(--k-font-body); font-size:12px; font-weight:600; color:var(--k-ink-muted);
  background:none; border:none; cursor:pointer; padding:6px 4px; line-height:1;
}
.kept-signout:hover { color:var(--k-ink); }

/* ============================================================================
 * W8-B (S4, briefs/W8-practice-ops.md) — MOBILE. Additive only: every rule below is
 * scoped inside its own @media block, never edits a base (desktop) rule above. This is
 * the shell rail's own mobile shape — "the rail collapses to a bottom bar with the room
 * glyphs" (S4 A6/S4's own words). Other rooms' stylesheets (kept-flow.mjs, kept-
 * moments.mjs, kept-ledger.mjs, kept-desk-day.mjs, kept-rounding.mjs, kept-portal.mjs,
 * kept-owner.mjs) are owned by other waves — their own @media (max-width:480px) blocks
 * belong in each file's own ensure*Styles(), not here; this file owns the shell + the
 * windows every room already shares (kept-windows.mjs's fallback, plus this wave's own
 * kept-claim-window.mjs / kept-patient-money-window.mjs / kept-appeal-window.mjs /
 * kept-help.mjs / kept-inbox.mjs, each carrying its own matching block).
 * ========================================================================== */
@media (max-width: 480px) {
  html.kept-shell-on body { padding-top: 0 !important; padding-bottom: 54px !important; }

  .kept-rail {
    top: auto; bottom: 0; height: 54px;
    border-bottom: none; border-top: 1px solid var(--k-hairline);
    flex-wrap: nowrap; gap: 6px; padding: 0 6px;
  }
  .kept-rail__brand, .kept-client, .kept-lens { display: none; }   /* identity chrome — not needed to act on a 375px screen */
  .kept-rail__doors { gap: 0; justify-content: space-between; width: 100%; margin: 0; }
  .kept-door {
    flex: 1 1 0; text-align: center; padding: 6px 2px; font-size: 9.5px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .kept-rail__right { gap: 6px; }
  .kept-signout { font-size: 0; width: 20px; height: 20px; padding: 0; }
  .kept-signout::before { content: '⏻'; font-size: 13px; display: inline-block; }

  /* the record window (kept-shell.mjs's own openRecord) goes full-screen, sticky header —
     "windows go full-screen with a sticky header" (S4's own words). */
  .kept-record-backdrop { padding: 0 !important; align-items: stretch !important; }
  .kept-record-window {
    width: 100% !important; max-width: 100% !important; max-height: 100vh !important;
    border-radius: 0 !important; height: 100vh;
  }

}

/* ============================================================================
 * A1 (briefs/A1-presence-panel.md; doc 40 §3.1-§3.3) — the assistant presence:
 * the floating ✳ button every page carries (kept-shell.mjs's own mountAssistantPresence,
 * apps/web/public/kept-assistant-panel.mjs) and its 420px floating panel. Retires the
 * old rail Ask pill/popover (doc 40 §2's migration table) — folded into
 * this ONE presence instead of a rail popover. Tokens only; --k-orange paints only the
 * ✳ glyph and the ONE primary pill (.pill.primary) — never a second primary anywhere
 * in this block (dom-audit's own orange-primary law). Includes its own
 * @media (max-width:767px) bottom-sheet layer (S4/mobile law: every new grid/chip row
 * carries its own collapse rule in the SAME file it is authored in).
 * ========================================================================== */
.k-assist-btn{position:fixed;right:24px;bottom:24px;width:56px;height:56px;border-radius:50%;
  background:var(--k-white);border:1.5px solid var(--k-ink);color:var(--k-orange);
  font-size:var(--k-fs-h1);display:flex;align-items:center;justify-content:center;
  box-shadow:var(--k-shadow-card);z-index:9500;cursor:pointer;padding:0;}
.k-assist-btn:focus-visible{outline:2px solid var(--k-aqua-soft);outline-offset:2px;}
.k-assist-btn .ast{color:var(--k-orange);font-weight:800;line-height:1;}
.k-assist-badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;border-radius:999px;
  background:var(--k-alert);color:#fff;font-size:var(--k-fs-micro);font-weight:800;
  display:flex;align-items:center;justify-content:center;padding:0 4px;font-family:var(--k-font-body);}
.k-assist-btn.is-pulsing{animation:k-assist-pulse .6s ease;}
@keyframes k-assist-pulse{0%{transform:scale(1);}45%{transform:scale(1.18);}100%{transform:scale(1);}}
.k-assist-btn.is-open{right:562px;width:40px;height:40px;font-size:var(--k-fs-h2);}

/* D-checkpoint-6 item 2: the panel's old top:24px measured from the viewport edge,
   but the shell rail (kept-rail, fixed top:0, height var(--k-rail-height), z-index
   9999 -- ABOVE this panel's own 9400) paints over that same band, so the shell
   clipped the panel's own header row on every desktop screen. Starting the panel
   24px BELOW the rail's bottom edge (never under it, never covering its nav actions)
   is the only fix that keeps both laws: one rail on top, one full header always
   visible beneath it. */
/* A6d item 1 (briefs/A6d-briefing-first-message.md, DECISIONS 09/21 A8): "one
   520px panel, full height" -- a single, fixed width, ALWAYS (no `.is-wide`
   modifier any more; A6c's own two-column one-pager is fully retired). */
.k-assist-panel{position:fixed;top:calc(var(--k-rail-height) + 24px);right:24px;bottom:24px;width:520px;
  background:var(--k-white);border:1px solid var(--k-hairline);border-radius:16px;
  box-shadow:0 8px 20px rgba(1,42,56,.08),0 30px 64px -18px rgba(1,42,56,.30);
  z-index:9400;display:flex;flex-direction:column;overflow:hidden;font-family:var(--k-font-body);color:var(--k-ink);}
.k-assist-panel[hidden]{display:none;}
.k-assist-head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--k-hairline);flex:0 0 auto;}
.k-assist-title{display:flex;align-items:center;gap:6px;font-family:var(--k-font-display);font-weight:800;font-size:var(--k-fs-h2);color:var(--k-ink);white-space:nowrap;}
.k-assist-title .ast{color:var(--k-orange);}
.k-assist-crumb{flex:1 1 auto;min-width:0;font-size:var(--k-fs-small);color:var(--k-ink-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:6px;border-left:1px solid var(--k-hairline-2);margin-left:4px;}
/* A6d item 1/3: "Today ▸" -- jumps the thread to the latest briefing turn; pulses
   once (the SAME k-assist-pulse keyframes above) when a live-card refresh finds
   the dashboard changed while the user wasn't looking. Ink-only, never orange —
   --k-orange stays reserved for the composer's own send button + the one primary
   start-here pill. */
.k-assist-today{flex:0 0 auto;border:none;background:none;color:var(--k-ink-secondary);font-size:var(--k-fs-micro);font-weight:700;cursor:pointer;padding:4px 6px;white-space:nowrap;border-radius:999px;}
.k-assist-today:hover{background:var(--k-hairline);color:var(--k-ink);}
.k-assist-today.is-pulsing{animation:k-assist-pulse .6s ease;}
.k-assist-taskchip{flex:0 0 auto;display:flex;align-items:center;gap:6px;font-size:var(--k-fs-micro);font-weight:700;background:var(--k-tint);color:var(--k-ink-secondary);border-radius:999px;padding:4px 8px 4px 10px;max-width:320px;}
.k-assist-tasktext{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* A5 item 4 (doc 40 §3.4): pause/faster/stop doors on the chip itself — tiny, ink-only
   controls, never a second orange primary (dom-audit's own orange-primary law: only
   .pill.primary and .k-assist-send may paint --k-orange as a background). */
.k-assist-taskbtn{flex:0 0 auto;height:20px;border-radius:999px;border:none;background:none;color:var(--k-ink-secondary);font-size:10.5px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0 7px;white-space:nowrap;}
.k-assist-taskbtn:hover{background:var(--k-hairline);color:var(--k-ink);}
.k-assist-close{flex:0 0 auto;width:26px;height:26px;border-radius:50%;border:1px solid var(--k-hairline-2);background:var(--k-white);color:var(--k-ink-secondary);font-size:var(--k-fs-body);line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;}

/* A5's old "while you were away" FIRST CARD (`.k-assist-digest*`) is retired —
   the digest now arrives as an ordinary thread bubble (assistant-thread.mjs logs it
   once via GET /api/assistant/thread); `digestCardEl`'s OWN markup classes
   (`.k-assist-digest*`) stay defined here since kept-assistant-panel.mjs still
   exports and pure-tests the function itself, even though no host mounts it any
   more. */
.k-assist-digest{padding:12px 18px;border-radius:12px;background:var(--k-mint-a);}
.k-assist-digest-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;}
.k-assist-digest-title{font-weight:800;font-size:var(--k-fs-small);color:var(--k-ink);}
.k-assist-digest-x{flex:0 0 auto;width:20px;height:20px;border-radius:50%;border:none;background:none;color:var(--k-ink-secondary);font-size:var(--k-fs-body);line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;}
.k-assist-digest-x:hover{background:var(--k-hairline);color:var(--k-ink);}
.k-assist-digest-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:var(--k-fs-small);color:var(--k-ink-secondary);line-height:1.5;}
.k-assist-digest-row + .k-assist-digest-row{margin-top:4px;}
.k-assist-digest-text{flex:1 1 auto;}
.k-assist-digest-door{flex:0 0 auto;color:var(--k-ink);font-weight:700;text-decoration:underline;text-decoration-color:var(--k-aqua-soft);text-underline-offset:3px;}

/* A6d item 1/2/5 (briefs/A6d-briefing-first-message.md, DECISIONS 09/21 A8): "the
   cards now live INSIDE the assistant's first message" — `.k-assist-dashboard`
   (START HERE + THE WORKFLOW, `[data-live="dashboard"]`) is no longer its own
   panel section (A6/A6c); it is built by kept-assistant-panel.mjs's own
   buildDashboardCardsFor and appended straight into the briefing turn's `.bubble`
   (msgEl). Nested-in-bubble box only — no border/max-height/scroll of its own, the
   PANEL's own `.k-assist-convo` is the one thing that scrolls now (one thread, one
   scrollbar, item 1's own "no columns, no modes"). Buttons reuse the SAME
   .pill/.pill.primary/.pill.quiet classes (never a second button style) — exactly
   one .pill.primary exists at a time (the first start-here row's Do it). */
.msg .k-assist-dashboard{margin-top:10px;padding:10px 12px 2px;border-radius:12px;background:var(--k-tint);}
.msg .k-assist-dashboard .microlabel{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--k-ink-muted);margin:10px 0 8px;}
.msg .k-assist-dashboard .microlabel:first-child{margin-top:0;}
.start-list{display:flex;flex-direction:column;gap:10px;}
.start-row{display:flex;flex-direction:column;gap:8px;padding:10px 12px;background:var(--k-white);border:1px solid var(--k-hairline);border-radius:12px;}
.start-txt{font-size:var(--k-fs-small);line-height:1.5;color:var(--k-ink);}
.start-doors{display:flex;gap:8px;flex-wrap:wrap;}
.start-doors .pill{padding:6px 14px;font-size:12.5px;}
.wf-strip{display:flex;flex-direction:column;}
.wf-row{display:flex;align-items:center;gap:10px;height:28px;border-top:1px solid var(--k-hairline);cursor:pointer;}
.wf-row:first-child{border-top:none;}
.wf-row:hover{background:var(--k-white);}
.wf-name{flex:1 1 auto;font-size:var(--k-fs-small);color:var(--k-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wf-val{flex:0 0 auto;font-family:var(--k-font-body);font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--k-fs-small);color:var(--k-ink);min-width:56px;text-align:right;}
.wf-chip{flex:0 0 auto;}
.wf-chip .chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 9px;font-size:10.5px;font-weight:700;white-space:nowrap;}
.wf-chip .chip-moving{background:var(--k-success-wash);color:var(--k-success);}
.wf-chip .chip-waiting_on_you{background:var(--k-attention-wash);color:var(--k-attention);}
.wf-chip .chip-paused{background:none;border:1px solid var(--k-hairline-2);color:var(--k-ink-secondary);}
.wf-chip .chip-quiet{background:var(--k-tint);color:var(--k-ink-muted);}
.wf-chev{flex:0 0 auto;color:var(--k-ink-muted);font-size:var(--k-fs-body);}
.k-assist-dashboard .reads{margin:10px 0 0;font-size:var(--k-fs-micro);font-style:italic;color:var(--k-ink-muted);}
/* the dashboard's own deferred-to-others line (doc 40 §4.4: "a verb that cannot
   act renders... never a fabricated bulk action") -- a real ask this lens may not
   perform (signing/ceremony doors are the billing expert's/owner's), said plainly,
   no pill, no door. Ink/muted only -- never orange, never a button. */
.k-assist-dashboard .deferred-note{margin-top:12px;padding-top:10px;border-top:1px solid var(--k-hairline);}
.k-assist-dashboard .deferred-note p{margin:0 0 4px;font-size:var(--k-fs-micro);font-style:italic;color:var(--k-ink-muted);}
.k-assist-dashboard .deferred-note p:last-child{margin-bottom:0;}

/* A6d item 1/2: every OTHER depth (area/record) -- the first turn is just this one
   muted context line, INSIDE the thread flow (`.k-assist-convo`'s own flex child),
   no bubble chrome, no separate host any more (A6/A6c's `.k-assist-ctxline-host`
   is retired). */
.k-assist-convo .ctx-line{margin:0;padding:0 2px;font-size:var(--k-fs-micro);color:var(--k-ink-muted);align-self:flex-start;}

/* A6 item 4 (doc 40 §3.3, "one conversation"): the collapsed prior-day thread toggle
   -- quiet, ink-only, sits above today's messages inside the SAME scrolling pane. */
.thread-yesterday{align-self:flex-start;border:none;background:none;color:var(--k-ink-secondary);font-size:var(--k-fs-micro);font-weight:700;cursor:pointer;padding:4px 2px;text-decoration:underline;text-decoration-color:var(--k-aqua-soft);text-underline-offset:3px;}

.k-assist-badges{flex:0 1 auto;padding:12px 18px;border-bottom:1px solid var(--k-hairline);background:var(--k-tint);max-height:40%;overflow-y:auto;}
.k-assist-badges:empty{display:none;}
.k-assist-panel.is-convo-empty .k-assist-badges{flex:1 1 auto;max-height:none;}
.k-assist-panel.is-convo-empty .k-assist-convo{flex:0 1 auto;min-height:0;}
.badge-row{display:flex;align-items:baseline;gap:6px;font-size:var(--k-fs-small);color:var(--k-ink-secondary);line-height:1.5;}
.badge-row .ast{flex:0 0 auto;color:var(--k-orange);}
.badge-row + .badge-row, .k-assist-badges > div + div{margin-top:8px;}

.k-assist-convo{flex:1 1 auto;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:14px;min-height:60px;}
.msg{max-width:92%;display:flex;flex-direction:column;gap:4px;}
.msg.from-ai{align-self:flex-start;}
.msg.from-user{align-self:flex-end;}
.msg-time{font-size:var(--k-fs-micro);color:var(--k-ink-muted);padding:0 2px;}
.msg.from-user .msg-time{text-align:right;}
.bubble{border-radius:14px;padding:11px 14px;font-size:var(--k-fs-body);line-height:1.55;color:var(--k-ink);}
.msg.from-ai .bubble{background:var(--k-white);border:1px solid var(--k-hairline);border-top-left-radius:4px;}
.msg.from-user .bubble{background:var(--k-mint-a);border-top-right-radius:4px;}
.msg-doors{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap;}
.pill{border-radius:999px;padding:8px 16px;font-weight:700;font-size:var(--k-fs-small);border:1.5px solid var(--k-hairline-2);cursor:pointer;background:var(--k-white);color:var(--k-ink);font-family:inherit;}
.pill.primary{background:var(--k-orange);border-color:var(--k-orange);color:#fff;}
.pill.primary:hover{background:var(--k-orange-hover);}
.pill.quiet{background:none;border:none;color:var(--k-ink-secondary);text-decoration:underline;text-decoration-color:var(--k-aqua-soft);text-underline-offset:3px;padding:8px 4px;}
.pill[disabled]{cursor:not-allowed;opacity:.55;}

.steplist{display:flex;flex-direction:column;gap:8px;margin:8px 0 4px;}
.step{display:flex;align-items:flex-start;gap:8px;font-size:var(--k-fs-small);line-height:1.5;}
.step .g{flex:0 0 auto;width:14px;text-align:center;font-weight:800;color:var(--k-success);}
.step .txt{color:var(--k-ink-secondary);}
.disclosure{font-size:var(--k-fs-micro);font-style:italic;color:var(--k-ink-muted);margin:8px 0 0;padding-top:8px;border-top:1px solid var(--k-hairline);}

.k-assist-composer{flex:0 0 auto;padding:14px 18px 16px;border-top:1px solid var(--k-hairline);background:var(--k-white);}
.verbchips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.verbchips[hidden]{display:none;}
.verbchip{border:1px solid var(--k-hairline-2);background:var(--k-white);color:var(--k-ink-secondary);border-radius:999px;padding:5px 12px;font-size:var(--k-fs-micro);font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;}
.verbchip:hover{background:var(--k-tint);color:var(--k-ink);}
.k-assist-inputrow{display:flex;align-items:center;border:1px solid var(--k-hairline-2);border-radius:999px;padding:9px 8px 9px 16px;gap:8px;}
.k-assist-inputrow input{flex:1 1 auto;border:none;outline:none;font:inherit;font-size:var(--k-fs-body);color:var(--k-ink);background:none;}
.k-assist-ideachip{order:-1;flex:0 0 auto;border:none;background:none;color:var(--k-ink-muted);font-size:var(--k-fs-micro);font-style:italic;cursor:pointer;padding:0 2px;white-space:nowrap;font-family:inherit;}
.k-assist-ideachip:hover{color:var(--k-ink-secondary);}
.k-assist-send{flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:var(--k-orange);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;}
.k-assist-send:hover{background:var(--k-orange-hover);}

/* the live-work highlight — any [data-thread-ref] the panel's own task narration is
   currently touching (doc 40 §3.4: "the touched row highlights for the step's
   duration"). Aqua, never orange — orange is reserved for the ✳ + one primary pill. */
.k-live-touch{outline:2px solid var(--k-aqua-soft);outline-offset:2px;transition:outline-color .2s ease;}

@media (max-width:767px){
  .k-assist-btn{right:16px;bottom:16px;}
  .k-assist-btn.is-open{right:16px;bottom:calc(50vh + 8px);}
  .k-assist-panel{top:auto;left:0;right:0;bottom:0;width:100%;max-width:100%;height:50vh;
    border-radius:16px 16px 0 0;border-bottom:none;}
  .k-assist-panel.is-full{height:100vh;border-radius:0;}
  /* A6d item 1: "mobile: sheet" -- the SAME single 520px column collapses to a
     100%-wide bottom sheet here; no `.is-wide` variant exists any more to reset
     (A6c's own two-column one-pager, fully retired). */
  .verbchips{flex-wrap:wrap;}
  .msg-doors{flex-wrap:wrap;}
  .badge-row{flex-wrap:wrap;}
}

/* ============================================================================
 * G1 (briefs/G1-components.md, doc 45 "One Grammar", DECISIONS U0-U7) — the grammar's
 * shared brick: tokens, the three chips, the provenance line, the band + tiles, the
 * desk row (opens in place) + row-card, the right-rail card. Copied from the approved
 * mocks (design/screens/kept-moments-v2.html / kept-flow-v4.html share ONE block) —
 * byte-faithful where a number is a design decision, tokenised where the scale names
 * one. ADDITIVE ONLY: every selector below is a NEW class (.k-band/.k-tile/.k-desk/
 * .k-row/.k-rowcard/.k-rail-card/.k-chip-x/.k-reads/.k-main/.k-page), so no room that
 * does not yet carry one renders differently today. G2-G5 adopt the components room by
 * room; G6 promotes the grammar scale below from `.k-g`-scoped to :root once every room
 * has adopted it.
 * ========================================================================== */
:root {
  /* the new scale names that collide with nothing already defined above */
  --k-fs-22:22px;             /* hero / window title */
  --k-fs-17:17px;             /* card lead line */
  --k-fs-meta:12px;           /* meta / captions (== --k-fs-small today) */
  --k-r-card:18px;            /* THE card radius — one value, every card */
  --k-content:1180px;         /* one container width on every room */
  --k-rail:320px;             /* the right rail, every room, same order */
}
/* The grammar's type scale (display 28 / 22 / 17 · body 15 · meta 12 · micro 11) —
   redefines the three tokens a room already reads at a DIFFERENT value (display 32,
   body 14, micro 10.5) ONLY inside a grammar scope: html.k-g (the shell sets it when a
   page declares data-k-grammar on <body>), or any grammar component root. A room that
   has not adopted the grammar keeps today's scale to the pixel. */
html.k-g, .k-g, .k-main, .k-band, .k-desk, .k-rail-card, .k-rowcard {
  --k-fs-display:28px;
  --k-fs-body:15px;
  --k-fs-micro:11px;
}

/* ---------- layout: one container, one rail ---------- */
.k-main { max-width:calc(var(--k-content) + 48px); margin:0 auto; padding:20px 24px 96px; box-sizing:border-box; }
.k-page { display:grid; grid-template-columns:minmax(0,1fr) var(--k-rail); gap:24px; margin-top:24px; align-items:start; }
.k-col { display:flex; flex-direction:column; gap:20px; min-width:0; }
@media (max-width:1024px) { .k-page { grid-template-columns:minmax(0,1fr); } }
/* WD1-4: the room canvas is STATIC (it used to live only in the JS-injected ensureFlowStyles, so a zoom opened straight off ?view= that never called it drew flush-left);
   a zoom is drawn in `.k-page` (zoomFrame, kept-rail.mjs) — one column while it has no rail. */
.k-fl-wrap { max-width:calc(var(--k-content) + 48px); margin:0 auto; padding:20px 24px 40px; box-sizing:border-box; }
.k-page--solo { grid-template-columns:minmax(0,1fr); }
.k-page--zoom { margin-top:0; }

/* ---------- card — one radius, one shadow ---------- */
.k-card { background:var(--k-white); border:1px solid var(--k-hairline); border-radius:var(--k-r-card); box-shadow:var(--k-shadow-card); padding:20px 22px 16px; box-sizing:border-box; }
.k-microlabel { font-size:var(--k-fs-micro); font-weight:700; text-transform:uppercase; letter-spacing:.09em; color:var(--k-ink-muted); margin:0 0 12px; }
.k-microlabel .k-ast { color:var(--k-orange); font-weight:800; margin-right:5px; }
.k-sub { font-size:var(--k-fs-meta); color:var(--k-ink-secondary); margin:-6px 0 14px; }

/* ---------- provenance line — one 11px grey line at the bottom of its card ---------- */
.k-reads { font-size:var(--k-fs-micro); color:var(--k-ink-muted); margin:14px 0 0; line-height:1.4; font-weight:400; text-transform:none; letter-spacing:0; }

/* ---------- chips — exactly three shapes: count · status · kind ---------- */
/* a chip NEVER truncates (G7): no overflow clip, no ellipsis — it is as wide as its text, and only when its
   cell is narrower than that does the text wrap inside the pill; the desk gives each chip column its room. */
.k-chip-count, .k-chip-status, .k-chip-kind { display:inline-block; font-size:10.5px; font-weight:700; line-height:1.35; max-width:100%; box-sizing:border-box; overflow:visible; white-space:normal; overflow-wrap:anywhere; vertical-align:middle; }
.k-chip-count { padding:2px 9px; border-radius:999px; background:var(--k-tint); color:var(--k-ink-secondary); border:1px solid var(--k-hairline); font-variant-numeric:tabular-nums; }
.k-chip-status { padding:2px 9px; border-radius:999px; background:var(--k-tint); color:var(--k-ink-secondary); font-variant-numeric:tabular-nums; }
.k-chip-status[data-tone="ok"] { background:var(--k-success-wash); color:var(--k-success); }
.k-chip-status[data-tone="warn"] { background:var(--k-attention-wash); color:var(--k-attention); }
.k-chip-status[data-tone="alert"] { background:var(--k-alert-wash); color:var(--k-alert); }
.k-chip-status[data-tone="info"] { background:var(--k-info-wash); color:var(--k-info); }
.k-chip-status[data-tone="muted"] { background:var(--k-tint); color:var(--k-ink-muted); border:1px solid var(--k-hairline); }
/* CC1-B (doc 46): a finding's DIRECTION is one status chip in two tones — under (teal: the record supports more) · over (amber: not
   supported). Never red/green, never a fourth shape; a question uses the quiet `muted` tone above. */
.k-chip-status[data-tone="under"] { background:var(--k-info-wash); color:var(--k-info); }
.k-chip-status[data-tone="over"] { background:var(--k-attention-wash); color:var(--k-attention); }
.k-chip-kind { padding:2px 7px; border-radius:6px; border:1px solid var(--k-hairline-2); background:var(--k-white); color:var(--k-ink-secondary); font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; }

/* ---------- quiet verbs — the only non-primary shapes a grammar component draws ---------- */
.k-link { background:none; border:none; padding:0; font:inherit; font-size:11.5px; font-weight:700; color:var(--k-ink-secondary); cursor:pointer; white-space:nowrap; text-decoration:none; }
.k-link:hover { color:var(--k-ink); text-decoration:underline; text-decoration-color:var(--k-aqua-soft); }
.k-link:focus-visible, .k-tile:focus-visible, .k-row__head:focus-visible, .k-rowcard:focus-visible { outline:2px solid var(--k-aqua-soft); outline-offset:2px; }

/* ---------- LEVEL 1 — the band (hero line in words + tiles that are doors) ---------- */
.k-band { position:relative; border-radius:var(--k-r-card); padding:20px 26px 18px; overflow:hidden; border:1px solid var(--k-hairline-2); box-sizing:border-box;
  background-image:radial-gradient(circle, rgba(1,42,56,.07) 1px, transparent 1.6px), linear-gradient(135deg, var(--k-mint-a) 0%, var(--k-mint-b) 55%, var(--k-white) 100%);
  background-size:16px 16px, 100% 100%; }
.k-band__top { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap; position:relative; }
.k-band__room { margin:0 0 2px; }
.k-band__client { font-family:var(--k-font-display); font-weight:800; font-size:var(--k-fs-22); letter-spacing:-.01em; margin:0; }
.k-band__date { font-size:var(--k-fs-meta); color:var(--k-ink-secondary); margin:3px 0 0; }
.k-band__hero { font-size:13.5px; font-weight:600; margin:8px 0 0; font-variant-numeric:tabular-nums; }
.k-band__who { display:flex; align-items:center; gap:10px; }
.k-band__avatar { width:34px; height:34px; border-radius:50%; background:var(--k-ink); color:var(--k-white); display:flex; align-items:center; justify-content:center; font-family:var(--k-font-display); font-weight:800; font-size:12.5px; }
.k-band__whotext { display:flex; flex-direction:column; line-height:1.3; }
.k-band__name { font-weight:700; font-size:12.5px; }
.k-band__lens { font-size:var(--k-fs-micro); color:var(--k-ink-muted); }
.k-band .k-reads { margin-top:14px; }

.k-tiles { display:grid; grid-template-columns:repeat(var(--k-tiles,7),minmax(0,1fr)); gap:10px; margin-top:18px; }
.k-tile { display:flex; flex-direction:column; gap:2px; min-width:0; box-sizing:border-box; background:var(--k-white); border:1px solid var(--k-hairline-2); border-radius:14px; padding:12px 13px;
  box-shadow:0 1px 2px rgba(1,42,56,.05); text-align:left; font:inherit; color:inherit; text-decoration:none; }
a.k-tile, button.k-tile { cursor:pointer; transition:transform .15s ease, box-shadow .15s ease; }
a.k-tile:hover, button.k-tile:hover { transform:translateY(-1px); box-shadow:0 2px 4px rgba(1,42,56,.06), 0 10px 24px -14px rgba(1,42,56,.25); }
.k-tile.is-quiet, .k-tile.is-tint { background:var(--k-tint); }
.k-tile__lbl { font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--k-ink-muted); }
.k-tile__count { font-family:var(--k-font-display); font-weight:800; font-size:21px; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.k-tile--text .k-tile__count { font-size:var(--k-fs-17); line-height:1.2; }   /* G11: a date/time or a phrase as the display number wraps at its spaces, never clips */
.k-tile__unit { font-size:9.5px; color:var(--k-ink-muted); margin-top:-3px; }
.k-tile__cents { font-size:11.5px; color:var(--k-ink-secondary); font-weight:600; font-variant-numeric:tabular-nums; }
.k-tile__bar { height:5px; border-radius:999px; overflow:hidden; background:var(--k-tint); display:flex; margin:4px 0 2px; }
.k-tile__bar-ins { background:var(--k-ink); height:100%; }
.k-tile__bar-pt { background:var(--k-attention); height:100%; }
.k-tile__sub { font-size:10.5px; color:var(--k-ink-secondary); margin:2px 0 0; line-height:1.35; }
.k-tile__sub [data-tone="ok"] { color:var(--k-success); font-weight:700; }
.k-tile__sub [data-tone="warn"] { color:var(--k-attention); font-weight:700; }
.k-tile__sub [data-tone="alert"] { color:var(--k-alert); font-weight:700; }
.k-tile__sub [data-tone="info"] { color:var(--k-info); font-weight:700; }
.k-tile__sub [data-tone="muted"] { color:var(--k-ink-muted); }
.k-tile__restraint { color:var(--k-ink-secondary); font-weight:800; margin-right:2px; }
@media (max-width:1180px) { .k-tiles { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:768px)  { .k-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:480px)  { .k-tiles { grid-template-columns:minmax(0,1fr); } .k-band { padding:16px 16px 14px; } }

/* ---------- LEVEL 2 — the desk: one row per kind, opens IN PLACE ---------- */
.k-desk { --k-kind-w:104px; --k-desk-cols:minmax(0,1fr) var(--k-kind-w) 44px 58px 84px 168px 18px; }   /* renderDesk sets both from the longest kind label */
.k-desk.no-kind { --k-desk-cols:minmax(0,1fr) 44px 58px 84px 168px 18px; }
.k-desk__cols, .k-row__head { display:grid; grid-template-columns:var(--k-desk-cols); gap:10px; align-items:center; }
.k-desk__cols { padding:0 12px 8px; border-bottom:1px solid var(--k-hairline); }
.k-desk__cols span { font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--k-ink-muted); }
.k-desk__cols .r, .k-row__head .r { text-align:right; }
.k-row { border-bottom:1px solid var(--k-hairline); }
.k-row:last-of-type { border-bottom:none; }
.k-row__head { width:100%; box-sizing:border-box; background:none; border:0; padding:13px 12px; text-align:left; cursor:pointer; font:inherit; color:inherit; border-radius:14px; }
.k-row__head:hover { background:var(--k-tint); }
.k-row__title { display:flex; flex-direction:column; gap:2px; min-width:0; }
.k-row__title b { font-size:14px; font-weight:700; }
.k-row__title small { font-size:11.5px; color:var(--k-ink-secondary); line-height:1.35; }
.k-row__count, .k-row__min, .k-row__amt { font-size:13px; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.k-row__count, .k-row__amt { font-family:var(--k-font-display); font-weight:800; }
.k-row__min { color:var(--k-ink-secondary); font-size:12px; }
.k-row__amt.is-none, .k-row__min.is-none { color:var(--k-ink-muted); font-weight:600; font-family:var(--k-font-body); }
.k-row__when { display:flex; gap:4px 6px; align-items:center; flex-wrap:wrap; min-width:0; }   /* oldest / time-sensitive wrap to a 2nd line, never truncate */
.k-row__chev { font-size:10px; color:var(--k-ink-muted); text-align:center; transition:transform .15s ease; display:inline-block; }
.k-row.is-open { background:var(--k-tint); border:1px solid var(--k-hairline); border-radius:16px; margin:6px 0; }
.k-row.is-open .k-row__head:hover { background:none; }
.k-row.is-open .k-row__chev { transform:rotate(90deg); }
.k-row__body { display:none; padding:2px 12px 14px; flex-direction:column; gap:8px; }
.k-row.is-open .k-row__body { display:flex; }
.k-row.is-quiet .k-row__head { cursor:default; }
.k-row.is-quiet .k-row__head:hover { background:none; }
.k-row.is-quiet .k-row__title b, .k-row.is-quiet .k-row__count { color:var(--k-ink-muted); }
.k-desk__foot { display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; padding:12px 12px 0; font-size:var(--k-fs-meta); color:var(--k-ink-secondary); }
.k-desk__foot b { font-family:var(--k-font-display); font-weight:800; color:var(--k-ink); font-size:13px; }
.k-row__more { padding:2px 4px 0; }
.k-row__empty { font-size:var(--k-fs-meta); color:var(--k-ink-muted); font-style:italic; padding:6px 2px; margin:0; }

/* the row-card — headline · dollars · kind chip · age · Open ▸ (no primary: the window carries it) */
.k-rowcard { display:grid; grid-template-columns:minmax(0,1fr) 84px var(--k-kind-w,104px) 112px 44px; gap:12px; align-items:center; box-sizing:border-box; background:var(--k-white); border:1px solid var(--k-hairline); border-radius:14px;
  padding:12px 14px; box-shadow:0 1px 2px rgba(1,42,56,.05); transition:transform .15s ease; cursor:pointer; }
.k-rowcard:hover { transform:translateY(-1px); }
.k-rowcard__h { font-size:13.5px; font-weight:700; line-height:1.3; margin:0; }
.k-rowcard__why { font-size:var(--k-fs-meta); color:var(--k-ink-secondary); line-height:1.4; margin:2px 0 0; }
.k-rowcard__amt { font-family:var(--k-font-display); font-weight:800; font-size:13.5px; text-align:right; font-variant-numeric:tabular-nums; }
.k-rowcard__amt.is-none { color:var(--k-ink-muted); font-family:var(--k-font-body); font-weight:600; }
.k-rowcard__go { text-align:right; }

/* CC1-B (mock kept-note-vs-charge-row) — the Note vs charge row: title chip, unit under the count, "reviewed" under the dollars, the paired
   under/over strip, the visit row-card (initials · name + DOS · sentence · chips), the footnote. Additive: no other row draws any of this. */
.k-nv-kind { margin-left:6px; vertical-align:2px; }
.k-row__unit, .k-row__rev { display:block; font-family:var(--k-font-body); font-weight:600; font-size:10px; color:var(--k-ink-muted); text-transform:none; letter-spacing:0; }
.k-row__rev { text-transform:uppercase; letter-spacing:.05em; }
.k-nv-pair { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:2px 0 4px; }
.k-nv-half { border-radius:14px; padding:10px 14px; display:flex; flex-direction:column; gap:1px; border:1px solid var(--k-hairline); background:var(--k-white); }
.k-nv-half.under { border-left:4px solid var(--k-info); }
.k-nv-half.over { border-left:4px solid var(--k-attention); }
.k-nv-lbl { font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--k-ink-muted); }
.k-nv-half b { font-family:var(--k-font-display); font-weight:800; font-size:var(--k-fs-17); font-variant-numeric:tabular-nums; }
.k-nv-half small { font-size:11px; color:var(--k-ink-secondary); }
.k-rowcard--nvc { grid-template-columns:34px minmax(0,1fr) 84px 44px; align-items:start; }
.k-nv-av { width:34px; height:34px; border-radius:50%; background:var(--k-shade-3,var(--k-tint)); color:var(--k-ink); display:flex; align-items:center; justify-content:center; font-family:var(--k-font-display); font-weight:800; font-size:12px; }
.k-nv-dos { font-weight:600; color:var(--k-ink-secondary); font-size:12.5px; font-variant-numeric:tabular-nums; }
.k-nv-chips { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.k-rowcard--nvc .k-rowcard__amt { padding-top:2px; }
.k-rowcard--nvc .k-rowcard__go { padding-top:3px; }
.k-nv-law { font-size:11.5px; color:var(--k-ink-secondary); font-style:italic; margin:2px 4px 0; }
/* CC5 (compliance lane): "second reviewer required to dismiss" under a paid-claim row-card; the rail's overpayment clocks use the same .k-follow-* rows as every other clock */
.k-cl-2nd { font-size:11px; color:var(--k-ink-muted); font-style:italic; margin:6px 0 0; }
@media (max-width:768px) {
  .k-nv-pair { grid-template-columns:1fr; }
  .k-rowcard--nvc { grid-template-columns:34px minmax(0,1fr) auto; }
  .k-rowcard--nvc .k-rowcard__h-wrap { grid-column:auto; }
}
@media (max-width:480px) {
  .k-rowcard--nvc { grid-template-columns:34px minmax(0,1fr); }
  .k-rowcard--nvc .k-rowcard__amt, .k-rowcard--nvc .k-rowcard__go { grid-column:2; text-align:left; }
}
@media (max-width:768px) {
  .k-desk__cols { display:none; }
  .k-row__head { display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center; }
  .k-row__title { flex:1 1 100%; }
  .k-row__chev { margin-left:auto; }
  .k-rowcard { grid-template-columns:minmax(0,1fr) auto; row-gap:6px; }
  .k-rowcard__h-wrap { grid-column:1 / -1; }
}
@media (max-width:480px) {
  .k-rowcard { grid-template-columns:minmax(0,1fr); }
  .k-rowcard__amt, .k-rowcard__go { text-align:left; }
}

/* ---------- the right rail — one order on every room ---------- */
.k-rail { display:flex; flex-direction:column; gap:20px; min-width:0; }
.k-rail-card { background:var(--k-white); border:1px solid var(--k-hairline); border-radius:var(--k-r-card); box-shadow:var(--k-shadow-card); padding:20px 22px 16px; box-sizing:border-box; min-width:0; }
.k-follow-lead { font-family:var(--k-font-display); font-weight:800; font-size:var(--k-fs-17); letter-spacing:-.005em; margin:0 0 12px; font-variant-numeric:tabular-nums; }
.k-follow-row { padding:10px 0; border-top:1px solid var(--k-hairline); }
.k-follow-row:first-of-type { border-top:none; padding-top:0; }
.k-follow-top { display:flex; justify-content:space-between; gap:10px; font-size:var(--k-fs-meta); font-weight:600; margin-bottom:5px; }
.k-follow-top .amt { font-weight:700; font-variant-numeric:tabular-nums; }
.k-follow-track { height:5px; background:var(--k-tint); border-radius:4px; overflow:hidden; margin-bottom:4px; }
.k-follow-fill { display:block; height:100%; background:var(--k-ink); }
.k-follow-fill[data-tone="alert"] { background:var(--k-alert); }
.k-follow-fill[data-tone="warn"] { background:var(--k-attention); }
.k-follow-note { font-size:var(--k-fs-micro); color:var(--k-ink-muted); }
.k-follow-left { margin-top:12px; padding-top:12px; border-top:1px solid var(--k-hairline); }
.k-follow-left .k-microlabel { margin-bottom:8px; }
.k-tl { list-style:none; margin:0; padding:0 0 0 16px; position:relative; }
.k-tl::before { content:""; position:absolute; left:3px; top:4px; bottom:4px; width:1px; background:var(--k-hairline-2); }
.k-tl-row { position:relative; padding:0 0 14px 14px; }
.k-tl-row:last-child { padding-bottom:0; }
.k-tl-row::before { content:""; position:absolute; left:-16px; top:4px; width:7px; height:7px; border-radius:50%; background:var(--k-ink-muted); }
.k-tl-row[data-tone="ok"]::before { background:var(--k-success); }
.k-tl-row[data-tone="warn"]::before { background:var(--k-attention); }
.k-tl-row[data-tone="alert"]::before { background:var(--k-alert); }
.k-tl-row[data-tone="ink"]::before { background:var(--k-ink-secondary); }
.k-tl-time { font-size:var(--k-fs-micro); color:var(--k-ink-muted); display:block; margin-bottom:2px; font-variant-numeric:tabular-nums; }
.k-tl-text { font-size:var(--k-fs-meta); color:var(--k-ink); line-height:1.45; }
.k-tl-text .k-glyph { color:var(--k-ink-secondary); font-weight:800; margin-right:3px; }
.k-tl-foot { font-size:var(--k-fs-micro); color:var(--k-ink-muted); font-style:italic; margin:16px 0 0; padding-top:12px; border-top:1px solid var(--k-hairline); }
.k-doc-row { display:flex; flex-direction:column; gap:3px; padding:10px 0; border-top:1px solid var(--k-hairline); }
.k-doc-row:first-of-type { border-top:none; padding-top:0; }
.k-doc-row__h { font-size:13px; font-weight:700; }
.k-doc-row__why { font-size:var(--k-fs-meta); color:var(--k-ink-secondary); line-height:1.4; margin:0 0 6px; }
.k-door-list { display:flex; flex-direction:column; }
.k-door-row { display:flex; justify-content:space-between; align-items:baseline; gap:10px; width:100%; box-sizing:border-box; background:none; border:0; border-top:1px solid var(--k-hairline); padding:9px 0; font:inherit; font-size:13px; font-weight:600; color:var(--k-ink); cursor:pointer; text-align:left; text-decoration:none; }
.k-door-row:first-child { border-top:none; padding-top:0; }
.k-door-row:hover .l { text-decoration:underline; text-decoration-color:var(--k-aqua-soft); }
.k-door-row .r { font-size:var(--k-fs-meta); color:var(--k-ink-muted); font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.k-quiet-door { font-size:var(--k-fs-meta); font-weight:700; color:var(--k-ink-muted); padding:0 4px; cursor:pointer; background:none; border:0; font-family:inherit; text-decoration:none; text-align:left; }
.k-quiet-door:hover { color:var(--k-ink); text-decoration:underline; text-decoration-color:var(--k-aqua-soft); }
.k-rail-empty { font-size:var(--k-fs-meta); color:var(--k-ink-muted); font-style:italic; margin:0; }

/* the MFA banner, restyled to the rail-card tokens (G1, doc 45 §3 / DECISIONS U0): a
   banner (enforcement stays a banner) that looks like every other rail card, identical on
   every page — kept-shell.mjs builds it, tone rides a status chip, never a second orange. */
.kept-mfa-banner { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; box-sizing:border-box; width:min(var(--k-content), calc(100% - 48px));
  margin:12px auto 0; padding:12px 20px; background:var(--k-white); border:1px solid var(--k-hairline); border-radius:var(--k-r-card); box-shadow:var(--k-shadow-card);
  font-family:var(--k-font-body); font-size:var(--k-fs-meta); color:var(--k-ink); }
.kept-mfa-banner__words { display:flex; align-items:center; gap:10px; flex:1 1 280px; min-width:0; line-height:1.4; }
.kept-mfa-banner button { font:inherit; font-weight:700; color:var(--k-ink); background:none; border:none; cursor:pointer; text-decoration:underline; text-decoration-color:var(--k-aqua-soft); text-underline-offset:3px; padding:0; white-space:nowrap; }
.kept-mfa-banner button:hover { color:var(--k-ink); text-decoration-color:var(--k-ink-secondary); }
.kept-mfa-banner button:disabled { color:var(--k-ink-muted); cursor:default; text-decoration:none; }

/* the shell wordmark (G11, U6 revised 10/12): "Kept" in the display face, the Amaze Tech mark AFTER the T in the
   exact box the ✳ had (13px) — the ✳ now lives only on the assistant's own floating button and in receipts. */
.kept-rail__brand img { height:13px; width:auto; display:block; flex-shrink:0; }

/* ============================================================================
 * WD1-3 (Fable's walk 10/22/2026) — never a horizontal scroll, at any width from 375 up.
 *  · the shell rail's doors row: a flex item's automatic minimum is its content, and five nowrap doors are ~398px — so the row could not shrink under
 *    a 375px bottom bar. min-width:0 lets it shrink (the doors already ellipsis); between 481 and 900 the rail drops the client name and the lens
 *    chip (the lens word is on the page) and the doors become a scrollable pill row (the only horizontal scroller, and it is inside the rail).
 *  · a long sentence-link is a link to a place, not a unit: it wraps.
 * ========================================================================== */
.kept-rail__doors { min-width:0; }
@media (max-width:1100px) { .kept-client { display:none; } }
@media (max-width:900px) {
  .kept-lens { display:none; }
  .kept-rail { gap:10px; padding:0 12px; }
  .kept-rail__doors { justify-content:flex-start; overflow-x:auto; scrollbar-width:none; margin:0; }
  .kept-rail__doors::-webkit-scrollbar { display:none; }
  .kept-door { flex:0 0 auto; }
}
@media (max-width:480px) {
  .kept-rail__doors { overflow-x:hidden; }
  .kept-door { flex:1 1 0; min-width:0; }
}
.k-nv-source .k-link, .k-nv-law .k-link, .k-row__title small, .k-rowcard__why { white-space:normal; overflow-wrap:anywhere; }
.k-nv-law { overflow-wrap:anywhere; }

/* ============================================================================
 * VA1 (briefs/VA1-view-as.md, 10/27/2026) — "View as", a superadmin's lens control. A quiet chip in the rail ("Viewing as: Superadmin ▾") that opens a small
 * menu card (the shell's own tokens — hairline, card radius, the one shadow). Never orange: the control is a way of looking, not an action. A viewing superadmin
 * sees the lens's screens under ONE banner line (`.kept-mfa-banner[data-banner="view_as"]`) with a plain "Back to superadmin" button. Three chip shapes only.
 * ========================================================================== */
.kept-viewas-wrap { position:relative; display:inline-flex; }
.kept-lens.kept-viewas { cursor:pointer; font-family:var(--k-font-body); display:inline-flex; align-items:center; gap:6px; }
.kept-lens.kept-viewas:hover { color:var(--k-ink); border-color:var(--k-ink-muted); }
.kept-lens.kept-viewas:focus-visible { outline:2px solid var(--k-aqua-soft); outline-offset:2px; }
.kept-lens.kept-viewas[data-viewing="1"] { color:var(--k-ink); background:var(--k-aqua-soft-wash, var(--k-tint)); border-color:var(--k-ink-muted); }
.kept-viewas-menu { position:absolute; top:calc(100% + 8px); right:0; z-index:9600; min-width:230px; max-width:min(300px, calc(100vw - 24px)); box-sizing:border-box;
  background:var(--k-white); border:1px solid var(--k-hairline); border-radius:var(--k-r-card, 18px); box-shadow:var(--k-shadow-card); padding:8px; font-family:var(--k-font-body); }
.kept-viewas-menu__head { margin:2px 8px 6px; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--k-ink-muted); }
.kept-viewas-menu button { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; box-sizing:border-box; text-align:left; font:inherit; font-size:var(--k-fs-meta, 13px); font-weight:600;
  color:var(--k-ink); background:none; border:none; border-radius:10px; padding:8px 10px; cursor:pointer; }
.kept-viewas-menu button:hover:not([disabled]) { background:var(--k-tint); }
.kept-viewas-menu button:focus-visible { outline:2px solid var(--k-aqua-soft); outline-offset:-2px; }
.kept-viewas-menu button[aria-checked="true"] { background:var(--k-tint); }
.kept-viewas-menu button[aria-checked="true"]::after { content:'✓'; color:var(--k-ink-secondary); font-weight:700; }
.kept-viewas-menu button[aria-expanded]::after { content:'▸'; color:var(--k-ink-muted); }
.kept-viewas-menu button[aria-expanded="true"]::after { content:'▾'; }
.kept-viewas-sub { margin:0 0 4px 10px; padding-left:8px; border-left:1px solid var(--k-hairline); }
.kept-viewas-sub button { font-weight:500; }
.kept-viewas-menu hr { border:none; border-top:1px solid var(--k-hairline); margin:6px 4px; }
.kept-viewas-menu .kept-viewas-note { margin:4px 10px 6px; font-size:11px; color:var(--k-ink-muted); line-height:1.4; }
.kept-mfa-banner[data-banner="view_as"] strong { font-weight:800; }
@media (max-width:900px) { .kept-lens.kept-viewas { display:inline-flex; } }
@media (max-width:480px) {
  .kept-lens.kept-viewas { display:inline-flex; font-size:9.5px; padding:3px 7px; max-width:112px; overflow:hidden; text-overflow:ellipsis; }
  .kept-viewas-menu { position:fixed; left:12px; right:12px; bottom:62px; top:auto; max-width:none; max-height:70vh; overflow:auto; }
}