@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap";:root{--bg-color:#0c0814;--surface-color:#1e14308c;--surface-hover:#2d1e48b3;--surface-border:#a78bfa26;--primary-color:#a78bfa;--primary-light:#c4b5fd;--primary-dark:#7c3aed;--text-primary:#f8fafc;--text-secondary:#a79fbb;--accent-color:#34d399;--accent-light:#6ee7b7;--danger-color:#f87171;--warning-color:#fbbf24;--glow-color:#a78bfa66}[data-theme=ocean]{--bg-color:#06111e;--surface-color:#0f233c8c;--surface-hover:#163255b3;--surface-border:#38bdf833;--primary-color:#38bdf8;--primary-light:#7dd3fc;--primary-dark:#0284c7;--accent-color:#818cf8;--accent-light:#a5b4fc;--glow-color:#38bdf866}[data-theme=forest]{--bg-color:#06140e;--surface-color:#122a1e8c;--surface-hover:#1a3c2ab3;--surface-border:#34d39933;--primary-color:#34d399;--primary-light:#6ee7b7;--primary-dark:#059669;--accent-color:#fbbf24;--accent-light:#fde047;--glow-color:#34d39966}[data-theme=sunset]{--bg-color:#1a0b16;--surface-color:#30142a8c;--surface-hover:#461c3cb3;--surface-border:#f472b633;--primary-color:#f472b6;--primary-light:#fbcfe8;--primary-dark:#db2777;--accent-color:#fb923c;--accent-light:#ffedd5;--glow-color:#f472b666}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Outfit,Plus Jakarta Sans,sans-serif;line-height:1.6;transition:background-color .5s;overflow-x:hidden}#root{background-color:var(--bg-color);max-width:520px;height:100dvh;box-shadow:0 0 50px #000000b3, 0 0 20px var(--glow-color);flex-direction:column;margin:0 auto;transition:background-color .5s;display:flex;position:relative;overflow:hidden}.top-bar{-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--surface-border);z-index:90;background:#0c081499;justify-content:space-between;align-items:center;padding:14px 20px;display:flex;position:absolute;top:0;left:0;right:0}.main-content{scroll-behavior:smooth;z-index:10;flex:1;padding:76px 20px 84px;overflow-y:auto}.main-content::-webkit-scrollbar{width:5px}.main-content::-webkit-scrollbar-track{background:0 0}.main-content::-webkit-scrollbar-thumb{background:var(--surface-border);border-radius:10px}.glass-panel{background:var(--surface-color);-webkit-backdrop-filter:blur(20px);border:1px solid var(--surface-border);border-radius:24px;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s,border-color .3s;box-shadow:0 10px 30px #00000040,inset 0 1px 1px #ffffff1a}.glass-panel:hover{box-shadow:0 12px 35px #00000059, 0 0 15px var(--glow-color);border-color:#ffffff40}.glass-button{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--surface-border);color:var(--text-primary);cursor:pointer;background:#ffffff12;border-radius:100px;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-family:inherit;font-size:.95rem;font-weight:500;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex}.glass-button:hover{box-shadow:0 6px 20px #0003, 0 0 12px var(--glow-color);background:#ffffff26;transform:translateY(-2px)}.glass-button:active{transform:translateY(0)scale(.97)}.glass-button.active{background:linear-gradient(135deg, var(--primary-color), var(--primary-dark));color:#fff;box-shadow:0 6px 20px var(--glow-color);border-color:#fff6}.glass-input{border:1px solid var(--surface-border);width:100%;color:var(--text-primary);-webkit-user-select:text;user-select:text;background:#0000004d;border-radius:16px;padding:14px 18px;font-family:inherit;font-size:.95rem;transition:all .3s}.glass-input:focus{border-color:var(--primary-color);box-shadow:0 0 15px var(--glow-color);background:#00000073;outline:none}h1{background:linear-gradient(135deg, #fff 30%, var(--primary-light) 100%);-webkit-text-fill-color:transparent;letter-spacing:-.02em;-webkit-background-clip:text;margin-bottom:6px;font-size:1.8rem;font-weight:700}h2{margin-bottom:12px;font-size:1.35rem;font-weight:600}p{color:var(--text-secondary);font-size:.95rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.45s cubic-bezier(.16,1,.3,1) forwards fadeIn}@keyframes floatSlow{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-8px)rotate(2deg)}}.animate-float{animation:5s ease-in-out infinite floatSlow}@keyframes pulseGlow{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.7;transform:scale(1.06)}}.animate-pulse-glow{animation:3s ease-in-out infinite pulseGlow}.bottom-nav{-webkit-backdrop-filter:blur(24px);border-top:1px solid var(--surface-border);height:72px;padding-bottom:env(safe-area-inset-bottom,0px);z-index:100;background:#0c0814d9;justify-content:space-around;align-items:center;display:flex;position:absolute;bottom:0;left:0;right:0}.nav-item{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:6px 12px;font-size:.75rem;font-weight:500;transition:color .3s,transform .2s;display:flex}.nav-item.active{color:var(--primary-light);transform:translateY(-2px)}.nav-item svg{transition:transform .3s}.nav-item.active svg{filter:drop-shadow(0 0 10px var(--primary-color));transform:scale(1.15)}.bubble{background:radial-gradient(circle at 30% 30%, #ffffff4d, var(--surface-hover));border:1.5px solid var(--surface-border);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:transform .15s,background-color .2s;display:flex;box-shadow:inset 2px 2px 6px #ffffff40,0 4px 10px #0003}.bubble:active{transform:scale(.88)}.bubble.popped{pointer-events:none;box-shadow:none;background:#ffffff0d;border-color:#0000;animation:.25s cubic-bezier(.175,.885,.32,1.275) forwards popOut}@keyframes popOut{0%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}to{opacity:0;transform:scale(0)}}.flex{display:flex}.flex-col{flex-direction:column}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.gap-8{gap:32px}.p-3{padding:12px}.p-4{padding:16px}.p-5{padding:20px}.p-6{padding:24px}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mb-6{margin-bottom:24px}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.text-center{text-align:center}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.w-full{width:100%}.h-full{height:100%}.relative{position:relative}.absolute{position:absolute}