:root{--bg:#0b1220;--card:#111a2d;--line:#1f2a44;--text:#e8ecf7;--muted:#aab4cf;--acc:#7aa2ff;--acc-600:#5f8dff;--acc-700:#4877f5;--acc2:#79f2a0;--warn:#ffd166;--err:#ff6b6b;--ok:#79f2a0;--surface:var(--card);--surface-2:#0f1727;--surface-3:#0c1424;--border:var(--line);--ring:var(--acc);--link:#9fc1ff;--radius-1:8px;--radius-2:12px;--radius-3:14px;--radius-4:18px;--space-1:6px;--space-2:10px;--space-3:14px;--space-4:18px;--space-5:24px;--space-6:32px;--fs-1:clamp(12px,0.85vw,13px);--fs-2:clamp(14px,1vw,15px);--fs-3:clamp(16px,1.2vw,17px);--fs-4:clamp(18px,1.5vw,20px);--fs-5:clamp(24px,2.4vw,28px);--fs-6:clamp(34px,3.6vw,42px);--shadow-1:0 1px 2px rgba(0,0,0,0.25),0 0 0 1px rgba(255,255,255,0.02) inset;--shadow-2:0 6px 20px rgba(0,0,0,0.35),0 0 0 1px rgba(255,255,255,0.02) inset;--shadow-3:0 14px 40px rgba(0,0,0,0.45),0 0 0 1px rgba(255,255,255,0.03) inset;--ts-fast:120ms cubic-bezier(.2,.7,.3,1);--ts:200ms cubic-bezier(.2,.7,.3,1)}*{box-sizing:border-box}body,html{padding:0;margin:0;height:100%}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--fs-3);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--link);text-decoration:none;transition:color var(--ts)}a:hover{color:#c9dcff}.container{max-width:1200px;margin:0 auto;padding:var(--space-5)}.stack>*+*{margin-top:var(--space-4)}.grid{display:grid;grid-gap:var(--space-4);gap:var(--space-4)}.grid-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}h1,h2,h3{margin:0 0 var(--space-2);letter-spacing:-.01em}h1{font-size:var(--fs-6);line-height:1.1}h2{font-size:var(--fs-5);line-height:1.2}h3{font-size:var(--fs-4);line-height:1.25}.muted{color:var(--muted)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-2);padding:var(--space-4);box-shadow:var(--shadow-1);transition:transform var(--ts),box-shadow var(--ts),border-color var(--ts)}.card:hover{transform:translateY(-1px);box-shadow:var(--shadow-2);border-color:#2a3555}.hero{padding:60px 0}.hero h1{font-size:var(--fs-6)}.hero p{color:var(--muted);font-size:var(--fs-3);max-width:720px}.btn{display:inline-block;padding:12px 16px;border-radius:10px;font-weight:700;background:var(--acc);color:#0b1220;border:0;box-shadow:0 6px 16px rgba(122,162,255,.25);transition:transform var(--ts-fast),box-shadow var(--ts-fast),background var(--ts)}.btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(122,162,255,.32)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn.secondary{background:#2a3555;color:var(--text);box-shadow:none}.btn.ghost{background:transparent;color:var(--text)}.badge,.btn.ghost{border:1px solid var(--border)}.badge{display:inline-block;padding:4px 10px;border-radius:999px;color:#cbd4ee;background:var(--surface-2)}.badge,label{font-size:var(--fs-1)}label{color:#c8d3f0;display:block;margin-bottom:6px}input,select,textarea{width:100%;padding:12px;border-radius:10px;border:1px solid var(--border);background:#0f1626;color:var(--text);transition:border-color var(--ts),box-shadow var(--ts),background var(--ts)}input::placeholder{color:#8ca0c7}:where(input,select,textarea):hover{border-color:#2a3555}:where(input,select,textarea):focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px rgba(122,162,255,.25);background:#0e1a2b}.notice{border-left:3px solid var(--acc);padding:12px;border-radius:8px;background:#0f1626}.notice.ok{border-left-color:var(--ok)}.notice.warn{border-left-color:var(--warn)}.notice.err{border-left-color:var(--err)}nav{position:-webkit-sticky;position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}nav .inner{justify-content:space-between;padding:14px 24px}nav .inner,nav .left{display:flex;align-items:center}nav .left{gap:12px}nav .links{display:flex;gap:14px;align-items:center}nav .links a{color:#cbd4ee;font-size:var(--fs-2);transition:color var(--ts)}nav .links a:hover{color:#e5ecff}footer{border-top:1px solid var(--border);margin-top:40px}footer .inner{display:flex;gap:16px;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:24px}ul{padding-left:18px;margin:8px 0}li{margin:6px 0}:focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:6px}@media (hover:hover){.btn:not(.secondary):not(.ghost):hover{background:linear-gradient(180deg,var(--acc) 0,var(--acc-600) 100%)}}.highlight{border-color:#2e3b61!important;box-shadow:inset 0 0 0 1px #2e3b61}