@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@300;400;500;600;700;800&family=Fira+Code:wght@400;500&display=swap";:root{--bg-primary:#0a0e17;--bg-secondary:#0f1524;--bg-tertiary:#172033;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--color-violet:#8b5cf6;--color-violet-glow:#8b5cf673;--color-teal:#14b8a6;--color-teal-glow:#14b8a666;--color-magenta:#db2777;--color-magenta-glow:#db277766;--glass-bg:#0f152499;--glass-border:#ffffff12;--glass-border-focus:#8b5cf680;--glass-shadow:0 8px 32px 0 #0006;--font-sans:"Outfit", "Inter", system-ui, -apple-system, sans-serif;--font-mono:"Fira Code", ui-monospace, monospace;--border-radius-sm:8px;--border-radius-md:14px;--border-radius-lg:24px;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1);--transition-fast:all .15s ease}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:var(--border-radius-sm);border:2px solid var(--bg-primary)}::-webkit-scrollbar-thumb:hover{background:var(--color-violet)}h1,h2,h3,h4,h5,h6{font-family:var(--font-sans);letter-spacing:-.025em;color:var(--text-primary);font-weight:600}a{color:var(--color-teal);transition:var(--transition-fast);text-decoration:none}a:hover{color:var(--color-violet)}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:var(--border-radius-md);transition:var(--transition-smooth)}.glass-panel:hover{border-color:#ffffff1f}.glow-violet{box-shadow:0 0 20px 0 var(--color-violet-glow)}.glow-teal{box-shadow:0 0 20px 0 var(--color-teal-glow)}.glow-magenta{box-shadow:0 0 20px 0 var(--color-magenta-glow)}@keyframes pulseGlow{0%,to{box-shadow:0 0 15px 0 var(--color-violet-glow)}50%{box-shadow:0 0 25px 5px var(--color-violet-glow)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes slideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes rotateCircle{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-float{animation:5s ease-in-out infinite float}.animate-slide-in{animation:.4s cubic-bezier(.16,1,.3,1) forwards slideIn}#root{width:100vw;min-height:100vh;display:flex;overflow:hidden}.form-input{border:1px solid var(--glass-border);border-radius:var(--border-radius-sm);width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:var(--transition-smooth);background:#ffffff08;outline:none;padding:12px 16px;font-size:.95rem}.form-input:focus{border-color:var(--color-violet);background:#ffffff0f;box-shadow:0 0 12px #8b5cf633}.btn{font-family:var(--font-sans);border-radius:var(--border-radius-sm);cursor:pointer;transition:var(--transition-smooth);-webkit-user-select:none;user-select:none;border:1px solid #0000;outline:none;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:.95rem;font-weight:500;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--color-violet) 0%, #6d28d9 100%);color:#fff;box-shadow:0 4px 15px #8b5cf64d}.btn-primary:hover{background:linear-gradient(135deg,#9b6bf7 0%,#7c3aed 100%);transform:translateY(-1px);box-shadow:0 6px 20px #8b5cf680}.btn-secondary{border:1px solid var(--glass-border);color:var(--text-primary);background:#ffffff0d}.btn-secondary:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-1px)}.btn-accent{background:linear-gradient(135deg, var(--color-teal) 0%, #0f766e 100%);color:#fff;box-shadow:0 4px 15px #14b8a640}.btn-accent:hover{background:linear-gradient(135deg,#2dd4bf 0%,#14b8a6 100%);transform:translateY(-1px);box-shadow:0 6px 20px #14b8a666}.btn:active{transform:translateY(1px)!important}.btn-danger{color:#fff;background:linear-gradient(135deg,#ef4444 0%,#b91c1c 100%)}.btn-danger:hover{background:linear-gradient(135deg,#f87171 0%,#dc2626 100%);box-shadow:0 4px 15px #ef44444d}.code-block-wrapper{border-radius:var(--border-radius-sm);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);margin:16px 0;overflow:hidden}.code-header{font-family:var(--font-sans);color:var(--text-secondary);background:#111827;border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:8px 16px;font-size:.8rem;display:flex}.code-copy-btn{color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;font-size:.8rem}.code-copy-btn:hover{color:var(--text-primary)}.code-content{font-family:var(--font-mono);color:#e5e7eb;background:#0b0f19;margin:0;padding:16px;font-size:.875rem;line-height:1.6;overflow-x:auto}.lyrics-container{border-left:3px solid var(--color-magenta);border-radius:0 var(--border-radius-md) var(--border-radius-md) 0;letter-spacing:.02em;white-space:pre-line;color:#fce7f3;background:#db277708;margin:16px 0;padding:24px;font-family:Outfit,Georgia,serif;font-size:1.05rem;line-height:1.8;box-shadow:inset 0 0 10px #0000001a}.credits-dial{justify-content:center;align-items:center;width:140px;height:140px;margin:0 auto;display:flex;position:relative}.credits-svg{width:100%;height:100%;transform:rotate(-90deg)}.credits-circle-bg{fill:none;stroke:#ffffff0d;stroke-width:8px}.credits-circle-fill{fill:none;stroke:url(#radialGlow);stroke-width:8px;stroke-dasharray:377;stroke-linecap:round;transition:stroke-dashoffset .8s cubic-bezier(.4,0,.2,1)}.credits-label{text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute}.credits-amount{color:var(--text-primary);font-size:1.5rem;font-weight:700;line-height:1.1}.credits-limit{color:var(--text-muted);margin-top:2px;font-size:.75rem}.markdown-body{color:#e5e7eb;font-size:.975rem;line-height:1.7}.markdown-body p{margin-bottom:12px}.markdown-body h1,.markdown-body h2,.markdown-body h3{margin-top:20px;margin-bottom:10px;font-weight:600}.markdown-body h2{border-bottom:1px solid #ffffff0d;padding-bottom:4px;font-size:1.3rem}.markdown-body ul,.markdown-body ol{margin-bottom:12px;margin-left:24px}.markdown-body li{margin-bottom:4px}.markdown-body blockquote{border-left:4px solid var(--color-teal);color:var(--text-secondary);margin:16px 0;padding-left:16px;font-style:italic}