/* ============================================================================
 * Array Operator — DAY MODE  (theme-day.css)  ·  the DEFAULT theme
 *
 * A professional, control-room light skin in the spirit of the operational
 * dashboards run by major energy / oil corporations (Schneider EcoStruxure,
 * Siemens, GE Digital, Bloomberg NEF): cool slate-and-white surfaces, a calm
 * utility-blue primary, and status reserved for amber/red. The emerald brand
 * of the original solarpunk skin is replaced sitewide (in day mode) with blue.
 *
 * Palette — "utility blue on cool slate":
 *   page slate   #f6f8fb     fill slate    #eef2f7     hairline #e2e8f0
 *   primary blue #2563eb / #1d4ed8 (deep) / #3b82f6 (top)
 *   data sky     #0ea5e9     info cyan     #0891b2
 *   ink slate-900 #0f172a    muted #64748b   faint #94a3b8
 *   warn amber   #d97706     fault red     #dc2626
 *
 * Strategy: (1) re-point every CSS custom property so everything that already
 * reads var(--…) flips for free, then (2) override the hardcoded dark/emerald
 * hexes and rgba "lift"/glow surfaces that don't go through a variable. Loaded
 * LAST so its higher-specificity html[data-theme="day"] rules win; !important is
 * used to also beat the dark .ao-*!important modal skin in styles.css.
 * Night mode (the original emerald solarpunk skin) is left completely untouched.
 * ==========================================================================*/

html[data-theme="day"]{
  /* ---- core surfaces / ink ---- */
  --bg:#f6f8fb;            /* cool page surface (slate-50.5) */
  --bg2:#eef2f7;           /* slate fill for inputs, search, chips, .res */
  --ink:#0f172a;           /* slate-900 primary text */
  --muted:#64748b;         /* slate-500 secondary text */
  --faint:#94a3b8;         /* slate-400 hints / tertiary */

  /* ---- accents ---- */
  --good:#2563eb;          /* blue-600 — brand primary + healthy/OK status */
  --good2:#0ea5e9;         /* sky-500 — bright value text + data series */
  --green-deep:#1d4ed8;    /* blue-700 — deep brand */
  --gold:#d97706;          /* amber-600 — warn */
  --gold2:#b45309;         /* amber-700 — deep warn / attention */
  --sky:#0891b2;           /* cyan-600 — info / comm-gap (distinct from blue) */
  --warn:#d97706;          /* amber-600 — reads on light */
  --bad:#dc2626;           /* red-600 — reads on light */

  /* ---- Auto-refresh vault signature (day) ---- */
  --ao-oct:#7c3aed;        /* violet-600 — octarine, reads bold on white */
  --ao-oct-soft:rgba(124,58,237,.09);
  --ao-oct-line:rgba(124,58,237,.30);
  --ao-live:#16a34a;       /* green-600 — the "working" dot (NOT the blue --good) */
  --ao-live-glow:rgba(22,163,74,.5);
  --ao-live-ink:#0f9d58;   /* readable green for status text on white */

  /* ---- lines + cards ---- */
  --line:#e2e8f0;          /* slate-200 hairline */
  --card:#ffffff;          /* white card */
  --card2:#f8fafc;         /* slate-50 card (gradient partner) */

  /* day-only helpers used in the overrides below */
  --day-chip:#eef2f7;      /* neutral slate chip/tag fill */
  --day-tile:#eef2f7;      /* icon tiles */
  --day-track:rgba(15,23,42,.08);   /* progress/meter tracks */
  --day-hover:rgba(15,23,42,.045);  /* row / button hover wash */
  --day-surf:#f8fafc;      /* very subtle raised surface (slate-50) */

  color-scheme:light;
  background:#f6f8fb;
}

/* ── page background ────────────────────────────────────────────────────── */
html[data-theme="day"],
html[data-theme="day"] body{background:#f6f8fb !important}
html[data-theme="day"] body{
  background:radial-gradient(1200px 700px at 75% -10%, #eef3fb 0%, #f6f8fb 55%) !important;
  background-attachment:fixed !important;
}

/* ── gradient "clipped" headings (white→gray text is invisible on light) ──── */
html[data-theme="day"] .hero h1,
html[data-theme="day"] .pricing h2{
  background:linear-gradient(180deg,#0f172a,#475569) !important;
  -webkit-background-clip:text !important;background-clip:text !important;color:transparent !important;
}

/* ── nav / brand ──────────────────────────────────────────────────────────── */
html[data-theme="day"] nav{
  background:linear-gradient(180deg,#f6f8fb 64%,transparent) !important;
}
/* the emerald logo orb + its halo ring → utility blue */
html[data-theme="day"] .logo{
  box-shadow:0 0 22px rgba(37,99,235,.32),inset 0 0 8px rgba(255,255,255,.6) !important;
}
html[data-theme="day"] .logo::after{border-color:rgba(37,99,235,.25) !important}
/* the live-pulse dot used a hardcoded green keyframe — run a blue one in day */
html[data-theme="day"] .dot{animation-name:pulse-day !important}
@keyframes pulse-day{
  0%{box-shadow:0 0 0 0 rgba(37,99,235,.55)}
  70%{box-shadow:0 0 0 9px rgba(37,99,235,0)}
  100%{box-shadow:0 0 0 0 rgba(37,99,235,0)}
}

/* ── primary CTA buttons → utility blue with white text ───────────────────── */
html[data-theme="day"] .btn-primary-lg,
html[data-theme="day"] .acct-btn.primary,
html[data-theme="day"] .sb-addbtn,
html[data-theme="day"] .sb-mbtn.primary,
html[data-theme="day"] .ao-btn-primary,
html[data-theme="day"] .cc-btn.primary,
html[data-theme="day"] .cl-btn.primary,
html[data-theme="day"] .cl-segbtn.on,
html[data-theme="day"] .cc-collapsible .cc-collapse-hint,
html[data-theme="day"] .rb-save{
  background:linear-gradient(180deg,#3b82f6,#1d4ed8) !important;
  color:#ffffff !important;
  box-shadow:0 4px 14px -4px rgba(29,78,216,.45) !important;
}
html[data-theme="day"] .cc-btn.primary:hover,
html[data-theme="day"] .cl-btn.primary:hover{background:linear-gradient(180deg,#2563eb,#1d4ed8) !important}

/* ── destructive confirm (AODialog danger:true) — red, not the go-forward blue ── */
html[data-theme="day"] .ao-btn-danger{
  background:linear-gradient(180deg,#ef4444,#dc2626) !important;
  color:#ffffff !important;
  box-shadow:0 4px 14px -4px rgba(220,38,38,.45) !important;
}

/* ── small accent tags keep dark text on the lighter blue ─────────────────── */
html[data-theme="day"] .act h3 .tag,
html[data-theme="day"] .pc-free{color:#0b2f6b !important}

/* ── inputs / selects / textareas → white fields on the card ──────────────── */
html[data-theme="day"] .acct-edit .r-v input,
html[data-theme="day"] .acct-pw-edit input,
html[data-theme="day"] .rep-fld select,
html[data-theme="day"] .rep-fld input,
html[data-theme="day"] .sb-fld input,
html[data-theme="day"] .sb-data-pick,
html[data-theme="day"] .ao-input,
html[data-theme="day"] .ao-textarea,
html[data-theme="day"] .cc-search input,
html[data-theme="day"] .cl-fld input,
html[data-theme="day"] .cl-fld textarea,
html[data-theme="day"] .cl-grace input{
  background:#ffffff !important;color:var(--ink) !important;border-color:var(--line) !important;
}
/* Day mode: flip native popups back to light so option lists match the theme. */
html[data-theme="day"] select,
html[data-theme="day"] option,
html[data-theme="day"] optgroup,
html[data-theme="day"] input,
html[data-theme="day"] textarea{ color-scheme:light; }
html[data-theme="day"] select option,
html[data-theme="day"] select optgroup{ background:#ffffff; color:var(--ink); }

/* ── ghost / secondary buttons → white with slate border ──────────────────── */
html[data-theme="day"] .acct-btn,
html[data-theme="day"] .acct-pw-eye,
html[data-theme="day"] .sb-togglebtn,
html[data-theme="day"] .sb-resetbtn,
html[data-theme="day"] .sb-cardbtn,
html[data-theme="day"] .sb-mbtn.ghost,
html[data-theme="day"] .ao-btn-ghost,
html[data-theme="day"] .ao-btn:not(.ao-btn-primary),
html[data-theme="day"] .rb-btn:not(.ao-btn-primary),
html[data-theme="day"] .rb-cancel,
html[data-theme="day"] .cl-btn.ghost,
html[data-theme="day"] .cc-btn.ghost{
  background:#ffffff !important;color:var(--ink) !important;border:1px solid var(--line) !important;
}
html[data-theme="day"] .rb-btn:not(.ao-btn-primary):hover,
html[data-theme="day"] .cl-x:hover{background:var(--day-hover) !important}

/* ── icon tiles ───────────────────────────────────────────────────────────── */
html[data-theme="day"] .act .ic{background:var(--day-tile) !important}

/* ── neutral chips / tags / badges (slate fill) ───────────────────────────── */
html[data-theme="day"] .sb-srctag,
html[data-theme="day"] .sb-brand,
html[data-theme="day"] .sb-brand.chint,
html[data-theme="day"] .sb-brand.mixed,
html[data-theme="day"] .sb-vend .vtag,
html[data-theme="day"] .cc-state.new,
html[data-theme="day"] .cc-state.snoozed,
html[data-theme="day"] .cl-col-n,
html[data-theme="day"] .cl-chip,
html[data-theme="day"] .rb-chip{background:var(--day-chip) !important}

/* ── "Open in <Vendor>" buttons: vibrant per-vendor color in day mode ──────────
 * The neutral slate flatten above (.sb-brand → day-chip) would gray these out, so
 * give the CLICKABLE link variant explicit, distinct vendor color (light tint + bold
 * vendor text + vendor border; filled on hover) so it pops on the light card. */
html[data-theme="day"] a.sb-brandlink.solaredge{background:rgba(234,88,12,.10) !important;color:#c2410c !important;border-color:#ea580c !important}
html[data-theme="day"] a.sb-brandlink.fronius{background:rgba(79,70,229,.10) !important;color:#4338ca !important;border-color:#4f46e5 !important}
html[data-theme="day"] a.sb-brandlink.sma{background:rgba(8,145,178,.10) !important;color:#0e7490 !important;border-color:#0891b2 !important}
html[data-theme="day"] a.sb-brandlink.chint{background:rgba(219,39,119,.10) !important;color:#be185d !important;border-color:#db2777 !important}
html[data-theme="day"] a.sb-brandlink.locus{background:rgba(2,132,199,.10) !important;color:#0369a1 !important;border-color:#0284c7 !important}
html[data-theme="day"] a.sb-brandlink.solaredge:hover{background:#ea580c !important;color:#fff !important}
html[data-theme="day"] a.sb-brandlink.fronius:hover{background:#4f46e5 !important;color:#fff !important}
html[data-theme="day"] a.sb-brandlink.sma:hover{background:#0891b2 !important;color:#fff !important}
html[data-theme="day"] a.sb-brandlink.chint:hover{background:#db2777 !important;color:#fff !important}
html[data-theme="day"] a.sb-brandlink.locus:hover{background:#0284c7 !important;color:#fff !important}

/* Vendor group names: NO per-vendor color — the rainbow was removed (Ford 2026-07-12,
 * "remove the colors of the vendors"). Every vendor name inherits the one uniform
 * .vs-vbadge brand blue in day + sky, so the table reads clean and consistent. */

/* ── progress / meter / peer tracks ───────────────────────────────────────── */
html[data-theme="day"] .peerbar,
html[data-theme="day"] .cc-meter,
html[data-theme="day"] .sb-pi{background:var(--day-track) !important}
/* peer-bar fill glow was emerald → utility blue */
html[data-theme="day"] .peerbar i{box-shadow:0 0 10px rgba(37,99,235,.45) !important}

/* ── code chips in footer / empty state ───────────────────────────────────── */
html[data-theme="day"] footer code,
html[data-theme="day"] .empty code{background:var(--day-hover) !important}

/* ── raised "panel-ish" surfaces that used near-zero white alpha ──────────── */
html[data-theme="day"] .sb-viewport,
html[data-theme="day"] .cc-tablewrap,
html[data-theme="day"] .cl-col,
html[data-theme="day"] .rb-drop{background:var(--day-surf) !important}
html[data-theme="day"] .sb-vend,
html[data-theme="day"] .cc-collapsible,
html[data-theme="day"] .cc-evidence .e{background:#ffffff !important}
html[data-theme="day"] .sb-card-bar{background:var(--day-surf) !important}

/* ── segmented controls ───────────────────────────────────────────────────── */
html[data-theme="day"] .rb-seg,
html[data-theme="day"] .cc-chips,
html[data-theme="day"] .cc-sel,
html[data-theme="day"] .cl-seg{background:var(--bg2) !important}
html[data-theme="day"] .cc-chip.on{background:#ffffff !important}

/* ── tab bar hovers + whoami chip ─────────────────────────────────────────── */
html[data-theme="day"] .tab:hover{background:var(--day-hover) !important;color:var(--ink) !important}
html[data-theme="day"] .tab.tab-whoami{background:#ffffff !important}
html[data-theme="day"] .tab.tab-whoami:hover{background:var(--day-surf) !important}

/* ── triage table rows ────────────────────────────────────────────────────── */
html[data-theme="day"] .cc-table thead th{background:var(--day-surf) !important;border-bottom-color:var(--line) !important}
html[data-theme="day"] .cc-table tbody tr.row{border-bottom-color:var(--line) !important}
html[data-theme="day"] .cc-table tbody tr.row:hover{background:var(--day-hover) !important}
html[data-theme="day"] .cc-drawer .inner{background:var(--day-surf) !important}

/* ── KPI cards / policy bar / claim cards → white (were dark gradients) ───── */
html[data-theme="day"] .cc-kpi,
html[data-theme="day"] .cl-kpi,
html[data-theme="day"] .cl-policy,
html[data-theme="day"] .cl-card{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;
}

/* ── frosted floating clusters over the fleet tree ────────────────────────── */
html[data-theme="day"] .sb-head-btns,
html[data-theme="day"] .sb-legend{
  background:rgba(255,255,255,.78) !important;border-color:var(--line) !important;
}

/* ── overlays / scrims (were near-black) → cool slate dim ─────────────────── */
html[data-theme="day"] .ao-overlay,
html[data-theme="day"] .sb-ov,
html[data-theme="day"] .cl-modal-back{
  background:rgba(15,23,42,.40) !important;
}

/* ── modals / toasts / alert cards / dropdown menus → light ───────────────── */
html[data-theme="day"] .ao-modal,
html[data-theme="day"] .sb-modal,
html[data-theme="day"] .cl-modal,
html[data-theme="day"] .sb-toast,
html[data-theme="day"] .sb-detail-card,
html[data-theme="day"] .sb-card,
html[data-theme="day"] .sb-card-menu{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;color:var(--ink) !important;
  border-color:var(--line) !important;
  box-shadow:0 24px 60px -28px rgba(15,23,42,.28) !important;
}
html[data-theme="day"] .cl-menu{background:#ffffff !important;border-color:var(--line) !important;
  box-shadow:0 18px 44px -20px rgba(15,23,42,.22) !important}
html[data-theme="day"] .ao-modal-foot,
html[data-theme="day"] .sb-modal-foot{background:var(--day-surf) !important}
/* red-tinted alert variants stay red, just light */
html[data-theme="day"] .sb-toast.alert,
html[data-theme="day"] .sb-alert-card{
  background:linear-gradient(165deg,#ffffff,#fef2f2) !important;border-color:rgba(220,38,38,.4) !important;
}
html[data-theme="day"] .cl-x{background:var(--day-tile) !important;color:var(--muted) !important}
html[data-theme="day"] .ao-sites,
html[data-theme="day"] .ao-site,
html[data-theme="day"] .ao-diag-stat,
html[data-theme="day"] .ao-evidence{background:#ffffff !important;border-color:var(--line) !important}

/* ── sandbox menu / card hovers ───────────────────────────────────────────── */
html[data-theme="day"] .sb-card-menu button:hover,
html[data-theme="day"] .sb-card-btn:hover,
html[data-theme="day"] .cl-menu-i:hover{background:var(--day-hover) !important}

/* ── login-portal buttons inside the add-array modal ──────────────────────── */
html[data-theme="day"] .sb-login-btn{
  background:linear-gradient(165deg,#ffffff,#f8fafc) !important;border-color:var(--line) !important;
}
html[data-theme="day"] .sb-login-btn:hover{background:var(--day-surf) !important}

/* ── fleet-tree feeder wires / flow motes → utility blue on light ─────────── */
html[data-theme="day"] svg.sb-wires path.feed,
html[data-theme="day"] svg.sb-wires path.trunk{stroke:rgba(37,99,235,.20) !important}
html[data-theme="day"] svg.sb-wires path.flow{
  stroke:rgba(14,165,233,.9) !important;filter:drop-shadow(0 0 5px rgba(14,165,233,.5)) !important;
}

/* ── soften the heavy black drop-shadows the dark theme used everywhere ───── */
html[data-theme="day"] .hcard,
html[data-theme="day"] .act,
html[data-theme="day"] .inv,
html[data-theme="day"] .acct-list,
html[data-theme="day"] .rep-card,
html[data-theme="day"] .pc-main,
html[data-theme="day"] .pc-tiers,
html[data-theme="day"] .rb-sub{
  box-shadow:0 1px 2px -1px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.07) !important;
}

/* ── the live "verdict" / value glow text-shadows are loud on white ───────── */
html[data-theme="day"] .hcard.value .big,
html[data-theme="day"] .pc-price,
html[data-theme="day"] .cc-kpi.recovered .v,
html[data-theme="day"] .cc-kpi.risk .v,
html[data-theme="day"] .cl-kpi.atstake .v,
html[data-theme="day"] .cl-kpi.recovered .v{text-shadow:none !important}

/* ===========================================================================
 * EMERALD-GLOW LONG TAIL — the dark theme hardcoded rgba(63,214,138,…) glows,
 * borders, focus-rings and "ok"/win tints all over styles.css. Re-point them
 * to utility blue so no green specks survive on the light skin. (Night keeps
 * the emerald — these only fire under [data-theme="day"].)
 * ==========================================================================*/

/* value / pricing hero cards that were emerald-tinted */
html[data-theme="day"] .hcard.value{
  background:linear-gradient(150deg,rgba(37,99,235,.08),rgba(37,99,235,.02)) !important;
  border-color:rgba(37,99,235,.25) !important;
}
html[data-theme="day"] .hcard .sun{
  background:radial-gradient(circle at 40% 40%,rgba(37,99,235,.18),rgba(37,99,235,.05) 60%,transparent 72%) !important;
}
html[data-theme="day"] .pc-main{
  background:linear-gradient(150deg,rgba(37,99,235,.07),rgba(37,99,235,.02)) !important;
  border-color:rgba(37,99,235,.28) !important;
}
html[data-theme="day"] .pc-sun{
  background:radial-gradient(circle at 40% 40%,rgba(37,99,235,.18),rgba(37,99,235,.05) 60%,transparent 72%) !important;
}
html[data-theme="day"] .pc-badge{
  background:rgba(37,99,235,.10) !important;border-color:rgba(37,99,235,.28) !important;color:var(--good) !important;
}

/* "win"/"ok" status tints */
html[data-theme="day"] .act.win{
  border-color:rgba(37,99,235,.32) !important;
  background:linear-gradient(170deg,rgba(37,99,235,.07),rgba(37,99,235,.02)) !important;
}
html[data-theme="day"] .act.win .ic{background:rgba(37,99,235,.12) !important;border-color:rgba(37,99,235,.28) !important}
html[data-theme="day"] .pill.ok{background:rgba(37,99,235,.12) !important;color:var(--good) !important}
html[data-theme="day"] .vlight.green{
  background:radial-gradient(circle at 38% 32%,#60a5fa,#2563eb) !important;
  box-shadow:0 0 18px rgba(37,99,235,.45),inset 0 0 8px rgba(255,255,255,.5) !important;
}

/* sandbox tiles / dots / flags / tier tags / alerts in the "ok" state */
html[data-theme="day"] .sb-tile.ok{border-color:rgba(37,99,235,.22) !important}
html[data-theme="day"] .sb-tile.ok:hover{border-color:rgba(37,99,235,.5) !important}
html[data-theme="day"] .sb-tile-dot.ok{background:var(--good) !important;box-shadow:0 0 8px rgba(37,99,235,.5) !important}
html[data-theme="day"] .sb-tile-flag.ok{color:var(--good) !important;background:rgba(37,99,235,.10) !important}
html[data-theme="day"] .sb-srctag.live{background:rgba(37,99,235,.14) !important;color:var(--good) !important}
html[data-theme="day"] .sb-alert.ok{border-color:rgba(37,99,235,.28) !important}
html[data-theme="day"] .sb-tier-tag.c{background:rgba(8,145,178,.12) !important;color:var(--sky) !important;border-color:rgba(8,145,178,.3) !important}
html[data-theme="day"] .sb-editable.sb-editing{outline-color:var(--good) !important;background:rgba(37,99,235,.08) !important}
html[data-theme="day"] .sb-inv-toggle:hover{border-color:rgba(37,99,235,.45) !important}

/* hover / focus rings that hardcoded the emerald glow → utility blue */
html[data-theme="day"] .acct-btn:hover,
html[data-theme="day"] .sb-togglebtn:hover{border-color:rgba(37,99,235,.45) !important;background:rgba(37,99,235,.06) !important}
html[data-theme="day"] .acct-edit .r-v input:focus,
html[data-theme="day"] .acct-pw-edit input:focus,
html[data-theme="day"] .acct-pw-eye:hover,
html[data-theme="day"] .rep-fld select:focus,
html[data-theme="day"] .rep-fld input:focus{border-color:rgba(37,99,235,.5) !important}
html[data-theme="day"] .ao-input:focus,
html[data-theme="day"] .ao-textarea:focus{border-color:var(--good) !important;box-shadow:0 0 0 3px rgba(37,99,235,.15) !important}
html[data-theme="day"] .fc-alerts-btn:hover{background:rgba(37,99,235,.10) !important;border-color:rgba(37,99,235,.4) !important;color:var(--ink) !important}
html[data-theme="day"] .ao-evidence{background:rgba(37,99,235,.05) !important;border-color:rgba(37,99,235,.16) !important}
/* global focus-visible ring — cheap, professional polish */
html[data-theme="day"] :focus-visible{outline:2px solid rgba(37,99,235,.55) !important;outline-offset:2px}

/* ===========================================================================
 * LANDING / ANONYMOUS-VISITOR SURFACES (index.html inline <style>):
 * hero value-prop + pricing aside + demo strip + GMP gate + trial nudge.
 * These hardcode warm gold/green and a dark pricing card; flip them to the
 * cool slate + utility-blue front door. Warnings keep amber (correct status).
 * ==========================================================================*/

/* conversion banner wrapper + demo strip → clean light panel */
html[data-theme="day"] .demo-banner{
  background:#ffffff !important;border-color:var(--line) !important;
  box-shadow:0 1px 3px rgba(15,23,42,.06) !important;
}
html[data-theme="day"] .db-demostrip{
  background:var(--day-surf) !important;border-top-color:var(--line) !important;
}
html[data-theme="day"] .db-badge{
  color:#1d4ed8 !important;background:#eff6ff !important;border-color:#bfdbfe !important;
}
html[data-theme="day"] .hero-h1 em{color:#2563eb !important}
/* pricing aside used a dark translucent card + emerald border → white card */
html[data-theme="day"] .hero-price{
  background:#ffffff !important;border-color:#bfdbfe !important;
  box-shadow:0 1px 3px rgba(15,23,42,.07) !important;
}
html[data-theme="day"] .hp-num{color:#2563eb !important}
/* primary marketing CTA: warm gold gradient → utility blue */
html[data-theme="day"] .db-cta{
  background:linear-gradient(180deg,#3b82f6,#1d4ed8) !important;color:#ffffff !important;
  box-shadow:0 6px 18px -8px rgba(29,78,216,.6) !important;
}
html[data-theme="day"] .db-cta:hover{filter:brightness(1.05)}

/* GMP "you're not done" gate is a WARNING → amber (kept), just on light */
html[data-theme="day"] .gmp-gate{
  border-color:#fcd34d !important;
  background:linear-gradient(115deg,#fffbeb,#fef3c7) !important;
  box-shadow:0 1px 3px rgba(15,23,42,.06) !important;
}
html[data-theme="day"] .gmp-gate-badge,
html[data-theme="day"] .gmp-gate-cta{background:#d97706 !important;color:#ffffff !important}
html[data-theme="day"] .gmp-gate-cta{box-shadow:0 6px 18px -8px rgba(217,119,6,.55) !important}
/* "almost there" variant was green → utility blue */
html[data-theme="day"] .gmp-gate.almost{
  border-color:#93c5fd !important;
  background:linear-gradient(115deg,#eff6ff,#dbeafe) !important;
  box-shadow:0 1px 3px rgba(15,23,42,.06) !important;
}
html[data-theme="day"] .gmp-gate.almost .gmp-gate-badge,
html[data-theme="day"] .gmp-gate.almost .gmp-gate-cta{background:#2563eb !important;color:#ffffff !important}

/* trial nudge: quiet light card; CTA + urgent rail to brand/warn */
html[data-theme="day"] .trial-nudge{background:#ffffff !important;border-color:var(--line) !important}
html[data-theme="day"] .trial-nudge-cta{color:var(--good) !important;border-color:var(--line) !important}
html[data-theme="day"] .trial-nudge-cta:hover{border-color:var(--good) !important}

/* ===========================================================================
 * REPORTS + DASHBOARD POLISH — make the Reports tab and the command-center
 * KPIs read like an energy-corp operational dashboard: white cards, slate
 * hairlines, tabular blue data, restrained chrome.
 * ==========================================================================*/

html[data-theme="day"] .rb-card,
html[data-theme="day"] .rb-wiz-card,
html[data-theme="day"] .rb-doc,
html[data-theme="day"] .rb-draft,
html[data-theme="day"] .rb-gr,
html[data-theme="day"] .rep-card{
  background:#ffffff !important;border-color:var(--line) !important;
  box-shadow:0 1px 2px -1px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.07) !important;
}
/* report section headers / labels → uppercase slate eyebrow feel */
html[data-theme="day"] .rb-k,
html[data-theme="day"] .rb-q{color:var(--muted) !important}
html[data-theme="day"] .rb-v{color:var(--ink) !important}
/* numeric report values blue + tabular for the corporate ledger look */
html[data-theme="day"] .rb-v.num,
html[data-theme="day"] .rb-gr-v,
html[data-theme="day"] .rb-status-v{color:var(--good) !important;font-variant-numeric:tabular-nums}
/* report status chips: ready=blue, scheduled=cyan, error keeps red */
html[data-theme="day"] .rb-status.ok,
html[data-theme="day"] .rb-status.ready{background:rgba(37,99,235,.10) !important;color:var(--good) !important}
html[data-theme="day"] .rb-status.scheduled{background:rgba(8,145,178,.10) !important;color:var(--sky) !important}
html[data-theme="day"] .rb-gmp-ok,
html[data-theme="day"] .rb-wiz-gmp-ok{color:var(--good) !important}
/* GMP empty/none states → quiet slate cards */
html[data-theme="day"] .rb-gmp-empty,
html[data-theme="day"] .rb-gmp-none,
html[data-theme="day"] .rb-gmp-auto-nudge,
html[data-theme="day"] .rb-wiz-gmp-none,
html[data-theme="day"] .rb-wiz-gmp-some{
  background:var(--day-surf) !important;border-color:var(--line) !important;color:var(--muted) !important;
}
/* command-center fleet KPIs: positive numbers blue, at-risk red, warn amber */
html[data-theme="day"] .cc-kpi.recovered .v,
html[data-theme="day"] .cl-kpi.recovered .v{color:var(--good) !important}
html[data-theme="day"] .cc-kpi.risk .v,
html[data-theme="day"] .cl-kpi.atstake .v{color:var(--bad) !important}

/* ===========================================================================
 * FLEET COMMANDER bar + OVERVIEW GRID tiles + ENRICHED detail modal.
 * Hardcoded dark gradients & emerald "ok" tints → cool slate + utility blue.
 * ==========================================================================*/

/* ── fleet COMMANDER KPI tiles (base tint; the dashboard-scoped polish for the
   4×2 tile grid lives in the DIVINE DASHBOARD block further down) ─────────── */
html[data-theme="day"] .fcg-tile{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;color:var(--ink) !important;
  border-color:var(--line) !important;
  box-shadow:0 1px 2px -1px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.07) !important;
}
html[data-theme="day"] .fcg-v b{color:var(--ink) !important}
html[data-theme="day"] .fcg-u{color:var(--muted) !important}

/* ── OVERVIEW GRID tiles ──────────────────────────────────────────────────── */
html[data-theme="day"] .sb-tile{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;color:var(--ink) !important;
  border-color:var(--line) !important;
  box-shadow:0 1px 2px -1px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.07) !important;
}
html[data-theme="day"] .sb-tile.warn{background:linear-gradient(168deg,#fffbeb,#fef3c7) !important;border-color:rgba(217,119,6,.32) !important}
html[data-theme="day"] .sb-tile.bad{background:linear-gradient(168deg,#fef2f2,#fee2e2) !important;border-color:rgba(220,38,38,.32) !important}
/* watch = soft live/data state — cyan on a cool wash, deliberately calmer than amber */
html[data-theme="day"] .sb-tile.watch{background:linear-gradient(168deg,#f0f9ff,#e0f2fe) !important;border-color:rgba(8,145,178,.30) !important}
html[data-theme="day"] .sb-tile.watch:hover{border-color:rgba(8,145,178,.55) !important}
html[data-theme="day"] .sb-tile:hover{box-shadow:0 12px 26px -14px rgba(15,23,42,.22) !important}
html[data-theme="day"] .sb-tile-name{color:var(--ink) !important}
html[data-theme="day"] .sb-tile-sub{color:var(--muted) !important}
html[data-theme="day"] .sb-tile-chip.ok{color:var(--good) !important;background:rgba(37,99,235,.10) !important}
html[data-theme="day"] .sb-tile-chip.warn{color:var(--warn) !important;background:rgba(217,119,6,.13) !important}
html[data-theme="day"] .sb-tile-chip.bad{color:var(--bad) !important;background:rgba(220,38,38,.10) !important}
html[data-theme="day"] .sb-tile-chip.watch{color:#0e7490 !important;background:rgba(8,145,178,.12) !important}
html[data-theme="day"] .sb-tile-risk{color:var(--bad) !important}
html[data-theme="day"] .sb-tile-risk small{color:var(--faint) !important}

/* ── ENRICHED detail modal: blown-up card + stat panel ────────────────────── */
html[data-theme="day"] .sb-dc-bigcard .sb-inv{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;color:var(--ink) !important;
  box-shadow:0 30px 80px -28px rgba(15,23,42,.32),0 0 0 1px rgba(37,99,235,.16) !important;
}
html[data-theme="day"] .sb-dc-bigcard .sb-inv[data-tone="warn"]{background:linear-gradient(168deg,#fffbeb,#fef3c7) !important}
html[data-theme="day"] .sb-dc-bigcard .sb-inv[data-tone="bad"]{background:linear-gradient(168deg,#fef2f2,#fee2e2) !important}
html[data-theme="day"] .sb-dc-diag{
  background:var(--day-surf) !important;color:var(--ink) !important;border-left-color:var(--good) !important;
}
html[data-theme="day"] .sb-dc-diag.warn{border-left-color:var(--warn) !important}
html[data-theme="day"] .sb-dc-diag.bad{border-left-color:var(--bad) !important}
html[data-theme="day"] .sb-dc-stat{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;border-color:var(--line) !important;
}
html[data-theme="day"] .sb-dc-stat.hero{
  background:linear-gradient(168deg,#fef2f2,#fee2e2) !important;border-color:rgba(220,38,38,.32) !important;
}
html[data-theme="day"] .sb-dc-sv{color:var(--ink) !important}
html[data-theme="day"] .sb-dc-sk,
html[data-theme="day"] .sb-dc-sv small{color:var(--faint) !important}
html[data-theme="day"] .sb-dc-sv.ok{color:var(--good) !important}
html[data-theme="day"] .sb-dc-sv.warn{color:var(--warn) !important}
html[data-theme="day"] .sb-dc-sv.bad{color:var(--bad) !important}
html[data-theme="day"] .sb-dc-array{color:var(--sky) !important}
html[data-theme="day"] .sb-dc-actions .sb-dc-origin{
  background:var(--day-surf) !important;border-color:var(--line) !important;color:var(--ink) !important;
}

/* ===========================================================================
 * SANDBOX "LIQUID TANK" FLEET CARDS (sb-inv / sb-array) — the live fleet view
 * and the DEFAULT tab. The dark theme hardcodes dark gradients, light text and
 * emerald tank fills with no variables, so flip the whole component to the
 * light control-room look here: white cards, slate ink, utility-blue "ok".
 * ==========================================================================*/

/* card surfaces */
html[data-theme="day"] .sb-inv,
html[data-theme="day"] .sb-array,
html[data-theme="day"] .sb-array--card{
  background:linear-gradient(168deg,#ffffff,#f8fafc) !important;
  color:var(--ink) !important;border-color:var(--line) !important;
  box-shadow:0 1px 2px -1px rgba(15,23,42,.06),0 1px 3px rgba(15,23,42,.07) !important;
}
html[data-theme="day"] .sb-inv.warn{
  background:linear-gradient(168deg,#fffbeb,#fef6e6) !important;border-color:rgba(217,119,6,.4) !important;
}
html[data-theme="day"] .sb-inv.bad{
  background:linear-gradient(168deg,#fef2f2,#fde9e8) !important;border-color:rgba(220,38,38,.45) !important;
}
html[data-theme="day"] .sb-inv:hover,
html[data-theme="day"] .sb-array--card:hover{box-shadow:0 10px 24px -14px rgba(15,23,42,.25) !important}

/* text inside the cards (hardcoded light → slate ink / muted) */
html[data-theme="day"] .sb-inv-name,
html[data-theme="day"] .sb-array-name,
html[data-theme="day"] .sb-perf-main,
html[data-theme="day"] .sb-perf-prod,
html[data-theme="day"] .sb-ag-total,
html[data-theme="day"] .sb-ag-graph,
html[data-theme="day"] .sb-inv-now,
html[data-theme="day"] .sb-spark-axis{color:var(--ink) !important}
html[data-theme="day"] .sb-perf-sub,
html[data-theme="day"] .sb-perf-sub--lone,
html[data-theme="day"] .sb-inv-size,
html[data-theme="day"] .sb-perf-unit,
html[data-theme="day"] .sb-perf-sym,
html[data-theme="day"] .sb-array-k,
html[data-theme="day"] .sb-ag-k,
html[data-theme="day"] .sb-wx{color:var(--muted) !important}

/* dark spec "plates" → light slate plate */
html[data-theme="day"] .sb-inv-plate,
html[data-theme="day"] .sb-array-plate{
  background:rgba(15,23,42,.05) !important;color:var(--ink) !important;border-color:var(--line) !important;
}

/* liquid tank fills — ok → utility blue, low → amber, fault → red */
html[data-theme="day"] .sb-liquid--ok{background-image:linear-gradient(rgba(37,99,235,.4),rgba(29,78,216,.82)) !important}
html[data-theme="day"] .sb-liquid--low{background-image:linear-gradient(rgba(245,158,11,.4),rgba(217,119,6,.78)) !important}
html[data-theme="day"] .sb-liquid--fault{background-image:linear-gradient(rgba(248,113,113,.42),rgba(220,38,38,.8)) !important}

/* output bar: track → slate; fill → blue (ok), amber/red on toned cards */
html[data-theme="day"] .sb-ob-track{background:var(--day-track) !important}
html[data-theme="day"] .sb-ob-fill{background-image:linear-gradient(90deg,#2563eb,#0ea5e9) !important}
html[data-theme="day"] .sb-inv.warn .sb-ob-fill{background-image:linear-gradient(90deg,#d97706,#f59e0b) !important}
html[data-theme="day"] .sb-inv.bad .sb-ob-fill{background-image:linear-gradient(90deg,#dc2626,#f87171) !important}

/* fair-share % — ok → blue, warn → amber, bad → red */
html[data-theme="day"] .sb-perf-pct{color:var(--good) !important}
html[data-theme="day"] .sb-inv.warn .sb-perf-pct{color:var(--warn) !important}
html[data-theme="day"] .sb-inv.bad .sb-perf-pct{color:var(--bad) !important}

/* status pill: producing → blue, watch → amber, error → red */
html[data-theme="day"] .sb-state{background:rgba(37,99,235,.12) !important;color:var(--good) !important}
html[data-theme="day"] .sb-state.st-warn,
html[data-theme="day"] .sb-inv.warn .sb-state{background:rgba(217,119,6,.13) !important;color:var(--warn) !important}
html[data-theme="day"] .sb-state.st-error,
html[data-theme="day"] .sb-inv.bad .sb-state{background:rgba(220,38,38,.12) !important;color:var(--bad) !important}

/* decorative tank bubbles/stars: green-white → light-blue, read on light glass */
html[data-theme="day"] .sb-liq-bubbles span{
  background-image:radial-gradient(circle at 35% 35%, rgba(219,234,254,.95), rgba(96,165,250,.5)) !important;
}
html[data-theme="day"] .sb-liq-stars{opacity:.25 !important}

/* identity chip dot glow + vendor/utility stream toggle (green-400) → blue */
html[data-theme="day"] .whoami-dot{box-shadow:0 0 8px rgba(37,99,235,.6) !important}
html[data-theme="day"] .sb-stream-seg.on{background:rgba(37,99,235,.14) !important}

/* ===========================================================================
 * SECOND PASS (2026-06-21) — readability + clean professional look for the
 * reworked SANDBOX + TRENDS tabs. Two systemic issues on the light skin:
 *   (1) the dark theme leaned on slate-400 (--faint) for real secondary text
 *       (labels, sub-labels, table headers, axis text) — only ~2.6:1 on white.
 *   (2) the trends revamp added emerald/gold accents + sky-as-small-text.
 * Fix at the token level (darken the day grays to a crisp, readable two-step
 * hierarchy) + recolor the trends accents/states to the utility-blue system.
 * ==========================================================================*/

/* readable gray hierarchy: secondary slate-600, tertiary slate-500 (were
   slate-500/slate-400). Lifts every var(--muted)/var(--faint) label AND the
   canvas chart text, which reads these vars at draw time. */
html[data-theme="day"]{
  --muted:#475569;   /* slate-600 — secondary text (was #64748b) */
  --faint:#64748b;   /* slate-500 — tertiary text (was #94a3b8, ~2.6:1 on white) */
}

/* sandbox "4 honest states": the rework colors the Error state amber — make it
   red (matches the alert pill + universal convention). warn=amber, off=gray. */
html[data-theme="day"] .sb-state.bad{background:rgba(220,38,38,.12) !important;color:#dc2626 !important}
html[data-theme="day"] .sb-state.warn{background:rgba(217,119,6,.14) !important;color:#b45309 !important}
html[data-theme="day"] .sb-state.off,
html[data-theme="day"] .sb-state.idle,
html[data-theme="day"] .sb-state.offline{background:rgba(71,85,105,.12) !important;color:#475569 !important}
/* "No live feed" calm/informational (audit #4) — CYAN: distinct from the day theme's
   utility-blue "Producing", slate "Offline", amber warn, red error. */
html[data-theme="day"] .sb-state.info{background:rgba(8,145,178,.13) !important;color:#0e7490 !important}
/* offline card: pure red on both night (styles.css) and day */
html[data-theme="day"] .sb-inv.st-offline{
  background:linear-gradient(168deg,#fef2f2,#fde9e8) !important;
  border-color:rgba(220,38,38,.45) !important;
}
/* warn alert + amber stat as small text on white → amber-700 for legibility */
html[data-theme="day"] .sb-inv-alert.warn{color:#b45309 !important}

/* positive deltas/values were sky-500 (#0ea5e9) — too light as small text on
   white (~2.8:1). Use a readable sky-700; negatives stay red. */
html[data-theme="day"] .tr-v.pos,
html[data-theme="day"] .an-delta.pos,
html[data-theme="day"] .rp-pos{color:#0369a1 !important}
html[data-theme="day"] .an-delta.pos{background:rgba(2,132,199,.10) !important}

/* ---- trends: emerald/gold accents → utility blue ---- */
/* stat-tile ambient glow (was emerald radial) */
html[data-theme="day"] .tr-glow{background:radial-gradient(circle at 50% 0%,rgba(37,99,235,.10),transparent 70%) !important}
/* export button → white ghost with blue label */
html[data-theme="day"] .tr-export{background:#ffffff !important;border-color:var(--line) !important;color:var(--good) !important}
html[data-theme="day"] .tr-export:hover{background:var(--day-hover) !important}
/* advanced art-view per-block accent (ACCENT map = green/gold) → uniform blue */
html[data-theme="day"] .tr-chartblock{--tr-accent:#2563eb !important}
html[data-theme="day"] .tr-stack-dot{background:#2563eb !important;box-shadow:0 0 8px rgba(37,99,235,.5) !important}
/* analytics toggle "on" state (green-400) → blue */
html[data-theme="day"] .an-g.on{background:#2563eb !important;color:#ffffff !important;box-shadow:0 0 0 1px rgba(37,99,235,.3) !important}

/* trends chart hover tooltip: the dark theme hardcodes a near-black bg while
   its text uses var(--ink) — dark-on-dark on the light skin. Flip to a white
   card so the (now-dark) ink/muted text reads. */
html[data-theme="day"] .rp-tip{
  background:#ffffff !important;border-color:var(--line) !important;
  box-shadow:0 14px 36px -16px rgba(15,23,42,.30) !important;
}
/* positive value/sub in the tooltip was sky-500 (too light) → sky-700 */
html[data-theme="day"] .rp-tip-v.pos,
html[data-theme="day"] .rp-tip-sub.pos,
html[data-theme="day"] .rp-tip-row b.pos{color:#0369a1 !important}

/* Production Analytics chart tooltip (an-tip) — same dark hardcoded bg fix */
html[data-theme="day"] .an-tip{
  background:#ffffff !important;border-color:var(--line) !important;
  box-shadow:0 8px 24px -8px rgba(15,23,42,.18) !important;
}
/* positive delta badge: emerald bg tint → blue tint */
html[data-theme="day"] .an-delta.pos{background:rgba(37,99,235,.10) !important}

/* ===========================================================================
 * THIRD PASS (2026-06-21, Lane B) — SANDBOX readability on the day skin.
 * The fleet cards rendered as heavy SATURATED green/blue blocks: the array /
 * inverter "liquid tank" fills are dynamic (class sb-liquid--clip + an inline
 * green/blue gradient), which the --ok/--low/--fault day overrides never catch,
 * AND the day content-plate was lightened to ~5% opacity — so the night-bright
 * tank flooded the whole card and clashed with the clean inverter tiles.
 * Fix: (1) re-skin the tank fill to a SUBTLE, theme-appropriate low-alpha tint
 * (blue ok / amber warn / red fault) so each card reads as a clean white
 * control-room card with a gentle production wash; (2) frost the content plate
 * to near-white so the data sits crisply above the wash; (3) tidy a few hairline
 * separators + the toolbar so the whole tab reads calm and legible. Night skin
 * untouched (these only fire under [data-theme="day"]).
 * ==========================================================================*/

/* (1) liquid tank fills → subtle tint, by parent tone. !important beats the
   inline night gradient. */
html[data-theme="day"] .sb-array .sb-liquid,
html[data-theme="day"] .sb-inv .sb-liquid{
  background-image:linear-gradient(rgba(37,99,235,.07),rgba(37,99,235,.20)) !important;
  opacity:1 !important;
}
html[data-theme="day"] .sb-array--card[data-tone="warn"] .sb-liquid,
html[data-theme="day"] .sb-inv.warn .sb-liquid,
html[data-theme="day"] .sb-inv[data-tone="warn"] .sb-liquid{
  background-image:linear-gradient(rgba(217,119,6,.08),rgba(217,119,6,.22)) !important;
}
html[data-theme="day"] .sb-array--card[data-tone="bad"] .sb-liquid,
html[data-theme="day"] .sb-inv.bad .sb-liquid,
html[data-theme="day"] .sb-inv[data-tone="bad"] .sb-liquid{
  background-image:linear-gradient(rgba(220,38,38,.08),rgba(220,38,38,.22)) !important;
}
/* decorative tank bubbles/stars: quiet right down on the light wash */
html[data-theme="day"] .sb-liq-bubbles span{opacity:.5 !important}

/* (2) content plate → frosted near-white so name/stats read crisply over the
   wash (was ~5% slate, which let the tank show straight through). */
html[data-theme="day"] .sb-array-plate,
html[data-theme="day"] .sb-inv-plate{
  background:rgba(255,255,255,.62) !important;border-color:rgba(15,23,42,.06) !important;
}

/* (3) calmer chrome: array section divider + the combined-graph divider use the
   slate hairline (were white-alpha, invisible on light); array eyebrow label
   reads sky-700 not the too-light cyan. */
html[data-theme="day"] .sb-ag{border-top-color:var(--line) !important}
html[data-theme="day"] .sb-array-k{color:#0369a1 !important}
/* per-array data-source brand chip + spec nameplates on a clean slate fill */
html[data-theme="day"] .sb-inv-plate,
html[data-theme="day"] .sb-array-plate .sb-inv-now{backdrop-filter:none !important}

/* ── Professional SANDBOX CANVAS background (Ford, template = NEPOOL operator
   sandbox). The NEPOOL board is a soft light gradient + two blurred ambient
   glow blobs + a dot grid. Translate that to AO's day "utility blue" palette:
   an off-white canvas with a faint blue dot grid and soft blue/cyan ambient
   glows, so the fleet reads as a calm professional control-room board instead
   of a flat slate panel. (#sbWrap = the framed card; .sb-viewport = the pannable
   canvas; the dot grid sits on the fixed viewport so it doesn't drift on pan.) */
html[data-theme="day"] #sbWrap{
  background:linear-gradient(180deg,#ffffff,#f5f8fe) !important;border-color:var(--line) !important;
}
/* Ops sheet — same opaque day plate as Inverters (#sbWrap) */
html[data-theme="day"] #panelOps .ops-wrap{
  background:linear-gradient(180deg,#ffffff,#f5f8fe) !important;
  border-color:var(--line) !important;
  box-shadow:0 18px 44px -30px rgba(15,50,110,.18) !important;
}
html[data-theme="day"] #panelOps .ops-card,
html[data-theme="day"] #panelOps .ops-kpi,
html[data-theme="day"] #panelOps .ops-empty{
  background:linear-gradient(180deg,#ffffff,#f8fafc) !important;
  border-color:var(--line) !important;
}
html[data-theme="day"] #panelOps .ops-seg{
  background:#eef2f7 !important;
  border:1px solid #d5dde8 !important;
  box-shadow:inset 0 1px 0 #fff !important;
}
html[data-theme="day"] #panelOps .ops-seg-btn{
  color:#1e293b !important;
  opacity:1 !important;
  font-weight:700 !important;
}
html[data-theme="day"] #panelOps .ops-seg-btn:hover{
  background:#fff !important;
  color:#0f172a !important;
}
html[data-theme="day"] #panelOps .ops-seg-btn.on{
  background:var(--good,#2563eb) !important;
  color:#fff !important;
  box-shadow:0 4px 12px -4px rgba(37,99,235,.45) !important;
}
html[data-theme="day"] #panelOps .ops-detail pre,
html[data-theme="day"] #panelOps .ops-checkin{
  background:rgba(15,23,42,.04) !important;
  color:var(--ink) !important;
}
html[data-theme="day"] .sb-viewport{
  background-color:#f7faff !important;
  background-image:
    radial-gradient(58% 55% at 84% -8%, rgba(59,130,246,.15), rgba(59,130,246,0) 70%),
    radial-gradient(52% 55% at -6% 112%, rgba(14,165,233,.13), rgba(14,165,233,0) 70%),
    radial-gradient(rgba(37,99,235,.11) 1.1px, transparent 1.3px) !important;
  background-size:auto, auto, 24px 24px !important;
  background-position:0 0, 0 0, 0 0 !important;
  background-attachment:local, local, local !important;
}

/* ── FOURTH PASS (2026-06-21, Lane B) — boost day-mode card contrast + fix the
   SOURCE-OFFLINE banner/badge. On the light skin the cards felt too delicate
   (slate-200 hairline, barely lifted off the canvas) and the source-offline
   freshness banner kept its NIGHT amber palette — pale cream body (#f4e3c4) +
   light-gold headline (#ffd479) on a light amber box = effectively invisible. ── */

/* cards: firmer slate-300 border + a touch more lift so they read as crisp,
   confident cards on the light dotted canvas instead of washing into it. */
html[data-theme="day"] .sb-inv,
html[data-theme="day"] .sb-array,
html[data-theme="day"] .sb-array--card{
  border-color:#cbd5e1 !important;
  box-shadow:0 1px 2px -1px rgba(15,23,42,.10), 0 4px 12px -6px rgba(15,23,42,.16) !important;
}
html[data-theme="day"] .sb-inv:hover,
html[data-theme="day"] .sb-array--card:hover{box-shadow:0 12px 28px -14px rgba(15,23,42,.30) !important}
/* lift the faintest in-card captions off slate-400/500 to readable slate-600 */
html[data-theme="day"] .sb-perf-sub,
html[data-theme="day"] .sb-perf-sub--lone,
html[data-theme="day"] .sb-ag-nodata,
html[data-theme="day"] .sb-inv-size,
html[data-theme="day"] .sb-spark-axis span{color:#475569 !important}

/* SOURCE-OFFLINE freshness banner → dark amber text on a light amber box. */
html[data-theme="day"] .sb-srcout{
  background:linear-gradient(180deg,#fef3c7,#fde9b3) !important;
  border-color:#f59e0b !important;
  box-shadow:0 0 0 1px rgba(217,119,6,.16) !important;
}
html[data-theme="day"] .sb-srcout-ic{color:#b45309 !important;filter:none !important}
html[data-theme="day"] .sb-srcout-txt{color:#7c3a06 !important}     /* dark-amber body — readable */
html[data-theme="day"] .sb-srcout-txt b{color:#92400e !important}   /* amber-800 headline */

/* "⚠ SOURCE OFFLINE" ribbon → solid amber with white text (matches the day warn
   badge convention; the gold-ribbon + dark-brown text read weakly on the light card). */
html[data-theme="day"] .sb-array--srcout::after{
  background:#d97706 !important;color:#ffffff !important;
}
html[data-theme="day"] .sb-array--srcout{
  border-color:rgba(217,119,6,.7) !important;
  box-shadow:0 0 0 1px rgba(217,119,6,.4), 0 8px 22px -10px rgba(217,119,6,.42) !important;
}

/* Auto-login hint → blue tint in day mode */
html[data-theme="day"] .sb-autologin-hint{
  background:rgba(37,99,235,.06) !important;border-color:rgba(37,99,235,.22) !important;
  color:#334155 !important;
}
html[data-theme="day"] .sb-autologin-hint a.sb-al-link{color:#1d4ed8 !important;}

/* Auto-refresh expand chip + whole-row click affordance → utility blue in day mode */
html[data-theme="day"] .ar-caret{ background:rgba(37,99,235,.12) !important; color:#2563eb !important; }
html[data-theme="day"] #rowAutoRefresh:hover{ background:rgba(37,99,235,.05) !important; }
html[data-theme="day"] #rowAutoRefresh:hover .ar-caret{ background:rgba(37,99,235,.22) !important; }
html[data-theme="day"] #rowAutoRefresh:hover .ar-toggle{ color:#1d4ed8 !important; }

/* ===========================================================================
 * DIVINE DASHBOARD (2026-06-24) — premium control-room redesign of the owner
 * health tab. Elevates the reused command-center card + attention queue into a
 * refined, layered, expensive-feeling dashboard. Scoped to #panelDashboard so it
 * never touches the marketing command-center; loaded last + !important to beat
 * the base .fcg- and .cc- rules. (NB: never write "*" + "/" inside this comment —
 * an earlier ".fc-*" + "/" here closed the comment early and the parser ate the
 * :root --dash-shadow rule below, so the dashboard cards lost their shadow.)
 * ==========================================================================*/
:root{ --dash-shadow:0 1px 2px rgba(15,23,42,.04), 0 22px 48px -28px rgba(15,23,42,.22); }

/* — canvas — */
html[data-theme="day"] #panelDashboard .dash-wrap{ max-width:1160px !important; margin:0 auto !important; padding:30px 26px 76px !important; }

/* — header: gradient-clipped title + production STAT-PILLS — */
html[data-theme="day"] #panelDashboard .dash-head{ align-items:center !important; margin:0 4px 22px !important; }
html[data-theme="day"] #panelDashboard .dash-head h2{
  font-size:27px !important; font-weight:800 !important; letter-spacing:-.025em !important;
  background:linear-gradient(165deg,#0f172a,#41566d) !important;
  -webkit-background-clip:text !important; background-clip:text !important; color:transparent !important; }
html[data-theme="day"] #panelDashboard .dash-prod{ gap:9px !important; }
html[data-theme="day"] #panelDashboard .dash-prod .dp-dot{ display:none !important; }
html[data-theme="day"] #panelDashboard .dash-prod .dp{
  display:inline-flex !important; align-items:baseline !important; gap:6px !important;
  padding:8px 15px !important; background:#fff !important; border:1px solid #e7edf5 !important;
  border-radius:12px !important; font-size:12px !important; color:var(--muted) !important;
  box-shadow:0 1px 2px rgba(15,23,42,.05) !important; }
html[data-theme="day"] #panelDashboard .dash-prod .dp b{ font-size:15.5px !important; font-weight:760 !important; color:var(--ink) !important; letter-spacing:-.01em !important; font-variant-numeric:tabular-nums !important; }
/* Loading skeleton in day mode: the .dp pill is white, so the night white-on-white
   shimmer is invisible — repaint the bars dark-on-light. */
html[data-theme="day"] #panelDashboard .dash-prod .dp-skel{ padding:8px 15px !important; }
html[data-theme="day"] #panelDashboard .dash-prod .dp-skel-bar{
  background:linear-gradient(90deg, rgba(15,23,42,.06) 25%, rgba(15,23,42,.13) 37%, rgba(15,23,42,.06) 63%) !important;
  background-size:280% 100% !important; }

/* — KPI TILE GRID — the hero bar broken into uniform white tiles (2026-07-01):
   4 × 2 standard sizes, same card language as the .dp stat-pills + queue. — */
html[data-theme="day"] #panelDashboard .fcg{ gap:14px !important; }
html[data-theme="day"] #panelDashboard .fcg-tile{
  background:#fff !important; border:1px solid #e7edf5 !important; border-radius:18px !important;
  box-shadow:var(--dash-shadow), inset 0 1px 0 rgba(255,255,255,.9) !important; }
html[data-theme="day"] #panelDashboard .fcg-k{ color:var(--faint) !important; font-weight:750 !important; letter-spacing:.13em !important; }
html[data-theme="day"] #panelDashboard .fcg-v b{ color:var(--ink) !important; font-weight:820 !important; letter-spacing:-.03em !important; }
html[data-theme="day"] #panelDashboard .fcg-u{ color:var(--muted) !important; }
html[data-theme="day"] #panelDashboard .fcg-s{ color:var(--faint) !important; }
/* lead tile: gradient-clipped % over a faint utility-blue wash (day = blue-is-good) */
html[data-theme="day"] #panelDashboard .fcg-tile--health{ border-color:rgba(37,99,235,.28) !important;
  background:linear-gradient(135deg,rgba(37,99,235,.07),rgba(14,165,233,.02) 55%,transparent) #fff !important; }
html[data-theme="day"] #panelDashboard .fcg-tile--health .fcg-v b{
  background:linear-gradient(160deg,#3b82f6,#0ea5e9) !important;
  -webkit-background-clip:text !important; background-clip:text !important; color:transparent !important; }
html[data-theme="day"] #panelDashboard .fcg-tile--health.warn{ border-color:rgba(217,119,6,.35) !important;
  background:linear-gradient(135deg,rgba(217,119,6,.08),transparent 55%) #fff !important; }
html[data-theme="day"] #panelDashboard .fcg-tile--health.warn .fcg-v b{
  background:linear-gradient(160deg,#f59e0b,#d97706) !important;
  -webkit-background-clip:text !important; background-clip:text !important; color:transparent !important; }
html[data-theme="day"] #panelDashboard .fcg-tile--health.bad{ border-color:rgba(220,38,38,.35) !important;
  background:linear-gradient(135deg,rgba(220,38,38,.07),transparent 55%) #fff !important; }
html[data-theme="day"] #panelDashboard .fcg-tile--health.bad .fcg-v b{
  background:linear-gradient(160deg,#f87171,#dc2626) !important;
  -webkit-background-clip:text !important; background-clip:text !important; color:transparent !important; }
/* the health meter — day track + blue/amber/red fills */
html[data-theme="day"] #panelDashboard .fcg-meter{ background:rgba(15,23,42,.07) !important; }
html[data-theme="day"] #panelDashboard .fcg-fill{ background:linear-gradient(90deg,#2563eb,#0ea5e9) !important; }
html[data-theme="day"] #panelDashboard .fcg-fill--warn{ background:linear-gradient(90deg,#d97706,#fbbf24) !important; }
html[data-theme="day"] #panelDashboard .fcg-fill--bad{ background:linear-gradient(90deg,#dc2626,#f87171) !important; }
/* triage + money tones (specificity: .t-warn/.t-bad outrank the --risk base) */
html[data-theme="day"] #panelDashboard .fcg-tile--risk .fcg-v b{ color:var(--good) !important; }
html[data-theme="day"] #panelDashboard .fcg-tile.t-warn .fcg-v b{ color:var(--gold2) !important; }
html[data-theme="day"] #panelDashboard .fcg-tile.t-bad .fcg-v b{ color:#dc2626 !important; }
html[data-theme="day"] #panelDashboard .fc-asof{ font-size:11px !important; color:var(--faint) !important; }
html[data-theme="day"] #panelDashboard .fc-alerts-btn{
  background:#fff !important; border:1px solid #e7edf5 !important; border-radius:10px !important;
  padding:7px 13px !important; font-size:12.5px !important; font-weight:650 !important; color:var(--muted) !important;
  box-shadow:0 1px 2px rgba(15,23,42,.05) !important; transition:all .14s !important; cursor:pointer !important; }
html[data-theme="day"] #panelDashboard .fc-alerts-btn:hover{ border-color:rgba(37,99,235,.4) !important; color:var(--good) !important; background:rgba(37,99,235,.05) !important; }

/* — "NEEDS ATTENTION" heading — */
html[data-theme="day"] #panelDashboard .dash-attn{ margin:30px 4px 12px !important; }
html[data-theme="day"] #panelDashboard .dash-attn h3{ font-size:11px !important; letter-spacing:.13em !important; text-transform:uppercase !important; color:var(--faint) !important; font-weight:760 !important; }

/* — ATTENTION QUEUE — refined ledger — */
html[data-theme="day"] #panelDashboard .cc-tools{ margin-bottom:14px !important; gap:12px !important; }
html[data-theme="day"] #panelDashboard .cc-search input{ border-radius:11px !important; padding:10px 14px 10px 30px !important; background:#fff !important; border:1px solid #e7edf5 !important; box-shadow:0 1px 2px rgba(15,23,42,.04) !important; }
html[data-theme="day"] #panelDashboard .cc-chips{ background:#fff !important; border:1px solid #e7edf5 !important; border-radius:12px !important; padding:4px !important; box-shadow:0 1px 2px rgba(15,23,42,.04) !important; }
html[data-theme="day"] #panelDashboard .cc-chip{ border-radius:9px !important; padding:6px 12px !important; font-size:12.5px !important; font-weight:600 !important; }
html[data-theme="day"] #panelDashboard .cc-chip.on{ background:var(--good) !important; color:#fff !important; box-shadow:0 2px 8px -2px rgba(37,99,235,.5) !important; }
html[data-theme="day"] #panelDashboard .cc-chip.on .n{ color:rgba(255,255,255,.85) !important; }
html[data-theme="day"] #panelDashboard .cc-tablewrap{ border-radius:18px !important; border:1px solid #e7edf5 !important; background:#fff !important; box-shadow:var(--dash-shadow) !important; overflow:hidden !important; }
html[data-theme="day"] #panelDashboard .cc-table thead th{ padding:12px 16px !important; font-size:10px !important; letter-spacing:.09em !important; text-transform:uppercase !important; color:var(--faint) !important; background:#fbfcfe !important; border-bottom:1px solid #eef2f7 !important; font-weight:700 !important; }
html[data-theme="day"] #panelDashboard .cc-table td{ padding:15px 16px !important; border-bottom:1px solid #f1f5f9 !important; }
html[data-theme="day"] #panelDashboard .cc-table tbody tr.row{ transition:background .13s ease !important; }
html[data-theme="day"] #panelDashboard .cc-table tbody tr.row:hover{ background:#f4f8ff !important; }
html[data-theme="day"] #panelDashboard .cc-table tbody tr:last-child td{ border-bottom:0 !important; }
/* severity left-rail (inset box-shadow → works under border-collapse) */
html[data-theme="day"] #panelDashboard .cc-table tbody tr.sev-crit td:first-child{ box-shadow:inset 3px 0 0 var(--bad) !important; }
html[data-theme="day"] #panelDashboard .cc-table tbody tr.sev-under td:first-child{ box-shadow:inset 3px 0 0 var(--warn) !important; }
html[data-theme="day"] #panelDashboard .cc-table tbody tr.sev-quiet td:first-child{ box-shadow:inset 3px 0 0 var(--sky) !important; }
/* verdict → refined pill */
html[data-theme="day"] #panelDashboard .cc-verdict{ display:inline-flex !important; align-items:center !important; gap:7px !important; font-size:12.5px !important; font-weight:600 !important; padding:4px 10px !important; border-radius:999px !important; }
html[data-theme="day"] #panelDashboard .cc-verdict.crit{ background:rgba(220,38,38,.10) !important; color:#b91c1c !important; }
html[data-theme="day"] #panelDashboard .cc-verdict.under{ background:rgba(217,119,6,.12) !important; color:var(--gold2) !important; }
html[data-theme="day"] #panelDashboard .cc-verdict.quiet{ background:rgba(8,145,178,.12) !important; color:#0e7490 !important; }
html[data-theme="day"] #panelDashboard td .cc-verdict[style]{ background:transparent !important; padding:0 !important; }   /* the "action" cell reuses cc-verdict as a plain link */
html[data-theme="day"] #panelDashboard .cc-sevdot{ box-shadow:none !important; width:7px !important; height:7px !important; }
/* $ at stake — emphasized blue ledger figure */
html[data-theme="day"] #panelDashboard .cc-loss{ color:var(--good) !important; font-weight:780 !important; font-size:14px !important; letter-spacing:-.01em !important; }
html[data-theme="day"] #panelDashboard .cc-pi{ font-weight:750 !important; }
html[data-theme="day"] #panelDashboard .cc-site{ font-weight:700 !important; }
html[data-theme="day"] #panelDashboard .cc-state{ background:var(--day-chip) !important; color:var(--muted) !important; font-weight:650 !important; }
html[data-theme="day"] #panelDashboard .cc-foot{ color:var(--faint) !important; padding:0 2px !important; margin-top:14px !important; }