:root{--bg-dark:#0b0f19;--bg-card:#111827bf;--bg-editor:#0d111d;--border-card:#ffffff14;--border-focus:#8b5cf680;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-violet:#8b5cf6;--accent-sky:#0ea5e9;--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 15% 15%,#8b5cf61a 0%,#0000 45%),radial-gradient(circle at 85% 25%,#0ea5e914 0%,#0000 40%),radial-gradient(circle at 50% 85%,#10b9810d 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 50%,#8b5cf6 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:480px;font-family:var(--font-mono);border:1px solid var(--border-card);resize:none;border-radius:12px;outline:none;padding:16px;font-size:.9rem;line-height:1.6;transition:border-color .2s,box-shadow .2s}.code-editor:focus{border-color:var(--accent-violet);box-shadow:0 0 16px #8b5cf640}.input-field{border:1px solid var(--border-card);color:var(--text-primary);font-family:var(--font-body);background:#0f172acc;border-radius:8px;outline:none;padding:8px 12px;font-size:.9rem;transition:border-color .2s}.input-field:focus{border-color:var(--accent-violet)}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 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 #8b5cf659}.btn-primary:hover{background:linear-gradient(135deg,#a78bfa 0%,#8b5cf6 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:#8b5cf666}.badge-tab{cursor:pointer;border:1px solid #0000;border-radius:8px;padding:6px 14px;font-size:.85rem;font-weight:600;transition:all .2s}.badge-tab.active{color:#a78bfa;background:#8b5cf633;border-color:#8b5cf680}.badge-tab:not(.active){color:var(--text-secondary);background:#ffffff0a}.badge-tab:not(.active):hover{color:var(--text-primary);background:#ffffff14}