:root{--bg: #0f1115;--bg-2: #131722;--panel: #171b27;--panel-2: #1b2030;--text: #f1f3f7;--muted: #9aa3b2;--line: rgba(255,255,255,.08);--accent: #a7b1c5;--accent-2: #d0d7e2}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Space Grotesk,system-ui,-apple-system,sans-serif;min-height:100%}body{background-image:radial-gradient(circle at top left,rgba(255,255,255,.05),transparent 55%),radial-gradient(circle at 20% 20%,rgba(255,255,255,.04),transparent 40%)}a{color:inherit;text-decoration:none}.container{max-width:1200px;margin:0 auto;padding:28px 24px 80px}.grid{display:grid;gap:24px}.card{background:linear-gradient(180deg,#171b27d9,#0f1115f2);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 16px 40px #00000073}.badge{font-size:.75rem;text-transform:uppercase;letter-spacing:.18em;color:var(--muted)}.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:600;cursor:pointer}.btn.primary{background:#f1f3f7;color:#101317;border:none}.btn.ghost{background:transparent}.input,.textarea,.select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:.95rem}.textarea{min-height:140px;resize:vertical}.helper{color:var(--muted);font-size:.85rem}.divider{height:1px;background:var(--line);margin:16px 0}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding-bottom:18px}.nav .links{display:flex;gap:18px;color:var(--muted);font-size:.95rem}.hero{display:grid;gap:18px}.hero h1{font-size:clamp(2.5rem,3vw + 1.4rem,4rem);margin:0}.hero p{color:var(--muted);font-size:1.05rem;max-width:720px}.preview-box{background:#0b0d12;border-radius:16px;border:1px solid rgba(255,255,255,.05);min-height:360px;display:grid;place-items:center;position:relative}.preview-box canvas{width:100%!important;height:100%!important}.tag{font-size:.75rem;border:1px solid var(--line);padding:4px 10px;border-radius:999px;color:var(--muted)}.section-title{font-size:1.4rem;margin:0}.code-block{background:#0d0f16;border:1px solid var(--line);border-radius:12px;padding:14px;font-family:DM Mono,ui-monospace,monospace;font-size:.85rem;color:#d6dce8;overflow-x:auto}