/* The original charcoal palette stays in site.css. This is a separate option. */
:root{--surface:#1b1d1d;--surface-raised:#252828;--card-border:#ffffff1b;--card-shadow:0 24px 65px #0004;--gather-halo:#f7a87909}
:root[data-palette=light]{color-scheme:light;--ink:#20242c;--muted:#68717d;--dim:#858e9a;--bg:#fff;--line:#20242c1a;--accent:#075bea;--surface:#fff;--surface-raised:#f7f8fa;--card-border:#20242c1a;--card-shadow:0 16px 45px #18243b0b,0 3px 9px #18243b04;--gather-halo:#075bea05}
html.palette-changing *,html.palette-changing *:before,html.palette-changing *:after{transition:none!important}
.header-tools{display:flex;align-items:center;gap:28px;min-width:0}
.palette-picker{display:flex;gap:3px;padding:4px;border:1px solid var(--line);border-radius:22px;background:var(--surface);flex-shrink:0}
.palette-picker button{display:flex;align-items:center;gap:6px;border:0;padding:7px 11px;border-radius:18px;background:transparent;font-size:11px;line-height:1.4;color:var(--muted);white-space:nowrap;transition:color .25s,background .25s,box-shadow .25s}
.palette-picker button:before{content:"";height:8px;width:8px;border-radius:50%;border:1px solid #a5aba9;background:#fff}
.palette-picker button[data-palette-choice=dark]:before{background:#282b2c;border-color:#525858}
.palette-picker button[aria-pressed=true]{background:var(--ink);color:var(--bg);box-shadow:0 2px 5px #0001}
.hero-safety{display:flex;align-items:flex-start;gap:12px;max-width:380px;margin:29px 0 0;padding-top:19px;border-top:1px solid var(--line);font-size:12px;line-height:1.9;color:var(--muted)}
.hero-safety svg{width:17px;height:20px;margin-top:1px;color:var(--accent)}
.hero-safety strong{display:block;color:var(--ink);font-weight:550;margin-bottom:2px}
.story-copy .ownership-statement strong{font-size:12px;font-weight:600;margin-bottom:5px}
:root[data-palette=light] ::selection{background:#dbeaff;color:#063578}
:root[data-palette=light] .skip{color:#fff}
:root[data-palette=light] .site-header nav>a:not(.nav-download){color:#68717d}
:root[data-palette=light] .site-header nav>a:hover{color:#075bea}
:root[data-palette=light] .nav-download{background:#fff;border-color:#20242c21;box-shadow:0 2px 4px #18243b06}
:root[data-palette=light] .nav-download:hover{background:#f6f8fc}
:root[data-palette=light] .tiny-orbit{box-shadow:0 0 18px #075bea29}
:root[data-palette=light] .hero h1 span{color:#858e9a}
:root[data-palette=light] .hero-description{color:#68717d}
:root[data-palette=light] .button.solid{background:#20242c;color:#fff}
:root[data-palette=light] .button.solid:hover{background:#153b75;box-shadow:0 8px 24px #075bea15}
:root[data-palette=light] .button.secondary{border-color:#20242c33}
:root[data-palette=light] .button.secondary:hover{background:#075bea06}
:root[data-palette=light] .hero-meta{color:#858e9a}
:root[data-palette=light] .hero-light{background:radial-gradient(ellipse at center,#e9eff82b,transparent 62%)}
:root[data-palette=light] .hero-light:after{border-color:#075bea09;box-shadow:0 0 0 50px #075bea02,0 0 0 90px #075bea02}
:root[data-palette=light] .product-demo{box-shadow:0 35px 75px #18243b10,0 8px 18px #18243b05,0 0 0 1px #20242c1c}
:root[data-palette=light] .hero-product figcaption,:root[data-palette=light] .story-visual figcaption,:root[data-palette=light] .demo-reference{color:#68717d}
:root[data-palette=light] .demo-reference:hover{color:#075bea}
:root[data-palette=light] .scroll-cue{color:#68717d}
:root[data-palette=light] .journey{border-top-color:#20242c0c}
:root[data-palette=light] .story-stage{background:#fff}
:root[data-palette=light] .stage-glow{background:radial-gradient(ellipse at 55% 60%,#edf1f91a,transparent 42%)}
:root[data-palette=light] .stage-orbit{border-color:#20242c09;box-shadow:0 0 0 70px #075bea02,0 0 0 140px #075bea02}
:root[data-palette=light] .stage-top{color:#858e9a}
:root[data-palette=light] .stage-wordmark i{background:#b8bec8}
:root[data-palette=light] .story-copy .eyebrow{color:#075bea}
:root[data-palette=light] .story-lead{color:#59626e}
:root[data-palette=light] .feature-points{color:#68717d}
:root[data-palette=light] .feature-points li:before{background:#075bea}
:root[data-palette=light] .story-foot,:root[data-palette=light] .ownership-statement{border-color:#20242c16;color:#68717d}
:root[data-palette=light] .story-foot svg,:root[data-palette=light] .ownership-statement svg{color:#075bea}
:root[data-palette=light] .ownership-statement strong{color:#20242c}
:root[data-palette=light] .story-link{color:#075bea}
:root[data-palette=light] .chapter-nav a{color:#858e9a}
:root[data-palette=light] .chapter-nav a[aria-current],:root[data-palette=light] .chapter-nav a:hover{color:#075bea}
:root[data-palette=light] .chapter-nav a[aria-current]:before{background:#075bea}
:root[data-palette=light] .chapter-progress{background:#075bea10}
:root[data-palette=light] .chapter-progress i{background:linear-gradient(90deg,#075bea,#9dbcf3)}
:root[data-palette=light] .ending{background:#fff}
:root[data-palette=light] .ending .eyebrow{color:#68717d}
:root[data-palette=light] .ending h2 span{color:#68717d}
:root[data-palette=light] .ending>p:not(.eyebrow){color:#68717d}
:root[data-palette=light] .ending .download-state{color:#858e9a!important}
:root[data-palette=light] .ending-light{background:radial-gradient(ellipse at 50% 110%,#e9eff826,transparent 60%)}
:root[data-palette=light] .ending-signature{color:#20242c07}
:root[data-palette=light] .site-footer{border-color:#20242c15;color:#68717d}
:root[data-palette=light] .site-footer .brand,:root[data-palette=light] .site-footer a:hover{color:#20242c}
/* Companion pages use the same palette, including their controls. */
:root[data-palette=light] .page-intro>p:not(.eyebrow){color:#68717d}
:root[data-palette=light] .download-primary{background:#fff;border-color:#20242c1c;box-shadow:var(--card-shadow)}
:root[data-palette=light] .download-primary p,:root[data-palette=light] .download-companion p,:root[data-palette=light] .download-note,:root[data-palette=light] .download-action small{color:#68717d}
:root[data-palette=light] .download-action .button[disabled]{background:#f0f2f5;color:#858e9a;opacity:1}
:root[data-palette=light] .download-badges span{border-color:#20242c1c;color:#68717d}
:root[data-palette=light] .guide-nav a{border-color:#20242c1c;color:#68717d}
:root[data-palette=light] .guide-nav a:hover{border-color:#075bea5c;color:#075bea}
:root[data-palette=light] .guide-num{color:#075bea;border-color:#075bea38}
:root[data-palette=light] .guide-section>p,:root[data-palette=light] .steps>li p,:root[data-palette=light] .web-guide>summary small,:root[data-palette=light] .guide-faq details p{color:#68717d}
:root[data-palette=light] .steps>li:before{color:#858e9a}
:root[data-palette=light] .guide-callout{border-color:#075bea;background:#075bea04;color:#68717d}
:root[data-palette=light] .guide-callout strong{color:#20242c}
:root[data-palette=light] .web-guide{border-color:#20242c22;background:#fff;box-shadow:0 16px 40px #18243b05}
:root[data-palette=light] .web-guide>summary svg{color:#68717d}
:root[data-palette=light] .guide-tabs{background:#f7f8fa;border-color:#20242c14}
:root[data-palette=light] .guide-tabs button{color:#68717d}
:root[data-palette=light] .guide-tabs button[aria-selected=true]{background:#20242c;color:#fff}
:root[data-palette=light] .guide-tabs button:hover{color:#075bea}
:root[data-palette=light] .guide-tabs button[aria-selected=true]:hover{color:#fff}
:root[data-palette=light] .settings-table th{color:#59626e}
:root[data-palette=light] .settings-table td{color:#68717d}
:root[data-palette=light] .settings-table td,:root[data-palette=light] .settings-table th,:root[data-palette=light] .settings-table tr:first-child td,:root[data-palette=light] .settings-table tr:first-child th{border-color:#20242c14}
:root[data-palette=light] .code-line{background:#fafbfc;border-color:#20242c22}
:root[data-palette=light] .code-line code,:root[data-palette=light] code{color:#59626e}
:root[data-palette=light] .copy-button{border-color:#20242c20;background:#fff;color:#59626e}
:root[data-palette=light] .guide-faq details{border-color:#20242c1a}
:root[data-palette=light] .guide-faq summary{color:#59626e}
@media(max-width:1100px){.header-tools{gap:20px}.site-header nav{gap:20px}.site-header nav a[data-chapter-link]{display:none}}
@media(max-width:640px){.site-header{height:auto;min-height:104px;align-items:flex-start;padding-top:20px}.header-tools{flex-direction:column-reverse;align-items:flex-end;gap:12px}.site-header nav{gap:17px}.site-header nav>a[href^="index.html"]{display:none}.palette-picker{padding:3px}.palette-picker button{font-size:10px;padding:5px 10px}.hero{padding-top:156px}.hero-safety{font-size:11px;margin-top:23px}.subpage .page-intro{padding-top:55px}}
@media(max-width:360px){.site-header nav{gap:13px}.header-tools{gap:10px}.palette-picker button{padding:5px 9px}}
.palette-picker button[data-palette-choice=system]:before{background:linear-gradient(90deg,#fff 50%,#282b2c 50%);}
@media(max-width:420px){.site-header{padding-left:18px;padding-right:18px;}.site-header>.brand{font-size:18px;gap:7px;}.site-header nav{gap:12px;}.site-header nav>a:not(.nav-download){display:none;}.palette-picker button{padding:5px 7px;font-size:10px;gap:4px;}}
@media(prefers-reduced-motion:reduce){.guide-tab{animation:none;}}
