@layer tokens,base,layout,type,components,utils;@layer tokens{:root{--red-400: #ff4d80;--red-500: color-mix(in srgb, var(--red-400), white 10%);--red-600: color-mix(in srgb, var(--red-400), white 20%);--red-glow: color-mix(in srgb, var(--red-400), transparent 60%);--green-400: #39ff14;--green-500: color-mix(in srgb, var(--green-400), white 10%);--green-600: color-mix(in srgb, var(--green-400), white 20%);--green-glow: color-mix(in srgb, var(--green-400), transparent 60%);--orange-400: #ff7a1a;--orange-500: color-mix(in srgb, var(--orange-400), white 10%);--orange-600: color-mix(in srgb, var(--orange-400), white 20%);--orange-glow: color-mix(in srgb, var(--orange-400), transparent 60%);--black: #070606;--bg: #0a0809;--surface: oklch(from var(--color-bg) calc(l*1.3) c h);--surface-2: oklch(from var(--color-bg) calc(l*2) c h);--surface-3: oklch(from var(--color-bg) calc(l*3) c h);--border: 1px solid oklch(from var(--color-bg) calc(l*1.3) c h);--border-hover: 1px solid oklch(from var(--color-bg) calc(l*1.6) c h);--border-strong: 1px solid var(--color-primary);--white: #fff;--text: #fcd1df;--text-muted: color-mix(in srgb, var(--text), transparent 10%);--text-faint: color-mix(in srgb, var(--text), transparent 20%);--indigo-ghost: #1c1c33;--danger: #ff0052;--success: #3fb950;--warning: #d29922;--color-bg: var(--bg);--color-surface: var(--surface-2);--color-text: var(--text);--color-text-muted: var(--text-muted);--color-border: var(--border);--color-primary: var(--red-400);--color-primary-hover: var(--red-500);--color-link: var(--red-400);--color-glow: var(--red-glow);--font-display: "Pixelify Sans", ui-monospace, monospace;--font-body: "Iosevka Charon Mono", ui-monospace, "Cascadia Code", "Courier New", monospace;--font-mono: "Iosevka Charon Mono", ui-monospace, "Cascadia Code", "Courier New", monospace;--text-xs: .79rem;--text-sm: .889rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.563rem;--text-2xl: 1.953rem;--text-3xl: 3.052rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-8: 48px;--space-10: 64px;--space-12: 96px;--space-16: 128px;--container: 1040px;--container-narrow: 720px;--sidebar-w: 280px;--ease: cubic-bezier(.4, 0, .2, 1);--dur-fast: .12s;--dur: .2s;--motion: var(--dur-fast) var(--ease);--lift: translateY(-2px)}.theme-green{--color-primary: var(--green-400);--color-primary-hover: var(--green-500);--color-link: var(--green-400);--color-glow: var(--green-glow)}.theme-orange{--color-primary: var(--orange-400);--color-primary-hover: var(--orange-500);--color-link: var(--orange-400);--color-glow: var(--orange-glow)}}@layer base{*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-lg);line-height:1.7;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9998}a{color:var(--color-link);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:2px solid var(--red-400);outline-offset:2px}[disabled],.is-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto}}}@layer layout{.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-w);display:flex;flex-direction:column;padding:var(--space-5);background-color:var(--black);z-index:100}.page{margin-left:var(--sidebar-w);min-height:100vh;display:flex;flex-direction:column}@media(max-width:768px){.sidebar{position:static;width:100%;flex-direction:row;align-items:center;justify-content:space-between;border-right:none;border-bottom:var(--border)}.page{margin-left:0}}.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--space-5);width:100%}.stack>*+*{margin-block-start:var(--stack-gap, var(--space-6))}.cluster{display:flex;flex-wrap:wrap;gap:var(--cluster-gap, var(--space-3));align-items:center}.grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(var(--grid-min, 260px),1fr))}}@layer type{h1,h2{font-family:var(--font-display);letter-spacing:.04em;font-weight:400;line-height:1.15;margin:0;text-transform:uppercase;color:var(--color-primary)}h1{font-size:clamp(var(--text-xl),5vw,var(--text-3xl));color:var(--color-primary)}h2{font-size:var(--text-xl);margin-block:var(--space-8) var(--space-4)}h3{font-size:var(--text-lg)}.lead{font-size:var(--text-xl);color:var(--color-text-muted);max-width:70ch}.muted{color:var(--color-text-muted)}}@layer components{.logo{font-family:var(--font-display);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text);font-size:1.2rem;display:block;margin-bottom:var(--space-6)}.logo:hover{text-decoration:none}.logo .accent{color:var(--color-primary)}.logo .ascii{margin:0;font-size:6px;line-height:1.25;overflow:hidden;max-width:100%;text-align:center;color:var(--red-400)}.site-nav{display:flex;flex-direction:column;gap:var(--space-2);text-align:center}.site-nav a{padding:var(--space-1) 0}.site-nav a:hover{color:var(--text);text-decoration:none}.site-nav a.nav-red{color:var(--red-400)}.site-nav a.nav-green{color:var(--green-400)}.site-nav a.nav-orange{color:var(--orange-400)}@media(max-width:768px){.site-nav{flex-direction:row;gap:var(--space-4)}}.site-footer{color:var(--text-muted);text-align:center;padding:var(--space-8) var(--space-5);font-size:var(--text-sm);margin-top:auto}.site-footer p{margin:var(--space-1) 0}.hero{padding:var(--space-8) 0 var(--space-4)}.hero .accent{color:var(--white);-webkit-text-stroke:2px var(--color-primary);paint-order:stroke fill;text-shadow:2px 2px 0 var(--color-primary)}.ascii{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--red-600);line-height:1.3;margin:0 0 var(--space-5);overflow-x:auto;white-space:pre}.card{display:block;border:var(--border);padding:var(--space-5);color:var(--text);background:var(--surface);transition:border-color var(--surface-3),transform var(--motion)}.card:hover{border-color:var(--surface-3);transform:var(--lift);text-decoration:none}.card h3{margin:0 0 var(--space-1)}.card p{margin:0;color:var(--text-muted);font-size:var(--text-sm)}.card.soon{opacity:.45;pointer-events:none}.card.featured{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 6%,var(--surface));order:-1}.card.featured h3{color:#fff}.card.card-green:hover{border-color:var(--green-400)}.card.card-green h3{color:var(--green-400)}.card.card-green .card-tag{background:var(--green-400)}.card.card-orange:hover{border-color:var(--orange-400)}.card.card-orange h3{color:var(--orange-400)}.card.card-orange .card-tag{background:var(--orange-400)}.card-tags{display:flex;gap:var(--space-2);margin-bottom:var(--space-3)}.card-tag{font-family:var(--font-mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.1em;padding:2px 8px;background:var(--color-primary);color:#fff}.badge{display:inline-block;font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);border:var(--border);padding:2px 8px;font-family:var(--font-mono);margin-top:var(--space-3)}.btn{display:inline-block;background:var(--color-primary);color:var(--bg);border:2px solid var(--color-primary);padding:var(--space-3) var(--space-5);font-family:var(--font-mono);font-weight:700;font-size:var(--text-base);cursor:pointer;letter-spacing:.05em;text-transform:uppercase;transition:background var(--motion),box-shadow var(--motion)}.btn:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover);box-shadow:0 0 0 3px var(--color-glow);text-decoration:none}.btn--ghost{background:transparent;color:var(--color-primary);border:1px solid var(--color-primary)}.btn--ghost:hover{background:var(--color-primary);color:var(--bg);border-style:solid}.callout{border:var(--border-strong);padding:var(--space-4) var(--space-5)}.callout-subtle{border:var(--border);padding:var(--space-4) var(--space-5);font-size:var(--text-sm);color:var(--text-muted)}.field{display:flex;flex-direction:column;gap:var(--space-1)}.field label{font-size:var(--text-sm);color:var(--text-muted);font-family:var(--font-mono)}.field label:before{content:"// ";color:var(--text-faint)}.field input,.field select,.field textarea{background:var(--surface);color:var(--text);border:var(--border);padding:var(--space-3);font-size:var(--text-base);font-family:var(--font-mono);width:100%}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--color-primary);border-style:solid;outline:none;box-shadow:0 0 0 3px var(--color-glow)}.tool-page{display:flex;flex-direction:column;gap:var(--space-10)}.tool-hero{max-width:var(--container)}.eyebrow{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.1em;margin:0 0 var(--space-3);color:var(--color-link)}.stat{display:flex;flex-direction:column;gap:2px}.stat-num{font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-primary);line-height:1}.stat-label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}.tool-screenshot{margin:var(--space-5) 0 0;border:var(--border-hover);overflow:hidden}.tool-screenshot img{width:100%;height:auto;display:block}.tool-screenshot figcaption{padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--text-muted);border-top:var(--border)}.how-steps{display:flex;flex-direction:column;gap:var(--space-5)}.step{display:grid;grid-template-columns:3rem 1fr;gap:var(--space-5);padding:var(--space-5);border:var(--border);align-items:start}.step-num{font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-primary);line-height:1}.step h3{margin:0 0 var(--space-2)}.step p{margin:0;color:var(--text-muted)}.card-icon{font-size:1.2rem;color:var(--color-link);display:block;margin-bottom:var(--space-2)}.faq-item{border:var(--border);padding:var(--space-4) var(--space-5);margin-bottom:var(--space-2);cursor:pointer}.faq-item summary{font-weight:700;list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-4)}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";color:var(--color-primary);flex-shrink:0}.faq-item[open] summary:after{content:"−"}.faq-item p{margin:var(--space-3) 0 0;color:var(--text-muted)}.modal-overlay{position:fixed;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:200;padding:var(--space-5)}.modal-overlay:not(.is-open){display:none}.modal{background:var(--surface);border:var(--border);padding:var(--space-6);max-width:var(--container-narrow);width:100%}}@layer utils{.prefix-arrow:before{content:">> ";color:var(--color-primary)}.bracket:before{content:"[ ";color:var(--text-faint)}.bracket:after{content:" ]";color:var(--text-faint)}}
