:root{--color-bg: #0b1218;--color-bg-2: #111923;--color-surface: #0f1720;--color-surface-2: #121e28;--color-border: #2a3642;--color-text: #dbe2ea;--color-text-muted: #9fb0bf;--color-heading: #ffffff;--teal-100: #8efbf7;--teal-200: #32e6e2;--teal-300: #14d8d4;--teal-400: #05bdba;--teal-500: #04a29f;--teal-700: #016968;--gold-400: #f98e21;--radius: 14px;--shadow: 0 10px 30px rgba(0,0,0,.35)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:1160px;padding:0 20px;margin:0 auto}.nav{position:sticky;top:0;z-index:50;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:color-mix(in oklab,var(--color-bg),transparent 20%);border-bottom:1px solid var(--color-border)}.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}.brand{display:flex;align-items:center;gap:12px;color:var(--color-heading);text-decoration:none;font-weight:700;letter-spacing:.2px}.brand img{width:36px;height:36px;border-radius:10px}.nav a{color:var(--color-text);text-decoration:none}.nav-links{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.button,button,input[type=submit]{background:var(--teal-400);color:#081117;padding:10px 16px;border-radius:12px;border:none;font-weight:700;transition:transform .08s ease,box-shadow .2s ease,background .2s ease;box-shadow:0 6px 16px #14d8d447;cursor:pointer}.button:hover,button:hover,input[type=submit]:hover{transform:translateY(-1px);background:var(--teal-300)}.button.ghost{background:transparent;color:var(--teal-200);border:1px solid color-mix(in oklab,var(--teal-300),#fff 10%);box-shadow:none}.button.ghost:hover{background:color-mix(in oklab,var(--teal-700),transparent 70%)}.hero{padding:72px 0 32px;background:radial-gradient(1000px 400px at 20% -10%,color-mix(in oklab,var(--teal-500),transparent 80%),transparent),radial-gradient(900px 300px at 80% -30%,color-mix(in oklab,var(--teal-400),transparent 85%),transparent);border-bottom:1px solid var(--color-border)}.hero h1{font-size:clamp(28px,4vw + 16px,46px);line-height:1.1;color:var(--color-heading);margin:0 0 10px}.hero p{margin:0 0 18px;color:var(--color-text-muted);font-size:18px}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.card{grid-column:span 4;background:var(--color-surface);border:1px solid var(--color-border);border-top:6px solid var(--teal-400);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}.card h3{margin-top:0;color:var(--color-heading)}.section{padding:48px 0}.footer{border-top:1px solid var(--color-border);background:var(--color-bg-2);color:var(--color-text-muted);padding:28px 0;margin-top:40px;font-size:14px}.kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;background:#0a131a;border:1px solid #1f2b36;border-bottom-width:3px;padding:2px 6px;border-radius:8px;color:#b7c8d9}input,textarea,select{width:100%;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:12px;padding:12px 14px;color:var(--color-text);outline:none}label{font-weight:600;color:var(--color-text)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-field{display:grid;gap:8px;margin:10px 0}.help{color:var(--color-text-muted);font-size:13px}small.error{color:#ffb3b0}.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--teal-200);font-weight:700;font-size:12px}.table{width:100%;border-collapse:collapse;border:1px solid var(--color-border);border-radius:12px;overflow:hidden}.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--color-border)}.table th{text-align:left;color:var(--color-text-muted);font-weight:600}.table tr:hover{background:color-mix(in oklab,var(--color-surface),#ffffff0a)}@media (max-width: 920px){.card{grid-column:span 6}.form-row{grid-template-columns:1fr}}@media (max-width: 640px){.card{grid-column:span 12}}