:root{--primary:#2563eb;--primary-hover:#1d4ed8;--bg:#f8fafc;--card-bg:#fff;--sidebar-bg:#f1f5f9;--border:#e2e8f0;--text:#1e293b;--text-muted:#64748b;--error:#ef4444;--warning:#f59e0b;--code-bg:#f1f5f9}[data-theme=dark]{--primary:#60a5fa;--primary-hover:#93c5fd;--bg:#0f172a;--card-bg:#1e293b;--sidebar-bg:#0b0e14;--border:#334155;--text:#f1f5f9;--text-muted:#94a3b8;--error:#f87171;--warning:#fbbf24;--code-bg:#020617}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg);color:var(--text);font-family:Inter,-apple-system,sans-serif;line-height:1.6;transition:background-color .3s,color .3s}.app-layout{height:100vh;display:flex;overflow:hidden}.sidebar{background:var(--sidebar-bg);border-right:1px solid var(--border);flex-direction:column;width:260px;padding:20px;transition:background-color .3s;display:flex}.main-content{flex:1;padding:40px;overflow-y:auto}.glass{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 6px -1px #0000001a}.card{padding:24px}.gradient-text{background:linear-gradient(90deg, var(--primary), var(--primary-hover));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.btn{cursor:pointer;border:none;border-radius:6px;align-items:center;gap:8px;padding:10px 20px;font-size:.9rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}[data-theme=dark] .btn-primary{color:#0f172a}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px)}.btn-outline{border:1px solid var(--border);color:var(--text);background:0 0}.btn-outline:hover{background:#0000000d}[data-theme=dark] .btn-outline:hover{background:#ffffff0d}.input-group{margin-bottom:20px}.input-group label{color:var(--text-muted);margin-bottom:8px;font-size:.85rem;display:block}.input-group input,.input-group select{background:var(--card-bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:6px;outline:none;padding:10px 14px}.input-group input:focus{border-color:var(--primary);ring:2px solid var(--primary)}.nav-item{color:var(--text-muted);cursor:pointer;border-radius:8px;align-items:center;gap:12px;margin-bottom:4px;padding:12px;text-decoration:none;transition:all .2s;display:flex}.nav-item:hover,.nav-item.active{color:var(--primary);background:#2563eb1a}.badge{text-transform:uppercase;border-radius:4px;padding:2px 8px;font-size:.7rem;font-weight:700}.badge-pro{background:var(--primary);color:#fff}[data-theme=dark] .badge-pro{color:#0f172a}.badge-free{background:var(--border);color:var(--text-muted)}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-in{animation:.5s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.monaco-editor-container{border:1px solid var(--border);border-radius:8px;overflow:hidden}