@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Fredoka:wght@400;600;700&display=swap";:root{--primary-light:#e6f7eb;--primary:#4ade80;--primary-dark:#16a34a;--bg-color:#f0fdf4;--text-dark:#0f172a;--text-light:#475569;--accent:#fcd34d;--accent-secondary:#f472b6;--surface:#ffffffb3;--surface-hover:#ffffffe6;--shadow-sm:0 4px 6px -1px #0000000d, 0 2px 4px -2px #0000000d;--shadow-ln:0 10px 25px -5px #4ade8033, 0 8px 10px -6px #4ade801a}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-color);color:var(--text-dark);background-image:radial-gradient(at 40% 20%,#8aff7a4d 0,#0000 50%),radial-gradient(at 80% 0,#1fddff4d 0,#0000 50%),radial-gradient(at 0%,#ffdbde4d 0,#0000 50%);flex-direction:column;min-height:100vh;font-family:Outfit,sans-serif;display:flex}h1,h2,h3{color:var(--primary-dark);font-family:Fredoka,sans-serif}.glass-panel{background:var(--surface);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow-ln);border:1px solid #ffffff80;border-radius:24px;transition:transform .3s,background .3s}.glass-panel:hover{background:var(--surface-hover);transform:translateY(-2px)}.magic-btn{cursor:pointer;border:none;border-radius:9999px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-family:Fredoka,sans-serif;font-size:1.1rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 14px #4ade8063}.magic-btn.primary{background:linear-gradient(135deg, var(--primary) 0%, #22c55e 100%);color:#fff}.magic-btn.primary:hover{transform:translateY(-3px)scale(1.02);box-shadow:0 6px 20px #4ade8099}.magic-btn:active{transform:scale(.95)}.magic-input{width:100%;color:var(--text-dark);background:#ffffffe6;border:2px solid #bbf7d0;border-radius:16px;padding:14px 20px;font-family:Outfit,sans-serif;font-size:1rem;transition:all .3s}.magic-input:focus{border-color:var(--primary);background:#fff;outline:none;box-shadow:0 0 0 4px #4ade8033}.login-container{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-box{text-align:center;width:100%;max-width:400px;padding:40px;animation:.8s ease-out forwards floatIn}.login-logo{flex-direction:column;align-items:center;gap:16px;margin-bottom:8px;display:flex}.logo-icon{color:var(--primary);filter:drop-shadow(0 4px 6px #4ade8066);animation:4s ease-in-out infinite pulseRotate}.login-subtitle{color:var(--text-light);margin-bottom:32px}.login-form{flex-direction:column;gap:16px;display:flex}.error-text{color:#ef4444;background:#fee2e2;border-radius:8px;padding:8px;font-size:.9rem;animation:.4s ease-in-out shake}.dashboard{flex-direction:column;min-height:100vh;display:flex}.navbar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:50;background:#fff9;border-bottom:1px solid #fffc;justify-content:space-between;align-items:center;padding:16px 5%;display:flex;position:sticky;top:0}.navbar-brand{color:var(--primary-dark);align-items:center;gap:12px;font-family:Fredoka,sans-serif;font-size:1.5rem;display:flex}.logout-btn{border:2px solid var(--primary);color:var(--primary-dark);background:0 0}.logout-btn:hover{background:var(--primary-light)}.main-content{flex:1;grid-template-columns:350px 1fr;gap:32px;width:100%;max-width:1200px;margin:0 auto;padding:32px 5%;display:grid}@media (width<=868px){.main-content{grid-template-columns:1fr}}.controls-panel{flex-direction:column;gap:24px;display:flex}.control-group{flex-direction:column;gap:12px;display:flex}.control-label{color:var(--text-dark);font-family:Fredoka,sans-serif;font-size:1.1rem}.selector-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.selector-item{text-align:center;cursor:pointer;background:#fff;border:2px solid #0000;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:12px 8px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.selector-item.active{border-color:var(--primary);background:var(--primary-light);color:var(--primary-dark);transform:scale(1.05);box-shadow:0 4px 12px #4ade8033}.selector-item:hover:not(.active){background:#f8fafc;transform:translateY(-2px)}textarea.magic-input{resize:vertical;min-height:100px}.preview-panel{background:#fff6;border:2px dashed #bbf7d0;border-radius:32px;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:500px;transition:all .3s;display:flex}.preview-placeholder{color:var(--text-light);opacity:.6;flex-direction:column;align-items:center;gap:16px;display:flex}.comic-grid{gap:16px;width:100%;height:100%;padding:16px;display:grid}@keyframes floatIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseRotate{0%{transform:scale(1)rotate(0)}50%{transform:scale(1.1)rotate(5deg)}to{transform:scale(1)rotate(0)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}