/* Theme token layer. Mode = html[data-mode=light|dark]; theme = html[data-theme=lime|hairline|layered|signal|custom]. See THEMES.md. */
@font-face{font-family:"Geist Pixel";src:url(/fonts/geist-pixel-square-sub.woff2) format("woff2");font-display:swap}
:root{--tint:0%;--grain:0;--pixel:"Geist Pixel",ui-monospace,monospace}
[data-mode="dark"]{--pill:#232328}
[data-mode="dark"] .btn-dark,[data-mode="dark"] .btn-li{background:var(--pill)}

/* --- presets --- */
[data-theme="hairline"][data-mode="dark"]{--page:#0c0c0d;--surface:#151516;--surface-2:#1c1c1e;--frame:#202023;--frame-2:#2a2a2e;--pill:#1c1c1e;--tint:10%}
[data-theme="hairline"][data-mode="light"]{--tint:22%;--page:#ffffff;--surface:#ffffff;--surface-2:#f6f6f8;--shadow:0 0 0 1px rgba(20,20,45,.10)}
[data-theme="layered"][data-mode="dark"]{--page:#0a0a0c;--surface:#141315;--surface-2:#1b1a1d;--frame:#1f1e22;--frame-2:#2b2a30;--pill:#1b1a1d;--tint:16%;--grain:.035}
[data-theme="layered"][data-mode="light"]{--tint:32%;--grain:.03;--page:#eceef3;--surface:#ffffff;--surface-2:#f4f5f8}
[data-theme="signal"][data-mode="dark"]{--page:#09090a;--surface:#131214;--surface-2:#1a191c;--frame:#1c1b1f;--frame-2:#28272c;--pill:#1a191c;--tint:22%;--grain:.05}
[data-theme="signal"][data-mode="light"]{--tint:42%;--grain:.04}

/* --- build your own: curated accents (on-accent pre-checked, >=4.5:1) --- */
[data-theme="custom"][data-accent="lime"]{--lime:#d9ff5c;--on-lime:#14142d}
[data-theme="custom"][data-accent="mint"]{--lime:#6fe3c4;--on-lime:#061a15}
[data-theme="custom"][data-accent="amber"]{--lime:#ffc94a;--on-lime:#1a1203}
[data-theme="custom"][data-accent="coral"]{--lime:#ff8a7a;--on-lime:#1f0805}
[data-theme="custom"][data-accent="periwinkle"]{--lime:#a3b3ff;--on-lime:#0b1030}
[data-theme="custom"][data-accent="paper"]{--lime:#f2efe8;--on-lime:#161514}
[data-theme="custom"][data-base="warm"][data-mode="dark"]{--page:#100e0c;--surface:#1a1815;--surface-2:#23201c;--frame:#25221e;--frame-2:#302c27;--pill:#23201c}
[data-theme="custom"][data-base="cool"][data-mode="dark"]{--page:#0b0c10;--surface:#14161b;--surface-2:#1b1e25;--frame:#1e2129;--frame-2:#2a2e38;--pill:#1b1e25}
[data-theme="custom"][data-base="warm"][data-mode="light"]{--page:#faf8f4;--page-tint:#f1ede6;--wash:#f1ede6;--surface-2:#f4f1ea}
[data-theme="custom"][data-base="cool"][data-mode="light"]{--page:#f8f9fc;--page-tint:#eceff6;--surface-2:#f1f3f9}
[data-theme="custom"][data-wash="1"]{--tint:12%}[data-theme="custom"][data-wash="1"][data-mode="light"]{--tint:26%}
[data-theme="custom"][data-wash="2"]{--tint:20%;--grain:.04}[data-theme="custom"][data-wash="2"][data-mode="light"]{--tint:40%}

/* --- treatments driven by tokens (no-ops on the default lime theme) --- */
html:not([data-theme="lime"]) .hero{position:relative;isolation:isolate}
html:not([data-theme="lime"]) .hero::before{content:"";position:absolute;inset:-140px 0 0;z-index:-1;pointer-events:none;background:radial-gradient(760px 420px at 16% 34%,color-mix(in srgb,var(--lime) var(--tint),transparent),transparent 72%)}
[data-theme="layered"] body::after,[data-theme="signal"] body::after,[data-theme="custom"][data-wash="2"] body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:300;opacity:var(--grain);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html:not([data-theme="lime"]) .feature-card .pill,html:not([data-theme="lime"]) .pg-head .pill,html:not([data-theme="lime"]) .foot-copy{font-family:var(--pixel);letter-spacing:.02em}
[data-theme="layered"] .feature-foot span,[data-theme="signal"] .feature-foot span,[data-theme="signal"] .foot-cols h3,[data-theme="signal"] .mini-title{font-family:var(--pixel);letter-spacing:.02em}
[data-mode="dark"]:not([data-theme="lime"]) .feature-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 0 1px rgba(255,255,255,.06)}
[data-theme="layered"] .feature-lead .feature-frame,[data-theme="signal"] .feature-frame{position:relative;isolation:isolate}
[data-theme="layered"] .feature-lead .feature-frame::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;background:radial-gradient(420px 260px at 0 0,color-mix(in srgb,var(--lime) 16%,transparent),transparent 70%)}
[data-theme="signal"] .feature-frame::before{content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:-1;padding:1px;background:linear-gradient(135deg,color-mix(in srgb,var(--lime) 55%,transparent),transparent 35%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}

/* --- switcher UI --- */
.ts-btn{display:inline-grid;place-items:center;width:34px;height:34px;border:0;border-radius:var(--r-sm);background:var(--surface);color:var(--ink);cursor:pointer;box-shadow:inset 0 0 0 1px var(--line)}
.ts-btn i{width:14px;height:14px;border-radius:4px;background:var(--lime);box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
.ts-pop{position:fixed;inset:64px 16px auto auto;margin:0;width:300px;max-height:calc(100dvh - 88px);overflow:auto;padding:16px;border:0;border-radius:var(--r);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-lg),0 0 0 1px var(--line);font-size:14px}
.ts-pop::backdrop{background:transparent}
.ts-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ts-pop .ts-t{font:12px var(--pixel);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:0}
.ts-x{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:var(--r-sm);background:var(--surface-2);color:var(--ink);font:400 20px/1 var(--font);cursor:pointer}
.ts-x:focus-visible,.ts-btn:focus-visible{outline:2px solid var(--focus,var(--ink));outline-offset:2px}
.ts-pop fieldset{border:0;margin:0 0 14px;padding:0}.ts-pop fieldset:last-child{margin-bottom:0}.ts-pop legend{font:12px var(--pixel);color:var(--muted);margin-bottom:6px;letter-spacing:.04em}
.ts-row{display:flex;flex-wrap:wrap;gap:6px}
.ts-row label{position:relative;cursor:pointer}.ts-row input{position:absolute;opacity:0}
.ts-row span{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);font-size:13px}
.ts-row input:checked+span{box-shadow:inset 0 0 0 2px var(--ink)}.ts-row input:focus-visible+span{outline:2px solid var(--focus,var(--ink));outline-offset:2px}
.ts-row b{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.3)}
.ts-custom[hidden]{display:none}
@media (prefers-reduced-motion:reduce){[data-theme] body::after{display:none}}
/* mobile: decluttered header + bottom sheet */
@media (max-width:640px){
  .mark-name{white-space:nowrap}
  .ts-pop{inset:auto 0 0 0;width:100%;max-width:none;max-height:85dvh;border-radius:20px 20px 0 0;padding:10px 20px max(20px,env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(0,0,0,.35),0 0 0 1px var(--line);transition:transform .35s cubic-bezier(.16,1,.3,1),display .35s allow-discrete,overlay .35s allow-discrete;transform:translateY(0)}
  .ts-pop::before{content:"";display:block;width:36px;height:4px;border-radius:2px;background:var(--line-2);margin:0 auto 10px}
  .ts-pop::backdrop{background:rgba(0,0,0,.45);transition:background .35s,display .35s allow-discrete,overlay .35s allow-discrete}
  @starting-style{.ts-pop[open]{transform:translateY(100%)}.ts-pop[open]::backdrop{background:transparent}}
  .ts-x{width:44px;height:44px}
  .ts-row span{padding:10px 14px;font-size:14px;min-height:44px}
}
@media (max-width:640px) and (prefers-reduced-motion:reduce){.ts-pop,.ts-pop::backdrop{transition:none}}
/* Rum staging (QA design-cleanup #3): Hairline shows a visible frame in light mode */
[data-theme="hairline"][data-mode="light"]{--page:#fafafb;--line:rgba(20,20,45,.14);--line-2:rgba(20,20,45,.24)}

/* /design/ Preview style presets (moved from design.css: raw palette values live in themes.css) */
.ds-preview[data-accent="lime"]{--lime:#d4ff3f;--accent:#d4ff3f;--on-lime:#14142d;--on-accent:#14142d}
.ds-preview[data-accent="ember"]{--lime:#ff5a3c;--accent:#ff5a3c;--on-lime:#ffffff;--on-accent:#ffffff}
.ds-preview[data-accent="ice"]{--lime:#9fd8ff;--accent:#9fd8ff;--on-lime:#0b1622;--on-accent:#0b1622}
.ds-preview[data-accent="mono"]{--lime:#ededf0;--accent:#ededf0;--on-lime:#141416;--on-accent:#141416}
.ds-preview[data-surface="ink"]{--page:#0f0f11;--bg-page:#0f0f11;--surface:#17171a;--bg-raised:#17171a;--line:rgba(235,237,250,.08)}
.ds-preview[data-surface="graphite"]{--page:#1c1c1f;--bg-page:#1c1c1f;--surface:#26262a;--bg-raised:#26262a;--line:rgba(235,237,250,.10)}
.ds-preview[data-surface="paper"]{--page:#f4f4f8;--bg-page:#f4f4f8;--surface:#ffffff;--bg-raised:#ffffff;--line:rgba(36,36,38,.08)}
.ds-preview[data-surface="ink"] .ds-demo,.ds-preview[data-surface="graphite"] .ds-demo{--ink:#ebedfa;--fg:#ebedfa;--ink-2:#b7b9c9;--fg-2:#b7b9c9;--muted:#8a8aa3;--fg-muted:#8a8aa3;--surface-2:#222226;--bg-sunken:#222226;--line-2:rgba(235,237,250,.14);--focus-ring:#9391b8;color:var(--fg)}
.ds-preview[data-surface="paper"] .ds-demo{--ink:#242426;--fg:#242426;--ink-2:#4d4f57;--fg-2:#4d4f57;--muted:#686882;--fg-muted:#686882;--surface-2:#eaeaf0;--bg-sunken:#eaeaf0;--line-2:rgba(36,36,38,.14);--focus-ring:#77759e;color:var(--fg)}