@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Syne:wght@500;600;700;800&display=swap";
:root{--bg:#0a0f0d;--bg-elev:#121a16;--surface:#16201b;--text:#e8f2ec;--text-muted:#8aa396;--border:#24352c;--primary:#3dff9a;--primary-fg:#04140c;--accent:#ff6b3d;--danger:#ff5c7a;--success:#3dff9a;--glow:#3dff9a2e;--font-display:"Syne", sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--fs-display:clamp(2.75rem, 8vw, 5.5rem);--fs-h1:clamp(1.75rem, 4vw, 2.5rem);--fs-h2:1.25rem;--fs-body:1.05rem;--fs-sm:.85rem;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--radius:2px;--gutter:1.25rem;--container:72rem;--ease:cubic-bezier(.22, 1, .36, 1)}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);font-family:var(--font-display);font-size:var(--fs-body);margin:0;line-height:1.5}body{background-image:radial-gradient(ellipse 80% 50% at 10% -10%, var(--glow), transparent 55%), radial-gradient(ellipse 60% 40% at 90% 0%, #ff6b3d1f, transparent 50%), linear-gradient(180deg, #0c1410 0%, var(--bg) 40%);background-attachment:fixed}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}code,.mono{font-family:var(--font-mono);font-size:.92em}.shell{width:min(100% - 2 * var(--gutter), var(--container));margin-inline:auto}.site-nav{padding:var(--space-5) 0;animation:rise .7s var(--ease) both;justify-content:space-between;align-items:center;display:flex}.brand{align-items:center;gap:var(--space-3);color:var(--text);letter-spacing:-.03em;font-size:1.15rem;font-weight:700;text-decoration:none;display:inline-flex}.brand:hover{color:var(--primary);text-decoration:none}.brand-mark{width:28px;height:28px}.nav-links{gap:var(--space-5);font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.08em;align-items:center;display:flex}.nav-links a{color:var(--text-muted);text-decoration:none}.nav-links a:hover{color:var(--text)}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius);font-family:var(--font-display);letter-spacing:-.02em;cursor:pointer;transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease);border:1px solid #0000;padding:.75rem 1.25rem;font-weight:700;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--primary);color:var(--primary-fg);box-shadow:0 0 0 0 var(--glow)}.btn-primary:hover:not(:disabled){box-shadow:0 0 32px var(--glow);text-decoration:none;transform:translateY(-1px)}.btn-ghost{color:var(--text);border-color:var(--border);background:0 0}.btn-ghost:hover:not(:disabled){border-color:var(--primary);color:var(--primary);text-decoration:none}.hero{align-content:center;gap:var(--space-5);min-height:calc(100svh - 88px);padding-bottom:var(--space-8);display:grid;position:relative;overflow:hidden}.hero:after{content:"";pointer-events:none;background:repeating-linear-gradient(-18deg,#0000,#0000 12px,#3dff9a0a 12px 13px);height:70%;animation:18s linear infinite drift;position:absolute;inset:auto -10% -30% 40%}.hero-brand{font-size:var(--fs-display);letter-spacing:-.06em;animation:rise .8s var(--ease) 50ms both;margin:0;font-weight:800;line-height:.95}.hero-brand span{color:var(--primary)}.hero-line{max-width:34rem;color:var(--text-muted);animation:rise .8s var(--ease) .15s both;margin:0;font-size:clamp(1.05rem,2.2vw,1.25rem)}.hero-cta{gap:var(--space-3);margin-top:var(--space-3);animation:rise .8s var(--ease) .25s both;flex-wrap:wrap;display:flex}.section{padding:var(--space-8) 0;border-top:1px solid var(--border)}.section h2{font-size:var(--fs-h1);letter-spacing:-.04em;margin:0 0 var(--space-3)}.section p.lead{color:var(--text-muted);max-width:36rem;margin:0 0 var(--space-6)}.feature-row{gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.feature{padding:var(--space-5) 0;border-top:1px solid var(--border)}.feature h3{margin:0 0 var(--space-2);font-size:var(--fs-h2);letter-spacing:-.03em}.feature p{color:var(--text-muted);font-size:var(--fs-sm);margin:0}.playground{gap:var(--space-5);padding-bottom:var(--space-8);display:grid}.playground-head{justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;align-items:end;display:flex}.playground-head h1{font-size:var(--fs-h1);letter-spacing:-.04em;margin:0}.playground-head p{margin:var(--space-2) 0 0;color:var(--text-muted);font-size:var(--fs-sm)}.panel{background:color-mix(in srgb, var(--surface) 88%, transparent);border:1px solid var(--border);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.panel-pad{padding:var(--space-5)}.field{gap:var(--space-2);margin-bottom:var(--space-4);display:grid}.field label{font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.field input[type=url],.field input[type=text],.field textarea,.field select{background:var(--bg);width:100%;color:var(--text);border:1px solid var(--border);border-radius:var(--radius);font-family:var(--font-mono);font-size:var(--fs-sm);padding:.85rem 1rem}.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:2px solid var(--primary);outline-offset:1px}.checks{gap:var(--space-4);margin-bottom:var(--space-5);flex-wrap:wrap;display:flex}.checks label{align-items:center;gap:var(--space-2);font-size:var(--fs-sm);color:var(--text-muted);cursor:pointer;display:inline-flex}.results{gap:var(--space-4);grid-template-columns:1fr;display:grid}@media (min-width:960px){.results{grid-template-columns:1fr 1fr;min-height:28rem}}.result-pane{flex-direction:column;min-height:22rem;display:flex}.result-pane header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);justify-content:space-between;align-items:center;display:flex}.result-body{padding:var(--space-4);white-space:pre-wrap;word-break:break-word;font-family:var(--font-mono);color:var(--text);flex:1;margin:0;font-size:.8rem;line-height:1.55;overflow:auto}.status-line{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-muted);min-height:1.25rem}.status-line.error{color:var(--danger)}.status-line.ok{color:var(--success)}.footer{border-top:1px solid var(--border);padding:var(--space-6) 0;color:var(--text-muted);font-size:var(--fs-sm);justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;display:flex}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes drift{0%{transform:translate(0)}to{transform:translate(-40px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}