:root{--ysec-neon: #f5e11c;--ysec-violet: #7a2bd6;--ysec-violet-deep: #3d1066;--ysec-bg: #0a0a0e;--ysec-ink: #f8f8f4;--ysec-ink-dim: #a8a8b3;--ysec-surface: #121218;--ysec-surface-2: #1a1a24;--ysec-border: #2a2a36;--ysec-primary: var(--ysec-violet);--ysec-accent: var(--ysec-neon);--ysec-text: var(--ysec-ink);--ysec-text-dim: var(--ysec-ink-dim);--ysec-danger: #ff4d6d;--ysec-security: var(--ysec-violet);--ysec-experience: var(--ysec-neon);--ysec-control: var(--ysec-violet-deep);--ysec-font-display: "Clash Display", "Space Grotesk", system-ui, sans-serif;--ysec-font-body: "Space Grotesk", system-ui, sans-serif;--ysec-font-mono: "JetBrains Mono", ui-monospace, monospace;--ysec-kicker-tracking: .32em;--ysec-radius: 12px;--ysec-glow-security: 0 0 28px rgba(122, 43, 214, .45);--ysec-glow-experience: 0 0 28px rgba(245, 225, 28, .35);--ysec-glow-control: 0 0 28px rgba(61, 16, 102, .55);--ysec-glow-accent: 0 0 36px rgba(245, 225, 28, .28);--ysec-glow-violet: 0 0 48px rgba(122, 43, 214, .35)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:var(--ysec-font-body);background:radial-gradient(ellipse 80% 50% at 10% 0%,rgba(122,43,214,.28),transparent),radial-gradient(ellipse 60% 40% at 90% 10%,rgba(245,225,28,.08),transparent),var(--ysec-bg);color:var(--ysec-text);min-height:100vh}.layout{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.side{padding:1.5rem 1.25rem;background:color-mix(in srgb,var(--ysec-surface) 92%,transparent);border-right:1px solid var(--ysec-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand-row{display:flex;align-items:center;gap:.75rem;margin-bottom:.35rem}.brand-mark{width:40px;height:40px;object-fit:contain;filter:drop-shadow(var(--ysec-glow-accent))}.logo{margin:0;font-family:var(--ysec-font-display);font-size:1.5rem;font-weight:700;letter-spacing:-.03em;color:var(--ysec-ink)}.logo .neon{color:var(--ysec-neon)}.side h1{margin:.5rem 0 0;font-family:var(--ysec-font-display);font-size:1.05rem;font-weight:600}.kicker{margin:.35rem 0 0;font-family:var(--ysec-font-mono);font-size:.6rem;letter-spacing:var(--ysec-kicker-tracking);text-transform:uppercase;color:var(--ysec-neon)}.sub{margin:.35rem 0 1.5rem;color:var(--ysec-text-dim);font-size:.85rem}nav{display:grid;gap:.35rem}.nav{color:var(--ysec-text-dim);text-decoration:none;padding:.55rem .7rem;border-radius:8px;border:1px solid transparent;background:transparent;font:inherit;text-align:left;cursor:pointer;width:100%}.nav.active,.nav:hover{color:var(--ysec-ink);background:color-mix(in srgb,var(--ysec-violet) 22%,var(--ysec-surface-2));border-color:color-mix(in srgb,var(--ysec-violet) 50%,var(--ysec-border))}.nav.active{box-shadow:var(--ysec-glow-security)}.main{padding:2rem}.main header h2{margin:0;font-family:var(--ysec-font-display);font-size:1.75rem}.main header p{margin:.4rem 0 1.5rem;color:var(--ysec-text-dim)}.keybox{margin-top:1.5rem;display:grid;gap:.5rem}.keybox label{display:grid;gap:.35rem;font-size:.8rem;color:var(--ysec-text-dim)}.keybox input{font:inherit;padding:.5rem;border-radius:8px;border:1px solid var(--ysec-border);background:var(--ysec-bg);color:var(--ysec-text)}.keybox input:focus{outline:none;border-color:var(--ysec-violet);box-shadow:0 0 0 3px color-mix(in srgb,var(--ysec-violet) 35%,transparent)}.cta,.ghost{font:inherit;cursor:pointer;border-radius:8px;padding:.5rem .7rem}.cta{border:none;background:var(--ysec-neon);color:var(--ysec-bg);font-family:var(--ysec-font-display);font-weight:700;box-shadow:var(--ysec-glow-accent)}.ghost{border:1px solid var(--ysec-border);background:transparent;color:var(--ysec-text-dim)}.ghost:hover{border-color:var(--ysec-violet);color:var(--ysec-ink)}.panel{border:1px solid color-mix(in srgb,var(--ysec-border) 70%,var(--ysec-violet));border-radius:var(--ysec-radius);background:color-mix(in srgb,var(--ysec-surface) 90%,transparent);padding:1rem;box-shadow:var(--ysec-glow-violet)}.panel h3{margin:0 0 .75rem;font-family:var(--ysec-font-display);color:var(--ysec-neon)}.code{margin:0;overflow:auto;max-height:60vh;font-family:var(--ysec-font-mono);font-size:.75rem;color:var(--ysec-text-dim)}.status{color:var(--ysec-neon);margin:0 0 1rem}@media(max-width:900px){.layout{grid-template-columns:1fr}}