/* Internal dashboard — page widgets and layouts (loaded after ops-shell.css) */

/* --- Shared animations (deduped from pages) --- */
@keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }


@keyframes pulse { 0% { opacity:.45; } 50% { opacity:1; } 100% { opacity:.45; } }


@keyframes chatPulse { 0%, 80%, 100% { opacity:.35; transform:scale(.9); } 40% { opacity:1; transform:scale(1); } }


/* --- OKR donut + compact variant (morning brief + board reporting) --- */
.okr-donut-row {
 display: flex;
 align-items: flex-start;
 gap: var(--space-xl);
 margin: var(--space-sm) 0 var(--space-md);
}
.okr-donut-left {
 display: flex;
 align-items: center;
 gap: 18px;
 min-width: 0;
 max-width: 100%;
 flex: 0 1 auto;
}

@media (max-width: 1100px) {
 .okr-donut-row:not(.okr-donut--compact) {
  flex-direction: column;
 }
 .okr-donut-left {
  width: 100%;
 }
}
.okr-donut-right {
 flex: 1;
 min-width: 0;
}
.okr-donut-svg {
 width: 160px;
 height: 160px;
 flex: 0 0 160px;
}
.okr-donut-center-total {
 font-size: var(--font-size-display); font-weight: 700;
 fill: var(--text-1);
 text-anchor: middle;
 dominant-baseline: middle;
}
.okr-donut-center-label {
 font-size: var(--font-size-meta); letter-spacing: 0.08em;
 text-transform: uppercase;
 fill: var(--text-3);
 text-anchor: middle;
 dominant-baseline: middle;
}
.okr-donut-legend {
 display: grid;
 gap: var(--space-sm);
}
.okr-donut-legend-item {
 display: inline-flex;
 align-items: center;
 gap: var(--space-sm);
 color: var(--text-2);
}
.okr-donut-swatch {
 width: 10px;
 height: 10px;
 border-radius: var(--radius-pill);
 display: inline-block;
}
.okr-donut-row.okr-donut--compact {
 margin: 0 0 var(--space-lg);
}
.okr-donut--compact .okr-donut-left {
 min-width: 0;
 flex-shrink: 0;
}
.okr-donut--compact .okr-donut-svg {
 width: 140px;
 height: 140px;
 flex: 0 0 140px;
}
.okr-donut--compact .okr-donut-center-total {
 font-size: var(--font-size-title);}
.okr-donut--compact .okr-donut-center-label {
 font-size: var(--font-size-label);}
.okr-donut--compact .okr-donut-legend {
 gap: 7px;
}
.okr-donut--compact .okr-donut-legend-item {
 font-size: var(--font-size-body);}
.okr-donut--compact .okr-donut-swatch {
 width: 9px;
 height: 9px;
 flex-shrink: 0;
}
.okr-donut-side-stats {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 6px;
 flex: 1;
 min-width: 0;
}
@media (max-width: 860px) {
 .okr-donut-row.okr-donut--compact {
  flex-direction: column;
 }
 .okr-donut--compact .okr-donut-side-stats {
  grid-template-columns: 1fr 1fr;
 }
}
@media (max-width: 1080px) {
 .okr-donut-row:not(.okr-donut--compact) {
  flex-direction: column;
 }
 .okr-donut-row:not(.okr-donut--compact) .okr-donut-left {
  min-width: 0;
 }
}

.okr-summary {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: var(--space-sm);
 margin: 0;
}
.okr-stat {
 border: 1px solid var(--border);
 border-radius: var(--radius-md);
 padding: var(--space-sm);
 background: var(--surface);
}
.okr-stat .k {
 font-size: var(--font-size-meta); color: var(--text-muted);
}
.okr-stat .v {
 font-size: var(--font-size-title); font-weight: 700;
 margin-top: 4px;
}
.okr-stat.good .v {
 color: var(--color-success);
}
.okr-stat.warn .v {
 color: var(--color-warning);
}
.okr-stat.bad .v {
 color: var(--color-danger);
}

/* --- Morning brief [morning-brief.html] — full-width stacked editorial layout --- */

.loading .spin { display:inline-block; animation:spin 1s linear infinite; }

.morning-brief-page .morning-brief-stack {
 display: flex;
 flex-direction: column;
 gap: var(--space-3xl);
 width: 100%;
 min-width: 0;
}

.morning-brief-page .morning-brief-greeting {
 font-size: var(--font-size-heading);
 font-weight: 600;
 line-height: 1.4;
 margin: var(--space-md) 0 var(--space-sm);
 letter-spacing: -0.01em;
}

.morning-brief-page .morning-brief-section-title {
 font-family: var(--font-data);
 font-size: var(--font-size-meta); font-weight: 600;
 letter-spacing: 0.06em;
 text-transform: none;
 color: var(--color-text-muted);
 margin: 0 0 var(--space-md);
}

.morning-brief-page .morning-brief-card.card {
 padding: var(--space-xl) 22px;
 margin: 0;
}

.morning-brief-page .kpi-grid--pulse-wide {
 width: 100%;
 margin-bottom: 0;
 gap: 0;
 grid-template-columns: repeat(
  auto-fill,
  minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
 );
 justify-content: start;
}

.morning-brief-page .kpi-card--pulse {
 width: 100%;
 max-width: var(--grid-card-max);
 box-sizing: border-box;
 background: transparent;
 border: none;
 border-radius: 0;
 padding: var(--space-sm) var(--space-lg) var(--space-sm);
 border-right: 1px solid var(--color-border);
 min-width: 0;
}

.morning-brief-page .kpi-card--pulse:nth-child(4n) {
 border-right: none;
}

@media (max-width: 900px) {
 .morning-brief-page .kpi-grid--pulse-wide {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
 }
 .morning-brief-page .kpi-card--pulse {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-md) var(--space-lg);
 }
}

.morning-brief-page .kpi-card--pulse .kpi-value {
 font-size: var(--font-size-display); font-weight: 700;
 font-variant-numeric: tabular-nums;
}

.morning-brief-page .kpi-sub {
 font-family: var(--font-data);
 font-size: var(--font-size-meta); font-weight: 500;
 color: var(--color-text-secondary);
 margin-top: 6px;
 min-height: 1.25em;
}

.ai-insights-link,
.ai-insights-link:visited { color: var(--text-2); }
.ai-insights-link:hover { color: var(--text-1); }

.okr-brief-flagged-title {
 font-size: var(--font-size-meta); font-weight: 600;
 letter-spacing: 0.06em;
 text-transform: none;
 color: var(--color-text-muted);
 margin: var(--space-xl) 0 10px;
}

.morning-brief-page .okr-brief-attention-table {
 width: 100%;
 table-layout: fixed;
}

.morning-brief-page .okr-brief-col-kr { width: 10%; }
.morning-brief-page .okr-brief-col-desc { width: 52%; }
.morning-brief-page .okr-brief-col-status { width: 14%; }
.morning-brief-page .okr-brief-col-time { width: 24%; }

.morning-brief-page .okr-brief-desc-cell {
 white-space: normal;
 word-break: break-word;
 overflow-wrap: anywhere;
 vertical-align: top;
}

.morning-brief-page .okr-brief-timing-overdue {
 color: var(--color-danger);
}

#deliverables-brief-empty.deliverables-brief-empty {
 margin: 0;
 padding: var(--space-3xl) var(--space-lg);
 text-align: center;
 font-size: var(--font-size-body); line-height: 1.5;
 width: 100%;
}

.cultural-brief-list--tight .cultural-brief-list__item {
 margin-bottom: 8px;
}

.cultural-brief-list--tight .cultural-brief-list__item:last-child {
 margin-bottom: 0;
}

.deliverables-brief-group {
 margin-bottom: 16px;
}

.deliverables-brief-group:last-child {
 margin-bottom: 0;
}

.deliverables-brief-group-label {
 font-family: var(--font-body);
 font-size: var(--font-size-meta); font-weight: 300;
 letter-spacing: 0.18em;
 text-transform: none;
 margin-bottom: 8px;
}

.deliverables-brief-list__item {
 margin-bottom: 8px;
}

.deliverables-brief-list__meta {
 display: block;
 font-size: var(--font-size-meta); margin-top: 4px;
 margin-left: 0;
}

.deliverables-brief-more {
 font-size: var(--font-size-meta); list-style: none;
}

.morning-brief-page .okr-donut-row.okr-donut--compact {
 width: 100%;
}
.morning-brief-page .okr-donut--compact .okr-donut-left {
 flex: 1 1 auto;
 min-width: 0;
}

/* --- Board reporting dashboard [board-reporting-dashboard.html] --- */

.board-reporting-page.ops-main {
   display: grid !important;
   grid-template-columns: minmax(0, 1fr) !important;
   gap: var(--space-md);
  }
  .board-reporting-page.ops-main > section.card {
   width: 100%;
   max-width: 100%;
  }
  .okr-heading { display:flex; justify-content:space-between; align-items:center; gap: 10px; margin-bottom: 4px; }
  .okr-heading-left { display:flex; align-items:baseline; gap: 10px; }
  .okr-title {
   font-family: var(--font-brand);
   font-size: var(--font-size-kpi);   font-weight: 400;
   letter-spacing: 0.11em;
   text-transform: uppercase;
   color: var(--text-1);
   line-height: 1.0;
  }
  .okr-quarter {
   color: var(--text-3);
   font-family: var(--font-data);
   font-size: var(--font-size-meta);   font-weight: 700;
   letter-spacing: .1em;
   text-transform: uppercase;
  }
  .okr-collapse-btn {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   line-height: 1;
  }
  .okr-collapse-btn .chev { transition: transform .15s ease; }
  .okr-collapse-btn[aria-expanded="false"] .chev { transform: rotate(-90deg); }
  .okr-obj-table { width:100%; table-layout:fixed; }
  .okr-obj-table col.ref { width:8%; } .okr-obj-table col.obj { width:34%; } .okr-obj-table col.health { width:28%; } .okr-obj-table col.status { width:12%; } .okr-obj-table col.target { width:18%; }
  .okr-ref-lg { color:var(--brand); font-size: var(--font-size-kpi); font-weight:700; }
  .okr-sub { background:rgba(255,255,255,.02); }
  .okr-sub-table { width:100%; table-layout:fixed; }
  .okr-sub-table col.ref { width:10%; } .okr-sub-table col.desc { width:34%; } .okr-sub-table col.progress { width:30%; } .okr-sub-table col.status { width:12%; } .okr-sub-table col.target { width:12%; } .okr-sub-table col.flag { width:2%; }
  .okr-track { height:8px; border-radius:var(--radius-pill); background:var(--color-surface-muted); overflow:hidden; margin-top:4px; }
  .okr-fill { height:100%; background:var(--color-success); }
  .dot-red { width:8px; height:8px; border-radius:var(--radius-pill); background:var(--color-danger); display:inline-block; }
  .nowrap { white-space:nowrap; }
  .truncate { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .fin-strip { display:grid; grid-template-columns:repeat(4,1fr); gap: 10px; margin-bottom:12px; }
  .fin-stat { border:1px solid var(--border); border-radius:var(--radius-md); padding: 10px; background:var(--surface); }
  .fin-stat .k { font-size: var(--font-size-meta); color:var(--text-muted); }
  .fin-stat .v { font-size: var(--font-size-kpi); font-weight:700; margin-top:4px; }
  .fin-seis { display:grid; grid-template-columns:220px 1fr auto; gap: 10px; align-items:center; margin: 10px 0 var(--space-md); }
  .fin-inline-track { height:8px; border-radius:var(--radius-pill); background:var(--color-surface-muted); overflow:hidden; }
  .fin-inline-fill { height:100%; background:var(--color-warning); }
  .fin-commit-track { height:6px; border-radius:var(--radius-pill); background:var(--color-surface-muted); overflow:hidden; margin-top:4px; }
  .fin-commit-fill { height:100%; background:var(--color-success); }
  .ai-panel-head { display:flex; align-items:center; justify-content:space-between; gap: 10px; margin-bottom:8px; }
  .ai-panel-head-right { display:flex; align-items:center; gap: var(--space-sm); }
  .ai-generated { color:var(--text-3); font-size: var(--font-size-meta); font-family:var(--font-data); }
  .ai-icon-btn { width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:var(--radius-sm); background:transparent; color:var(--text-2); cursor:pointer; }
  .ai-icon-btn:disabled { opacity:.55; cursor:not-allowed; }
  .ai-icon-btn .spin { animation:spin 1s linear infinite; display:inline-block; }
  .ai-list { display:grid; gap: var(--space-sm); }
  .ai-row { display:grid; grid-template-columns:auto 1fr auto; align-items:flex-start; gap: 10px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); padding: 10px; }
  .ai-dot { width:8px; height:8px; border-radius:var(--radius-pill); margin-top:6px; background:var(--color-border); }
  .ai-dot[data-urgency="critical"] { background:var(--color-danger); }
  .ai-dot[data-urgency="high"] { background:var(--color-warning); }
  .ai-dot[data-urgency="medium"] { background:var(--color-text-muted); }
  .ai-dot[data-urgency="low"] { background:var(--color-border); }
  .ai-row-headline { margin: 0 0 3px; color:var(--text-1); font-size: var(--font-size-body); font-weight:700; line-height:1.3; }
  .ai-row-detail { margin: 0; color:var(--text-2); font-size: var(--font-size-meta); line-height:1.35; }
  .ai-badge { display:inline-flex; align-items:center; padding: var(--space-xs) var(--space-sm); border-radius:var(--radius-pill); font-size: var(--font-size-meta); letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--border); color:var(--text-2); background:rgba(255,255,255,.03); }
  .ai-badge-commercial { color:var(--color-cat-a-fg); border-color:var(--color-cat-a-border); background:var(--color-cat-a-bg); }
  .ai-badge-financial { color:var(--color-cat-b-fg); border-color:var(--color-cat-b-border); background:var(--color-cat-b-bg); }
  .ai-badge-okr { color:var(--color-cat-a-fg); border-color:var(--color-cat-a-border); background:var(--color-cat-a-bg); }
  .ai-badge-client { color:var(--color-cat-d-fg); border-color:var(--color-cat-d-border); background:var(--color-cat-d-bg); }
  .ai-badge-delivery { color:var(--color-cat-c-fg); border-color:var(--color-cat-c-border); background:var(--color-cat-c-bg); }
  .ai-badge-social { color:var(--color-cat-c-fg); border-color:var(--color-cat-c-border); background:var(--color-cat-c-bg); }
  .ai-skeleton-row { height:48px; border-radius:var(--radius-md); background:var(--color-surface-muted); animation:pulse 1.4s ease-in-out infinite; }
  
  
  @media (max-width:1080px){
   .board-reporting-page .okr-summary{grid-template-columns:1fr;}
  }

/* --- AI intelligence [ai-intelligence.html] --- */

.ai-header {
 display: flex;
 justify-content: flex-end;
 align-items: center;
 flex-wrap: wrap;
 gap: var(--space-md);
 margin-bottom: 12px;
}
  .ai-header-right { display:flex; align-items:center; gap: 10px; }
  .ai-generated-at { color:var(--text-3); font-size: var(--font-size-meta); font-family:var(--font-data); letter-spacing:.08em; text-transform:uppercase; }
  .ai-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap: var(--space-md); }
  .ai-card { position:relative; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); overflow:hidden; }
  .ai-card::before { content:''; position:absolute; inset:0 auto 0 0; width:4px; background:var(--text-muted); }
  .ai-card[data-urgency="critical"]::before { background:var(--color-danger); }
  .ai-card[data-urgency="high"]::before { background:var(--color-warning); }
  .ai-card[data-urgency="medium"]::before { background:var(--color-text-muted); }
  .ai-card[data-urgency="low"]::before { background:var(--color-border); }
  .ai-card-body { padding: var(--space-md) 14px var(--space-md) var(--space-lg); }
  .ai-meta { display:flex; justify-content:space-between; align-items:center; gap: var(--space-sm); margin-bottom:8px; }
  .ai-headline { color:var(--text-1); font-size: var(--font-size-heading); font-weight:700; line-height:1.3; margin: 0 0 6px; }
  .ai-detail { color:var(--text-2); font-size: var(--font-size-body); line-height:1.4; margin: 0 0 var(--space-sm); }
  .ai-data-point { color:var(--text-3); font-size: var(--font-size-meta); font-style:italic; margin: 0; }
  .ai-badge { display:inline-flex; align-items:center; padding: var(--space-xs) var(--space-sm); border-radius:var(--radius-pill); font-size: var(--font-size-meta); letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--border); color:var(--text-2); background:rgba(255,255,255,.03); }
  .badge badge-danger { color:var(--color-text); border-color:var(rgba(192,57,43,0.3)); background:var(--color-danger-dim); }
  .badge badge-warning { color:var(--color-text); border-color:var(rgba(201,146,10,0.25)); background:var(--color-warning-dim); }
  .badge badge-neutral { color:var(--color-text-secondary); border-color:var(--color-border); background:var(--color-surface-muted); }
  .badge badge-neutral { color:var(--color-text-muted); border-color:var(--color-border); background:var(--color-surface-muted); }
  .cat-badge cat-a { color:var(--color-cat-a-fg); border-color:var(--color-cat-a-border); background:var(--color-cat-a-bg); }
  .cat-badge cat-b { color:var(--color-cat-b-fg); border-color:var(--color-cat-b-border); background:var(--color-cat-b-bg); }
  .cat-badge cat-a { color:var(--color-cat-a-fg); border-color:var(--color-cat-a-border); background:var(--color-cat-a-bg); }
  .cat-badge cat-d { color:var(--color-cat-d-fg); border-color:var(--color-cat-d-border); background:var(--color-cat-d-bg); }
  .cat-badge cat-c { color:var(--color-cat-c-fg); border-color:var(--color-cat-c-border); background:var(--color-cat-c-bg); }
  .cat-badge cat-c { color:var(--color-cat-c-fg); border-color:var(--color-cat-c-border); background:var(--color-cat-c-bg); }
  .ai-state { border:1px dashed var(--border); border-radius:var(--radius-md); padding: var(--space-3xl) var(--space-xl); text-align:center; color:var(--text-3); }
  .ai-state h3 { margin: 10px 0 6px; color:var(--text-1); font-size: var(--font-size-heading); font-weight:600; }
  .ai-state p { margin: 0; max-width:620px; margin-inline:auto; }
  .ai-state-icon { width:28px; height:28px; opacity:.75; }
  .ai-skeleton .line { height:10px; border-radius:6px; background:var(--color-surface-muted); animation:pulse 1.4s ease-in-out infinite; }
  .ai-skeleton .line + .line { margin-top:8px; }
  .ai-skeleton .line.w-70 { width:70%; }
  .ai-skeleton .line.w-45 { width:45%; }
  .ai-skeleton .line.w-85 { width:85%; }
  .ai-loading-copy { text-align:center; color:var(--text-3); margin-top:8px; font-style:italic; }
  .btn .spin { display:inline-block; animation:spin 1s linear infinite; }
  .chat-module { display:flex; flex-direction:column; gap: var(--space-md); min-height:200px; }
  .chat-header { display:flex; justify-content:space-between; align-items:center; gap: var(--space-sm); }
  .chat-title { margin: 0; font-size: var(--font-size-body); color:var(--text-2); font-weight:600; letter-spacing:.02em; }
  .chat-clear { border:0; background:none; color:var(--text-3); font-size: var(--font-size-meta); cursor:pointer; padding: 0; }
  .chat-clear:hover { color:var(--text-1); text-decoration:underline; }
  .chat-debug { display:none; margin-top:-4px; margin-bottom:2px; color:var(--color-warning); font-size: var(--font-size-meta); font-family:var(--font-data); letter-spacing:.03em; }
  .chat-debug.visible { display:block; }
  .chat-suggested { display:flex; gap: var(--space-sm); overflow-x:auto; padding-bottom:2px; }
  .chat-pill { border:1px solid var(--border); border-radius:var(--radius-pill); background:rgba(255,255,255,.03); color:var(--text-2); padding: var(--space-sm) var(--space-md); font-size: var(--font-size-meta); white-space:nowrap; cursor:pointer; }
  .chat-pill:hover { border-color:rgba(255,255,255,.25); color:var(--text-1); }
  .chat-thread { max-height:520px; overflow-y:auto; padding: var(--space-sm) 2px 2px; display:flex; flex-direction:column; gap: 10px; }
  .chat-thread[hidden] { display:none; }
  .chat-row { display:flex; align-items:flex-end; gap: var(--space-sm); }
  .chat-row.user { justify-content:flex-end; }
  .chat-row.assistant { justify-content:flex-start; }
  .chat-avatar { width:24px; height:24px; border-radius:var(--radius-pill); display:grid; place-items:center; font-size: var(--font-size-meta); font-weight:700; flex:0 0 auto; }
  .chat-avatar.user { background:var(--color-surface-muted); color:var(--color-text); }
  .chat-avatar.assistant { background:var(--color-text-muted); color:var(--color-bg); }
  .chat-message { display:flex; flex-direction:column; min-width:0; }
  .chat-bubble { border-radius:14px; padding: 10px var(--space-md); font-size: var(--font-size-body); line-height:1.45; word-break:break-word; }
  .chat-row.user .chat-bubble { background:var(--color-surface-muted); color:var(--color-text); max-width:70%; margin-left:auto; }
  .chat-row.assistant .chat-bubble { background:rgba(255,255,255,.06); color:var(--color-text); max-width:80%; }
  .chat-bubble.error { background:var(--color-brand-dim); color:var(--color-text); border:1px solid var(rgba(192,57,43,0.3)); }
  .chat-time { margin-top:4px; font-size: var(--font-size-meta); color:var(--text-3); }
  .chat-row.user .chat-time { text-align:right; }
  .chat-row.assistant .chat-time { text-align:left; }
  .chat-loading-dots { display:inline-flex; gap: var(--space-xs); align-items:center; height:14px; }
  .chat-loading-dots span { width:6px; height:6px; border-radius:var(--radius-pill); background:rgba(255,255,255,.55); animation:chatPulse 1s infinite ease-in-out; }
  .chat-loading-dots span:nth-child(2) { animation-delay:.15s; }
  .chat-loading-dots span:nth-child(3) { animation-delay:.3s; }
  .chat-input-bar { position:sticky; bottom:0; display:flex; align-items:center; gap: var(--space-sm); border-top:1px solid var(--border); padding-top:10px; background:var(--surface); }
  .chat-input { flex:1; min-width:0; border:1px solid var(--border); border-radius:var(--radius-md); background:rgba(255,255,255,.03); color:var(--text-1); padding: 10px var(--space-md); font-size: var(--font-size-body); }
  .chat-input:disabled { opacity:.65; cursor:not-allowed; }
  .chat-send { min-width:72px; }
  
  
  
  @media (max-width: 980px) { .ai-grid { grid-template-columns:1fr; } }

/* --- Pipeline acquisition (kanban + client editor) [pipeline-acquisition.html] --- */

/* Lock viewport width; kanban scrolls inside #view-kanban only (see ops-shell.css). */
  html {
   overflow-x: hidden;
   max-width: 100%;
  }
  body {
   overflow-x: hidden;
   max-width: 100%;
  }

  .client-edit-overlay {
   position: fixed;
   inset: 0;
   background: rgba(8, 12, 18, 0.62);
   display: none;
   align-items: center;
   justify-content: center;
   z-index: var(--z-overlay);
   padding: 18px;
  }

  .client-edit-overlay.open {
   display: flex;
  }

  .client-edit-shell {
   width: min(1200px, 96vw);
   height: min(92vh, 900px);
   background: var(--color-bg);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   overflow: hidden;
   display: flex;
   flex-direction: column;
  }

  .client-edit-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: var(--space-sm) var(--space-md);
   border-bottom: 1px solid var(--color-border);
  }

  .client-edit-frame {
   width: 100%;
   height: 100%;
   border: 0;
   background: #000;
  }

/* --- Board finance summary page [board-finance-summary.html]; #board-finance-summary-* --- */

.board-fin-summary.ops-main,
.board-finance-summary-page.ops-main {
   display: grid !important;
   grid-template-columns: minmax(0, 1fr) !important;
   gap: var(--space-lg);
   max-width: none;
   width: 100%;
  }
  .bs-fin-kpi-row {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
   gap: var(--space-sm);
  }
  .bs-fin-kpi-row--5 {
   grid-template-columns: repeat(
    auto-fill,
    minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
   );
   justify-content: start;
  }
  @media (max-width: 900px) {
   .bs-fin-kpi-row--5 {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
   }
  }
  .fin-kpi {
   display: flex;
   flex-direction: column;
   gap: var(--space-xs);
   padding: var(--space-sm) var(--space-md);
   border: 1px solid var(--border, var(--color-border));
   border-radius: var(--radius-sm);
   background: var(--surface, var(--color-surface));
   min-width: 0;
  }
  .fin-kpi-k {
   font-family: var(--font-body);
   font-size: var(--font-size-label);   font-weight: 300;
   text-transform: uppercase;
   letter-spacing: 0.18em;
   color: var(--color-text-muted);
  }
  .fin-kpi-v {
   font-size: var(--font-size-body);   font-weight: 600;
   font-variant-numeric: tabular-nums;
  }
  .fin-kpi-v--bar {
   margin-top: auto;
   padding-top: 6px;
  }
  .tone-danger {
   color: var(--color-danger);
  }
  .tone-success {
   color: var(--color-success);
  }
  .bs-ytd-pct--good {
   color: var(--color-success);
  }
  .bs-ytd-pct--warn {
   color: var(--color-warning);
  }
  .bs-ytd-pct--bad {
   color: var(--color-danger);
  }
  .fin-paired-runway {
   width: 100%;
   border-collapse: collapse;
   font-size: var(--font-size-meta);  }
  .fin-paired-runway th,
  .fin-paired-runway td {
   border: 1px solid var(--border, var(--color-border));
   padding: var(--space-sm) var(--space-sm);
   text-align: left;
   vertical-align: top;
  }
  .fin-paired-runway th {
   font-size: var(--font-size-label);   text-transform: uppercase;
   font-family: var(--font-body);
   font-weight: 300;
   letter-spacing: 0.18em;
   color: var(--color-text-muted);
   background: var(--surface, var(--color-surface));
  }
  .fin-paired-runway .pair-label {
   font-weight: 600;
   color: var(--color-text-secondary);
   min-width: 200px;
  }
  .bs-rev-chart {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: 4px;
   height: 160px;
   margin-top: 12px;
   padding: 0 4px;
   border-bottom: 1px solid var(--border, var(--color-border));
  }
  .bs-rev-chart-col {
   flex: 1 1 0;
   min-width: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   height: 100%;
   justify-content: flex-end;
   gap: 6px;
  }
  .bs-rev-chart-stack {
   flex: 1;
   width: 100%;
   max-width: 28px;
   display: flex;
   flex-direction: column;
   justify-content: flex-end;
   align-items: stretch;
   min-height: 0;
  }
  .bs-rev-chart-bg,
  .bs-rev-chart-fg {
   width: 100%;
   border-radius: 2px 2px 0 0;
   min-height: 2px;
  }
  .bs-rev-chart-bg {
   background: color-mix(in srgb, var(--color-text-muted) 35%, transparent);
   flex-shrink: 0;
  }
  .bs-rev-chart-fg {
   background: var(--color-brand);
   flex-shrink: 0;
   margin-top: 2px;
  }
  .bs-rev-chart-label {
   font-size: var(--font-size-label);   color: var(--color-text-muted);
   text-align: center;
  }
  .gate-summary-row {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--space-sm);
   margin-bottom: 12px;
  }
  .metric-card {
   padding: var(--space-md);
   border-radius: var(--radius-sm);
   border: 1px solid var(--border, var(--color-border));
   background: var(--surface, var(--color-surface));
  }
  .metric-label {
   font-family: var(--font-body);
   font-size: var(--font-size-label);   font-weight: 300;
   text-transform: uppercase;
   letter-spacing: 0.18em;
   color: var(--color-text-muted);
  }
  .metric-value {
   font-size: var(--font-size-title);   font-weight: 700;
   font-variant-numeric: tabular-nums;
   margin-top: 4px;
  }

/* --- Contacts [contacts.html] --- */

.contacts-toolbar {
   --toolbar-h: 32px;
   display: flex;
   align-items: center;
   gap: var(--space-md);
   flex-wrap: wrap;
   margin-bottom: 14px;
  }
  .contacts-toolbar .filter-bar {
   flex: 1;
   min-width: 180px;
   margin-bottom: 0;
  }
  .contacts-toolbar .filter-bar input[type="text"],
  .contacts-toolbar select {
   width: 100%;
   height: var(--toolbar-h);
   min-height: var(--toolbar-h);
   max-height: var(--toolbar-h);
   box-sizing: border-box;
   padding: 0 var(--space-md);
   line-height: 1.25;
   color-scheme: dark;
   background: var(--color-bg);
   color: var(--color-text);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-sm);
  }
  .contacts-toolbar .warmth-filter {
   width: 140px;
   min-width: 120px;
   flex-shrink: 0;
  }
  .contacts-actions {
   margin-left: auto;
   flex-shrink: 0;
  }
  .contacts-actions .btn.btn-primary {
   height: var(--toolbar-h);
   min-height: var(--toolbar-h);
   padding: 0 var(--space-lg);
   display: inline-flex;
   align-items: center;
  }
  #contacts-table-wrap table tbody tr {
   cursor: pointer;
  }
  #contacts-table-wrap table tbody tr:hover {
   background: var(--color-surface-muted);
  }
  #contacts-table-wrap table a {
   color: var(--color-calendar-crm-soft);
   text-decoration: underline;
   text-underline-offset: 2px;
  }
  #contacts-table-wrap table a:hover {
   color: var(--color-brand);
  }
  .contact-client-pill {
   display: inline-flex;
   align-items: center;
   padding: 2px var(--space-sm);
   border-radius: var(--radius-pill);
   font-size: var(--font-size-meta);   color: var(--color-text-secondary);
   background: var(--color-surface-muted);
   border: 1px solid var(--color-border);
   margin: 2px var(--space-xs) 2px 0;
   white-space: nowrap;
   max-width: 160px;
   overflow: hidden;
   text-overflow: ellipsis;
   vertical-align: middle;
  }
  .drawer-backdrop {
   position: fixed;
   inset: 0;
   background: rgba(8, 12, 18, 0.45);
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.2s ease;
   z-index: 15;
  }
  .drawer {
   position: fixed;
   top: 0;
   right: 0;
   width: min(560px, 96vw);
   height: 100vh;
   background: var(--color-bg);
   border-left: 1px solid var(--color-border);
   transform: translateX(102%);
   transition: transform 0.24s ease;
   z-index: 16;
   display: flex;
   flex-direction: column;
  }
  .drawer.open {
   transform: translateX(0);
  }
  .drawer-backdrop.open {
   opacity: 1;
   pointer-events: auto;
  }
  .drawer-header {
   padding: var(--space-md) var(--space-lg);
   border-bottom: 1px solid var(--color-border);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   flex-shrink: 0;
  }
  .drawer-title {
   font-size: var(--font-size-body);   font-family: var(--font-data);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.1em;
   color: var(--color-text);
  }
  .drawer-scroll {
   flex: 1;
   min-height: 0;
   overflow-y: auto;
   padding: var(--space-md) var(--space-lg);
   display: grid;
   gap: var(--space-md);
  }
  .drawer-grid-2 {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: var(--space-sm);
  }
  .drawer-footer {
   flex-shrink: 0;
   padding: var(--space-md) var(--space-lg);
   border-top: 1px solid var(--color-border);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
  }
  .drawer-footer-right {
   display: flex;
   gap: var(--space-sm);
  }
  .drawer .field {
   display: flex;
   flex-direction: column;
   gap: 6px;
  }
  .drawer .field label {
   font-family: var(--font-body);
   font-size: var(--font-size-meta);   font-weight: 300;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--color-text-muted);
  }
  .drawer input, .drawer select, .drawer textarea {
   color-scheme: dark;
   background: var(--color-bg);
   color: var(--color-text);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-sm);
   padding: var(--space-sm) var(--space-sm);
   font-size: var(--font-size-body);   font-family: var(--font-body);
  }
  /* Themed checkboxes (admin-theme .checkbox-field) are 17×17 fixed; padding breaks the box + tick */
  .drawer input[type="checkbox"] {
   padding: 0;
   min-height: 0;
   font-size: inherit;
  }
  .drawer textarea {
   min-height: 88px;
   resize: vertical;
  }
  .drawer-section {
   padding: var(--space-md);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   background: var(--color-surface-muted);
  }
  .drawer-section h3 {
   font-family: var(--font-data);
   font-size: var(--font-size-label);   font-weight: 700;
   letter-spacing: 0.12em;
   text-transform: uppercase;
   color: var(--color-text-muted);
   margin: 0 0 var(--space-sm);
  }
  .link-row {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   padding: var(--space-sm) 0;
   border-bottom: 1px solid var(--color-border);
   font-size: var(--font-size-body);  }
  .link-row:last-child {
   border-bottom: none;
  }
  .link-row-meta {
   color: var(--color-text-secondary);
   font-size: var(--font-size-meta);   margin-top: 2px;
  }
  .link-remove {
   border: none;
   background: none;
   color: var(--color-text-muted);
   cursor: pointer;
   padding: var(--space-xs) 6px;
   border-radius: var(--radius-sm);
   line-height: 1;
   flex-shrink: 0;
  }
  .link-remove:hover {
   color: var(--color-brand);
   background: var(--color-brand-dim);
  }
  .add-link-grid {
   display: grid;
   gap: var(--space-sm);
   margin-top: 10px;
  }
  .add-link-actions {
   display: flex;
   gap: var(--space-sm);
   align-items: flex-end;
  }
  .req {
   color: var(--color-brand);
   margin-left: 2px;
  }

/* --- Data enrichment [data-enrichment.html] --- */

.enrich-toolbar {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   margin-bottom: 10px;
   flex-wrap: wrap;
  }

  .enrich-meta {
   font-size: var(--font-size-meta);   color: var(--color-text-muted);
  }

  .review-body {
   padding: var(--space-sm) 2px 2px;
   display: grid;
   gap: var(--space-sm);
  }

  .review-card {
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   padding: var(--space-sm);
   background: var(--color-surface-muted);
   overflow-wrap: anywhere;
  }

  .review-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: var(--space-sm);
   margin-top: 8px;
  }

  .verify-link {
   color: #8ec5ff;
   text-decoration: underline;
   text-underline-offset: 2px;
   text-decoration-thickness: 1.5px;
   font-weight: 600;
  }

  .verify-link:visited {
   color: #b7a9ff;
  }

  .verify-link:hover {
   color: #c6e2ff;
  }

  .verify-link:focus-visible {
   outline: 2px solid #8ec5ff;
   outline-offset: 2px;
   border-radius: 2px;
  }

  .review-actions {
   display: flex;
   gap: var(--space-sm);
   justify-content: flex-end;
   margin-top: 10px;
  }

  .row-actions {
   display: inline-flex;
   gap: var(--space-sm);
   align-items: center;
   flex-wrap: wrap;
  }

  .enrich-inline-details-row td {
   background: var(--color-surface-muted);
   border-top: none;
   padding-top: 0;
  }

  #action-section .table-wrap th:nth-child(5),
  #action-section .table-wrap td:nth-child(5) {
   white-space: nowrap;
  }

  details.enrich-collapsible {
   margin-bottom: 14px;
  }

  details.enrich-collapsible > summary {
   list-style: none;
   cursor: pointer;
   display: flex;
   align-items: flex-start;
   justify-content: flex-start;
   gap: var(--space-sm);
   user-select: none;
  }

  details.enrich-collapsible > summary.enrich-toolbar {
   justify-content: flex-start;
  }

  details.enrich-collapsible > summary::-webkit-details-marker {
   display: none;
  }

  .enrich-summary-chevron {
   display: inline-block;
   transition: transform 0.15s ease;
   color: var(--color-text-muted);
   font-size: var(--font-size-meta);   margin-top: 5px;
   flex-shrink: 0;
   font-family: var(--font-data);
  }

  details.enrich-collapsible[open] > summary .enrich-summary-chevron {
   transform: rotate(90deg);
  }

  .enrich-summary-text {
   flex: 1;
   min-width: 0;
  }

  .enrich-panel-inner {
   padding-top: 4px;
  }

  .enrich-summary-title-row {
   display: flex;
   align-items: center;
   gap: var(--space-sm);
   flex-wrap: wrap;
   margin-bottom: 4px;
  }

  .enrich-summary-title-row .nav-attn-badge {
   margin-left: 0;
  }

/* --- Deliverables [deliverables.html] --- */

.commercial-toolbar {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-md);
   flex-wrap: wrap;
   margin-bottom: 16px;
  }
  .commercial-toolbar .filter-bar {
   margin-bottom: 0;
   flex: 1;
   min-width: 0;
  }
  .filter-bar .deliverable-filter-text {
   min-width: 140px;
   flex: 1;
   max-width: 240px;
   box-sizing: border-box;
  }
  .row-completed td {
   opacity: 0.5;
  }
  .deliverables-completed-details {
   margin-bottom: 0;
  }
  .deliverables-completed-details > summary {
   cursor: pointer;
   list-style: none;
   padding: 0 0 var(--space-sm);
   border-bottom: 1px solid var(--color-border);
   margin-bottom: 12px;
  }
  .deliverables-completed-details > summary::-webkit-details-marker {
   display: none;
  }
  .deliverables-completed-summary__title {
   font-family: var(--font-data);
   font-size: var(--font-size-body);   font-weight: 700;
   letter-spacing: 0.14em;
   text-transform: uppercase;
   color: var(--color-text-muted);
   margin-right: 10px;
  }
  .deliverables-completed-summary__hint {
   font-size: var(--font-size-meta);   font-weight: 400;
  }
  .deliverables-completed-kicker {
   margin: 0 0 var(--space-md);
   font-size: var(--font-size-meta);  }
  .deliverables-completed-details .card {
   margin-top: 0;
  }
  .deliverables-removed-details > summary {
   cursor: pointer;
   list-style: none;
   padding: 0 0 var(--space-sm);
   border-bottom: 1px solid var(--color-border);
   margin-bottom: 12px;
  }
  .deliverables-removed-details > summary::-webkit-details-marker {
   display: none;
  }
  .deliverable-row-actions {
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
   justify-content: flex-end;
   align-items: center;
  }
  .row-removed td {
   opacity: 0.55;
  }
  #deliverable-create-modal .overlay-modal-card {
   overflow: visible;
  }
  .urgency-dot {
   display: inline-block;
   width: 8px;
   height: 8px;
   border-radius: 50%;
   flex-shrink: 0;
  }
  .urgency-dot--overdue {
   background: var(--color-danger, var(--color-danger));
  }
  .urgency-dot--today {
   background: var(--color-warning);
  }
  .urgency-dot--week {
   background: var(--color-warning);
   opacity: 0.6;
  }
  .urgency-dot--future {
   background: var(--color-border, #3a3a3a);
  }
  .urgency-dot--none {
   background: transparent;
  }

/* --- Finance dashboard [finance.html] --- */

.finance-view-seg-toggle {
 width: max-content;
 max-width: 100%;
 margin: 0 0 var(--space-lg);
}

.finance-main--awaiting-data .finance-view-seg-toggle {
 pointer-events: none;
 opacity: 0.7;
}

.finance-grid {
   display: grid;
   grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
   gap: var(--space-lg);
   align-items: start;
  }
  .finance-grid .card {
   min-width: 0;
  }
  .finance-subhead {
   font-size: var(--font-size-meta);   font-weight: 700;
   letter-spacing: 0.12em;
   text-transform: uppercase;
   color: var(--color-text-muted);
   margin: 14px 0 var(--space-sm);
  }
  .finance-subhead:first-child {
   margin-top: 0;
  }
  .finance-chart-wrap {
   padding: 10px 0;
   max-width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
  }
  #cf13w-table-wrap,
  #cf18m-table-wrap {
   max-width: 100%;
  }
  .tabular-nums {
   font-variant-numeric: tabular-nums;
  }
  .runway-strip-inner,
  .metrics-grid {
   display: grid;
   grid-template-columns: repeat(
    auto-fill,
    minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
   );
   gap: var(--space-sm);
   margin-top: 10px;
   justify-content: start;
  }
  @media (max-width: 900px) {
   .runway-strip-inner,
   .metrics-grid {
    grid-template-columns: 1fr;
   }
  }
  .fin-scenario-seg {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-sm);
   align-items: center;
   margin-bottom: 10px;
  }
  .fin-scenario-seg .seg-label {
   font-size: var(--font-size-meta);   color: var(--color-text-muted);
   margin-right: 4px;
  }
  .cf13w-cost-btn--active,
  .cf13w-rev-btn--active,
  .cf18m-cost-btn--active,
  .cf18m-rev-btn--active,
  .cfschedule-cost-btn--active,
  .cfschedule-rev-btn--active,
  .cfschedule-view-btn--active {
   background: var(--color-brand-dim);
   border-color: var(--color-brand);
   color: var(--color-text);
  }
  .cfschedule-view-btn--active:focus,
  .cfschedule-view-btn--active:focus-visible {
   outline: none;
   border-color: var(--color-brand);
   box-shadow: 0 0 0 3px var(--color-brand-dim);
  }
  /* Detailed cashflow schedule: equal period columns, no clip, horizontal scroll + sticky labels */
  .finance-dashboard #cfschedule-table-wrap.cfschedule-pl-wrap {
   width: 100%;
   max-width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table {
   table-layout: fixed;
   width: max-content;
   border-collapse: collapse;
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table th.cfschedule-label-col,
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table td.cfschedule-label-col {
   position: sticky;
   left: 0;
   z-index: 1;
   width: var(--cfschedule-label-w, 220px);
   min-width: var(--cfschedule-label-w, 220px);
   max-width: var(--cfschedule-label-w, 220px);
   box-sizing: border-box;
   white-space: normal;
   word-wrap: break-word;
   overflow-wrap: break-word;
   background: var(--surface, var(--color-surface));
   box-shadow: 1px 0 0 var(--border, var(--color-border));
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table thead th.cfschedule-label-col {
   z-index: 3;
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table th.cfschedule-period-col,
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table td.cfschedule-period-col {
   width: var(--cfschedule-period-w, 88px);
   min-width: var(--cfschedule-period-w, 88px);
   max-width: var(--cfschedule-period-w, 88px);
   box-sizing: border-box;
   white-space: nowrap;
   overflow: visible;
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table .cyt-pl-th-inner {
   white-space: nowrap;
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table.cfschedule-pl-table--measuring th.cfschedule-period-col,
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table.cfschedule-pl-table--measuring td.cfschedule-period-col {
   width: auto !important;
   min-width: 0 !important;
   max-width: none !important;
  }
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table.cfschedule-pl-table--measuring th.cfschedule-label-col,
  .finance-dashboard #cfschedule-table-wrap .cfschedule-pl-table.cfschedule-pl-table--measuring td.cfschedule-label-col {
   width: auto !important;
   min-width: 0 !important;
   max-width: none !important;
  }
  .fin-kpi-row {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
   gap: var(--space-sm);
  }
  .fin-kpi {
   display: flex;
   flex-direction: column;
   gap: var(--space-xs);
   padding: var(--space-sm) var(--space-md);
   border: 1px solid var(--border, var(--color-border));
   border-radius: var(--radius-sm);
   background: var(--surface, var(--color-surface));
   min-width: 0;
  }
  .fin-kpi-k {
   font-size: var(--font-size-label);   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--color-text-muted);
  }
  .fin-kpi-v {
   font-size: var(--font-size-body);   font-weight: 600;
   font-variant-numeric: tabular-nums;
  }
  #cf13w-kpi-strip,
  #cf18m-kpi-strip,
  #cash-position-strip {
   align-items: stretch;
  }
  #cf13w-kpi-strip .fin-kpi,
  #cf18m-kpi-strip .fin-kpi,
  #cash-position-strip .fin-kpi {
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   text-align: center;
   gap: var(--space-sm);
   min-height: 5.5rem;
   padding-block: 12px;
  }
  #cf13w-kpi-strip .fin-kpi-v,
  #cf18m-kpi-strip .fin-kpi-v,
  #cash-position-strip .fin-kpi-v {
   width: 100%;
   line-height: 1.25;
  }
  #cf13w-kpi-strip .fin-kpi-k,
  #cf18m-kpi-strip .fin-kpi-k,
  #cash-position-strip .fin-kpi-k {
   width: 100%;
   text-wrap: balance;
   hyphens: auto;
  }
  .fin-kpi-row .tone-danger,
  #cf13w-detail-body .tone-danger,
  #director-loan-facility .tone-danger {
   color: var(--color-danger);
  }
  #director-loan-facility .table-wrap thead th {
   text-transform: none;
   letter-spacing: 0.04em;
   font-weight: 600;
  }
  .fin-kpi-row .tone-cream {
   color: color-mix(in srgb, #f2ebe0 88%, var(--color-text-secondary));
  }
  .fin-kpi-row .tone-warning,
  #cf13w-detail-body .tone-warning {
   color: var(--color-warning);
  }
  #cf13w-table-wrap thead th:not(:first-child),
  #cf13w-detail-body td.tabular-nums {
   text-align: right;
  }
  .cyt-cost-btn--active,
  .cyt-rev-btn--active,
  .fin-forecast-cost-btn--active,
  .fin-forecast-rev-btn--active {
   background: var(--color-brand-dim);
   border-color: var(--color-brand);
   color: var(--color-text);
  }
  .fin-forecast-container {
   margin-top: 10px;
   border: 1px solid var(--border, var(--color-border));
   border-radius: var(--radius-sm);
   overflow: hidden;
   background: color-mix(in srgb, var(--color-surface-muted) 40%, transparent);
  }
  .fin-forecast-container__head {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   padding: var(--space-sm) var(--space-md);
   min-height: 44px;
   font-size: var(--font-size-meta);   font-weight: 600;
   box-sizing: border-box;
   border-bottom: 1px solid var(--border, var(--color-border));
   background: var(--surface, var(--color-surface));
  }
  .fin-forecast-container__head-toggle {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   gap: var(--space-sm);
   margin: 0;
   padding: 0;
   font-size: var(--font-size-meta);   font-weight: 600;
   border: 0;
   background: transparent;
   color: var(--color-text);
   text-align: left;
   cursor: pointer;
  }
  .fin-forecast-head-controls {
   display: inline-flex;
   align-items: center;
   justify-content: flex-end;
   gap: var(--space-sm);
   flex-shrink: 0;
   margin-left: 10px;
  }
  .fin-forecast-head-actions {
   display: inline-flex;
   align-items: center;
   justify-content: flex-end;
   gap: 6px;
   flex-shrink: 0;
   padding-left: 10px;
   margin-left: 2px;
   border-left: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
  }
  .fin-forecast-view-toggle {
   display: inline-flex;
   gap: 6px;
   flex-shrink: 0;
  }
  .fin-forecast-action-btn {
   padding: 6px var(--space-sm);
   line-height: 1.2;
  }
  .fin-forecast-view-btn--active {
   background: var(--color-brand-dim);
   border-color: var(--color-brand);
   color: var(--color-text);
  }
  .fin-budget-cost-btn--active {
   background: var(--color-brand-dim);
   border-color: var(--color-brand);
   color: var(--color-text);
  }
  .fin-forecast-container__chevron {
   width: 12px;
   color: var(--color-text-secondary);
  }
  .fin-forecast-container__body {
   padding: var(--space-sm) var(--space-md) var(--space-md);
  }
  .fin-forecast-table th {
   position: sticky;
   top: 0;
   z-index: 3;
   background: var(--surface, var(--color-surface));
  }
  .fin-forecast-th--quarter,
  .fin-forecast-th--year,
  .fin-forecast-cell--quarter,
  .fin-forecast-cell--year {
   background: color-mix(in srgb, var(--color-surface-muted) 65%, transparent);
   font-weight: 600;
  }
  .fin-forecast-table .cyt-pl-row-header .cyt-pl-label {
   font-weight: 600;
   color: var(--color-text);
  }
  .fin-forecast-table .cyt-pl-row-cat .cyt-pl-label {
   padding-left: 14px;
   font-weight: 400;
   color: var(--color-text-secondary);
  }
  .fin-forecast-table .cyt-pl-row-sub .cyt-pl-label {
   padding-left: 14px;
   color: var(--color-text-secondary);
   font-weight: 400;
  }
  .fin-forecast-table .fin-forecast-line-row .cyt-pl-label {
   padding-left: 26px;
   color: var(--color-text-muted);
   font-weight: 400;
  }
  #current-year-tracker,
  #finance-cashflow-13w {
   grid-column: 1 / -1;
   min-width: 0;
  }
  .cyt-legend-visual {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: flex-start;
   gap: var(--space-sm) var(--space-md);
   margin: 10px 0 var(--space-sm);
   font-size: var(--font-size-label);   font-weight: 500;
   color: var(--color-text-muted);
   letter-spacing: 0.02em;
  }
  .cyt-legend-item {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   white-space: nowrap;
  }
  .cyt-legend-swatch {
   width: 10px;
   height: 10px;
   border-radius: 2px;
   flex-shrink: 0;
   box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-border) 40%, transparent);
  }
  .cyt-legend-swatch--cyt-cost-var {
   background: var(--color-danger);
  }
  .cyt-legend-swatch--cyt-cost-budget {
   background: rgba(148, 163, 184, 0.5);
  }
  .cyt-legend-swatch--cyt-rev-var {
   background: var(--color-success);
  }
  .cyt-legend-swatch--cyt-rev-target {
   background: var(--color-success);
   opacity: 0.35;
  }
  .cyt-chart-tooltip {
   position: fixed;
   z-index: 10050;
   left: 0;
   top: 0;
   max-width: min(280px, calc(100vw - 24px));
   padding: 10px 12px;
   font-size: var(--font-size-meta);   line-height: 1.45;
   color: var(--color-text);
   background: var(--surface, var(--color-surface));
   border: 1px solid var(--border, var(--color-border));
   border-radius: var(--radius-sm);
   box-shadow: 0 6px 24px color-mix(in srgb, var(--color-text) 12%, transparent);
   pointer-events: none;
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.12s ease, visibility 0.12s ease;
  }
  .cyt-chart-tooltip.cyt-chart-tooltip--visible {
   opacity: 1;
   visibility: visible;
  }
  .cyt-chart-tooltip-title {
   font-weight: 700;
   font-size: var(--font-size-meta);   margin-bottom: 8px;
   color: var(--color-text);
  }
  .cyt-chart-tooltip-source {
   font-size: var(--font-size-label);   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--color-text-muted);
   margin-bottom: 8px;
  }
  .cyt-chart-tooltip-row {
   display: grid;
   grid-template-columns: auto 1fr;
   gap: 2px 10px;
   margin-top: 6px;
  }
  .cyt-chart-tooltip-row:first-of-type {
   margin-top: 0;
  }
  .cyt-chart-tooltip-k {
   color: var(--color-text-secondary);
   font-weight: 500;
  }
  .cyt-chart-tooltip-v {
   font-variant-numeric: tabular-nums;
   text-align: right;
   color: var(--color-text);
  }
  .cyt-chart-tooltip-v.cyt-chart-tooltip-v--danger {
   color: var(--color-danger);
  }
  .cyt-chart-tooltip-section {
   margin-top: 10px;
   padding-top: 8px;
   border-top: 1px solid var(--border, var(--color-border));
   font-size: var(--font-size-label);   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   color: var(--color-text-muted);
  }
  .cyt-pl-wrap {
   width: 100%;
   max-width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   margin-top: 4px;
  }
  .finance-dashboard .finance-col--label {
   text-align: left;
   min-width: 160px;
  }
  .finance-dashboard .finance-col--scenario {
   text-align: left;
   min-width: 120px;
  }
  .finance-dashboard .finance-col--band {
   text-align: left;
   min-width: 100px;
  }
  @media (max-width: 900px) {
   .finance-dashboard .finance-col--label {
    min-width: 120px;
   }
   .finance-dashboard .finance-col--scenario,
   .finance-dashboard .finance-col--band {
    min-width: 80px;
   }
  }
  .cyt-pl-row-chart td {
   vertical-align: bottom;
   padding: 0 3px 0;
   line-height: 0;
   background: var(--surface, var(--color-surface));
  }
  .cyt-pl-row-chart td.cyt-pl-chart-corner {
   vertical-align: bottom;
   padding: 0 3px 0 8px;
   line-height: normal;
   background: var(--surface, var(--color-surface));
   box-shadow: 1px 0 0 var(--border, var(--color-border));
  }
  tr.cyt-pl-row-chart + tr td {
   padding-top: 2px;
  }
  .cyt-pl-chart-yaxis {
   position: relative;
   align-self: flex-end;
   width: 100%;
   min-height: 0;
   font-size: var(--font-size-label);   font-variant-numeric: tabular-nums;
   color: var(--color-text-muted);
   padding-right: 4px;
   box-sizing: border-box;
  }
  .cyt-pl-chart-yaxis-tick {
   position: absolute;
   right: 4px;
   transform: translateY(-50%);
   line-height: 1;
   white-space: nowrap;
  }
  .cyt-pl-chart-cell {
   cursor: pointer;
   user-select: none;
  }
  .cyt-pl-chart-cell:active {
   filter: brightness(1.05);
  }
  .cyt-pl-chart-bars {
   display: flex;
   align-items: flex-end;
   justify-content: center;
   gap: 2px;
   height: 118px;
   padding: 0 5px 0;
   margin: 0;
   box-sizing: border-box;
   line-height: normal;
   border-bottom: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
   background: linear-gradient(
    to top,
    transparent 0,
    transparent calc(100% - 1px),
    color-mix(in srgb, var(--color-border) 35%, transparent) calc(100% - 1px)
   );
   background-size: 100% 25%;
  }
  .cyt-pl-chart-bar-group {
   display: flex;
   align-items: flex-end;
   justify-content: center;
   gap: 3px;
   width: 100%;
   height: 100%;
   min-width: 0;
   box-sizing: border-box;
  }
  .cyt-pl-mini-bar-wrap {
   flex: 1 1 0;
   min-width: 6px;
   height: 100%;
   display: flex;
   align-items: flex-end;
   align-self: stretch;
   transition: opacity 0.15s ease;
  }
  .cyt-pl-mini-bar-wrap--cyt-quad {
   flex: 1 1 0;
   min-width: 3px;
   max-width: 24%;
  }
  .cyt-pl-mini-bar-wrap--cyt-pair {
   flex: 1 1 0;
   min-width: 5px;
   max-width: 46%;
  }
  .cyt-pl-mini-bar-wrap--zero {
   min-width: 3px;
  }
  .cyt-pl-mini-bar {
   width: 100%;
   min-height: 1px;
   border-radius: 2px 2px 0 0;
  }
  .cyt-pl-chart-fy {
   background: var(--surface, var(--color-surface));
  }
  .cyt-pl-table {
   table-layout: fixed;
   width: 100%;
   max-width: 100%;
   border-collapse: collapse;
   font-size: var(--font-size-meta);   font-variant-numeric: tabular-nums;
  }
  .cyt-pl-table thead th {
   background: var(--surface, var(--color-surface));
   font-family: var(--font-body);
   font-size: var(--font-size-label);
   font-weight: 300;
   letter-spacing: 0.18em;
   vertical-align: bottom;
  }
  .cyt-pl-table th,
  .cyt-pl-table td {
   border: 1px solid var(--border, var(--color-border));
   padding: 4px 3px;
   text-align: right;
   vertical-align: middle;
  }
  .cyt-pl-table th:first-child,
  .cyt-pl-table td:first-child {
   text-align: left;
   min-width: 0;
   width: 26%;
   position: sticky;
   left: 0;
   z-index: 1;
   background: var(--surface, var(--color-surface));
   box-shadow: 1px 0 0 var(--border, var(--color-border));
   word-wrap: break-word;
   overflow-wrap: break-word;
   hyphens: auto;
  }
  .cyt-pl-table tbody td {
   font-weight: 400;
  }
  .cyt-pl-table td:not(:first-child) {
   text-align: right;
   font-variant-numeric: tabular-nums;
  }
  .cyt-pl-th-corner {
   width: 26%;
  }
  .cyt-pl-th-inner {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: flex-end;
   gap: 4px;
   padding: 2px 0 1px;
   margin: 0 auto;
   max-width: 100%;
  }
  .cyt-pl-th-month,
  .cyt-pl-th-fy {
   text-align: center;
  }
  .cyt-pl-period-pill {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 2px 4px;
   border-radius: 4px;
   border: 1px solid transparent;
   font-family: var(--font-data, inherit);
   font-size: 8px;
   font-weight: 700;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   line-height: 1.15;
   white-space: nowrap;
   max-width: 100%;
   box-sizing: border-box;
  }
  .cyt-pl-period-pill--actual {
   background: var(--color-success-dim);
   color: var(--color-success);
   border-color: color-mix(in srgb, var(--color-success) 50%, transparent);
  }
  .cyt-pl-period-pill--forecast {
   background: var(--color-surface-muted);
   color: var(--color-text-muted);
   border-color: color-mix(in srgb, var(--color-border) 80%, transparent);
  }
  .cyt-pl-period-pill--total {
   background: var(--color-surface-muted);
   color: var(--color-text-secondary);
   border-color: color-mix(in srgb, var(--color-border) 70%, transparent);
  }
  .cyt-pl-period-pill--cf-overdue {
   background: color-mix(in srgb, var(--color-warning) 12%, var(--color-surface-muted));
   color: var(--color-warning);
   border-color: color-mix(in srgb, var(--color-warning) 45%, transparent);
  }
  .cf-chart-week-head {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 4px;
   padding: 0 2px;
   box-sizing: border-box;
   height: 100%;
   width: 100%;
   max-width: 100%;
   margin: 0;
   pointer-events: none;
  }
  .cf-chart-week-head.cyt-pl-th-inner {
   justify-content: center;
  }
  .cf-chart-week-head .cf-chart-week-label {
   font-size: var(--font-size-label);   line-height: 1.2;
   font-weight: 500;
   color: var(--color-text-secondary);
   letter-spacing: 0.02em;
   text-transform: none;
  }
  .cf-chart-week-head .cyt-pl-th-month-name {
   font-size: var(--font-size-label);   line-height: 1.2;
  }
  .cyt-pl-th-month-name {
   font-size: var(--font-size-label);   font-weight: 500;
   color: var(--color-text-secondary);
   letter-spacing: 0.02em;
   line-height: 1.2;
   text-transform: none;
  }
  .cyt-pl-th-month {
   cursor: pointer;
   user-select: none;
  }
  .cyt-pl-col--selected {
   background: rgba(214, 164, 91, 0.12) !important;
  }
  .cyt-pl-th-fy {
   font-weight: 500;
  }
  .cyt-pl-cell--forecast {
   color: var(--color-text-muted);
  }
  .cyt-pl-cell--danger {
   color: var(--color-danger);
  }
  .cyt-pl-cell--success {
   color: var(--color-success);
  }
  .cyt-pl-row-header {
   cursor: pointer;
   user-select: none;
  }
  .cyt-pl-row-header .cyt-pl-label {
   font-weight: 600;
   font-size: var(--font-size-body);  }
  .cyt-pl-row-cat {
   cursor: pointer;
   user-select: none;
  }
  .cyt-pl-row-cat .cyt-pl-label {
   font-weight: 600;
   font-size: var(--font-size-meta);  }
  .cyt-pl-row-sub .cyt-pl-label {
   font-weight: 400;
   color: var(--color-text-secondary);
  }
  .cyt-pl-row-sub {
   padding-left: 16px !important;
  }
  .cyt-pl-row-summary {
   border-top: 2px solid var(--border, var(--color-border));
  }
  .cyt-pl-row-summary .cyt-pl-label {
   font-weight: 600;
   font-size: var(--font-size-meta);  }
  .cyt-pl-row-summary td:not(:first-child) {
   font-weight: 600;
  }
  .cyt-pl-row-summary--cumulative .cyt-pl-label,
  .cyt-pl-row-summary--cumulative td:not(:first-child) {
   font-weight: 700;
  }
  .cyt-pl-fy {
   color: var(--color-text);
  }
  .cyt-pl-fy.cyt-pl-cell--danger {
   color: var(--color-danger);
  }
  .cyt-pl-fy.cyt-pl-cell--success {
   color: var(--color-success);
  }
  .cyt-pl-fy.cyt-pl-cell--forecast {
   color: var(--color-text-muted);
  }
  .cyt-pl-expand-hint {
   font-size: var(--font-size-label);   font-style: italic;
   font-weight: 400;
   color: var(--color-text-muted);
   white-space: nowrap;
  }

/* --- OKRs [okrs.html] --- */

.okrs-dashboard .okr-summary {
   display: flex;
   flex-direction: column;
   gap: var(--space-md);
   margin-bottom: 14px;
  }
  .okrs-dashboard .okr-summary-kpis {
   display: grid;
   grid-template-columns: repeat(
    auto-fill,
    minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
   );
   gap: var(--space-sm);
   justify-content: start;
  }
  .okrs-dashboard .okr-summary-kpis .sp-ctx-label--okr-on-track {
   color: var(--color-success);
  }
  .okrs-dashboard .okr-summary-kpis .sp-ctx-label--okr-at-risk {
   color: var(--color-warning);
  }
  .okrs-dashboard .okr-summary-kpis .sp-ctx-label--okr-overdue-behind {
   color: var(--color-danger);
  }
  .okrs-dashboard .okr-summary-kpis .sp-ctx-label--okr-not-started {
   color: var(--color-text-muted);
  }
  .okrs-dashboard .okr-summary-donut {
   margin: 0;
  }
  .okrs-dashboard .okr-donut-row--okrs-page .okr-donut-left {
   min-width: 0;
   flex-wrap: wrap;
  }
  /* Budget gates strip: same class name as KPI row but must stay a grid, not flex-column. */
  .okrs-dashboard .okr-summary.okr-summary--gates {
   display: grid;
   grid-template-columns: repeat(6, minmax(0, 1fr));
   gap: var(--space-sm);
   margin-bottom: 14px;
  }
  /* Finance overview: same grid as OKRs; typography matches .fin-kpi (director loan strip) */
  .finance-dashboard .okr-summary.finance-overview-kpis {
   display: grid;
   grid-template-columns: repeat(
    auto-fill,
    minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
   );
   gap: var(--space-sm);
   margin: 0;
   justify-content: start;
  }
  .finance-dashboard .finance-overview-kpis .sp-ctx-label {
   font-size: var(--font-size-label);   letter-spacing: 0.06em;
   margin-bottom: 4px;
  }
  .finance-dashboard .finance-overview-kpis .sp-ctx-value,
  .finance-dashboard .finance-overview-kpis .sp-ctx-value-row .sp-ctx-value {
   font-size: var(--font-size-body);   font-weight: 600;
   font-variant-numeric: tabular-nums;
   line-height: 1.25;
  }
  /* Summary stat cards — same visual language as staff-planner Plan context bar (.sp-ctx-*) */
  .okrs-dashboard .okr-summary-kpis .sp-ctx-card,
  .finance-dashboard .finance-equity-summary-grid .sp-ctx-card,
  .finance-dashboard .finance-overview-kpis .sp-ctx-card {
   width: 100%;
   max-width: var(--grid-card-max);
   box-sizing: border-box;
  }
  .okrs-dashboard .sp-ctx-card,
  .finance-dashboard .sp-ctx-card {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   background: var(--color-surface-muted);
   border: 0.5px solid var(--color-border);
   border-radius: var(--radius-md);
   padding: var(--space-md) var(--space-md);
   min-width: 0;
  }
  .okrs-dashboard .sp-ctx-label,
  .finance-dashboard .sp-ctx-label {
   font-size: var(--font-size-meta);   font-weight: 600;
   letter-spacing: 0.05em;
   text-transform: uppercase;
   color: var(--color-text-muted);
   margin-bottom: 4px;
   text-align: center;
   width: 100%;
  }
  .okrs-dashboard .sp-ctx-value-row,
  .finance-dashboard .sp-ctx-value-row {
   display: inline-flex;
   align-items: baseline;
   justify-content: center;
   gap: 3px;
   flex-wrap: nowrap;
   width: 100%;
   box-sizing: border-box;
  }
  .okrs-dashboard .sp-ctx-value-row .sp-ctx-value,
  .finance-dashboard .sp-ctx-value-row .sp-ctx-value {
   font-size: var(--font-size-kpi);   font-weight: 600;
   color: var(--color-text);
   line-height: 1.2;
   width: auto;
   max-width: 100%;
   flex: 0 1 auto;
   text-align: center;
  }
  .okrs-dashboard .sp-ctx-unit,
  .finance-dashboard .sp-ctx-unit {
   font-size: var(--font-size-meta);   font-weight: 500;
   color: var(--color-text-muted);
   letter-spacing: 0.02em;
   line-height: 1.35;
   flex-shrink: 0;
   white-space: nowrap;
  }
  .okrs-dashboard .sp-ctx-value,
  .finance-dashboard .sp-ctx-value {
   font-size: var(--font-size-kpi);   font-weight: 600;
   color: var(--color-text);
   line-height: 1.2;
   text-align: center;
  }
  .finance-dashboard .sp-ctx-value.tone-danger {
   color: var(--color-danger);
  }
  .finance-dashboard .sp-ctx-sub {
   font-size: var(--font-size-label);   font-weight: 500;
   color: var(--color-text-muted);
   margin-top: 4px;
   text-align: center;
   width: 100%;
  }
  /* Overview CYT lite: months as columns — sticky metric labels when scrolling */
  .finance-dashboard .overview-cyt-lite-wrap {
   max-width: 100%;
  }
  .finance-dashboard .overview-cyt-lite-table th:first-child,
  .finance-dashboard .overview-cyt-lite-table td:first-child {
   position: sticky;
   left: 0;
   z-index: 1;
   background: var(--surface, var(--color-surface));
   box-shadow: 1px 0 0 var(--color-border, var(--border));
  }
  .finance-dashboard .overview-cyt-lite-table thead th:first-child {
   z-index: 2;
  }
  /* Funding summary (Overview): centre-aligned KPIs — same idea as #cf13w-kpi-strip .fin-kpi */
  .finance-dashboard .overview-funding-lite-grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--space-xl);
   align-items: start;
  }
  .finance-dashboard .overview-funding-lite-col {
   text-align: center;
   min-width: 0;
  }
  .finance-dashboard .overview-funding-lite-section-title {
   font-size: var(--font-size-meta);   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.08em;
   color: var(--color-text-muted);
   margin-bottom: 8px;
   text-align: center;
  }
  .finance-dashboard .overview-funding-lite-kpis {
   align-items: stretch;
  }
  .finance-dashboard .overview-funding-lite-kpis .fin-kpi {
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   text-align: center;
   gap: var(--space-sm);
   min-height: 5.5rem;
   padding-block: 12px;
  }
  .finance-dashboard .overview-funding-lite-kpis .fin-kpi-k,
  .finance-dashboard .overview-funding-lite-kpis .fin-kpi-v {
   width: 100%;
   line-height: 1.25;
  }
  .finance-dashboard .overview-funding-lite-kpis .fin-kpi-k {
   text-wrap: balance;
   hyphens: auto;
  }
  /* Intelligent forecast band KPIs (P&L): centre labels, values, sublines */
  .finance-dashboard #intelligent-forecast-kpis.fin-kpi-row {
   align-items: stretch;
  }
  .finance-dashboard #intelligent-forecast-kpis .fin-kpi {
   align-items: stretch;
   text-align: center;
   gap: 6px;
   padding-block: 12px;
  }
  .finance-dashboard #intelligent-forecast-kpis .fin-kpi-k,
  .finance-dashboard #intelligent-forecast-kpis .fin-kpi-v,
  .finance-dashboard #intelligent-forecast-kpis .fin-kpi > span {
   display: block;
   width: 100%;
   text-align: center;
   box-sizing: border-box;
  }
  .finance-dashboard #intelligent-forecast-kpis .fin-kpi-k {
   text-wrap: balance;
  }
  .finance-dashboard .overview-funding-lite-bar-caption {
   font-size: var(--font-size-label);   color: var(--color-text-muted);
   margin-top: 4px;
   text-align: center;
  }
  .finance-dashboard .overview-funding-lite-empty {
   font-size: var(--font-size-meta);   margin: 0;
   text-align: center;
  }
  /* Cashflow tab: equity summary — same centred KPI cards as Overview funding */
  .finance-dashboard .finance-equity-summary-grid {
   display: grid;
   grid-template-columns: repeat(
    auto-fill,
    minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
   );
   gap: var(--space-sm);
   margin-bottom: 20px;
   align-items: stretch;
   justify-content: start;
  }
  .finance-dashboard .finance-equity-summary-grid .equity-kpi-status-pills {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-xs);
   margin-top: 2px;
   justify-content: center;
   width: 100%;
  }
  .finance-dashboard .finance-equity-summary-grid .equity-kpi-status {
   gap: 6px;
  }
  @media (max-width: 900px) {
   .finance-dashboard .finance-equity-summary-grid {
    grid-template-columns: 1fr;
   }
  }
  /* Director loan — previous facilities table: uppercase headings */
  .finance-dashboard #director-loan-facility .director-loan-previous-table thead th {
   text-transform: uppercase;
   letter-spacing: 0.05em;
   font-size: var(--font-size-meta);   text-align: left;
  }
  .finance-dashboard #director-loan-facility .director-loan-previous-table td.tabular-nums {
   text-align: left;
  }
  /* Equity rounds table: all cells left-aligned */
  .finance-dashboard #equity-funding-detail .equity-rounds-table-wrap table.equity-rounds-table th,
  .finance-dashboard #equity-funding-detail .equity-rounds-table-wrap table.equity-rounds-table td {
   text-align: left;
  }
  .finance-dashboard #equity-funding-detail .equity-rounds-table-wrap table.equity-rounds-table td.tabular-nums {
   text-align: left;
  }
  .okr-set-context { margin: 0 0 10px; color:var(--color-text-muted); font-size: var(--font-size-meta); }
  .obj-section { margin-bottom:12px; }
  .obj-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; gap: 10px; }
  .obj-ref { font-size: var(--font-size-title); font-weight:700; color:var(--brand); min-width:52px; }
  .okr-full-ref { font-family:ui-monospace, SFMono-Regular, Menlo, monospace; color:var(--color-text-muted); }

  /* Table layout — fixed widths that actually sum correctly */
  .okr-table { table-layout:fixed; width:100%; }
  .okr-table col.col-ref   { width:7%; }
  .okr-table col.col-desc   { width:36%; }
  .okr-table col.col-status  { width:10%; }
  .okr-table col.col-progress { width:14%; }
  .okr-table col.col-target  { width:13%; }
  .okr-table col.col-updated { width:12%; }
  .okr-table col.col-flag   { width:8%; }

  .okr-table tbody td { vertical-align:top; }
  .okr-table td.okr-cell-desc {
   white-space:normal;
   word-break:break-word;
   overflow-wrap:anywhere;
   line-height:1.45;
   max-width:0;
  }
  .okr-table thead th:last-child { text-align:end; }
  .okr-table--gates-budget thead th:last-child { text-align:start; }
  .okr-table tbody tr.kr-row > td:last-child {
   white-space:nowrap;
   text-align:end;
  }

  .okr-progress-track { height:10px; border-radius:var(--radius-pill); background:var(--color-surface-muted); overflow:hidden; margin-top:4px; }
  .okr-progress-fill { height:100%; background:var(--color-success); }
  .kr-overdue-row td { background:rgba(239,108,108,0.08); }
  .okr-overdue {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   padding: 2px var(--space-sm);
   border-radius:var(--radius-pill);
   border:1px solid rgba(239,108,108,.5);
   background:rgba(239,108,108,.16);
   color:#ffb3b3;
   font-size: var(--font-size-meta);   font-weight:700;
   letter-spacing:.02em;
   text-transform:uppercase;
   white-space:nowrap;
  }

  /* Expand panel */
  .okr-expand { background:rgba(255,255,255,.02); border-top:1px dashed var(--border); }
  .okr-expand-inner { padding: var(--space-lg) var(--space-lg) var(--space-xl); display:flex; flex-direction:column; gap: var(--space-lg); }

  /* History list */
  .okr-history-head {
   display:grid;
   grid-template-columns:130px 100px 130px 1fr 100px;
   gap: var(--space-sm);
   padding: 0 0 6px;
   border-bottom:1px solid var(--border);
   color:var(--color-text-muted);
   font-size: var(--font-size-meta);   letter-spacing:.08em;
   text-transform:uppercase;
  }
  .okr-history-row {
   display:grid;
   grid-template-columns:130px 100px 130px 1fr 100px;
   gap: var(--space-sm);
   align-items:start;
   padding: var(--space-sm) 0;
   border-bottom:1px solid rgba(255,255,255,.04);
   font-size: var(--font-size-body);  }
  .okr-history-commentary {
   line-height:1.5;
   word-break:break-word;
   overflow-wrap:anywhere;
   white-space:normal;
  }
  .okr-history-actions { display:flex; justify-content:flex-end; }

  /* Update form — stacked layout, not cramped single row */
  .okr-update-form {
   padding: var(--space-md) var(--space-lg);
   border:1px solid var(--border);
   border-radius:var(--radius-md);
   background:rgba(255,255,255,.025);
  }
  .okr-update-form-title {
   font-size: var(--font-size-meta);   font-weight:700;
   letter-spacing:.08em;
   text-transform:uppercase;
   color:var(--color-text-muted);
   margin-bottom:12px;
  }
  .okr-update-row-1 {
   display:grid;
   grid-template-columns:160px 160px 1fr;
   gap: var(--space-sm);
   margin-bottom:10px;
  }
  .okr-update-row-2 {
   display:grid;
   grid-template-columns:1fr auto;
   gap: var(--space-sm);
   align-items:end;
  }
  .okr-update-form .field { margin: 0; }
  .okr-update-form .field label {
   font-family: var(--font-body);
   font-size: var(--font-size-label);   font-weight: 300;
   letter-spacing: 0.18em;
   text-transform:uppercase;
   color:var(--color-text-muted);
  }

  /* Match admin-shell.css form controls */
  .okr-update-form input[type="number"],
  .okr-update-form textarea {
   background:var(--color-surface);
   border:1px solid var(--color-border-strong);
   border-radius:var(--radius-md);
   padding: var(--space-sm) 11px;
   color:var(--color-text);
   font-family:var(--font-body);
   font-size: var(--font-size-body);   width:100%;
   outline:none;
   transition:border-color .15s;
   box-sizing:border-box;
  }
  .okr-update-form input[type="number"] {
   appearance:textfield;
   -moz-appearance:textfield;
  }
  .okr-update-form input[type="number"]::-webkit-outer-spin-button,
  .okr-update-form input[type="number"]::-webkit-inner-spin-button {
   -webkit-appearance:none;
   margin: 0;
  }
  .okr-update-form select {
   background:var(--color-surface);
   border:1px solid var(--color-border-strong);
   border-radius:var(--radius-md);
   padding: var(--space-sm) 11px;
   padding-inline-end:2.25rem;
   color:var(--color-text);
   font-family:var(--font-body);
   font-size: var(--font-size-body);   line-height:1.35;
   width:100%;
   max-width:100%;
   min-height:2.65rem;
   box-sizing:border-box;
   outline:none;
   cursor:pointer;
   transition:border-color .15s;
   appearance:auto;
   -webkit-appearance:menulist;
   color-scheme:dark;
  }
  .okr-update-form select option {
   background:var(--color-surface);
   color:var(--color-text);
  }
  .okr-update-form textarea {
   min-height:72px;
   height:72px;
   resize:vertical;
   line-height:1.5;
   appearance:none;
  }
  .okr-update-form input[type="number"]:focus,
  .okr-update-form select:focus,
  .okr-update-form textarea:focus {
   border-color:var(--color-brand);
   box-shadow:0 0 0 3px var(--color-brand-dim);
  }
  .okr-update-form textarea::placeholder {
   color:var(--color-text-muted);
  }

  /* Status: native <select> menus are OS-drawn (light on macOS); use pills + radios instead */
  .okr-status-radios {
   display:flex;
   flex-wrap:wrap;
   gap: var(--space-sm);
   margin-top:2px;
  }
  .okr-status-pill {
   position:relative;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   padding: var(--space-sm) var(--space-md);
   border-radius:var(--radius-pill);
   border:1px solid var(--color-border-strong);
   background:var(--color-surface);
   color:var(--color-text-secondary);
   font-family:var(--font-body);
   font-size: 12.5px;
   font-weight:500;
   cursor:pointer;
   transition:border-color .15s, background .15s, color .15s;
   -webkit-tap-highlight-color:transparent;
  }
  .okr-status-pill:has(input:checked) {
   border-color:var(--color-brand);
   background:var(--color-brand-dim);
   color:var(--color-text);
  }
  .okr-status-pill:has(input:focus-visible) {
   outline:none;
   box-shadow:0 0 0 3px var(--color-brand-dim);
  }
  .okr-status-pill input {
   position:absolute;
   inset:0;
   opacity:0;
   width:100%;
   height:100%;
   margin: 0;
   cursor:pointer;
  }

  .okr-update-submit {
   height:38px;
   white-space:nowrap;
   padding: 0 var(--space-xl);
   align-self:end;
  }

  @media (max-width:1080px) {
   .okrs-dashboard .okr-summary.okr-summary--gates {
    grid-template-columns: repeat(6, minmax(0, 1fr));
   }
   .okr-update-row-1 { grid-template-columns:1fr 1fr; }
   .okr-update-row-2 { grid-template-columns:1fr; }
   .okr-update-submit { width:100%; }
  }
  @media (max-width: 900px) {
   .finance-dashboard .okr-summary.finance-overview-kpis,
   .okrs-dashboard .okr-summary-kpis {
    grid-template-columns: 1fr;
   }
   .morning-brief-page .kpi-card--pulse {
    max-width: none;
   }
  }
  @media (max-width:860px) {
   .okr-history-head,
   .okr-history-row { grid-template-columns:110px 80px 110px 1fr 80px; }
  }

/* --- Pipeline commercial [pipeline-commercial.html] --- */

html {
   overflow-x: hidden;
   max-width: 100%;
  }
  body {
   overflow-x: hidden;
   max-width: 100%;
  }
  .commercial-toolbar {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-md);
   flex-wrap: wrap;
   margin-bottom: 16px;
  }
  .commercial-toolbar .seg-toggle {
   margin-bottom: 0;
  }

  .commercial-toolbar__cluster {
   display: flex;
   align-items: center;
   gap: var(--space-md);
   flex: 1;
   min-width: 0;
   flex-wrap: wrap;
  }

  .pc-pipeline-search {
   flex: 1;
   min-width: 160px;
   max-width: 420px;
   box-sizing: border-box;
   height: 32px;
   padding: 0 var(--space-md);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   background: var(--color-surface);
   color: var(--color-text);
   font-size: var(--font-size-body);
  }

  .pc-pipeline-search::placeholder {
   color: var(--color-text-muted);
  }

  .pc-pipeline-search:focus {
   outline: none;
   border-color: var(--color-accent, var(--color-border));
   box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-accent, var(--color-border)) 25%, transparent);
  }

  /* Let OL date popover escape the card (overlay-modal-card uses overflow: auto). */
  #activity-create-modal .overlay-modal-card {
   overflow: visible;
  }

  /* £ totals row directly under column title (shared .kanban-col-footer is styled for bottom placement). */
  #kanban-board .kanban-col-footer {
   border-top: none;
   border-bottom: 1px solid var(--color-border);
  }

  .overlay-modal-head .pc-detail-head-actions {
   display: flex;
   align-items: center;
   gap: var(--space-sm);
   flex-shrink: 0;
  }

  .pc-updates-kicker {
   font-size: var(--font-size-meta);   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
   color: var(--color-text-muted);
   margin-bottom: 10px;
  }

  .pc-updates-stack {
   margin-top: 20px;
  }

  .pc-updates-list {
   display: flex;
   flex-direction: column;
   gap: var(--space-sm);
   margin-bottom: 14px;
  }

  .pc-detail-update-form {
   display: flex;
   flex-direction: column;
   gap: var(--space-sm);
  }

  .pc-detail-update-actions {
   display: flex;
   justify-content: flex-end;
  }

  .update-card {
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   padding: var(--space-sm) var(--space-md);
   background: var(--color-surface);
   font-size: var(--font-size-body);   line-height: 1.5;
  }
  .update-card-meta {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   margin-bottom: 6px;
   flex-wrap: wrap;
  }
  .update-card-byline {
   font-size: var(--font-size-meta);   color: var(--color-text-muted);
   letter-spacing: 0.02em;
  }
  .update-card-actions {
   display: flex;
   gap: 6px;
   flex-shrink: 0;
  }
  .update-card-commentary {
   color: var(--color-text);
   white-space: pre-wrap;
   word-break: break-word;
  }
  .update-card-edit-form {
   display: flex;
   flex-direction: column;
   gap: var(--space-sm);
   margin-top: 8px;
  }
  /* .u-hidden alone loses to display:flex on these classes (equal specificity, our rules are later). */
  .update-card-commentary.u-hidden,
  .update-card-actions.u-hidden,
  .update-card-edit-form.u-hidden {
   display: none !important;
  }

  /* Create activity modal — full-width rows, searchable client */
  #create-form label .req {
   color: var(--color-brand);
   margin-left: 3px;
  }
  #create-form .overlay-form-grid-2 {
   grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #create-form .pc-form-full {
   grid-column: 1 / -1;
   min-width: 0;
  }
  #create-form .pc-form-full > input:not([type="search"]),
  #create-form .pc-form-full > select,
  #create-form .pc-form-full .pc-value-row input,
  #create-form .overlay-form-grid-2 > div:not(.pc-form-full) input,
  #create-form .overlay-form-grid-2 > div:not(.pc-form-full) select {
   width: 100%;
   box-sizing: border-box;
  }
  #create-form .pc-client-search-wrap {
   position: relative;
  }
  #create-form .pc-client-search-wrap input[type="search"] {
   width: 100%;
   box-sizing: border-box;
  }
  #create-form .pc-client-search-results {
   position: absolute;
   left: 0;
   right: 0;
   top: 100%;
   margin: var(--space-xs) 0 0;
   padding: var(--space-xs) 0;
   max-height: 220px;
   overflow-y: auto;
   list-style: none;
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong);
   border-radius: var(--radius-md);
   z-index: 20;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  }
  #create-form .pc-client-search-item {
   padding: var(--space-sm) var(--space-md);
   cursor: pointer;
   font-size: var(--font-size-body);  }
  #create-form .pc-client-search-item:hover,
  #create-form .pc-client-search-item:focus {
   background: var(--color-surface-muted);
   outline: none;
  }
  #create-form .pc-client-search-empty {
   padding: var(--space-sm) var(--space-md);
   font-size: var(--font-size-body);  }
  #create-form .pc-value-row {
   display: flex;
   align-items: center;
   gap: var(--space-sm);
  }
  #create-form .pc-value-row .pc-currency-select {
   width: 90px;
   flex-shrink: 0;
   box-sizing: border-box;
  }
  #create-form .pc-value-row .pc-value-input {
   flex: 1;
   min-width: 0;
   box-sizing: border-box;
  }
  #create-form .pc-value-and-close-row {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-lg);
   align-items: flex-start;
  }
  #create-form .pc-value-date-col {
   flex: 1 1 200px;
   min-width: 0;
   display: flex;
   flex-direction: column;
   gap: 6px;
  }
  #create-form .pc-value-input {
   text-align: right;
  }

  /* Commercial kanban card: priority badge bottom-right (with value on the left). */
  #kanban-board .pc-commercial-card {
   display: flex;
   flex-direction: column;
   gap: 6px;
   min-height: 118px;
   box-sizing: border-box;
  }
  #kanban-board .pc-commercial-card__body {
   flex: 1 1 auto;
  }
  #kanban-board .pc-commercial-card__footer {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: var(--space-sm);
   margin-top: auto;
   padding-top: 4px;
  }
  #kanban-board .pc-commercial-card__footer .pc-card-value {
   min-width: 0;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 2px;
  }
  #kanban-board .pc-card-value__native {
   font-weight: 600;
   line-height: 1.25;
  }
  #kanban-board .pc-card-value__converted {
   line-height: 1.25;
  }
  .pc-value-gbp-hint {
   color: var(--color-text-muted);
   font-size: var(--font-size-meta);   margin-left: 4px;
   font-weight: 400;
  }
  #kanban-board .pc-value-gbp-hint {
   margin-left: 0;
  }
  #kanban-board .pc-priority-badge {
   flex-shrink: 0;
   font-family: var(--font-data);
   font-size: var(--font-size-label);   font-weight: 700;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   padding: var(--space-xs) 7px;
   border-radius: var(--radius-sm);
   line-height: 1.2;
  }
  #kanban-board .pc-priority-badge--high {
   background: rgba(192, 57, 43, 0.22);
   color: #e74c3c;
   border: 1px solid rgba(192, 57, 43, 0.45);
  }
  #kanban-board .pc-priority-badge--medium {
   background: var(--color-warning-dim);
   color: var(--color-warning);
   border: 1px solid rgba(201, 146, 10, 0.35);
  }
  #kanban-board .pc-priority-badge--low {
   background: var(--color-surface-muted);
   color: var(--color-text-muted);
   border: 1px solid var(--color-border);
  }

  /* List view: same badge (no #kanban-board scope). */
  .pc-priority-badge--inline {
   font-family: var(--font-data);
   font-size: var(--font-size-label);   font-weight: 700;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   padding: var(--space-xs) 7px;
   border-radius: var(--radius-sm);
   line-height: 1.2;
   display: inline-block;
   vertical-align: middle;
  }
  .pc-priority-badge--inline.pc-priority-badge--high {
   background: rgba(192, 57, 43, 0.22);
   color: #e74c3c;
   border: 1px solid rgba(192, 57, 43, 0.45);
  }
  .pc-priority-badge--inline.pc-priority-badge--medium {
   background: var(--color-warning-dim);
   color: var(--color-warning);
   border: 1px solid rgba(201, 146, 10, 0.35);
  }
  .pc-priority-badge--inline.pc-priority-badge--low {
   background: var(--color-surface-muted);
   color: var(--color-text-muted);
   border: 1px solid var(--color-border);
  }

/* --- Pipeline holding pen [pipeline-holding-pen.html] --- */

.prospects-toolbar {
   --toolbar-h: 32px;
   display: flex;
   align-items: center;
   gap: var(--space-md);
   flex-wrap: wrap;
   margin-bottom: 12px;
  }

  .prospects-toolbar .filter-bar {
   flex: 1;
   min-width: 200px;
   margin-bottom: 0;
   display: flex;
   align-items: center;
  }

  .prospects-toolbar .filter-bar input[type="text"] {
   width: 100%;
   height: var(--toolbar-h);
   min-height: var(--toolbar-h);
   max-height: var(--toolbar-h);
   box-sizing: border-box;
   padding: 0 var(--space-md);
   line-height: 1.25;
  }

  .prospects-toolbar-cluster {
   display: flex;
   align-items: stretch;
   gap: var(--space-md);
   flex-shrink: 0;
   height: var(--toolbar-h);
  }

  /* Toolbar height: shared .seg-toggle tokens live in admin-shell.css */
  .prospects-toolbar .seg-toggle {
   margin-bottom: 0;
   align-self: stretch;
   height: 100%;
  }

  .prospects-toolbar .seg-toggle .seg-toggle__btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   height: 100%;
   min-height: var(--toolbar-h);
   box-sizing: border-box;
  }

  .prospects-toolbar-cluster .btn.btn-primary {
   height: var(--toolbar-h);
   min-height: var(--toolbar-h);
   max-height: var(--toolbar-h);
   box-sizing: border-box;
   padding: 0 var(--space-lg);
   display: inline-flex;
   align-items: center;
   justify-content: center;
   line-height: 1;
  }

  .prospects-actions {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   flex-shrink: 0;
   height: 100%;
  }

  .prospects-cards-wrap {
   margin-top: 4px;
  }

  /* Full-width “column” shell to match pipeline Kanban columns */
  .prospects-kanban-col {
   width: 100%;
   max-width: 100%;
   min-width: 0;
   max-height: none;
  }

  .prospects-kanban-body {
   min-height: 0;
  }

  .prospects-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
   gap: var(--space-md);
  }

  /* Same card chrome as .kanban-card; not draggable */
  .kanban-card.prospect-card {
   cursor: default;
   margin-bottom: 0;
   min-height: 0;
   display: flex;
   flex-direction: column;
  }

  .kanban-card.prospect-card .prospect-card-notes {
   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   line-height: 1.45;
   flex: 1;
   min-height: 0;
  }

  .kanban-card.prospect-card .prospect-card-actions {
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
   margin-top: 10px;
   padding-top: 8px;
   border-top: 1px solid var(--color-border);
  }

  .kanban-card.prospect-card .prospect-card-actions .btn {
   border-radius: var(--radius-pill);
   padding: 5px var(--space-md);
   font-size: var(--font-size-meta);   font-weight: 600;
  }

  .btn-remove-prospect {
   color: var(--color-text-muted);
  }

  .btn-remove-prospect:hover:not(:disabled) {
   color: var(--color-brand);
   border-color: rgba(250, 33, 33, 0.45);
  }

  .page-prospects.view-cards .prospects-table-wrap {
   display: none;
  }

  .page-prospects.view-list .prospects-cards-wrap {
   display: none;
  }

  .page-prospects:not(.has-prospects) .prospects-cards-wrap,
  .page-prospects:not(.has-prospects) .prospects-table-wrap {
   display: none !important;
  }

  .drawer-backdrop {
   position: fixed;
   inset: 0;
   background: rgba(8, 12, 18, 0.45);
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.2s ease;
   z-index: 15;
  }

  .drawer {
   position: fixed;
   top: 0;
   right: 0;
   width: min(460px, 92vw);
   height: 100vh;
   background: var(--color-bg);
   border-left: 1px solid var(--color-border);
   transform: translateX(102%);
   transition: transform 0.24s ease;
   z-index: 16;
   display: flex;
   flex-direction: column;
  }

  .drawer.open {
   transform: translateX(0);
  }

  .drawer-backdrop.open {
   opacity: 1;
   pointer-events: auto;
  }

  .drawer-header {
   padding: var(--space-md) var(--space-lg);
   border-bottom: 1px solid var(--color-border);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
  }

  .drawer-title {
   font-size: var(--font-size-body);   font-family: var(--font-data);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.1em;
   color: var(--color-text);
  }

  .drawer-body {
   padding: var(--space-md) var(--space-lg) var(--space-xl);
   overflow-y: auto;
   display: grid;
   gap: var(--space-md);
  }

  .drawer-grid-2 {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: var(--space-sm);
  }

  .drawer-actions {
   margin-top: 8px;
   display: flex;
   justify-content: flex-end;
   gap: var(--space-sm);
  }

  .drawer-note {
   font-size: var(--font-size-meta);   color: var(--color-text-muted);
   line-height: 1.5;
  }

  .drawer-subnote {
   font-size: 10.5px;
   color: var(--color-text-muted);
   margin-top: -4px;
  }

  .drawer .field {
   display: flex;
   flex-direction: column;
   gap: 6px;
  }

  /* Keep Add Prospect selects on dark theme (native popup on macOS). */
  .drawer select {
   color-scheme: dark;
   background-color: var(--color-bg);
   color: var(--color-text);
  }

  .drawer select option,
  .drawer select optgroup {
   background-color: var(--color-bg);
   color: var(--color-text);
  }

  .req {
   color: var(--color-brand);
   margin-left: 3px;
  }

  .drawer-section {
   display: grid;
   gap: var(--space-sm);
   padding: var(--space-sm);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   background: var(--color-surface-muted);
  }

  .enrich-card {
   margin-top: 14px;
  }

  #enrich-card .table-wrap table {
   width: 100%;
   table-layout: fixed;
  }

  #enrich-card .table-wrap th:nth-child(1),
  #enrich-card .table-wrap td:nth-child(1) {
   width: 30%;
  }

  #enrich-card .table-wrap th:nth-child(2),
  #enrich-card .table-wrap td:nth-child(2) {
   width: 20%;
  }

  #enrich-card .table-wrap th:nth-child(3),
  #enrich-card .table-wrap td:nth-child(3) {
   width: 20%;
  }

  #enrich-card .table-wrap th:nth-child(4),
  #enrich-card .table-wrap td:nth-child(4) {
   width: 30%;
  }

  .enrich-toolbar {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   margin-bottom: 10px;
   flex-wrap: wrap;
  }

  .enrich-meta {
   font-size: var(--font-size-meta);   color: var(--color-text-muted);
  }

  .enrich-diag {
   margin: var(--space-sm) 0 var(--space-md);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   background: var(--color-surface-muted);
   padding: var(--space-sm) var(--space-sm);
   font-size: var(--font-size-meta);   color: var(--color-text-secondary);
   white-space: pre-wrap;
   word-break: break-word;
   line-height: 1.5;
  }

  .review-body {
   padding: var(--space-sm) 2px 2px;
   display: grid;
   gap: var(--space-sm);
  }

  .review-card {
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   padding: var(--space-sm);
   background: var(--color-surface-muted);
   overflow-wrap: anywhere;
  }

  .review-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: var(--space-sm);
   margin-top: 8px;
  }

  .verify-link {
   color: #8ec5ff;
   text-decoration: underline;
   text-underline-offset: 2px;
   text-decoration-thickness: 1.5px;
   font-weight: 600;
  }

  .verify-link:visited {
   color: #b7a9ff;
  }

  .verify-link:hover {
   color: #c6e2ff;
  }

  .verify-link:focus-visible {
   outline: 2px solid #8ec5ff;
   outline-offset: 2px;
   border-radius: 2px;
  }

  .review-actions {
   display: flex;
   gap: var(--space-sm);
   justify-content: flex-end;
   margin-top: 10px;
  }

  .row-actions {
   display: inline-flex;
   gap: var(--space-sm);
   align-items: center;
   flex-wrap: wrap;
  }

  @media (max-width: 900px) {
   .drawer-grid-2 {
    grid-template-columns: 1fr;
   }
  }

  .client-edit-overlay {
   position: fixed;
   inset: 0;
   background: rgba(8, 12, 18, 0.62);
   display: none;
   align-items: center;
   justify-content: center;
   z-index: var(--z-overlay);
   padding: 18px;
  }

  .client-edit-overlay.open {
   display: flex;
  }

  .client-edit-shell {
   width: min(1200px, 96vw);
   height: min(92vh, 900px);
   background: var(--color-bg);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
   overflow: hidden;
   display: flex;
   flex-direction: column;
  }

  .client-edit-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: var(--space-sm) var(--space-md);
   border-bottom: 1px solid var(--color-border);
  }

  .client-edit-frame {
   width: 100%;
   height: 100%;
   border: 0;
   background: #000;
  }

/* --- Time tracker [time-tracker.html] --- */

#ol-time-banner-host { display: none; }
  .tt-manual-search-wrap { position: relative; }
  .tt-results {
   position: absolute;
   left: 0; right: 0;
   top: 100%;
   margin-top: 4px;
   max-height: 220px;
   overflow-y: auto;
   list-style: none;
   padding: var(--space-xs) 0;
   margin: var(--space-xs) 0 0;
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong, #444);
   border-radius: var(--radius-sm);
   z-index: 10;
   box-shadow: 0 8px 24px rgba(0,0,0,0.35);
  }
  .tt-results[hidden] { display: none !important; }
  .tt-results li { padding: var(--space-sm) var(--space-md); cursor: pointer; font-size: var(--font-size-body); }
  .tt-results li:hover { background: var(--color-surface-muted); }
  .tt-manual-form .field.tt-dur-row {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--space-md);
   align-items: end;
  }
  .tt-dur-row .field { min-width: 0; }
  .tt-bar-wrap { margin-top: 12px; }
  .tt-bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-size: var(--font-size-meta); }
  .tt-bar-row .lbl { width: 120px; flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tt-bar-track { flex: 1; height: 8px; background: var(--color-surface-muted); border-radius: var(--radius-pill); overflow: hidden; min-width: 0; }
  .tt-bar-fill { height: 100%; background: var(--color-brand); border-radius: var(--radius-pill); min-width: 2px; }
  .tt-bar-pct { width: 44px; text-align: right; flex-shrink: 0; color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
  .tt-success-inline { color: var(--color-success); font-size: var(--font-size-body); margin-top: 10px; }

  /* OKR-style themed date trigger + gold date readout (matches internal OKR date field). */
  .tt-manual-form .ol-date-field__display {
   color: #d4b883;
   font-weight: 500;
  }

  /* Custom list dropdowns (team member, category) — avoids native macOS/iOS select sheets. */
  .tt-list-dropdown {
   position: relative;
   width: 100%;
  }
  .tt-list-dropdown__trigger {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   width: 100%;
   min-height: 2.65rem;
   padding: var(--space-sm) 11px;
   border: 1px solid var(--color-border-strong);
   border-radius: var(--radius-md);
   background: var(--color-surface);
   color: var(--color-text);
   font-family: var(--font-body);
   font-size: var(--font-size-body);   text-align: left;
   cursor: pointer;
   box-sizing: border-box;
   transition: border-color 0.15s, box-shadow 0.15s;
  }
  .tt-list-dropdown__trigger:hover:not(:disabled) {
   border-color: var(--color-text-muted);
  }
  .tt-list-dropdown__trigger:focus {
   outline: none;
   border-color: var(--color-brand);
   box-shadow: 0 0 0 3px var(--color-brand-dim);
  }
  .tt-list-dropdown__trigger:disabled {
   opacity: 0.88;
   cursor: default;
  }
  .tt-list-dropdown--static .tt-list-dropdown__chev {
   visibility: hidden;
  }
  .tt-list-dropdown__value {
   flex: 1;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
  }
  .tt-list-dropdown__chev {
   flex-shrink: 0;
   color: var(--color-text-muted);
   font-size: var(--font-size-label);   line-height: 1;
   margin-top: 2px;
  }
  .tt-list-dropdown__menu {
   position: absolute;
   left: 0;
   right: 0;
   top: calc(100% + 4px);
   margin: 0;
   padding: var(--space-xs) 0;
   list-style: none;
   max-height: 240px;
   overflow-y: auto;
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong, #444);
   border-radius: var(--radius-sm);
   z-index: 25;
   box-shadow: 0 12px 40px rgba(0, 0, 0, 0.55);
  }
  .tt-list-dropdown__menu[hidden] {
   display: none !important;
  }
  .tt-list-dropdown__menu li {
   padding: var(--space-sm) var(--space-md);
   cursor: pointer;
   font-size: var(--font-size-body);  }
  .tt-list-dropdown__menu li:hover,
  .tt-list-dropdown__menu li:focus {
   background: var(--color-surface-muted);
   outline: none;
  }
  .tt-list-dropdown__menu li[aria-selected="true"] {
   background: var(--color-brand-dim);
  }
  .tt-manual-form textarea {
   min-height: 80px;
  }
  .tt-manual-form-actions {
   display: flex;
   align-items: center;
   gap: var(--space-md);
   flex-wrap: wrap;
   margin-top: 24px;
   padding-top: 4px;
  }
  .tt-entries-card {
   position: relative;
   overflow: visible;
  }
  .tt-log-open-btn {
   position: absolute;
   top: 12px;
   right: 12px;
   z-index: 3;
  }
  .tt-entries-table-area {
   padding-top: 44px;
  }
  .tt-row-actions {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   align-items: center;
   justify-content: flex-end;
   gap: 6px;
   white-space: nowrap;
   vertical-align: middle;
  }
  .tt-row-actions .btn {
   flex: 0 0 auto;
  }
  .tt-leadership-entries-card .tt-entries-table-area {
   padding-top: 0;
  }
  .tt-log-popover {
   position: absolute;
   top: 48px;
   right: 12px;
   width: min(420px, calc(100% - 24px));
   z-index: 25;
   padding: 0;
   box-sizing: border-box;
   background: var(--color-bg, #141414);
   border: 1px solid var(--color-border-strong);
   border-radius: var(--radius-md);
   box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55);
   overflow: visible;
  }
  .tt-log-popover-body {
   padding: 0 var(--space-md) var(--space-lg);
   max-height: min(calc(85vh - 56px), 640px);
   overflow-x: hidden;
   overflow-y: auto;
  }
  .tt-log-popover[hidden] {
   display: none !important;
  }
  .tt-log-popover-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-sm);
   padding: var(--space-md) var(--space-md) var(--space-md);
   border-bottom: 1px solid var(--color-border);
  }
  .tt-log-popover-title {
   font-family: var(--font-data);
   font-size: var(--font-size-label);   font-weight: 700;
   letter-spacing: 0.12em;
   text-transform: uppercase;
   color: var(--color-text-muted);
  }
  .tt-log-close {
   flex-shrink: 0;
   line-height: 1;
   padding: var(--space-xs) var(--space-sm);
   font-size: var(--font-size-heading);
  }
  .tt-log-popover .tt-results,
  .tt-log-popover .tt-list-dropdown__menu {
   z-index: 40;
  }

/* --- Whiteboard [whiteboard.html] --- */

/* Single viewport: no page scroll (same idea as cultural calendar shell). */
  html:has(.ops-content-column--whiteboard),
  body:has(.ops-content-column--whiteboard) {
   height: 100%;
   overflow: hidden;
  }

  .admin-shell:has(.ops-content-column--whiteboard) {
   height: 100vh;
   height: 100dvh;
   max-height: 100vh;
   max-height: 100dvh;
   min-height: 0;
   overflow: hidden;
  }

  .ops-content-column.ops-content-column--whiteboard {
   flex: 1;
   min-width: 0;
   min-height: 0;
   max-height: 100vh;
   max-height: 100dvh;
   overflow: hidden;
   display: flex;
   flex-direction: column;
  }

  .ops-content-column--whiteboard .ops-topbar {
   position: relative;
   top: auto;
   flex-shrink: 0;
  }

  .ops-content-column--whiteboard .ops-main.wb-main {
   flex: 1 1 auto;
   min-height: 0;
   display: flex;
   flex-direction: column;
   padding-top: 12px;
   padding-bottom: 12px;
   overflow: hidden;
  }

  .ops-content-column--whiteboard .wb-section {
   flex: 1 1 auto;
   min-height: 0;
   display: flex;
   flex-direction: column;
   margin-bottom: 0;
   overflow: hidden;
  }

  .ops-content-column--whiteboard .wb-section > h2,
  .ops-content-column--whiteboard .wb-section > .card {
   flex-shrink: 0;
  }

  .ops-content-column--whiteboard .wb-hint {
   flex-shrink: 0;
   margin-top: 8px;
  }

  .ops-content-column--whiteboard .wb-section > h2 {
   margin-bottom: 8px;
  }

  /* Tighter than global .card (20px 24px) — toolbar strip only */
  .ops-content-column--whiteboard .card.wb-toolbar-card {
   padding: var(--space-sm) var(--space-md);
   margin-bottom: 12px;
  }

  .wb-toolbar {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: var(--space-sm) var(--space-sm);
   min-width: 0;
  }
  .wb-toolbar-label {
   font-family: var(--font-data);
   font-size: var(--font-size-label);   font-weight: 700;
   letter-spacing: 0.12em;
   text-transform: uppercase;
   color: var(--text-3);
   margin-right: 0;
   line-height: 1.2;
  }
  .wb-priority-pills {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 6px;
  }
  /* Match commercial pipeline priority badges (.pc-priority-badge--inline) */
  .wb-priority-pill {
   font-family: var(--font-data);
   font-size: var(--font-size-label);   font-weight: 700;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   padding: 5px var(--space-sm);
   border-radius: var(--radius-sm);
   line-height: 1.2;
   border: 1px solid transparent;
   background: transparent;
   cursor: pointer;
   color: inherit;
   transition: box-shadow 0.15s, border-color 0.15s, opacity 0.15s;
   -webkit-tap-highlight-color: transparent;
  }
  .wb-priority-pill:hover {
   opacity: 0.92;
  }
  .wb-priority-pill:focus-visible {
   outline: none;
   box-shadow: 0 0 0 3px var(--color-brand-dim);
  }
  .wb-priority-pill[aria-pressed="true"] {
   box-shadow: 0 0 0 2px var(--color-brand);
  }
  /* Opaque blends matching prior translucent pills over card (#141414). */
  .wb-priority-pill--high {
   background: #3a1c19;
   color: #e74c3c;
   border-color: #61251e;
  }
  .wb-priority-pill--medium {
   background: #2f2712;
   color: var(--color-warning);
   border-color: #534010;
  }
  .wb-priority-pill--low {
   background: #162d25;
   color: var(--color-success);
   border-color: #184b3b;
  }
  .wb-priority-pill--fyi {
   background: var(--color-surface-muted);
   color: var(--color-text-muted);
   border-color: var(--color-border);
  }
  .wb-toolbar-actions {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: var(--space-sm);
   margin-left: auto;
  }

  .ops-content-column--whiteboard .wb-toolbar-actions .btn {
   padding: 5px var(--space-sm);
   min-height: 0;
  }
  .wb-board-wrap {
   flex: 1 1 0;
   min-height: 0;
   border: 1px solid var(--border);
   border-radius: var(--radius-md);
   background: var(--surface, var(--color-surface));
   background-image:
    linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
   background-size: 20px 20px;
   background-position: -1px -1px;
   overflow: hidden;
   position: relative;
  }
  .wb-board {
   position: absolute;
   inset: 0;
   box-sizing: border-box;
  }
  .wb-empty {
   position: absolute;
   inset: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   pointer-events: none;
   padding: var(--space-3xl);
   text-align: center;
  }
  .wb-empty-inner {
   max-width: 400px;
   color: var(--text-3);
   font-size: var(--font-size-body);   line-height: 1.5;
  }
  .wb-empty-title {
   margin: 0 0 var(--space-sm);
   font-family: var(--font-body);
   font-size: var(--font-size-heading);   font-weight: 600;
   color: var(--text-2);
  }
  .wb-empty-copy {
   margin: 0;
   text-wrap: balance;
  }
  .wb-empty-copy strong {
   display: inline;
   font-weight: 600;
   color: var(--text-1);
  }
  .wb-board.has-notes .wb-empty {
   display: none;
  }
  .wb-note {
   --wb-accent: var(--color-text-muted);
   position: absolute;
   width: 200px;
   min-height: 112px;
   border-radius: var(--radius-md);
   box-shadow: 0 2px 14px rgba(0, 0, 0, 0.28);
   display: flex;
   flex-direction: column;
   z-index: 1;
   user-select: none;
   overflow: hidden;
   cursor: grab;
  }
  .wb-note.wb-note--dragging {
   cursor: grabbing;
  }
  .wb-note::before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   bottom: 0;
   width: 4px;
   background: var(--wb-accent);
   border-radius: var(--radius-md) 0 0 var(--radius-md);
   pointer-events: none;
  }
  .wb-note:focus-within {
   z-index: 5;
  }
  .wb-note__del {
   position: absolute;
   top: 6px;
   right: 6px;
   z-index: 2;
   width: 26px;
   height: 26px;
   border: none;
   border-radius: 6px;
   background: var(--color-bg);
   color: inherit;
   font-size: var(--font-size-heading);
   line-height: 1;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0;
   transition: opacity 0.12s, background 0.12s;
  }
  .wb-note:hover .wb-note__del,
  .wb-note:focus-within .wb-note__del {
   opacity: 1;
  }
  .wb-note__del:hover {
   background: #5a2222;
  }
  .wb-note__body {
   flex: 1;
   padding: var(--space-sm) 36px var(--space-sm) var(--space-md);
   min-height: 0;
  }
  .wb-note__text {
   width: 100%;
   min-height: 72px;
   border: none;
   background: transparent;
   color: inherit;
   font-family: var(--font-body);
   font-size: var(--font-size-body);   line-height: 1.45;
   resize: none;
   outline: none;
   cursor: text;
   user-select: text;
   display: block;
  }
  .wb-hint {
   margin-top: 4px;
   font-size: var(--font-size-meta);   color: var(--text-3);
   max-width: 100%;
  }
  @media (max-width: 720px) {
   .wb-toolbar-actions {
    margin-left: 0;
    width: 100%;
   }
  }

/* --- Commercial client P&L [commercial-client-pl.html] --- */

.tabular-nums {
   font-variant-numeric: tabular-nums;
  }
  .commercial-client-filter-card {
   margin-bottom: 10px;
   padding-bottom: 12px;
  }
  .commercial-client-filter-card .pc-client-search-wrap {
   position: relative;
  }
  .commercial-client-filter-card .pc-client-search-wrap input[type="search"] {
   width: 100%;
   box-sizing: border-box;
  }
  .commercial-client-filter-card .pc-client-search-results {
   position: absolute;
   left: 0;
   right: 0;
   top: 100%;
   margin: var(--space-xs) 0 0;
   padding: var(--space-xs) 0;
   max-height: 220px;
   overflow-y: auto;
   list-style: none;
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong);
   border-radius: var(--radius-md);
   z-index: 20;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  }
  .commercial-client-filter-card .pc-client-search-item {
   padding: var(--space-sm) var(--space-md);
   cursor: pointer;
   font-size: var(--font-size-body);  }
  .commercial-client-filter-card .pc-client-search-item:hover,
  .commercial-client-filter-card .pc-client-search-item:focus {
   background: var(--color-surface-muted);
   outline: none;
  }
  .commercial-client-filter-card .pc-client-search-empty {
   padding: var(--space-sm) var(--space-md);
   font-size: var(--font-size-body);  }
  th.sortable-th[data-pl-sort] {
   cursor: pointer;
   user-select: none;
  }
  th.sortable-th.sortable-active {
   color: var(--color-brand);
  }
  .sort-ind {
   font-size: var(--font-size-label);   opacity: 0.85;
  }
  .fin-pl-scenario-bar {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: var(--space-sm);
   margin-bottom: 10px;
  }
  .fin-pl-scenario-bar .seg-label {
   font-size: var(--font-size-meta);   color: var(--color-text-muted);
  }
  .fin-pl-scenario-btn--active {
   background: var(--color-brand-dim);
   border-color: var(--color-brand);
   color: var(--color-text);
  }
  .tone-success {
   color: var(--color-success);
  }

  .client-time-costs-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-md);
   width: 100%;
   max-width: none;
  }
  .client-time-costs-range-grid {
   grid-template-columns: repeat(2, minmax(220px, 280px));
   justify-content: start;
   margin-bottom: 10px !important;
  }
  .client-time-costs-range-grid label {
   font-size: var(--font-size-label);   letter-spacing: 0.06em;
   color: var(--color-text-muted);
  }
  .client-time-costs-range-grid .ol-date-field__trigger {
   min-height: 34px;
   padding: 7px var(--space-sm);
   font-size: var(--font-size-body);  }
  .client-time-costs-client-card {
   border: 1px solid var(--border);
   border-radius: var(--radius-md);
   background: rgba(255, 255, 255, 0.02);
   overflow: hidden;
   width: 100%;
   max-width: none;
  }
  .client-time-costs-top {
   display: grid;
   grid-template-columns: auto minmax(220px, 1fr);
   gap: var(--space-3xl);
   align-items: center;
  }
  .client-time-costs-kpis {
   margin: 0;
   grid-template-columns: 1fr;
   order: 2;
   max-width: 320px;
   justify-self: start;
   width: 100%;
  }
  #client-time-costs-donut {
   order: 1;
  }
  .client-time-costs-kpis .fin-kpi {
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   text-align: center;
   gap: var(--space-sm);
   min-height: 5.5rem;
   padding-block: 12px;
  }
  .client-time-costs-kpis .fin-kpi-v {
   width: 100%;
   line-height: 1.25;
  }
  .client-time-costs-kpis .fin-kpi-k {
   width: 100%;
   text-wrap: balance;
   hyphens: auto;
  }
  .client-time-costs-donut-wrap {
   display: flex;
   align-items: center;
   gap: var(--space-sm);
  }
  .client-time-costs-donut-legend {
   display: grid;
   gap: var(--space-xs);
   min-width: 180px;
  }
  .client-time-costs-donut-legend-row {
   display: grid;
   grid-template-columns: 10px 1fr auto;
   gap: var(--space-sm);
   align-items: center;
   font-size: var(--font-size-meta);  }
  .client-time-costs-donut-swatch {
   width: 10px;
   height: 10px;
   border-radius: var(--radius-pill);
   display: inline-block;
  }
  .client-time-costs-client-head {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-md);
   border: 0;
   background: transparent;
   color: var(--text-1);
   text-align: left;
   padding: var(--space-sm) var(--space-md);
   cursor: pointer;
   font: inherit;
  }
  .client-time-costs-client-head:hover {
   background: rgba(255, 255, 255, 0.04);
  }
  .client-time-costs-client-head-label {
   font-weight: 600;
  }
  .client-time-costs-client-head-metrics {
   display: inline-flex;
   align-items: center;
   gap: var(--space-md);
   color: var(--text-2);
   font-variant-numeric: tabular-nums;
  }
  .client-time-costs-client-body {
   padding: 0 var(--space-sm) var(--space-sm);
  }
  .client-time-costs-client-body .table-wrap > table thead th,
  .client-time-costs-client-body .table-wrap > table tbody td {
   vertical-align: middle;
   padding: 0.5rem 0.45rem;
  }
  .client-time-costs-client-body table th,
  .client-time-costs-client-body table td {
   font-size: var(--font-size-meta);  }
  .client-time-costs-total-row td {
   border-top: 1px solid var(--color-border);
   background: color-mix(in srgb, var(--color-surface) 78%, transparent);
  }
  .client-time-costs-toggle-btn {
   border: 0;
   background: transparent;
   color: var(--text-2);
   font: inherit;
   padding: 0;
   cursor: pointer;
  }
  .client-time-costs-detail-row td {
   padding: var(--space-xs) 0;
   vertical-align: middle;
  }
  .client-time-costs-detail-wrap {
   border: 1px solid var(--border);
   border-radius: var(--radius-sm);
   padding: var(--space-sm);
   background: rgba(0, 0, 0, 0.12);
  }
  .client-time-costs-detail-wrap .table-wrap table {
   width: 100%;
   border-collapse: collapse;
  }
  .client-time-costs-detail-wrap .table-wrap table thead th,
  .client-time-costs-detail-wrap .table-wrap table tbody td {
   vertical-align: middle;
   padding: 0.55rem 0.5rem;
  }
  .client-revenue-card .client-revenue-kpi-row {
   margin: 0 0 12px;
  }
  .client-revenue-card .client-time-costs-client-body th.num,
  .client-revenue-card .client-time-costs-client-body td.num {
   text-align: right;
  }
  @media (max-width: 720px) {
   .client-time-costs-top {
    grid-template-columns: 1fr;
   }
   .client-time-costs-range-grid {
    grid-template-columns: 1fr;
   }
   .client-time-costs-grid {
    grid-template-columns: 1fr;
   }
  }

/* --- Finance invoices [finance/invoices.html] --- */

.inv-toolbar {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-md);
   flex-wrap: wrap;
   margin-bottom: 14px;
  }
  .inv-filters {
   display: flex;
   gap: var(--space-sm);
   flex-wrap: wrap;
   align-items: center;
  }
  .inv-row {
   cursor: pointer;
  }
  .inv-row-overdue {
   background: var(--color-warning-dim);
  }
  .inv-row:hover {
   background: var(--color-surface);
  }
  .inv-row-overdue:hover {
   background: color-mix(in srgb, var(--color-warning-dim) 80%, var(--color-surface));
  }
  .tabular-nums {
   font-variant-numeric: tabular-nums;
  }
  .overlay-modal-card--880 {
   width: min(880px, 100%);
  }
  th.sortable-th[data-sort] {
   cursor: pointer;
   user-select: none;
  }
  th.sortable-th.sortable-active {
   color: var(--color-brand);
  }
  .sort-ind {
   font-size: var(--font-size-label);   opacity: 0.85;
  }
  .ni-grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--space-sm);
  }
  .ni-grid .span-2 {
   grid-column: span 2;
  }

  /* Time tracker: activity vs deliverable in manual/timer pickers */
  .tt-type-badge {
   display: inline-block;
   font-size: var(--font-size-label);   padding: 1px 5px;
   border-radius: 3px;
   margin-right: 4px;
   font-weight: 500;
  }
  .tt-type-badge--activity {
   background: var(--color-background-info, var(--color-calendar-crm-dim));
   color: var(--color-text-info, var(--color-calendar-crm));
  }
  .tt-type-badge--deliverable {
   background: var(--color-background-warning, var(--color-warning-dim));
   color: var(--color-text-warning, var(--color-warning));
  }

/* ═══════════════════════════════════════════════════════════════════
   Phase B — page responsive (internal dashboard)
   ═══════════════════════════════════════════════════════════════════ */

/* --- Clients + Documents [clients.html, documents.html] --- */
.clients-page .docs-grid,
.documents-page .docs-grid {
 display: grid;
 gap: 12px;
 grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 720px) {
 .clients-page .docs-grid,
 .documents-page .docs-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

@media (min-width: 1160px) {
 .clients-page .docs-grid,
 .documents-page .docs-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
 }
}

.documents-page .docs-toolbar {
 display: flex;
 flex-wrap: wrap;
 gap: 12px;
}

.documents-page .docs-tabs {
 width: max-content;
 max-width: 100%;
}

.documents-page .upload-grid-2 {
 display: grid;
 gap: 12px;
 grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 880px) {
 .documents-page .upload-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

.documents-page .team-functions {
 display: grid;
 gap: 8px;
 grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 680px) {
 .documents-page .team-functions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

/* --- Staff planner [staff-planner.html] --- */
.staff-planner-page .sp-context-bar {
 display: grid;
 grid-template-columns: repeat(
  auto-fill,
  minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
 );
 gap: var(--space-sm);
 margin-bottom: var(--space-2xl);
 justify-content: start;
}

@media (max-width: 900px) {
 .staff-planner-page .sp-context-bar {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

@media (max-width: 800px) {
 .staff-planner-page .sp-team-row {
  grid-template-columns: 1fr auto;
 }
 .staff-planner-page .sp-team-header-row {
  grid-template-columns: 1fr auto;
 }
 .staff-planner-page .sp-team-row-kr {
  display: none;
 }
}

/* --- Athlete archetypes [athlete-archetypes.html] --- */
.archetype-page-root .archetype-grid {
 display: grid;
 grid-template-columns: repeat(
  auto-fill,
  minmax(min(100%, var(--grid-card-min)), var(--grid-card-max))
 );
 gap: var(--space-md);
 justify-content: start;
}

@media (max-width: 900px) {
 .archetype-page-root .archetype-grid {
  grid-template-columns: 1fr;
 }
}

/* --- Social & Digital [social.html] --- */
.social-page .social-entity-head,
.social-page .social-add-form-row,
.social-page .social-find-result {
 flex-wrap: wrap;
}

.social-page .social-channel-table-wrap {
 overflow-x: auto;
 max-width: 100%;
}

@media (max-width: 1100px) {
 .social-page .social-entity-actions {
  flex-wrap: wrap;
 }
}

@media (max-width: 900px) {
 .social-page .social-section-header {
  flex-wrap: wrap;
  gap: var(--space-sm);
 }
}

/* --- Open items [open-items.html] --- */
.compass-page .compass-resolved-item__row,
.compass-page .page-header {
 flex-wrap: wrap;
}

.compass-page #council-modal .modal {
 max-width: min(520px, calc(100vw - 32px));
 width: 100%;
 box-sizing: border-box;
}

/* --- Deliverables, contacts, data enrichment, todo, system settings --- */
.deliverables-page .page-header,
.deliverables-page .commercial-toolbar,
.contacts-page .contacts-toolbar,
.contacts-page .page-header,
.data-enrichment-page .page-header,
.data-enrichment-page .enrich-toolbar,
.todo-list-page .todo-toolbar,
.todo-list-page .todo-toolbar-left,
.todo-list-page .todo-toolbar-right,
.system-settings-page .page-header {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
}

.todo-list-page .todo-toolbar {
 align-items: center;
 justify-content: space-between;
}

.deliverables-page .filter-bar,
.contacts-page .filter-bar {
 flex-wrap: wrap;
 max-width: 100%;
}

/* --- Pipeline pages --- */
.pipeline-page .page-header,
.pipeline-page .pc-toolbar,
.pipeline-page .prospects-toolbar {
 flex-wrap: wrap;
 gap: var(--space-md);
}

.pipeline-page .filter-bar,
.pipeline-page .pc-pipeline-search {
 max-width: 100%;
 min-width: 0;
}

.pipeline-page .pc-tab-bar {
 width: max-content;
 max-width: 100%;
}

/* --- Finance ops / funding --- */
.finance-ops-main--awaiting-data .forecasting-controls {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
 align-items: center;
}

.finance-ops-main--awaiting-data .actuals-toolbar,
.finance-ops-main--awaiting-data .finance-ops-forecasting-toolbar {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
 align-items: center;
 justify-content: space-between;
}

.finance-ops-main--awaiting-data .forecasting-controls .seg-toggle-wrap {
 margin-bottom: 0;
}

/* --- Finance invoices --- */
.finance-invoices-page .page-header,
.finance-invoices-page .inv-toolbar {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
 align-items: center;
 justify-content: space-between;
}

.data-enrichment-page .enrich-toolbar {
 flex-wrap: wrap;
 gap: var(--space-sm);
}

.commercial-client-pl-page .page-header,
.commercial-client-pl-page .client-pl-toolbar {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
 align-items: center;
}

/* ═══════════════════════════════════════════════════════════════════
   Phase C — JS-rendered layouts (finance, board, calendar, staff, client P&L)
   ═══════════════════════════════════════════════════════════════════ */

.commercial-client-pl-page .table-wrap,
.commercial-client-pl-page .cyt-pl-wrap {
 max-width: 100%;
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
}

.commercial-client-pl-page .client-time-costs-top,
.commercial-client-pl-page .client-revenue-kpi-row {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
}

.commercial-client-pl-page .pc-client-search-wrap {
 max-width: min(420px, 100%);
}

.staff-planner-page .sp-team-header-row,
.staff-planner-page .sp-team-row {
 grid-template-columns: minmax(140px, 200px) minmax(0, 1fr) auto auto;
}

.staff-planner-page .sp-fin-chart-wrap {
 max-width: 100%;
 overflow-x: auto;
}

.staff-planner-page .spc-table-wrap {
 width: 100%;
 max-width: 100%;
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
}

.board-reporting-page.ops-main > *,
.board-finance-summary-page.ops-main > * {
 min-width: 0;
}

.board-reporting-page .card,
.board-finance-summary-page .card {
 max-width: 100%;
}

/* ═══════════════════════════════════════════════════════════════════
   Phase D — verification pass (overflow containment + remaining pages)
   ═══════════════════════════════════════════════════════════════════ */

.pipeline-page #view-kanban,
.pipeline-page #view-list,
.pipeline-page #view-lost,
.pipeline-page .page-card {
 min-width: 0;
 max-width: 100%;
}

.page-prospects #page-card,
.page-prospects #view-kanban {
 min-width: 0;
 max-width: 100%;
}

.ai-intelligence-page .section-block,
.ai-intelligence-page .chat-module,
.ai-intelligence-page #ai-content {
 min-width: 0;
 max-width: 100%;
}

.time-tracker-page .tt-bar-row .lbl {
 width: min(120px, 28vw);
}

.time-tracker-page .section-block,
.time-tracker-page #tt-tab-panel-entries,
.time-tracker-page #tt-tab-panel-leadership {
 min-width: 0;
 max-width: 100%;
}

.brand-health-page #page-body,
.reports-page .filter-bar,
.reports-page #page-card,
.reference-library-page .card {
 min-width: 0;
 max-width: 100%;
}

.reports-page .filter-bar {
 flex-wrap: wrap;
}

.contacts-page .contacts-toolbar {
 display: flex;
 flex-wrap: wrap;
 gap: var(--space-md);
 align-items: center;
}

.contacts-page .warmth-filter {
 min-width: 0;
}

.contacts-page .filter-bar input[type='search'] {
 max-width: min(320px, 100%);
 flex: 1 1 200px;
}

.morning-brief-page .morning-brief-stack,
.morning-brief-page .morning-brief-section {
 min-width: 0;
 max-width: 100%;
}

.finance-dashboard .finance-grid,
.finance-dashboard #finance-grid > * {
 min-width: 0;
 max-width: 100%;
}

.okrs-dashboard #page-body,
.finance-ops-main--awaiting-data #finance-ops-grid {
 min-width: 0;
 max-width: 100%;
}

/* Drawers/modals stay viewport-bound */
.drawer,
.modal {
 max-width: min(100%, calc(100vw - 32px));
 box-sizing: border-box;
}