:root{color-scheme:light}
.header-tools{display:flex;align-items:center;gap:12px;flex-shrink:0}
.theme-toggle{width:42px;height:42px;flex:0 0 42px;display:inline-flex;align-items:center;justify-content:center;padding:0;background:transparent;border:1px solid var(--line);border-radius:50%;color:var(--ink)}
.theme-toggle[hidden]{display:none}
.theme-toggle:hover{background:var(--white);border-color:var(--teal)}
.theme-toggle svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .theme-sun{display:none}
html[data-theme=dark]{color-scheme:dark;--paper:#101e1d;--ink:#edf2e9;--muted:#b1c2bb;--teal:#6ed8ca;--aqua:#48c7bb;--line:#354c46;--white:#192c29}
html[data-theme=dark] .theme-toggle .theme-moon{display:none}
html[data-theme=dark] .theme-toggle .theme-sun{display:block}
html[data-theme=dark] .primary,html[data-theme=dark] .languages a[aria-current]{color:#102c28}
html[data-theme=dark] .gold{color:#e3ac2a}
html[data-theme=dark] .process{background:#091513;color:#edf2e9}
html[data-theme=dark] .ticker{color:#102c28}
html[data-theme=dark] .filters button[aria-pressed=true]{color:#102c28}
html[data-theme=dark] .experience{background:var(--paper);color:var(--ink)}
html[data-theme=dark] .experience-stage{background:radial-gradient(ellipse at 72% 45%,#265e514d,transparent 60%)}
html[data-theme=dark] .experience-eyebrow,html[data-theme=dark] .experience-step h1 em{color:var(--teal)}
html[data-theme=dark] .experience-top,html[data-theme=dark] .experience-scroll,html[data-theme=dark] .experience-tags span,html[data-theme=dark] .experience-bottom button,html[data-theme=dark] .experience-orbit-labels,html[data-theme=dark] .experience-note{color:var(--muted)}
html[data-theme=dark] .experience-progress i{background:#405b52}
html[data-theme=dark] .experience-progress i.is-active{background:var(--gold)}
html[data-theme=dark] .experience-art::before{background:radial-gradient(ellipse,#0008,transparent 70%)}
/* Product illustrations keep their own palette, without recoloring demo screenshots. */
html[data-theme=dark] .pos-art,html[data-theme=dark] .clinic-art,html[data-theme=dark] .supply-art,html[data-theme=dark] .agent-art{color:#172e2b}
html[data-theme=dark] .phone{color:#f5f1e8}
html[data-theme=dark] .receipt{background:#fffdf8;color:#172e2b}
html[data-theme=dark] .agent-art,html[data-theme=dark] .connection{--teal:#0d6664}
html[data-theme=dark] .number{background:#eef4e9e6;color:#172e2b}
html[data-theme=dark] .uploaded-art{background:#243b34}
html[data-theme=dark] .notice{background:#382f1b;color:#f3e6c7}
html[data-theme=dark] .notice.success{background:#1e3b2f;color:#d7f1df}
html[data-theme=dark] .skip{background:var(--white);color:var(--ink)}
@media(max-width:760px){.header-tools{gap:8px}.theme-toggle{width:36px;height:36px;flex-basis:36px}.header .wordmark{font-size:20px}.header-tools .languages{font-size:10px}.header-tools .languages a{padding:5px 7px}}
@media(max-width:380px){.header-tools{margin-inline-start:auto}}