/* Founders dashboard (Jeff, Sep 30 2026). Same shape as the Safe Harbor
   client dashboard he signed off on that night: light ground, white cards,
   bold sans, colored KPI tiles on top. The colors are the Cabinet's own,
   taken from site/styles.css (ink green, brass, paper), with four deeper
   companions so ten tiles read as a set. */
:root {
  --bg: #F6F4EE;
  --card: #FFFFFF;
  --card-2: #FBFAF7;
  --text: #14201D;
  --text-2: #3D4A45;
  --text-3: #5F6A65;
  --brass: #8C6D3F;
  --brass-dark: #7F6234;
  --notes-accent: #8C6D3F;
  --border: rgba(20, 32, 29, 0.10);
  --border-2: rgba(20, 32, 29, 0.18);
  --good: #1E7A4C; --good-bg: #E3F2E9;
  --bad: #A33B2E;
  --kpi-c1: #14201D;
  --kpi-c2: #8C6D3F;
  --kpi-c3: #2F6B5A;
  --kpi-c4: #35546B;
  --kpi-c5: #9A4E3A;
  --kpi-c6: #4E5D3A;
  --sans: "Inter", "Helvetica Neue", Arial, sans-serif;
  --r1: 8px; --r2: 14px; --r3: 16px;
  --shadow: 0 1px 2px rgba(20,32,29,0.04), 0 8px 24px rgba(20,32,29,0.07);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --wrap: 1180px; --gutter: clamp(20px, 5vw, 56px);
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
button { font: inherit; color: inherit; }
button:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }

/* ---------- Login ---------- */
.login-screen { min-height: 100vh; display: grid; place-items: center; padding: var(--gutter); }
.login-card { width: 100%; max-width: 400px; background: var(--card); border: 1px solid var(--border); border-radius: var(--r3); padding: 40px 36px; box-shadow: var(--shadow); text-align: center; }
.login-card img { height: 44px; max-width: 100%; margin: 0 auto 26px; }
.login-card h1 { font-weight: 700; font-size: 1.4rem; margin: 0 0 6px; }
.login-card p.sub { color: var(--text-2); font-size: 0.9rem; margin: 0 0 28px; }
.login-card input { width: 100%; padding: 14px 16px; background: var(--card-2); border: 1px solid var(--border-2); border-radius: var(--r1); color: var(--text); font-size: 1rem; margin-bottom: 16px; }
.login-card input:focus { outline: 2px solid var(--brass); outline-offset: 2px; }
.login-card .btn { width: 100%; padding: 14px; background: var(--text); color: #FBFAF7; border-radius: var(--r1); font-weight: 700; font-size: 0.95rem; cursor: pointer; border: none; }
.login-card .btn:hover { background: var(--brass); }
.login-card .setup-note { font-size: 0.8rem; color: var(--text-3); margin: 20px 0 0; }
.login-card .err { color: var(--bad); background: #FCEEEC; border-radius: var(--r1); padding: 10px 12px; font-size: 0.86rem; margin: -6px 0 16px; }

/* ---------- Shell ---------- */
/* ---------- Shell, reworked Oct 17 2026 to match the Safe Harbor page:
   a left rail, white cards on the canvas, color only for state. The
   Cabinet's own ink and brass stay as the chrome. ---------- */
:root {
  --on: #1E7A4C; --on-bg: #E3F2E9;
  --warn: #B8860B; --warn-bg: #FBF3DC;
  --off: #A33B2E; --off-bg: #FBECE9;
  --none: #7E8984; --none-bg: #EEF0ED;
  --ink: #14201D; --ink-soft: #AEB8B3; --ink-faint: #E6E9E5;
  --rail: 232px;
}
.fd-nav { border-bottom: 1px solid var(--border); background: var(--card); position: sticky; top: 0; z-index: 20; }
/* The Cabinet lockup at twice its size (Jeff, Oct 27 2026: "100% larger"), the header grown to hold it. */
.fd-nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 100px; padding: 0 28px; }
.fd-brand { display: flex; align-items: center; gap: 14px; min-width: 0; }
.fd-brand img { height: 68px; width: auto; max-width: 100%; }
.fd-badge { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--brass-dark); border: 1px solid var(--brass); border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.fd-nav-right { display: flex; align-items: center; gap: 14px; min-width: 0; }
.fd-asof { font-size: 0.8rem; font-weight: 600; color: var(--text-2); background: var(--card-2); border: 1px solid var(--border); padding: 8px 14px; border-radius: var(--r1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 48ch; }
.fd-nav button.logout { font-size: 0.86rem; font-weight: 600; background: var(--card-2); border: 1px solid var(--border-2); padding: 9px 16px; border-radius: var(--r1); cursor: pointer; white-space: nowrap; }
.fd-nav button.logout:hover { border-color: var(--brass); }

.fd-shell { display: grid; grid-template-columns: var(--rail) minmax(0, 1fr); min-height: calc(100vh - 100px); }
.fd-rail { background: var(--card); border-right: 1px solid var(--border); padding: 22px 14px; display: flex; flex-direction: column; gap: 22px; position: sticky; top: 100px; align-self: start; height: calc(100vh - 100px); }
.fd-tabs { display: flex; flex-direction: column; gap: 4px; }
.fd-tabs button { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: none; border: 0; padding: 11px 14px; border-radius: 10px; font-size: 0.92rem; font-weight: 600; color: var(--text-3); cursor: pointer; white-space: nowrap; }
.fd-tabs button::before { content: ""; width: 20px; height: 20px; flex: 0 0 20px; background: currentColor; -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat; opacity: 0.85; }
.fd-tabs button:hover { background: var(--card-2); color: var(--text); }
.fd-tabs button[aria-selected="true"] { background: rgba(140,109,63,0.12); color: var(--text); }
.fd-tabs button[data-tab="notes"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11l3 3 8-8'/%3E%3Cpath d='M20 12v7a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h9'/%3E%3C/svg%3E"); }
.fd-tabs button[data-tab="overview"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E"); }
.fd-tabs button[data-tab="opportunities"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M7 15l4-4 3 3 6-7'/%3E%3C/svg%3E"); }
.fd-tabs button[data-tab="clients"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); }
.fd-tabs button[data-tab="safeharbor"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l8 4v6c0 5-3.5 8.5-8 10-4.5-1.5-8-5-8-10V6z'/%3E%3C/svg%3E"); }
.fd-tabs button[data-tab="insyght"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E"); }
.fd-tabs button[data-tab="giorgi"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s7-6 7-12a7 7 0 1 0-14 0c0 6 7 12 7 12z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }
.fd-group { display: flex; flex-direction: column; gap: 4px; }
.fd-group-toggle { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: none; border: 0; padding: 11px 14px; border-radius: 10px; font-size: 0.92rem; font-weight: 600; color: var(--text-3); cursor: pointer; white-space: nowrap; }
.fd-group-toggle::before { content: ""; width: 20px; height: 20px; flex: 0 0 20px; background: currentColor; -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat; opacity: 0.85; --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='14' rx='2'/%3E%3Cpath d='M3 9h18M8 21h8'/%3E%3C/svg%3E"); }
.fd-group-toggle::after { content: ""; margin-left: auto; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform 0.18s var(--ease); opacity: 0.7; }
.fd-group-toggle[aria-expanded="true"]::after { transform: rotate(-135deg); }
.fd-group-toggle:hover, .fd-group-toggle[aria-expanded="true"] { background: var(--card-2); color: var(--text); }
.fd-group-list { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 6px 14px; border-left: 2px solid var(--border); margin-left: 23px; }
.fd-group-label { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--brass-dark); padding: 10px 12px 2px; }
.fd-group-list button, .fd-group-list a.fd-ext { padding: 8px 12px; font-size: 0.88rem; }
.fd-group-list button::before { display: none; }
/* A dashboard behind its own sign-in elsewhere: a link in the drop down that opens it in a new tab, no pane of its own (Oct 27 2026). */
.fd-group-list a.fd-ext { display: flex; align-items: center; gap: 8px; width: 100%; border-radius: 10px; font-weight: 600; color: var(--text-3); text-decoration: none; }
.fd-group-list a.fd-ext:hover { background: var(--card-2); color: var(--text); }
.fd-group-list a.fd-ext::after { content: ""; margin-left: auto; width: 9px; height: 9px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); opacity: 0.6; }
.fd-rail-legend { margin-top: auto; display: grid; gap: 6px; padding: 14px 14px 4px; border-top: 1px solid var(--border); font-size: 0.76rem; color: var(--text-3); }
.fd-rail-legend span { display: flex; align-items: center; gap: 8px; }
.dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: 0 0 9px; }
.dot.on { background: var(--on); } .dot.warn { background: var(--warn); } .dot.off { background: var(--off); } .dot.none { background: var(--none); }

.fd-main { padding: 26px 28px 40px; min-width: 0; }
.fd-panel { padding: 0; }
.fd-panel[hidden] { display: none; }
.fd-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 16px; margin-bottom: 16px; flex-wrap: wrap; }
.fd-head h2 { font-weight: 800; font-size: 1.35rem; margin: 0; letter-spacing: -0.01em; }
.fd-head .note { font-size: 0.82rem; color: var(--text-3); }

/* ---------- Tiles: white cards, state in the tag, a gauge where the number
   has a goal or a share ---------- */
.kpi-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; align-content: start; }
.stage-panes > [data-pane] { align-self: start; }
.kpi { background: var(--card); border: 1px solid var(--border); border-radius: var(--r2); padding: 16px 18px 14px; min-height: 124px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: var(--shadow); transition: transform 180ms var(--ease), box-shadow 180ms var(--ease); color: var(--text); position: relative; }
.kpi:hover { transform: translateY(-2px); }
.kpi .label { font-size: 0.8rem; font-weight: 600; color: var(--text-2); line-height: 1.3; }
.kpi .value { font-weight: 800; font-size: 1.75rem; margin-top: 6px; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.kpi .tag { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-3); background: var(--none-bg); align-self: flex-start; margin-top: 10px; padding: 3px 8px; border-radius: 999px; }
.kpi .explain { font-size: 0.72rem; color: var(--text-3); margin-top: 2px; line-height: 1.3; }
.kpi[data-state="live"] .tag, .kpi[data-state="up"] .tag, .kpi[data-state="on"] .tag { background: var(--on-bg); color: var(--on); }
.kpi[data-state="warn"] .tag { background: var(--warn-bg); color: #7A5600; }
.kpi[data-state="off"] .tag, .kpi[data-state="down"] .tag { background: var(--off-bg); color: var(--off); }
.kpi[data-state="unknown"] .tag, .kpi[data-state="none"] .tag { background: var(--none-bg); color: var(--text-2); }
.kpi .kpi-viz { position: absolute; right: 14px; top: 14px; }
.kpi .kpi-viz.spark { position: static; margin-top: 10px; width: 100%; height: 34px; }
.kpi:has(> .kpi-viz.ring) .label, .kpi:has(> .kpi-viz.ring) .explain { padding-right: 64px; }
@media (max-width: 1300px) { .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px) { .kpi-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .kpi { transition: none; } .kpi:hover { transform: none; } }

/* Rings and sparklines (viz.js). */
svg.ring { width: 104px; height: 104px; display: block; margin: 0 auto; }
svg.ring .track { fill: none; stroke: var(--ink-faint); stroke-width: 9; }
svg.ring .arc { fill: none; stroke-width: 9; stroke-linecap: round; transform: rotate(-90deg); transform-origin: 50% 50%; }
svg.ring .over { fill: none; stroke-width: 9; stroke-linecap: round; transform: rotate(-90deg); transform-origin: 50% 50%; opacity: 0.45; }
svg.ring .pace { stroke: var(--text); stroke-width: 2; }
svg.ring text.big { font-size: 20px; font-weight: 800; fill: var(--text); text-anchor: middle; font-family: var(--sans); }
svg.ring text.small { font-size: 9.5px; fill: var(--text-3); text-anchor: middle; font-family: var(--sans); }
.state-on { stroke: var(--on); } .state-warn { stroke: var(--warn); } .state-off { stroke: var(--off); } .state-none { stroke: var(--none); }
svg.spark { width: 100%; height: 34px; display: block; overflow: visible; }
svg.spark .line { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
svg.spark .area { fill: var(--ink); opacity: 0.08; }
svg.spark .last { fill: var(--ink); }

/* The detail drawer (viz.js), slid in from the right. */
.sh-drawer-back { position: fixed; inset: 0; background: rgba(20, 32, 29, 0.18); z-index: 40; }
.sh-drawer-back[hidden] { display: none; }
.sh-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(460px, 100vw); background: var(--card); border-left: 1px solid var(--border); box-shadow: -12px 0 32px rgba(20, 32, 29, 0.12); z-index: 41; display: flex; flex-direction: column; animation: sh-drawer-in 220ms var(--ease); }
.sh-drawer[hidden] { display: none; }
@keyframes sh-drawer-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .sh-drawer { animation: none; } }
.sh-drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px 14px; border-bottom: 1px solid var(--border); }
.sh-drawer-title { margin: 0; font-size: 1rem; font-weight: 800; color: var(--text); }
.sh-drawer-close { width: 34px; height: 34px; border: 1px solid var(--border-2); border-radius: var(--r1); background: var(--card-2); color: var(--text-2); font-size: 1.3rem; line-height: 1; cursor: pointer; }
.sh-drawer-close:hover { border-color: var(--brass); color: var(--text); }
.sh-drawer-body { padding: 16px 20px 28px; overflow-y: auto; flex: 1; }
.sh-drawer-body .kpi-detail-title { display: none; }
.sh-drawer-body .kpi-detail-open { margin-left: auto; }
.sh-drawer-body svg.spark { height: 48px; margin: 6px 0 12px; }
body.sh-drawer-open .kpi.live[aria-expanded="true"] { border-color: var(--brass); box-shadow: 0 0 0 2px var(--brass), var(--shadow); }

/* ---------- Tables ---------- */
.fd-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r3); box-shadow: var(--shadow); padding: 22px 24px; margin-top: 22px; }
.fd-card h3 { font-size: 1rem; font-weight: 700; margin: 0 0 12px; }
.fd-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 0.9rem; min-width: 640px; }
th { text-align: left; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-3); padding: 0 14px 10px 0; border-bottom: 1px solid var(--border-2); white-space: nowrap; }
td { padding: 12px 14px 12px 0; border-bottom: 1px solid var(--border); font-variant-numeric: tabular-nums; }
tr:last-child td { border-bottom: 0; }
th.r, td.r { text-align: right; padding-right: 0; padding-left: 14px; }
td.empty { color: var(--text-3); text-align: center; padding: 28px 0; }
.pill { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--brass-dark); background: rgba(140,109,63,0.12); padding: 3px 9px; border-radius: 999px; }

/* 60/40 on every tab (Oct 31 2026): the page on the left, Jeff's Chief on
   the right, the Chief column sticky so it stays in view while the page
   scrolls. Under 1100px the Chief drops below the page. */
.fd-split { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 22px; align-items: start; }
.fd-pages { min-width: 0; }
.fd-chief-col { min-width: 0; position: sticky; top: 118px; }
.fd-chief-col .fd-chief-main .chat-log { max-height: calc(100vh - 420px); min-height: 160px; }
@media (max-width: 1100px) {
  .fd-split { grid-template-columns: 1fr; }
  .fd-chief-col { position: static; }
}
/* Custom Pitch (Oct 31 2026): the draft tile on the left, the Chief on the right. */
.fd-lead { margin: -4px 0 0; font-size: 1.05rem; color: var(--text-2); }
.fd-pitch { min-height: 320px; }
.fd-pitch-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.fd-pitch-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-3); }
.fd-pitch-copy { padding: 7px 14px; border: 1px solid var(--border-2, var(--border)); border-radius: var(--r1, 10px); background: var(--card-2, var(--card)); font-weight: 600; font-size: 0.82rem; color: var(--text-2); cursor: pointer; }
.fd-pitch-copy[hidden] { display: none; }
.fd-pitch-body { font-size: 1rem; line-height: 1.6; white-space: pre-wrap; color: var(--text); }
.fd-pitch-body .hn-empty { white-space: normal; }
/* Show mode: the New York desk is off the rail and off the page. */
.fd-show[aria-pressed="true"] { background: var(--text); color: #FBFAF7; }
body.fd-showing #tab-nydesk, body.fd-showing #nydesk { display: none !important; }
.fd-frame { display: block; width: 100%; height: calc(100vh - 182px); min-height: 640px; border: 1px solid var(--border); border-radius: var(--r2); background: var(--card); box-shadow: var(--shadow); }

.fd-footer { padding: 22px 28px 36px; color: var(--text-3); font-size: 0.8rem; border-top: 1px solid var(--border); background: var(--card); }

@media (max-width: 900px) {
  .fd-shell { grid-template-columns: 1fr; }
  .fd-rail { position: static; height: auto; border-right: 0; border-bottom: 1px solid var(--border); padding: 10px 12px; }
  .fd-tabs { flex-direction: row; }
  .fd-tabs button { width: auto; padding: 9px 12px; }
  .fd-tabs { flex-wrap: wrap; }
  .fd-group { flex: 1 1 100%; }
  .fd-group-list { display: grid; grid-template-columns: 1fr; gap: 2px; border-left: 0; margin: 0; padding: 2px 0 6px; }
  .fd-group-label { grid-column: 1 / -1; }
  .fd-rail-legend { display: none; }
  .fd-main { padding: 18px 16px 32px; }
  .fd-nav-inner { height: 84px; padding: 0 16px; }
  .fd-brand img { height: 56px; }
  .fd-asof { display: none; }
  .fd-card { padding: 18px 16px; }
}

/* ---------- Live data states ---------- */
.fd-banner { margin: 0 0 14px; padding: 10px 14px; border: 1px solid var(--brass); border-radius: var(--r1); background: rgba(140,109,63,0.10); color: var(--text-2); font-size: 0.86rem; }
.fd-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; color: var(--text-3); font-size: 0.78rem; }
.fd-day { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.fd-day .n { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.fd-day .track { display: flex; align-items: flex-end; width: 100%; max-width: 56px; height: 120px; background: rgba(20,32,29,0.05); border-radius: 6px; overflow: hidden; }
.fd-day .bar { display: block; width: 100%; background: var(--kpi-c3); border-radius: 6px 6px 0 0; min-height: 2px; }
.fd-day .d { text-align: center; line-height: 1.2; }

/* ---------- The Safe Harbor tab (Oct 7 2026): the same Chief desk Andy's
   dashboard mounts, in this page's own tokens. guide.js renders inline. */
.fd-chief { margin-top: 22px; }
.sh-chief-mount { background: var(--card); border: 1px solid var(--border); border-radius: var(--r3); box-shadow: var(--shadow); position: relative; overflow: hidden; }
.guide-panel.inline { position: relative; z-index: 1; display: flex; flex-direction: column; padding: 24px 26px 22px; }
.guide-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.guide-name { font-weight: 700; font-size: 1.1rem; margin: 0; color: var(--text); }
.guide-head-tools { display: flex; align-items: center; gap: 12px; }
.guide-live { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--good); background: var(--good-bg); padding: 5px 10px; border-radius: 999px; }
.guide-min, .guide-dock { width: 30px; height: 30px; border: 1px solid var(--border-2); border-radius: var(--r1); background: var(--card-2); cursor: pointer; color: var(--text-2); }
.chat-log { display: flex; flex-direction: column; gap: 12px; max-height: 360px; min-height: 160px; overflow-y: auto; padding: 4px 2px 14px; border-bottom: 1px solid var(--border); margin-bottom: 14px; }
.chat-msg { max-width: 78%; padding: 11px 15px; border-radius: 14px; font-size: 0.95rem; line-height: 1.5; }
.chat-msg.staff { align-self: flex-start; background: var(--card-2); color: var(--text); border-bottom-left-radius: 4px; }
.chat-msg.visitor { align-self: flex-end; background: var(--text); color: #FBFAF7; border-bottom-right-radius: 4px; }
.chat-msg.notice { align-self: center; color: var(--text-2); background: none; font-size: 0.85rem; font-style: italic; }
.chat-msg.staff.spoken { box-shadow: inset 0 0 0 1px var(--border-2); }
.chat-msg.visitor.spoken { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35); }
.chat-msg.partial { opacity: 0.6; }
.chat-form { display: flex; gap: 10px; }
.chat-form input { flex: 1; padding: 13px 16px; background: var(--card-2); border: 1px solid var(--border-2); border-radius: var(--r1); color: var(--text); font-size: 0.95rem; }
.chat-form input:focus { outline: 2px solid var(--brass); outline-offset: 2px; }
.chat-form button { padding: 13px 22px; background: var(--text); color: #FBFAF7; border: none; border-radius: var(--r1); font-weight: 700; cursor: pointer; white-space: nowrap; }
.chat-form button:hover { background: var(--brass); }
.chat-form button:disabled { opacity: 0.5; cursor: default; }
.chat-form select.guide-mode { flex: 0 0 auto; max-width: 40%; padding: 13px 14px; background: var(--card-2); border: 1px solid var(--border-2); border-radius: var(--r1); color: var(--text); font-size: 0.88rem; }
@media (max-width: 520px) { .chat-form select.guide-mode { max-width: none; flex-basis: 100%; } }
.guide-voice { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; flex-wrap: wrap; }
.guide-vrow { display: flex; align-items: center; gap: 12px; }
.guide-talk, .guide-stop { padding: 11px 18px; border-radius: var(--r1); font-size: 0.88rem; font-weight: 600; cursor: pointer; border: 1px solid var(--border-2); background: var(--card-2); color: var(--text); }
.guide-talk:hover:not(:disabled) { border-color: var(--brass); }
.guide-talk:disabled { opacity: 0.4; cursor: default; }
.guide-stop { border-color: rgba(163,59,46,0.35); background: #FCEEEC; color: var(--bad); }
.guide-vstate { color: var(--text); font-weight: 500; font-size: 0.84rem; margin: 0; }
.guide-voice > label { display: flex; align-items: flex-start; gap: 8px; font-size: 0.78rem; color: var(--text-3); max-width: 40ch; cursor: pointer; }
.guide-voice > label input { margin-top: 3px; }
.guide-panel.floating { position: fixed; right: 20px; bottom: 20px; width: min(380px, calc(100vw - 40px)); max-height: 70vh; background: var(--card); border: 1px solid var(--border-2); border-radius: var(--r2); box-shadow: var(--shadow); z-index: 60; overflow-y: auto; }
.guide-panel.floating.min .chat-log, .guide-panel.floating.min .chat-form, .guide-panel.floating.min .guide-voice { display: none; }
.guide-placeholder { padding: 20px; border: 1px dashed var(--border-2); border-radius: var(--r2); text-align: center; color: var(--text-2); font-size: 0.88rem; }
.guide-placeholder button { margin-top: 10px; padding: 8px 14px; border: 1px solid var(--border-2); border-radius: var(--r1); background: var(--card-2); cursor: pointer; }

/* A quiet desk (Oct 7 2026): no opening line, the text box right under the
   log, the mode picker in its own small row beneath it. */
.chat-log { min-height: 0; }
.chat-log:empty { display: none; }
.guide-modes { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: 0.78rem; color: var(--text-3); }
.guide-modes-label { font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.guide-modes select.guide-mode { padding: 7px 10px; background: var(--card-2); border: 1px solid var(--border-2); border-radius: var(--r1); color: var(--text-2); font-size: 0.82rem; }

/* Under the text box (Oct 7 2026): mode picker left, Talk on the right under Send. */
.guide-under { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; flex-wrap: wrap; }
.guide-under .guide-modes { margin-top: 0; }
.guide-under .guide-voice { margin-top: 0; justify-content: flex-end; }

/* Talk in the text-box row, right of Send (Oct 7 2026). */
.chat-form .guide-vrow { display: flex; align-items: center; gap: 8px; }
.chat-form .guide-talk, .chat-form .guide-stop { padding: 13px 18px; }
.chat-form .guide-vstate { font-size: 0.8rem; max-width: 22ch; }
.guide-voice:empty { display: none; }
.guide-under:has(.guide-voice:empty) { justify-content: flex-start; }

/* Upload into the Cabinet AI library from the Safe Harbor tab (Oct 9 2026),
   the same control as Andy's dashboard. The control itself is moved into
   the row under the text box by founders.js; the panel keeps the list. */
.sh-upload-panel { padding: 0; }
.sh-upload { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.sh-upload label.btn { padding: 11px 18px; border: 1px solid var(--border-2, var(--border)); border-radius: var(--r1, 10px); background: var(--card-2, var(--card)); font-weight: 600; font-size: 0.88rem; color: var(--text-2); cursor: pointer; }
.sh-upload label.btn.disabled { cursor: not-allowed; opacity: 0.55; pointer-events: none; }
.sh-upload input[type="file"] { display: none; }
.sh-upload .status { font-size: 0.84rem; color: var(--text-2); }
.sh-upload-list { list-style: none; margin: 10px 0 0; padding: 0; font-size: 0.82rem; color: var(--text-2); display: grid; gap: 4px; }
.sh-upload-list:empty { display: none; }

/* Live Metrics tiles (Ninety.io, Oct 9 2026): on track reads calm, off track reads warm. */

/* Metrics drill-down (Oct 11): tiles are buttons, the detail opens under the grid. */
.kpi.live { cursor: pointer; outline: none; }
.kpi.live:focus-visible { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--text); }
.kpi.live[aria-expanded="true"] { border-color: var(--brass); box-shadow: 0 0 0 2px var(--brass), var(--shadow); }
.kpi-detail { grid-column: 1 / -1; background: #fff; color: var(--text); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); padding: 18px 20px; }
.kpi-detail[hidden] { display: none; }
.kpi-detail-title { margin: 0 0 4px; font-size: 1rem; font-weight: 700; }
.kpi-detail-lead { margin: 0 0 12px; font-size: 0.85rem; color: #5b6673; line-height: 1.45; }
.kpi-detail-empty { margin: 0; font-size: 0.88rem; color: #5b6673; }
.kpi-detail-list { list-style: none; margin: 0; padding: 0; }
.kpi-detail-list .row { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-top: 1px solid #edf0f3; font-size: 0.88rem; }
.kpi-detail-list .row:first-child { border-top: none; }
.kpi-detail-list .main { font-weight: 600; }
.kpi-detail-list .meta { color: #5b6673; text-align: right; font-variant-numeric: tabular-nums; }
.kpi-detail-list .row.muted .meta { color: #9aa3ad; }
.kpi-detail-list .row.warn .meta { color: #B5482A; }
@media (max-width: 560px) { .kpi-detail-list .row { flex-direction: column; gap: 2px; } .kpi-detail-list .meta { text-align: left; } }
.kpi-detail-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.kpi-detail-open { font-size: 0.82rem; font-weight: 600; color: #fff; background: #1d2733; padding: 6px 12px; border-radius: 999px; text-decoration: none; white-space: nowrap; }
.kpi-detail-open:hover, .kpi-detail-open:focus-visible { background: #33475b; }
.sh-upload-panel { display: none; }
