:root{--bg-dark:#1a1a2e;--bg-darker:#0f0f1e;--bg-card:#16213e;--bg-card-hover:#1c2a4a;--bg-surface:#202848;--accent-orange:#ff6b35;--accent-orange-glow:#ff6b354d;--accent-purple:#7b2ff7;--accent-purple-glow:#7b2ff74d;--accent-teal:#00d2ff;--accent-teal-glow:#00d2ff33;--accent-red:#ff2e63;--accent-red-glow:#ff2e634d;--accent-green:#08d9a0;--accent-green-glow:#08d9a04d;--accent-yellow:#ffd166;--accent-pink:#f72585;--text-primary:#f0f0f0;--text-secondary:#c4c9d9;--text-muted:#8892b0;--font-heading:"Baloo 2", cursive, system-ui;--font-body:"Nunito", sans-serif, system-ui;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-card:0 4px 24px #0000004d;--shadow-glow-orange:0 0 30px var(--accent-orange-glow);--shadow-glow-purple:0 0 30px var(--accent-purple-glow);--shadow-glow-teal:0 0 20px var(--accent-teal-glow);--shadow-glow-red:0 0 30px var(--accent-red-glow);--transition-fast:.15s ease;--transition-normal:.3s ease;--transition-slow:.5s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px}body{font-family:var(--font-body);background:var(--bg-dark);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;min-height:100dvh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:1.2}button{font-family:var(--font-body);cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:none;outline:none;font-weight:600}input{font-family:var(--font-body);border:none;outline:none}.app-container{max-width:480px;padding:var(--space-md);padding-bottom:max(28px, calc(var(--space-xl) + env(safe-area-inset-bottom,0px)));min-height:100dvh;flex-direction:column;min-height:-webkit-fill-available;margin:0 auto;display:flex}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-lg);transition:all var(--transition-normal);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;padding:14px 28px;font-size:1.05rem;font-weight:700;display:inline-flex;position:relative;overflow:hidden}.btn:active{transform:scale(.96)}.btn-primary{background:linear-gradient(135deg, var(--accent-orange), #ff8a5c);color:#fff;box-shadow:var(--shadow-glow-orange)}.btn-primary:hover{box-shadow:0 0 40px var(--accent-orange-glow), 0 4px 16px #0000004d;transform:translateY(-2px)}.btn-secondary{background:linear-gradient(135deg, var(--accent-purple), #9a5cf7);color:#fff;box-shadow:var(--shadow-glow-purple)}.btn-secondary:hover{box-shadow:0 0 40px var(--accent-purple-glow), 0 4px 16px #0000004d;transform:translateY(-2px)}.btn-danger{background:linear-gradient(135deg, var(--accent-red), #ff5c8a);color:#fff;box-shadow:var(--shadow-glow-red)}.btn-danger:hover{box-shadow:0 0 40px var(--accent-red-glow), 0 4px 16px #0000004d;transform:translateY(-2px)}.btn-ghost{color:var(--text-secondary);background:0 0;border:2px solid #ffffff1a}.btn-ghost:hover{background:#ffffff0d;border-color:#ffffff40}.btn-small{border-radius:var(--radius-md);padding:8px 18px;font-size:.9rem}.btn-full{width:100%}.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none!important;transform:none!important}.card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--shadow-card);border:1px solid #ffffff0d}.input{background:var(--bg-surface);border-radius:var(--radius-md);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast);border:2px solid #ffffff14;padding:14px 18px;font-size:1rem}.input:focus{border-color:var(--accent-teal);box-shadow:0 0 0 3px var(--accent-teal-glow)}.input::placeholder{color:var(--text-muted)}.screen{padding-bottom:max(16px, env(safe-area-inset-bottom,0px));flex-direction:column;flex:1;animation:.4s forwards screenIn;display:flex}@keyframes screenIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.confetti-container{pointer-events:none;z-index:1000;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.confetti-piece{width:10px;height:10px;animation:confettiFall var(--fall-duration,3s) linear forwards;animation-delay:var(--delay,0s);position:absolute;top:-10px}@keyframes confettiFall{0%{opacity:1;transform:translateY(0)rotate(0)scale(1)}to{opacity:0;transform:translateY(100vh)rotate(720deg)scale(.5)}}.bg-particles{pointer-events:none;z-index:0;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.bg-particles span{background:#ffffff0f;border-radius:50%;width:4px;height:4px;animation:linear infinite float;position:absolute}@keyframes float{0%{opacity:0;transform:translateY(100vh)scale(0)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-10vh)scale(1)}}.avatar{width:42px;height:42px;font-family:var(--font-heading);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;font-weight:700;display:flex}.avatar-0{background:linear-gradient(135deg,#ff6b35,#ff8a5c)}.avatar-1{background:linear-gradient(135deg,#7b2ff7,#9a5cf7)}.avatar-2{background:linear-gradient(135deg,#00d2ff,#00a5cc)}.avatar-3{background:linear-gradient(135deg,#ff2e63,#ff5c8a)}.avatar-4{background:linear-gradient(135deg,#08d9a0,#06b380)}.avatar-5{background:linear-gradient(135deg,#ffd166,#ffba33)}.avatar-6{background:linear-gradient(135deg,#f72585,#d91a72)}.avatar-7{background:linear-gradient(135deg,#4cc9f0,#3a9fc0)}.avatar-8{background:linear-gradient(135deg,#7209b7,#5a0792)}.avatar-9{background:linear-gradient(135deg,#06d6a0,#04a87e)}.avatar-10{background:linear-gradient(135deg,#ef476f,#c03a59)}.avatar-11{background:linear-gradient(135deg,#fca311,#d98b0e)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}@media (width<=480px){.app-container{padding:var(--space-sm) var(--space-md)}}@media (width>=768px){.app-container{padding:var(--space-xl)}}