/* Palette from web/src/styles/theme.css and DESIGN.md. Keep brand roles shared
   across themes: Prussian actions in light mode, cyan actions in dark mode. */
:root {
  color-scheme: light;
  --brand-prussian: #003153;
  --brand-teal: #006688;
  --brand-cyan: #00ffff;
  --ink: #0d1b2e;
  --muted: #5a6c7d;
  --secondary-ink: #344b5e;
  --paper: #f3f6f9;
  --surface: #ffffff;
  --surface-soft: #f5f8fb;
  --line: #d9e4ed;
  --strong-line: #c0d2de;
  --teal: #0e7490;
  --navy: var(--brand-prussian);
  --action-ink: #ffffff;
  --action-hover: var(--brand-teal);
  --heading-ink: var(--brand-prussian);
  --selected: color-mix(in srgb, var(--teal) 12%, var(--surface));
  --chart-line: #1597a5;
  --chart-bar: #6b8fc5;
}
:root[data-site-theme=dark] {
  color-scheme: dark;
  --ink: #ededee;
  --muted: #9b9ba3;
  --secondary-ink: #c2c2c7;
  --paper: #0b0b0d;
  --surface: #1a1a1c;
  --surface-soft: #151517;
  --line: #2c2c31;
  --strong-line: #44444c;
  --teal: #00dddd;
  --navy: #00dddd;
  --action-ink: #08181c;
  --action-hover: #2af0f0;
  --heading-ink: var(--ink);
  --chart-line: #31c5cf;
  --chart-bar: #7fa2d6;
}
body{background:var(--paper);color:var(--ink)}
.header{background:color-mix(in srgb,var(--paper) 96%,transparent)}
.brand,.hero h1,.section h2,.section h2 span{color:var(--heading-ink)}
.brand-dot{color:var(--teal)}
.button{background:var(--navy);border-color:var(--navy);color:var(--action-ink)}
.button:hover{background:var(--action-hover);border-color:var(--action-hover);color:var(--action-ink)}
.button-outline{background:transparent;border-color:var(--secondary-ink);color:var(--ink)}
.button-outline:hover{background:var(--selected);border-color:var(--teal);color:var(--ink)}
.site-theme-toggle{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;padding:11px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink)}
.site-theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.site-theme-toggle .theme-sun{display:none}
.site-theme-toggle:active{transform:scale(.97)}
.header>.site-theme-toggle{order:3}
.not-found>.site-theme-toggle{float:right}
@media(hover:hover){.site-theme-toggle:hover{background:var(--line)}}
[data-site-theme=dark] .theme-sun{display:block}
[data-site-theme=dark] .theme-moon{display:none}
.announcement,.hero-summary>p,.section-heading>p,.stage-caption,.stage-caption>span:last-child,.connection-strip>p{color:var(--muted)}
.announcement>span{background:var(--selected);color:var(--teal)}
.announcement:hover{color:var(--teal)}
.announcement i{background:var(--teal)}
.product-tabs,#product-panel{border:0;background:var(--surface-soft)}
.product-tabs button{background:var(--surface);border:0;color:var(--secondary-ink)}
.product-tabs button:hover{background:var(--selected)}
.product-tabs button[aria-selected=true]{color:var(--teal);background:var(--selected)}
.product-tabs button[aria-selected=true]:after{background:var(--teal)}
.connection-strip strong,.connection-strip .channel-list>span{color:var(--secondary-ink)}
.channel-list b,.eyebrow,.coverage-label{color:var(--teal)}
/* Major sections keep a single divider; content within them stays open. */
.platform,.product-coverage,.workflow,.governance{border:0;border-top:1px solid var(--line)}
.steps article,.feature-option,.feature-option:last-child,.steps article:last-child{border:0}
.feature-option:not(.selected){color:var(--muted)}
.feature-option.selected{color:var(--teal)}
.feature-option:hover{background:var(--surface-soft)}
.feature-arrow{color:var(--teal)}
.feature-visual{background:var(--surface);border:0}
.visual-topline,.visual-bottom,.spotlight-value>span,.spotlight-trend>span,.target-line span{color:var(--muted)}
.visual-bottom{border:0}
.bar-chart>i{background:var(--chart-bar)}
.bar-chart>i:nth-last-child(-n+3){background:var(--chart-line)}
.target-line{border-color:var(--strong-line)}
.feature-flow>div,.alert-demo{background:var(--surface-soft);border-color:var(--strong-line)}
.feature-flow>div{border-left-color:var(--teal)}
.step-number{background:var(--selected);color:var(--teal)}
.governance-art{background:var(--surface-soft)}
.orbit{border-color:var(--strong-line)}
.core,.orbit-label{background:var(--surface);border-color:var(--line)}
.orbit-point{background:var(--teal);border-color:var(--surface-soft);box-shadow:0 0 0 4px var(--selected)}
.coverage-grid article{border:0;padding-top:0}
.coverage-grid button{border:0;text-decoration:none;min-height:44px}
.coverage-grid button span{display:inline-block;transition:transform .2s}
.coverage-grid button:hover span{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){.coverage-grid button span{transition:none}.coverage-grid button:hover span{transform:none}}
.closing{background:var(--brand-prussian);color:#ffffff}
.closing .eyebrow{color:var(--brand-cyan)}
.closing p,.closing .access-note{color:#d9e4ed}
.closing .button{background:var(--brand-cyan);border-color:var(--brand-cyan);color:#0d1b2e}
.closing .button:hover{background:#00dddd;border-color:#00dddd}
.closing-actions .text-link{color:#ffffff}
.closing-art span{background:#006688}
.closing-art span:nth-child(2){background:#0e7490}
.closing-art span:nth-child(3){background:#1597a5}
.closing-art span:nth-child(4){background:#00dddd}
[data-site-theme=dark] .closing{background:#0d1b2e}
.skip{background:var(--surface);color:var(--ink)}
@media(max-width:720px){
 .header .brand{margin-right:auto}
 .header>.site-theme-toggle{order:1}
 .header>.menu-toggle{order:2;margin-left:0}
 .header nav{background:var(--surface)}
 .menu-toggle:hover{background:var(--selected)}
 .header nav .mobile-account-links>.button:hover{color:var(--action-ink)}
}

/* Design-system invariant: links and text actions never use underlines.
   Important is intentional: this also overrides legacy Tailwind hover utilities
   and rich-text link styles. Tab indicators and keyboard focus are unaffected. */
:is(a, button, [role="link"]),
:is(a, button, [role="link"]) * {
  text-decoration-line: none !important;
}