:root{--demo-bg: linear-gradient(180deg, #fcf8f0 0%, #f1ebde 100%);--demo-fg: #171310;--demo-muted: rgba(23, 19, 16, .66);--demo-line: rgba(23, 19, 16, .14);--demo-surface: rgba(255, 252, 245, .82);--demo-surface-strong: rgba(255, 252, 245, .96);--demo-shadow: 0 32px 90px rgba(48, 35, 24, .09);--demo-accent: #9a6a39;font-family:IBM Plex Sans,Segoe UI,sans-serif;color:var(--demo-fg);background:radial-gradient(circle at top,rgba(255,255,255,.78),transparent 40%),var(--demo-bg)}:root[data-ascii-theme=dark],:root[data-ascii-theme=matrix]{--demo-bg: linear-gradient(180deg, #050706 0%, #0f1511 100%);--demo-fg: #ecfff0;--demo-muted: rgba(236, 255, 240, .68);--demo-line: rgba(236, 255, 240, .14);--demo-surface: rgba(13, 19, 15, .76);--demo-surface-strong: rgba(13, 19, 15, .92);--demo-shadow: 0 28px 84px rgba(0, 0, 0, .42);--demo-accent: #5eff78}:root[data-ascii-theme=light]{--demo-bg: linear-gradient(180deg, #f7fbff 0%, #eef2f8 100%);--demo-fg: #111827;--demo-muted: rgba(17, 24, 39, .66);--demo-line: rgba(17, 24, 39, .12);--demo-surface: rgba(255, 255, 255, .82);--demo-surface-strong: rgba(255, 255, 255, .96);--demo-shadow: 0 30px 82px rgba(34, 57, 94, .12);--demo-accent: #274690}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--demo-fg);background:transparent}button,a,code,pre,kbd{font-family:IBM Plex Mono,SFMono-Regular,monospace}.demo-shell{width:min(1180px,calc(100% - 2rem));margin-inline:auto}.demo-topbar{margin-top:1rem;padding:.9rem 1rem;border:1px solid var(--demo-line);border-radius:20px;background:var(--demo-surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;box-shadow:var(--demo-shadow)}.demo-brand{display:grid;gap:.15rem}.demo-mark{font-size:1.05rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.demo-version,.demo-footnote,.demo-kicker,.demo-block-label,.demo-preview-title{color:var(--demo-muted)}.demo-version,.demo-footnote,.demo-kicker,.demo-block-label{font-size:.82rem;text-transform:uppercase;letter-spacing:.12em}.demo-links,.demo-actions,.demo-hero-actions,.demo-chip-row,.demo-tab-row,.demo-note-strip{display:flex;flex-wrap:wrap;gap:.65rem}.demo-links{justify-content:center}.demo-links a,.demo-proof-grid p,.demo-stategrid dd,.demo-stategrid dt,.demo-sticker-panel p,.demo-lead,#preview-copy{color:inherit}.demo-main{padding-block:1.2rem 2rem;display:grid;gap:1.2rem}.demo-hero,.demo-rail,.demo-preview,.demo-adoption,.demo-stickerlab{border:1px solid var(--demo-line);background:var(--demo-surface);border-radius:28px;box-shadow:var(--demo-shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.demo-hero{padding:clamp(1.3rem,2vw,2rem);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr);gap:1rem;align-items:start}.demo-hero h1,.demo-section-head h2,.demo-preview h2{margin:0;line-height:.98;letter-spacing:-.04em}.demo-hero h1{max-width:12ch;font-size:clamp(2.5rem,6vw,5.4rem)}.demo-lead{max-width:52ch;font-size:1.02rem;line-height:1.7;color:var(--demo-muted)}.demo-pill,.demo-chip,.demo-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--demo-line);background:var(--demo-surface-strong);color:var(--demo-fg);padding:.7rem .95rem;border-radius:999px;cursor:pointer;transition:transform .18s ease,background-color .18s ease,border-color .18s ease}.demo-pill:hover,.demo-chip:hover,.demo-tab:hover{transform:translateY(-1px)}.demo-pill--primary,.demo-chip.is-active,.demo-tab.is-active{background:var(--demo-fg);color:var(--demo-surface-strong);border-color:var(--demo-fg)}.demo-stateboard,.demo-notes,.demo-codepanel,.demo-sticker-panel,.demo-meter{padding:1rem;border-radius:22px;border:1px solid var(--demo-line);background:var(--demo-surface-strong)}.demo-stateboard-head,.demo-codepanel-head,.demo-meter-head,.demo-section-head,.demo-preview-topline{display:flex;justify-content:space-between;gap:.8rem;align-items:center}.demo-stategrid{margin:1rem 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}.demo-stategrid dt{margin-bottom:.2rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--demo-muted)}.demo-stategrid dd{margin:0;font-size:1.1rem;font-weight:700}.demo-state-attrs{display:flex;flex-wrap:wrap;gap:.5rem}.demo-attr,.demo-mini-tag{border:1px solid var(--demo-line);border-radius:999px;padding:.35rem .6rem;font-size:.8rem;background:#ffffff0d}.demo-rail,.demo-section-head{padding:1rem 1.2rem}.demo-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.demo-control-block{display:grid;gap:.65rem}.demo-preview{padding:1rem}.demo-preview-shell{border-radius:24px;border:1px solid var(--demo-line);background:linear-gradient(120deg,rgba(255,255,255,.1),transparent 30%),var(--demo-surface-strong);overflow:hidden}.demo-preview-topline{padding:.9rem 1rem;border-bottom:1px solid var(--demo-line)}.demo-dot{width:10px;height:10px;border-radius:999px;background:color-mix(in srgb,var(--demo-fg) 22%,transparent)}.demo-preview-title{margin-left:auto;font-size:.78rem}.demo-preview-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);gap:1rem;padding:1rem}.demo-scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.7fr);gap:1rem;align-items:start}.demo-scene-copy,.demo-adoption-copy{display:grid;gap:.9rem}.demo-scene-actions{display:flex;flex-wrap:wrap;gap:.7rem}.demo-scene-stack{display:grid;gap:1rem}.demo-meter-track{margin-top:.75rem;height:11px;border-radius:999px;background:color-mix(in srgb,var(--demo-fg) 10%,transparent);overflow:hidden}.demo-meter-fill{display:block;height:100%;width:35%;border-radius:inherit;background:linear-gradient(90deg,var(--demo-accent),var(--demo-fg))}.demo-preview-sticker-slot,.demo-widget-slot{min-height:84px;display:grid;place-items:center;border:1px dashed var(--demo-line);border-radius:18px}.demo-note-strip{margin-top:auto}.demo-adoption,.demo-stickerlab{padding-bottom:1rem}.demo-adoption-grid,.demo-sticker-grid,.demo-proof-grid{padding-inline:1.2rem;display:grid;gap:1rem}.demo-adoption-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.95fr)}.demo-proof-grid{padding-inline:0;grid-template-columns:repeat(3,minmax(0,1fr))}.demo-proof-grid article{padding:.95rem 1rem;border-radius:18px;border:1px solid var(--demo-line);background:var(--demo-surface-strong)}.demo-codepanel pre{margin:.8rem 0 0;min-height:240px}.demo-codepanel code{white-space:pre-wrap}.demo-sticker-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.demo-sticker-panel{min-height:100%}.demo-footer{padding-bottom:2rem;color:var(--demo-muted)}@media(max-width:980px){.demo-topbar,.demo-hero,.demo-rail,.demo-preview-grid,.demo-scene,.demo-adoption-grid,.demo-sticker-grid,.demo-proof-grid{grid-template-columns:1fr}.demo-links{justify-content:flex-start}}@media(max-width:720px){.demo-topbar{grid-template-columns:1fr}.demo-hero h1{max-width:100%;font-size:clamp(2.2rem,10vw,3.4rem)}.demo-shell{width:min(100% - 1rem,100%)}}@layer base,theme,components,utilities,overrides;@property --ascii-transition-speed{syntax: "<time>"; inherits: true; initial-value: .25s;}@layer base{:root{--ascii-transition-speed: .25s;--a-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;--a-bg: #ffffff;--a-fg: #0b2a7a;--a-muted: #1a409c;--a-border: #0b2a7a;--a-link: #0b2a7a;--a-code-bg: #eef2ff;--a-ui-bg: #f7f9ff;--a-ui-fg: #121a2b;--a-ui-muted: #3f4f73;--a-ui-border: rgba(18, 26, 43, .22);--a-ui-card: #ffffff;--a-ui-surface: #ffffff}:root[data-ascii-transitions=on] body,:root[data-ascii-transitions=on] button,:root[data-ascii-transitions=on] a,:root[data-ascii-transitions=on] input,:root[data-ascii-transitions=on] textarea,:root[data-ascii-transitions=on] select,:root[data-ascii-transitions=on] [data-ascii-role],:root[data-ascii-transitions=on] .ascii-theme-toggle-btn,:root[data-ascii-transitions=on] .ascii-card,:root[data-ascii-transitions=on] .ascii-sticker{transition:background-color var(--ascii-transition-speed) ease,color var(--ascii-transition-speed) ease,border-color var(--ascii-transition-speed) ease}@media(prefers-reduced-motion:reduce){:root[data-ascii-transitions=on] *{transition:none!important;animation:none!important}}}@layer theme{:root[data-style=default]{background:var(--a-ui-bg);color:var(--a-ui-fg)}:root[data-style=default][data-ascii-mode] body{background:var(--a-ui-bg);color:var(--a-ui-fg)}:root[data-style=default][data-ascii-mode=dark]{color-scheme:dark}:root[data-style=default][data-ascii-mode=light]{color-scheme:light}:root[data-style=ascii]{color:var(--a-fg)}:root[data-style=ascii] body{background:var(--a-bg);color:var(--a-fg);font-family:var(--a-font)}:root[data-style=ascii][data-ascii-theme=dark],:root[data-style=ascii][data-ascii-theme=matrix],:root[data-style=ascii][data-ascii-mode=dark]{color-scheme:dark}:root[data-style=ascii][data-ascii-theme=light],:root[data-style=ascii][data-ascii-theme=sepia],:root[data-style=ascii][data-ascii-mode=light]{color-scheme:light}}@layer components{.ascii-theme-toggle-group{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.ascii-theme-toggle-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid currentColor;background:transparent;color:inherit;border-radius:8px;min-height:32px;min-width:32px;padding:.35rem .65rem;font:inherit;line-height:1;cursor:pointer}.ascii-theme-toggle-btn:hover{background:color-mix(in srgb,currentColor 12%,transparent)}.ascii-theme-toggle-btn:focus-visible,:root[data-style=ascii] :focus-visible{outline:2px solid currentColor;outline-offset:2px}:root[data-style=ascii] :where(*):not(img):not(video):not(canvas):not(svg):not(picture):not(source){box-shadow:none!important;text-shadow:none!important;background-image:none!important}:root[data-style=ascii] a{color:var(--a-link);text-decoration:underline;text-underline-offset:2px}:root[data-style=ascii] button,:root[data-style=ascii] [data-ascii-role=cta],:root[data-style=ascii] [data-ascii-role=cta-secondary],:root[data-style=ascii] .ascii-btn{font-family:var(--a-font);border:2px solid var(--a-border);background:transparent;color:inherit;border-radius:2px;padding:.6rem .9rem;cursor:pointer}:root[data-style=ascii] button:hover,:root[data-style=ascii] [data-ascii-role=cta]:hover,:root[data-style=ascii] [data-ascii-role=cta-secondary]:hover,:root[data-style=ascii] .ascii-btn:hover{background:var(--a-fg);color:var(--a-bg)}:root[data-style=ascii] [data-ascii-role=card],:root[data-style=ascii] .ascii-card{border:2px solid var(--a-border);border-radius:2px;background:transparent;padding:14px}:root[data-style=ascii] [data-ascii-role=badge],:root[data-style=ascii] .ascii-badge,:root[data-style=ascii] .ascii-pill{border:2px solid var(--a-border);border-radius:2px;background:transparent;padding:2px 6px}.ascii-sticker-host[data-ascii-sticker-position=top-left],.ascii-sticker-host[data-ascii-sticker-position=top-right],.ascii-sticker-host[data-ascii-sticker-position=bottom-left],.ascii-sticker-host[data-ascii-sticker-position=bottom-right]{position:fixed;z-index:40}.ascii-sticker-host[data-ascii-sticker-position=top-left]{top:1rem;left:1rem}.ascii-sticker-host[data-ascii-sticker-position=top-right]{top:1rem;right:1rem}.ascii-sticker-host[data-ascii-sticker-position=bottom-left]{bottom:1rem;left:1rem}.ascii-sticker-host[data-ascii-sticker-position=bottom-right]{right:1rem;bottom:1rem}.ascii-sticker{margin:0;padding:0;border:0;color:var(--a-fg);background:transparent;line-height:1.2;white-space:pre;font-family:var(--a-font)}.ascii-sticker--pulse{animation:ascii-pulse 1.6s ease-in-out infinite}.ascii-sticker--blink{animation:ascii-blink 1s steps(1,end) infinite}.ascii-sticker--spinner{letter-spacing:.03em}.ascii-footnote{font-family:var(--a-font);letter-spacing:.02em;opacity:.9;white-space:normal;font-size:.82rem}}@layer utilities{:root[data-style=ascii] :where(h1,h2,h3,h4,h5,h6,p,li,span,small,strong,em,label,dt,dd){color:inherit}:root[data-style=ascii] :is([class*=text-zinc-],[class*=text-neutral-],[class*=text-slate-],[class*=text-gray-]){color:inherit!important}:root[data-style=ascii] :is([class*=bg-white],[class*="bg-[#F9FAFB]"],[class*="bg-[#F3F4F6]"],[class*="bg-[#ECFDF3]"],[class*=bg-zinc-9],[class*=bg-zinc-8],[class*=bg-black],[class*=bg-neutral-9],[class*=bg-slate-9],[class*=bg-gray-9]){background:transparent!important;border-color:currentColor!important;color:currentColor!important}}@layer overrides{:root[data-style=default][data-ascii-mode=dark] :is([class*=text-black],[class*="text-[#111827]"],[class*="text-[#374151]"]){color:var(--a-ui-fg)!important}:root[data-style=default][data-ascii-mode=dark] :is([class*=bg-white],[class*="bg-[#F9FAFB]"],[class*="bg-[#F3F4F6]"],[class*="bg-[#ECFDF3]"]){background:var(--a-ui-card)!important;border-color:var(--a-ui-border)!important;color:var(--a-ui-fg)!important}:root[data-style=default][data-ascii-mode=light] :is([class*=bg-black],[class*=bg-zinc-9],[class*=bg-neutral-9],[class*=bg-slate-9],[class*=bg-gray-9]){background:#fff!important;border-color:#cdd6e6!important;color:var(--a-ui-fg)!important}}@keyframes ascii-pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes ascii-blink{0%,49%{opacity:1}50%,to{opacity:.2}}
