.style-controls{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.5rem 0 2rem}.style-controls button{min-height:42px;padding:.65rem .85rem;border:1px solid var(--line);background:rgba(255,255,255,.025);color:var(--muted);font:800 .65rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}.style-controls button[aria-pressed="true"]{color:var(--cyan);border-color:rgba(80,244,255,.55);box-shadow:inset 0 0 24px rgba(80,244,255,.05)}.surface-preview{--p-bg:#05070d;--p-panel:#0b1120;--p-text:#f3f6ff;--p-muted:#aab4c8;--p-accent:#50f4ff;--p-accent2:#ff3fd7;--p-line:rgba(167,190,255,.22);--p-font:Inter,ui-sans-serif,system-ui,sans-serif;position:relative;overflow:hidden;border:1px solid var(--p-line);background:var(--p-bg);color:var(--p-text);font-family:var(--p-font);min-height:620px;box-shadow:0 30px 100px rgba(0,0,0,.32);transition:background .2s ease,border-color .2s ease}.surface-preview *{box-sizing:border-box}.preview-top{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.85rem 1rem;border-bottom:1px solid var(--p-line);color:var(--p-muted);font:800 .63rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;text-transform:uppercase}.preview-top strong{color:var(--p-accent)}.preview-hero{padding:clamp(2rem,7vw,5rem);background:linear-gradient(130deg,color-mix(in srgb,var(--p-accent2) 12%,transparent),transparent 48%)}.preview-kicker{margin:0 0 .8rem;color:var(--p-accent);font:800 .68rem/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}.preview-hero h2{margin:0;font-size:clamp(2.8rem,8vw,6.5rem);line-height:.86;letter-spacing:-.06em}.preview-hero p{max-width:700px;color:var(--p-muted);font-size:1rem}.preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--p-line);border-top:1px solid var(--p-line)}.preview-card{min-height:210px;padding:1.25rem;background:var(--p-panel)}.preview-card span{color:var(--p-accent);font:800 .62rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em}.preview-card h3{margin:.8rem 0 .55rem;font-size:1.15rem}.preview-card p{margin:0;color:var(--p-muted);font-size:.88rem}.preview-terminal{margin:0;padding:1.2rem;border-top:1px solid var(--p-line);background:color-mix(in srgb,var(--p-bg) 82%,black);color:var(--p-muted);font:600 .74rem/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap}.preview-terminal b{color:var(--p-accent)}.surface-preview[data-theme="midnight"]{--p-bg:#03080b;--p-panel:#07100f;--p-text:#e6f2df;--p-muted:#8ba08e;--p-accent:#9bf57a;--p-accent2:#d29a45;--p-line:rgba(155,245,122,.2)}.surface-preview[data-theme="blueprint"]{--p-bg:#071524;--p-panel:#0b2034;--p-text:#edf7ff;--p-muted:#aac8dd;--p-accent:#72d8ff;--p-accent2:#b6e8ff;--p-line:rgba(114,216,255,.26);background-image:linear-gradient(rgba(114,216,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(114,216,255,.06) 1px,transparent 1px);background-size:24px 24px}.surface-preview[data-theme="crt"]{--p-bg:#020704;--p-panel:#051009;--p-text:#c8ffd2;--p-muted:#75b880;--p-accent:#65ff7e;--p-accent2:#2ab44a;--p-line:rgba(101,255,126,.21);--p-font:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.surface-preview[data-theme="crt"]:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(101,255,126,.035) 3px 4px);mix-blend-mode:screen}.surface-preview[data-theme="clean"]{--p-bg:#090b10;--p-panel:#11151c;--p-text:#f5f7fb;--p-muted:#b3bbc8;--p-accent:#dbe7ff;--p-accent2:#7d8da8;--p-line:rgba(220,230,247,.13)}.surface-preview[data-theme="zine"]{--p-bg:#e6e1d5;--p-panel:#f3efe6;--p-text:#151515;--p-muted:#4c4a45;--p-accent:#151515;--p-accent2:#721b20;--p-line:rgba(0,0,0,.3);--p-font:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background-image:repeating-linear-gradient(4deg,rgba(0,0,0,.02) 0 1px,transparent 1px 4px)}.surface-preview[data-theme="zine"] .preview-hero{background:linear-gradient(118deg,rgba(114,27,32,.14),transparent 52%)}.surface-preview[data-theme="zine"] .preview-terminal{background:#171717;color:#efeadf}.surface-preview[data-theme="neon"]{--p-bg:#05070d;--p-panel:#0b1120;--p-text:#f3f6ff;--p-muted:#aab4c8;--p-accent:#50f4ff;--p-accent2:#ff3fd7;--p-line:rgba(167,190,255,.22)}.style-matrix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.style-matrix article{border:1px solid var(--line);padding:1.15rem;background:rgba(255,255,255,.015)}.style-matrix h3{margin:.45rem 0;font-size:1rem}.style-matrix p{margin:0;color:var(--muted);font-size:.86rem}@media(max-width:760px){.preview-grid,.style-matrix{grid-template-columns:1fr}.surface-preview{min-height:0}.style-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){.surface-preview{transition:none}}