:root{color-scheme:dark;--cg-bg:#0a0a12;--cg-bg-alt:#0f0f1a;--cg-bg-elevated:#12121f;--cg-bg-alt-translucent:#0f0f1ae6;--cg-border:#26263a;--cg-border-strong:#3a3a55;--cg-text:#e2e8f0;--cg-text-muted:#94a3b8;--cg-text-on-accent:#0a0a12;--cg-accent:#8b5cf6;--cg-accent-high:#c4b5fd;--cg-accent-low:#1e1b4b;--cg-gradient:linear-gradient(135deg, #8b5cf6 0%, #38bdf8 100%);--cg-success-bg:#052e16;--cg-success-text:#86efac;--cg-success-border:#166534;--cg-warning-bg:#1e1b4b;--cg-warning-text:#c4b5fd;--cg-warning-border:#312e81;--cg-danger-bg:#2a0a10;--cg-danger-text:#f87171;--cg-danger-border:#7f1d1d;--cg-focus-ring:#8b5cf640;--cg-font-sans:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--cg-font-mono:ui-monospace, "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;--cg-font-size-xs:.8rem;--cg-font-size-sm:.9rem;--cg-font-size-md:1rem;--cg-font-size-lg:1.1rem;--cg-font-size-xl:1.6rem;--cg-font-size-3xl:clamp(2.2rem, 5vw, 3.5rem);--cg-line-height:1.6;--cg-heading-h1:var(--cg-font-size-3xl);--cg-heading-h2:var(--cg-font-size-xl);--cg-heading-h3:1.2rem;--cg-space-1:.25rem;--cg-space-2:.5rem;--cg-space-3:.75rem;--cg-space-4:1rem;--cg-space-6:1.5rem;--cg-space-8:2rem;--cg-space-12:3rem;--cg-space-16:4rem;--cg-radius-sm:.375rem;--cg-radius-md:.5rem;--cg-radius-lg:.75rem;--cg-radius-full:999px;--cg-shadow:0 4px 24px #0006;--cg-transition:.15s ease}*{box-sizing:border-box}html,body{background:var(--cg-bg);color:var(--cg-text);font-family:var(--cg-font-sans);line-height:var(--cg-line-height);margin:0;padding:0}html{scrollbar-gutter:stable}:root{--sl-color-accent:var(--cg-accent);--sl-color-accent-high:var(--cg-accent-high);--sl-color-black:var(--cg-bg);--sl-color-gray-5:var(--cg-border);--sl-color-gray-6:var(--cg-border);--sl-color-gray-7:var(--cg-bg-elevated);--sl-color-text:var(--cg-text);--sl-line-height:var(--cg-line-height);--sl-text-code:.875rem}body{flex-direction:column;min-height:100vh;display:flex}a{color:var(--cg-accent-high);text-decoration:none}a:hover{text-decoration:underline}.site-main{width:100%;max-width:72rem;padding:var(--cg-space-12) var(--cg-space-8) var(--cg-space-16);flex:1 0 auto;margin:0 auto}.hero{padding:var(--cg-space-16) 0 var(--cg-space-12);text-align:center}.hero h1{font-size:var(--cg-heading-h1);margin:0 0 var(--cg-space-6);background:var(--cg-gradient);color:#0000;background-clip:text;line-height:1.3}.hero p{max-width:44rem;margin:0 auto var(--cg-space-8);color:var(--cg-text-muted);font-size:var(--cg-font-size-lg)}.hero-actions{justify-content:center;gap:var(--cg-space-4);flex-wrap:wrap;display:flex}.rss-link{margin-top:var(--cg-space-8);text-align:center;font-size:var(--cg-font-size-sm)}.btn{justify-content:center;align-items:center;gap:var(--cg-space-2);padding:var(--cg-space-3) var(--cg-space-6);border-radius:var(--cg-radius-md);border:1px solid var(--cg-border);color:var(--cg-text);background:var(--cg-bg-alt);font:inherit;font-size:var(--cg-font-size-md);cursor:pointer;transition:transform var(--cg-transition), border-color var(--cg-transition), box-shadow var(--cg-transition);line-height:1.2;display:inline-flex}.btn:hover{border-color:var(--cg-accent);text-decoration:none;transform:translateY(-1px)}.btn:focus-visible{border-color:var(--cg-accent);box-shadow:0 0 0 3px var(--cg-focus-ring);outline:none}.btn:active{transform:translateY(0)}.btn:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:var(--cg-gradient);color:var(--cg-text-on-accent);border:none;font-weight:600}.btn-primary:hover{border:none}.btn-sm{padding:var(--cg-space-2) var(--cg-space-4);font-size:var(--cg-font-size-sm)}.section{margin-top:var(--cg-space-16)}.section-head{justify-content:space-between;align-items:baseline;gap:var(--cg-space-4);margin-bottom:var(--cg-space-6);display:flex}.section-head h2{font-size:var(--cg-heading-h2);margin:0}.section-head a{font-size:var(--cg-font-size-sm)}.grid{gap:var(--cg-space-6);grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));display:grid}.card{gap:var(--cg-space-4);padding:var(--cg-space-6);border:1px solid var(--cg-border);border-radius:var(--cg-radius-lg);background:var(--cg-bg-alt);transition:border-color var(--cg-transition), transform var(--cg-transition);flex-direction:column;display:flex;position:relative}.card:hover{border-color:var(--cg-accent);transform:translateY(-2px)}.card a:hover{text-decoration:none}.card .stretched-link:after{content:"";position:absolute;inset:0}.card-actions,.card-meta{z-index:1;position:relative}.card img{border-radius:var(--cg-radius-md);width:100%;height:auto}.card h3{font-size:var(--cg-heading-h3);margin:0}.card p{color:var(--cg-text-muted);font-size:var(--cg-font-size-sm);flex-grow:1;margin:0}.card-meta{gap:var(--cg-space-2);font-size:var(--cg-font-size-xs);flex-wrap:wrap;display:flex}.card-meta>div{align-items:center;gap:var(--cg-space-2);flex-wrap:wrap;display:flex}.badge{padding:var(--cg-space-1) var(--cg-space-3);border-radius:var(--cg-radius-full);font-size:var(--cg-font-size-xs);white-space:nowrap;background:var(--cg-bg-elevated);color:var(--cg-text-muted);border:1px solid var(--cg-border);align-items:center;line-height:1.5;display:inline-flex}.badge-available{background:var(--cg-success-bg);color:var(--cg-success-text);border-color:var(--cg-success-border)}.badge-soon{background:var(--cg-warning-bg);color:var(--cg-warning-text);border-color:var(--cg-warning-border)}.badge-danger{background:var(--cg-danger-bg);color:var(--cg-danger-text);border-color:var(--cg-danger-border)}.card-actions,.card-actions>div{gap:var(--cg-space-3);flex-wrap:wrap;display:flex}.article-actions{margin:var(--cg-space-6) 0}.meta-spaced{margin:var(--cg-space-4) 0 var(--cg-space-6)}.actions-below{margin-bottom:var(--cg-space-8)}.back-link{margin-top:var(--cg-space-8)}.legal-note{color:var(--cg-text-muted);font-size:var(--cg-font-size-sm)}article{max-width:46rem;margin:0 auto}article h1{font-size:var(--cg-heading-h2);margin:0 0 var(--cg-space-2);line-height:1.2}.article-meta{color:var(--cg-text-muted);font-size:var(--cg-font-size-sm);margin-bottom:var(--cg-space-8)}article img{border-radius:var(--cg-radius-lg);max-width:100%;height:auto}.field{gap:var(--cg-space-2);margin-bottom:var(--cg-space-4);flex-direction:column;display:flex}.field label{font-size:var(--cg-font-size-sm);color:var(--cg-text-muted)}.input{background:var(--cg-bg-alt);border:1px solid var(--cg-border);color:var(--cg-text);font:inherit;border-radius:var(--cg-radius-md);padding:var(--cg-space-3) var(--cg-space-4);transition:border-color var(--cg-transition), box-shadow var(--cg-transition)}.input:hover{border-color:var(--cg-border-strong)}.input:focus{border-color:var(--cg-accent);box-shadow:0 0 0 3px var(--cg-focus-ring);outline:none}.input:disabled{opacity:.5;cursor:not-allowed}textarea.input{resize:vertical;min-height:6rem}code:not(pre code){font-family:var(--cg-font-mono);background:var(--cg-bg-elevated);border:1px solid var(--cg-border);border-radius:var(--cg-radius-sm);padding:.1em .35em;font-size:.9em}.codeblock{padding:var(--cg-space-4) var(--cg-space-6);background:var(--cg-bg-elevated);border:1px solid var(--cg-border);border-radius:var(--cg-radius-md);margin:0;overflow-x:auto}.codeblock code{font-family:var(--cg-font-mono);font-size:var(--cg-font-size-sm);white-space:pre}.stylebook-grid{gap:var(--cg-space-4);grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));display:grid}.swatch{gap:var(--cg-space-2);border:1px solid var(--cg-border);border-radius:var(--cg-radius-md);background:var(--cg-bg-alt);padding:var(--cg-space-4);font-size:var(--cg-font-size-xs);flex-direction:column;display:flex}.swatch-color{border-radius:var(--cg-radius-sm);border:1px solid var(--cg-border-strong);height:3.5rem}.swatch code{font-family:var(--cg-font-mono)}.swatch-value{color:var(--cg-text-muted);font-family:var(--cg-font-mono)}.demo-block{padding:var(--cg-space-6);border:1px solid var(--cg-border);border-radius:var(--cg-radius-lg);background:var(--cg-bg-alt);margin-bottom:var(--cg-space-6)}.demo-block>.btn{margin-right:var(--cg-space-3);margin-bottom:var(--cg-space-3)}.demo-block>.badge{margin-right:var(--cg-space-2);margin-bottom:var(--cg-space-2)}@media (width<=640px){.site-header{padding:var(--cg-space-3) var(--cg-space-4);flex-direction:row}}
