/* Charcoal dark theme. The generated sheet covers legacy colour declarations;
   this layer keeps the shared surfaces and controls visually consistent. */
html[data-theme="dark"]{
  color-scheme:dark;
  --lv-canvas:#0B0B0C;
  --grid-head-bg:#202023;
  --grid-rule:#303034;
  --ctl-border:#303034;
  --ctl-bg:#202023;
  --ctl-text:#F0F0F2;
  --ctl-muted:#9C9CA3;
  --ctl-soft:#242428;
  --ctl-lbl-color:#83838B;
  --ctl-on-bg:#4B4B50;
  --ctl-on-text:#F7F7F8;
  --ctl-seg-on-bg:#2A2A2E;
  --ctl-seg-on-text:#F0F0F2;
  --ctl-seg-border:#303034;
  --ctl-seg-bg:#171719;
  --ctl-seg-shadow:0 1px 2px rgba(0,0,0,.18);
  --ctl-seg-shadow-run:0 1px 2px rgba(0,0,0,.18);
  --dvz-ink:#F0F0F2;
  --dvz-body:#C6C6CA;
  --dvz-mute:#83838B;
  --dvz-rule:#303034;
}
html[data-theme="dark"] :is(#listing-gcc.lv2,.lv2-root,.lv2-surface,#lrv-section,#lrv-ai-campaign,.lv2-drawer,.lv2-toast,.modal-overlay,#lv2-tip){
  --lv-primary:#587493;
  --lv-deep:#A4B8CC;
  --lv-soft:#252A30;
  --lv-hover:#69849F;
  --lv-text:#F0F0F2;
  --lv-body:#C6C6CA;
  --lv-muted:#9C9CA3;
  --lv-faint:#83838B;
  --lv-bg:#0B0B0C;
  --lv-surface:#18181B;
  --lv-border:#303034;
  --lv-border-soft:#27272B;
  --lv-success:#78AB98;
  --lv-success-ink:#85B7A1;
  --lv-success-soft:#202B26;
  --lv-warning:#B99C6F;
  --lv-warning-ink:#C3A77B;
  --lv-warning-soft:#2C281F;
  --lv-danger:#BD7C84;
  --lv-danger-ink:#C98A91;
  --lv-danger-soft:#2C2225;
  --lv-purple:#B4A9C2;
  --lv-teal:#90B3B1;
  --lv-shadow:0 1px 2px rgba(0,0,0,.18),0 8px 28px rgba(0,0,0,.16);
  --lv-shadow-hover:0 12px 36px rgba(0,0,0,.22);
  --lv-shadow-float:0 16px 50px rgba(0,0,0,.32);
}
html[data-theme="dark"] body,
html[data-theme="dark"] #login-screen{background:#0B0B0C;color:#F0F0F2}
html[data-theme="dark"] #dash .app-shell,
html[data-theme="dark"] #dash .app-main,
html[data-theme="dark"] :is(#overview,#project-detail,#listing-gcc,.lv2-root,.lv2-surface,.lv2-canvas){background:#0B0B0C}
html[data-theme="dark"] :is(.app-sidebar,.topbar,.home-stickyhead,.detail-stickyhead,.am-stickyhead,#mb-header,#mb-nav){background:#111113;border-color:#303034}
html[data-theme="dark"] :is(.card,.kpi-mini,.detail-kpi,.lv2-panel,.lv2-kpi,.login-card,.cmp-ad){background:#18181B;border-color:#303034}
html[data-theme="dark"] :is(.lv2-panel--dark,.lv2-kpi--hero){background:#202023;background-image:none}
html[data-theme="dark"] .open-row--go:hover{background:#29292D}
html[data-theme="dark"] :is(.lv2-panel--dark,.lv2-kpi--hero)::after{background:none}
html[data-theme="dark"] :is(.nav-item.active,#mb-nav .mb-tab.on){background:#29292D;color:#F7F7F8;box-shadow:none}
html[data-theme="dark"] .nav-item.active .ni-ic{background:#34343A;color:#F0F0F2}
html[data-theme="dark"] :is(input,select,textarea){color-scheme:dark}
html[data-theme="dark"] :is(input,select,textarea)::placeholder{color:#83838B}
html[data-theme="dark"] select option{background:#202023;color:#F0F0F2}
html[data-theme="dark"] :is(.ui-sel,.lgc-sel,.ui-inp,.lgc-inp,.ctl-sel,.ctl-inp,.search-input,.pw-input){background:#202023;color:#F0F0F2;border-color:#303034}
html[data-theme="dark"] :is(.ui-btn,.lgc-btn):not(.ui-btn-ghost):not(.lgc-btn-ghost){background:#4B4B50!important;border-color:#4B4B50!important;box-shadow:none!important;color:#F7F7F8!important}
html[data-theme="dark"] :is(.ui-btn,.lgc-btn):hover:not(.ui-btn-ghost):not(.lgc-btn-ghost){background:#5A5A60!important;border-color:#5A5A60!important}
html[data-theme="dark"] #project-detail .mchild-pick select{
  background:#202023 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239C9CA3' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 11px center !important;
}
html[data-theme="dark"] :is(.src-pill.active,.md-period-btn.active)::before{background:#2A2A2E}
html[data-theme="dark"] :is(.lv2-chart .grid,.lv2-map .grid){stroke:#303034}
html[data-theme="dark"] .lv2-map .city-lbl,
html[data-theme="dark"] .lv2-map .city-lbl *{stroke:#18181B}
html[data-theme="dark"] .modal-overlay{background:rgba(0,0,0,.74)}
html[data-theme="dark"] #boot{--bt-text:#F0F0F2;--bt-muted:#9C9CA3;--bt-faint:#83838B;--bt-border:#303034;--bt-soft:#242428}
html[data-theme="dark"] :is(.cmp-ad--sk .cmp-ad__pic,.cmp-ad--sk .cmp-ad__b i,#boot .ghost){background:linear-gradient(90deg,#242428 25%,#303034 50%,#242428 75%);background-size:200% 100%}
html[data-theme="dark"] .cmp-spin{border-color:#303034;border-top-color:#C6C6CA}
html[data-theme="dark"] #mb-nav .mb-tab.on .mb-tab-ic{background:#34343A}
html[data-theme="dark"] #mb-sheet-host .mb-sheet{background:#18181B}
html[data-theme="dark"] canvas{filter:saturate(.4)}

/* The theme control shares the existing header dimensions. */
.theme-toggle{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.theme-toggle svg{width:15px;height:15px;display:block;flex:none}
.theme-toggle .theme-sun{display:none}
html[data-theme="dark"] .theme-toggle .theme-sun{display:block}
html[data-theme="dark"] .theme-toggle .theme-moon{display:none}
html[data-theme="dark"] .theme-toggle{background:#202023;color:#C6C6CA;border-color:#303034}
html[data-theme="dark"] .theme-toggle:hover{background:#29292D;color:#F0F0F2;border-color:#3B3B40}
#mb-theme-toggle{width:34px;height:34px;flex:none;display:grid;place-items:center;border:0;border-radius:10px;background:#EFF4FF;color:#2563EB;cursor:pointer}
html[data-theme="dark"] #mb-theme-toggle{background:#29292D;color:#F0F0F2}
#mb-theme-toggle:focus-visible,.theme-toggle:focus-visible{outline:2px solid #587493;outline-offset:2px}
html[data-theme="dark"] ::-webkit-scrollbar-track{background:#0B0B0C}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#34343A}
/* Team Capacity's action popover floats over cards of the same #18181B; lift it
   one step so it reads as a layer, not a hole in the board. */
html[data-theme="dark"] .cap-pop{background:#232327;border-color:#3A3A40;box-shadow:0 18px 50px rgba(0,0,0,.55)}
html[data-theme="dark"] .cap-pop__seg{background:#232327}
html[data-theme="dark"] .cap-pop__sub{color:#F7F7F8}

/* Sidebar toggle is a bare panel icon since 2026-10-03 (Notion style) — the
   generated rule still paints the old chip, so it is undone here. */
html[data-theme="dark"] .sidebar-toggle{background:transparent;border-color:transparent;color:#A1A1AA}
html[data-theme="dark"] .sidebar-toggle:hover{background:#252A30;border-color:#252A30;color:#F7F7F8}
/* Team Capacity cards lost their MKT Agents / Agency tint (2026-10-03); the
   generated sheet still carries it, so it is undone here. */
html[data-theme="dark"] #pmkt-capacity-view .cap-card.is-agentic,html[data-theme="dark"] #pmkt-capacity-view .cap-card.is-agency{background:#252A30;border-color:transparent}
html[data-theme="dark"] #pmkt-capacity-view .cap-grp{border-color:#3A3A40;background:transparent}
html[data-theme="dark"] #pmkt-capacity-view .cap-grp__h{border-bottom-color:#303034}

/* The floating hover card (devbiz-polish.css .dvz-tip) is white in light mode —
   lift it off the dark canvas the way the capacity popover is. */
html[data-theme="dark"] .dvz-tip{background:#232327;border-color:#3A3A40;color:#D4D4D8;box-shadow:0 18px 50px rgba(0,0,0,.55)}
html[data-theme="dark"] .dvz-tip .dvz-tip__t,html[data-theme="dark"] .dvz-tip .dvz-tip__r b{color:#FAFAFA}
html[data-theme="dark"] .dvz-tip .dvz-tip__r span,html[data-theme="dark"] .dvz-tip .dvz-tip__l{color:#D4D4D8}
html[data-theme="dark"] .dvz-tip .dvz-tip__t,html[data-theme="dark"] .dvz-tip .dvz-tip__l,html[data-theme="dark"] .dvz-tip .dvz-tip__n,html[data-theme="dark"] .dvz-tip .dvz-tip__r+.dvz-tip__r{border-color:#3A3A40}
