:root{--bg-dark:#090d16;--bg-card:#0f172abf;--bg-editor:#0c1220;--border-card:#ffffff14;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-sky:#0ea5e9;--accent-blue:#38bdf8;--accent-violet:#8b5cf6;--accent-emerald:#10b981;--accent-amber:#f59e0b;--accent-rose:#f43f5e;--font-heading:"Plus Jakarta Sans", sans-serif;--font-body:"Inter", sans-serif;--font-mono:"JetBrains Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-primary);font-family:var(--font-body);background-image:radial-gradient(circle at 20% 20%,#0ea5e91f 0%,#0000 45%),radial-gradient(circle at 80% 30%,#8b5cf61a 0%,#0000 40%),radial-gradient(circle at 50% 90%,#10b9810f 0%,#0000 50%);background-attachment:fixed;min-height:100vh;line-height:1.5}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading)}.gradient-text{background:linear-gradient(135deg,#fff 0%,#cbd5e1 40%,#38bdf8 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-card);border-radius:16px}.code-editor{background:var(--bg-editor);color:#e2e8f0;width:100%;height:380px;font-family:var(--font-body);border:1px solid var(--border-card);resize:none;border-radius:12px;outline:none;padding:16px;font-size:.95rem;line-height:1.6;transition:border-color .2s,box-shadow .2s}.code-editor:focus{border-color:var(--accent-sky);box-shadow:0 0 16px #0ea5e940}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#0ea5e9 0%,#0284c7 100%);border:none;border-radius:10px;align-items:center;gap:8px;padding:10px 18px;font-size:.9rem;font-weight:600;transition:all .2s;display:inline-flex;box-shadow:0 4px 14px #0ea5e959}.btn-primary:hover{background:linear-gradient(135deg,#38bdf8 0%,#0ea5e9 100%);transform:translateY(-1px)}.btn-secondary{color:var(--text-primary);border:1px solid var(--border-card);cursor:pointer;background:#ffffff0d;border-radius:10px;align-items:center;gap:8px;padding:10px 18px;font-size:.9rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-secondary:hover{background:#ffffff1a;border-color:#0ea5e966}.badge-tab{cursor:pointer;border:1px solid #0000;border-radius:10px;padding:8px 16px;font-size:.9rem;font-weight:600;transition:all .2s}.badge-tab.active{color:#38bdf8;background:#0ea5e933;border-color:#0ea5e980}.badge-tab:not(.active){color:var(--text-secondary);background:#ffffff0a}.badge-tab:not(.active):hover{color:var(--text-primary);background:#ffffff14}.theme-obsidian{background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%);border:1px solid #ffffff1a}.theme-violet{background:linear-gradient(135deg,#4c1d95 0%,#2e1065 100%);border:1px solid #a78bfa4d}.theme-ocean{background:linear-gradient(135deg,#0369a1 0%,#0c4a6e 100%);border:1px solid #38bdf84d}.theme-sunset{background:linear-gradient(135deg,#991b1b 0%,#7c2d12 100%);border:1px solid #f871714d}