/* Light appearance: the light palette of Landing V4 (design/landing-v4 `.mxl` with the azure
   accent), chosen with the header switch (client/theme-mode.js). Dark stays the default and the
   rest of the system is unchanged; only colours move. Loaded last on every route that has the
   shared header. The reading ramp keeps the dark ramp's steps, so every step stays at 6.5:1 or
   better on paper (the design's own greys sit between 4.6:1 and 6.2:1). */
:root[data-theme='light'] {
  color-scheme: light;
  --color-paper: #f5f4f0;
  --color-surface: #ffffff;
  --color-surface-raised: #eeede8;
  --color-ink: #141414;
  --color-body: #3f3e3b;
  --color-muted: #4e4d49;
  --color-rule: #dedcd5;
  --color-rule-strong: #c9c7bf;
  --color-accent: #004cb2;
  --color-accent-tint: rgba(0, 88, 204, 0.06);
  --color-positive: #1a5c3b;
  --color-warning: #7a4200;
  --color-error: #9a2419;
  --color-error-surface: #fbeceb;
  --action-ink: #ffffff;
  --action-fill-hover: #2e2d2a;
  --action-fill-active: #45443f;
  --field-disabled-ink: #676561;
  --lp-eyebrow: #004cb2;
  --lp-nav-text: #3a3936;
  --lp-second: #343330;
  --lp-sub: #2b2b27;
  --lp-faint: #575652;
  --lp-ghost-line: rgba(0, 0, 0, 0.3);
  --lp-nav: rgba(245, 244, 240, 0.86);
  --lp-glass-rule: rgba(0, 0, 0, 0.08);
  --lp-glass-hi: rgba(0, 0, 0, 0.05);
  --lp-flag: #7a4200;
  --lp-page: #ffffff;
  --lp-blue: #0058cc;
}
/* The design's azure (#0058cc), amber (#8a4b00) and green sit just under 6.5:1 as small text on
   paper, so the accent and status tones are one step deeper; the hue is the design's. */

/* Footage and photographs stay dark in either appearance, so what is drawn over them (camera
   overlays, detection boxes, photo labels) keeps the dark palette. */
:root[data-theme='light'] :is(.pm-feed, .pm-photo, .pm-ev, .lp-camera, .ind-photo) {
  --color-paper: #05070b;
  --color-surface: #0c0f17;
  --color-surface-raised: #131723;
  --color-ink: #f4f4f5;
  --color-body: #b9bcc4;
  --color-muted: #a7abb4;
  --color-rule: #1a1e29;
  --color-rule-strong: #2a2f3c;
  --color-accent: #4aa3ff;
  --color-positive: #99cfb1;
  --color-warning: #dfbd87;
  --color-error: #f1af98;
}

/* ---- glass product views: white glass with a warm shadow ---- */
:root[data-theme='light'] .lp-glass,
:root[data-theme='light'] body .pm-window {
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 40px 80px rgba(40, 36, 20, 0.12);
}

/* ---- homepage stage: the dark studio's lighting is not drawn on paper ---- */
:root[data-theme='light'] :is(.lp-backdrop-base, .lp-backdrop-glow, .lp-rim, .lp-scene-light),
:root[data-theme='light'] :is(.lp-beam, .lp-fade, .lp-view-glow, .cta-glow) {
  display: none;
}
/* The floor shading past the design's 900px belongs to the dark floor, which light has not. */
:root[data-theme='light'][data-lp-mode='pinned'] .lp-story .lp-sticky::after {
  display: none;
}
:root[data-theme='light'] .lp-app-hero {
  --color-muted: #363632;
  --lp-faint: #575652;
}
:root[data-theme='light'] .lp-proof-item {
  color: var(--lp-sub);
}
:root[data-theme='light'] .lp-proof-rule {
  background: rgba(0, 0, 0, 0.12);
}
/* ---- navigation menus ---- */
:where(:root[data-theme='light']) .mobile-nav-toggle {
  color: var(--color-ink);
}
/* The phone menu's own demo action takes the shared action colours. */
:where(:root[data-theme='light']) .mobile-nav-demo {
  background: var(--action-fill);
  color: var(--action-ink);
}
:root[data-theme='light'] .mega-panel {
  border-color: var(--color-rule-strong);
  background: var(--color-surface);
  color: var(--color-ink);
  box-shadow: 0 32px 90px rgba(40, 36, 20, 0.16);
}
:root[data-theme='light'] .mega-icon {
  border-color: var(--color-rule-strong);
  background: var(--color-paper);
  color: var(--color-ink);
}
/* Each menu's overview banner: the dark azure tint becomes the light azure. */
:where(:root[data-theme='light']) body .mp-feature {
  border-color: rgba(0, 88, 204, 0.3);
  background: linear-gradient(110deg, rgba(0, 88, 204, 0.08), rgba(0, 88, 204, 0.02) 70%);
}

/* ---- product views ---- */
:root[data-theme='light'] .ind-window {
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 40px 80px rgba(40, 36, 20, 0.12);
}
:root[data-theme='light'] .ind-issues li {
  background: rgba(0, 0, 0, 0.025);
}
:root[data-theme='light'] .ind-issues b.mono {
  color: var(--color-paper);
}
/* Documents keep their fixed paper and ink (Packet PAPER); on a white window a page casts the warm
   light shadow instead of the dark window's black one. A scan keeps its own. */
:root[data-theme='light'] :is(.ind-paper:not(.is-scan), .ind-sheet-paper) {
  box-shadow:
    0 1px 2px rgba(40, 36, 20, 0.24),
    0 10px 26px rgba(40, 36, 20, 0.12);
}
:root[data-theme='light'] .ind-checks.is-row li.is-flag {
  border-color: rgba(122, 66, 0, 0.35);
  background: rgba(122, 66, 0, 0.04);
}
/* The site plan is a drawing on the window's paper, not footage. */
:root[data-theme='light'] .pm-site {
  background: var(--color-surface);
}
:root[data-theme='light'] .pm-site-plan > .pm-site-ramp {
  fill: rgba(26, 92, 59, 0.1);
}
:root[data-theme='light'] .pm-site-plan > .pm-site-drive {
  fill: rgba(0, 0, 0, 0.03);
}
:root[data-theme='light'] .pm-site-plan > .pm-site-lane {
  fill: rgba(0, 76, 178, 0.08);
}
:root[data-theme='light'] .pm-site-plan > .pm-site-park {
  stroke: rgba(122, 66, 0, 0.55);
}
:root[data-theme='light'] .pm-site-miss {
  background: rgba(122, 66, 0, 0.06);
}
:root[data-theme='light'] .pm-page mark {
  background: rgb(223 189 135 / 0.12);
}
:root[data-theme='light'] .pm-pill-ask {
  background: rgba(0, 76, 178, 0.08);
}
/* Decorative drawings made in the dark palette are shown as their negative: dark lines on a
   light ground, with the hues kept. */
:root[data-theme='light'] .inner-art > svg,
:root[data-theme='light'] body .mp-feature-art .mega-scene {
  filter: invert(1) hue-rotate(180deg);
}

/* ---- homepage ---- */
:root[data-theme='light'] .lp-compare-table .is-matrix {
  background: rgba(0, 88, 204, 0.05);
  border-left-color: rgba(0, 76, 178, 0.4);
  border-right-color: rgba(0, 76, 178, 0.4);
}
:root[data-theme='light'] .lp-compare-table thead th.is-matrix {
  background: rgba(0, 88, 204, 0.09);
}
:root[data-theme='light'] .lp-compare-table tbody tr:last-child .is-matrix {
  border-bottom-color: rgba(0, 76, 178, 0.4);
}

/* ---- retained page families: same selectors, no added weight, so the dark cascade between them
   still decides which one applies ---- */
:where(:root[data-theme='light']) .inner-atmosphere {
  display: none;
}
:where(:root[data-theme='light']) :is(.art-top, .art-bottom) {
  border-color: var(--color-rule);
  color: var(--lp-faint);
}
:where(:root[data-theme='light']) .art-corner {
  border-color: var(--color-rule-strong);
}
:where(:root[data-theme='light']) .art-grid {
  background-image: radial-gradient(rgba(0, 0, 0, 0.14) 0.65px, transparent 0.8px);
}
:where(:root[data-theme='light']) .art-signal {
  background: var(--color-accent);
  box-shadow: none;
}

/* story.css */
:where(:root[data-theme='light']) .fde-path h3 {
  color: var(--color-ink);
}
:where(:root[data-theme='light']) .fde-step-number {
  color: var(--color-accent);
}

:where(:root[data-theme='light']) :is(.sector-resource-links a, .policy-content a) {
  color: var(--color-accent);
}
:where(:root[data-theme='light']) :is(.policy-meta dt, .policy-index a) {
  color: var(--color-muted);
}
:where(:root[data-theme='light'])
  :is(.policy-meta dd, .policy-entity > strong, .policy-content h2, .trust-rows dt) {
  color: var(--color-ink);
}
:where(:root[data-theme='light']) .policy-content dd {
  color: var(--color-body);
}
:where(:root[data-theme='light']) .policy-content code {
  color: var(--color-ink);
}

/* solutions.css */
:where(:root[data-theme='light']) body .citation {
  color: var(--color-accent);
}
:where(:root[data-theme='light']) .sample-label {
  border-color: rgba(122, 66, 0, 0.3);
  background: rgba(122, 66, 0, 0.05);
  color: var(--color-warning);
}
:where(:root[data-theme='light']) .missing-value {
  color: var(--color-warning);
}
:where(:root[data-theme='light'])
  :is(.science-chart figcaption, .science-table td, .chart-legend, .sample-reply strong) {
  color: var(--color-ink);
}
:where(:root[data-theme='light'])
  :is(.chart-axis-title, .chart-unit, .science-table caption, .science-table th) {
  color: var(--color-muted);
}
:where(:root[data-theme='light']) :is(.chart-y, .chart-x) {
  color: var(--lp-faint);
}
:where(:root[data-theme='light']) :is(.case-result, .case-outcomes > div) {
  border-top-color: var(--color-rule);
}

:where(:root[data-theme='light']) .solution-deliverables > span {
  color: var(--color-positive);
}
:where(:root[data-theme='light']) .solution-deliverables li {
  color: var(--color-body);
}
:where(:root[data-theme='light']) .scenario-notice {
  background: var(--color-surface);
}
:where(:root[data-theme='light']) body.page-inner main .case-section-title {
  color: var(--color-ink);
}
:where(:root[data-theme='light']) .case-inputs {
  color: var(--color-body);
}
:where(:root[data-theme='light']) .chat-avatar {
  border-color: rgba(0, 76, 178, 0.25);
  background: var(--color-accent-tint);
  color: var(--color-accent);
}
:where(:root[data-theme='light'])
  :is(.walkthrough-heading > div > span, .scroll-demo-source > span, .result-status) {
  color: var(--lp-faint);
}
:where(:root[data-theme='light']) .chat-request > span {
  color: var(--color-accent);
}
:where(:root[data-theme='light']) body.page-inner main .chat-request p {
  color: var(--color-ink);
}
:where(:root[data-theme='light']) .scroll-demo-source i {
  border-color: var(--color-rule);
  background: var(--color-paper);
  color: var(--color-body);
}
:where(:root[data-theme='light']) :is(.case-source-links a, .research-sources a) {
  color: var(--color-accent);
}

:where(:root[data-theme='light']) body.page-inner main .research-article .research-intro {
  border-color: var(--color-rule-strong);
  color: var(--color-body);
}
:where(:root[data-theme='light'])
  :is(
    .research-process-map figcaption,
    .research-process-map strong,
    .research-role-grid h3,
    .faq-item h3,
    .sizing-card h3
  ) {
  color: var(--color-ink);
}
:where(:root[data-theme='light'])
  :is(
    .research-role-grid article > span,
    .research-key-points article > span,
    .research-process-map li > span,
    .research-process-map small
  ) {
  color: var(--lp-faint);
}
:where(:root[data-theme='light'])
  :is(
    body.page-inner main .research-key-points p,
    body.page-inner main .research-role-grid p,
    body.page-inner main .research-principles p,
    body.page-inner main .research-scope-note p,
    body.page-inner main .faq-item p,
    body.page-inner main .sizing-card p
  ) {
  color: var(--color-body);
}
:where(:root[data-theme='light']) .research-scope-note > strong {
  color: var(--color-warning);
}
:where(:root[data-theme='light']) body.page-inner main .matrix-design-copy .lead {
  color: var(--lp-sub);
}

/* noir.css */
:where(:root[data-theme='light']) :is(.article-sidebar > .mono) {
  color: var(--lp-faint);
}

:where(:root[data-theme='light']) .mission .lead-small {
  color: var(--color-body);
}

:where(:root[data-theme='light']) .cta-section {
  border-color: var(--color-rule);
  box-shadow: none;
}

/* inner-effects.css, workstation-scan.css and request-demo.css */
:where(:root[data-theme='light']) .article-sidebar > a.is-reading {
  border-color: var(--color-accent);
  color: var(--color-ink);
}
:where(:root[data-theme='light'])
  :is(body.page-inner)
  main
  :is(.ws-toolbar p, .ws-status-row p, .ws-static-note) {
  color: var(--color-muted);
}
/* The reveal value is pale cyan on the dark stage; on paper it takes the accent ink. */
:where(:root[data-theme='light']) .ws-scan-readout strong {
  color: var(--color-accent);
}
:where(:root[data-theme='light']) .rd-card {
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.06),
    0 26px 70px rgba(40, 36, 20, 0.14);
}

/* Borders drawn as pale tints on the dark ground become the light rules, in their own hue. */
:where(:root[data-theme='light']) :is(.scenario-notice, .research-principles > section) {
  border-color: var(--color-rule-strong);
}

:where(:root[data-theme='light']) .case-role {
  color: var(--color-muted);
}
:where(:root[data-theme='light']) :is(.policy-entity, .fde-path li) {
  border-color: var(--color-rule-strong);
}

/* Status outlines in the product views keep their hue at a strength that shows on white. */
:root[data-theme='light'] :is(.pm-check-miss, .pm-kpi-gap) {
  border-color: rgba(122, 66, 0, 0.35);
}
:root[data-theme='light'] .pm-check-miss .pm-check-thumb {
  border-color: rgba(122, 66, 0, 0.6);
}
:root[data-theme='light'] .pm-dot {
  border-color: rgba(26, 92, 59, 0.5);
  background: rgba(26, 92, 59, 0.08);
}
:root[data-theme='light'] .pm-alert {
  border-color: rgba(154, 36, 25, 0.35);
  background: rgba(154, 36, 25, 0.04);
}
:where(:root[data-theme='light']) .workstation-scan button:hover {
  border-color: var(--color-ink);
  background: var(--color-surface-raised);
}
:where(:root[data-theme='light'])
  :is(.workstation-scan button:focus-visible, .ws-curtain:focus-visible .ws-scan-handle) {
  outline-color: var(--color-accent);
}

/* ---- Privacy and Resources diagrams (kit-art.mjs, kit.css): drawn on white glass like the
   product views. Same selectors with no added weight, so a lit, open or muted part still wins
   over its base exactly as in dark. ---- */
:where(:root[data-theme='light']) .kit-scene-ground {
  background: linear-gradient(180deg, #ffffff 0%, #f3f2ee 100%);
}
:where(:root[data-theme='light']) .kd-zone {
  background: rgba(0, 0, 0, 0.015);
}
:where(:root[data-theme='light']) :is(.kd-outside, .kd-lane, .kd-slot) {
  border-color: rgba(0, 0, 0, 0.22);
}
:where(:root[data-theme='light'])
  :is(
    .kd-node,
    .kd-steps li,
    .kd-anatomy li,
    .kd-lane-steps li,
    .kd-shelf,
    .kd-note,
    .kit-scene-map .research-process-map li
  ) {
  background: rgba(255, 255, 255, 0.92);
}
:where(:root[data-theme='light'])
  :is(
    .kd-inside,
    .kd-node.is-lit,
    .kd-cell.is-open,
    .kd-shelf.is-lit,
    .kd-anatomy li.is-lit,
    .kd-note li.is-lit,
    .kd-slot.is-lit,
    .kit-scene-map .research-process-map li:last-child
  ) {
  border-color: rgba(0, 76, 178, 0.4);
  background: rgba(0, 88, 204, 0.06);
}
:where(:root[data-theme='light']) .kd-node.is-muted {
  text-decoration-color: rgba(154, 36, 25, 0.6);
}
:where(:root[data-theme='light']) .kd-wall::before {
  border-color: rgba(0, 76, 178, 0.6);
}
/* The mark and the note sit on the wall line and mask it with the ground behind them. */
:where(:root[data-theme='light']) :is(.kd-wall-mark, .kd-wall-note) {
  background: var(--color-surface);
}
:where(:root[data-theme='light']) .kd-wall-mark {
  border-color: rgba(0, 76, 178, 0.5);
}

/* The Security diagrams (October 4, 2026): the network boundary and the system's layers. */
:where(:root[data-theme='light']) :is(.kd-net-matrix, .kd-net-parts li, .kd-stack-layers li) {
  background: rgba(255, 255, 255, 0.92);
}
:where(:root[data-theme='light']) :is(.kd-net-inside, .kd-stack-layers li.is-lit) {
  border-color: rgba(0, 76, 178, 0.4);
  background: rgba(0, 88, 204, 0.06);
}
:where(:root[data-theme='light']) :is(.kd-net-outside, .kd-stack-side) {
  border-color: rgba(0, 0, 0, 0.22);
}
:where(:root[data-theme='light']) .kd-net-edge span {
  background: var(--color-surface);
}

/* ---- Product pages (product.css): the launcher field and rule steps are white fields, the
   in-section call to action and the outlines drawn in the dark azure take the light azure, and
   the hero Tower casts the warm light shadow. Same selectors with no added weight, so hover,
   current and the AI step still win over their base exactly as in dark. ---- */
:where(:root[data-theme='light']) :is(.pd-launcher-search, .pd-stepper i) {
  background: var(--color-surface);
}
:where(:root[data-theme='light']) .pd-cta {
  background: rgba(0, 88, 204, 0.08);
  color: var(--color-accent);
}
:where(:root[data-theme='light']) .pd-cta:hover {
  background: rgba(0, 88, 204, 0.14);
  color: var(--color-ink);
}
:where(:root[data-theme='light']) .pd-hero-stack .pd-hero-machine {
  filter: drop-shadow(0 30px 50px rgba(40, 36, 20, 0.18));
}
:where(:root[data-theme='light'])
  :is(.pd-layer-3, .pd-app.is-custom, .pd-cat.is-custom, .pd-tile-icon) {
  border-color: rgba(0, 88, 204, 0.3);
}
:where(:root[data-theme='light']) .pd-config.is-featured {
  border-color: rgba(0, 88, 204, 0.45);
  border-top-color: var(--color-accent);
  background: linear-gradient(180deg, rgba(0, 88, 204, 0.06), var(--color-surface) 60%);
}
:where(:root[data-theme='light']) .pd-config-tag {
  border-color: rgba(0, 88, 204, 0.45);
}
:where(:root[data-theme='light']) .pd-cta-strip {
  border-color: rgba(0, 88, 204, 0.3);
  background: linear-gradient(110deg, rgba(0, 88, 204, 0.07), rgba(0, 88, 204, 0.02) 70%);
}