body{color:#1a1a1a;margin:0;padding:0}*{-webkit-tap-highlight-color:transparent}:root{--green-900:#1a3a1a;--green-800:#2d5a2d;--green-700:#3d7a3d;--green-600:#4a9a4a;--green-500:#58b858;--green-400:#6dcc6d;--green-300:#8adf8a;--green-200:#a8eea8;--green-100:#c8f5c8;--green-50:#e8fae8;--primary:#58b858;--primary-dark:#2d5a2d;--primary-light:#c8f5c8;--primary-gradient:linear-gradient(135deg,#2d5a2d,#4a9a4a 25%,#58b858 50%,#6dcc6d 75%,#8adf8a);--primary-gradient-strong:linear-gradient(135deg,#1a3a1a,#3d7a3d 30%,#4a9a4a 60%,#58b858);--accent-warm:#a8c050;--accent-calm:#4a9a4a;--accent-hope:#6dcc6d;--accent-sunset:#c0d860;--accent-banana:#e0f0a0;--sos-red:#e8875f;--sos-orange:#f5b07a;--sos-gradient:linear-gradient(135deg,#f08a5f,#f5ad7a);--bg-page:#0000;--bg-card:#fff9;--bg-card-hover:#ffffffb8;--bg-muted:#d8f0d0f2;--bg-overlay:#00000073;--bg-glass:#f4faf0f5;--hero-glass:linear-gradient(160deg,#ffffffb3,#eef8e8b8 30%,#ffffffad 50%,#f2faeeb3 70%,#ffffffb8);--text-primary:#10281b;--text-secondary:#1c3a22;--text-muted:#32543a;--text-light:#fff;--text-link:#2e6b35;--border-light:#b8e0b8;--border-card:#c8e8c8;--diary-warm:#c08020;--radius-xs:6px;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--radius-full:50%;--shadow-xs:0 1px 3px #1a3a1a0d;--shadow-sm:0 3px 14px #10341c0a,0 1px 3px #00000005,inset 0 1px 0 #fff6;--shadow-md:0 4px 16px #1a3a1a1a;--shadow-lg:0 6px 28px #10341c0f,0 2px 8px #00000008,inset 0 1px 0 #ffffff59;--shadow-xl:0 8px 28px #10341c14,0 2px 6px #00000008,0 0 0 1px #69b4781a,inset 0 1px 0 #ffffff85;--shadow-glow:0 0 20px #58b85859;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:24px;--space-2xl:32px;--space-3xl:48px;--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;--fs-nano:8px;--fs-micro:9px;--fs-caption:10px;--fs-label:11px;--fs-body-sm:12px;--fs-body:13px;--fs-body-lg:14px;--fs-form:15px;--fs-title:16px;--fs-brand:17px;--fs-title-lg:18px;--fs-hero:22px;--fs-display:28px;--font-size-xs:var(--fs-label);--font-size-sm:var(--fs-body);--font-size-md:var(--fs-form);--font-size-lg:var(--fs-title-lg);--font-size-xl:var(--fs-hero);--font-size-2xl:var(--fs-display);--transition-fast:0.15s ease;--transition-normal:0.25s ease;--transition-slow:0.4s cubic-bezier(0.4,0,0.2,1);--transition-spring:0.5s cubic-bezier(0.34,1.56,0.64,1);--nav-height:64px;--header-height:56px;--bottom-nav-height:64px;--radius-pill:9999px;--ease-spring:cubic-bezier(0.34,1.56,0.64,1);--ease-smooth:cubic-bezier(0.4,0,0.2,1);--ease-out:cubic-bezier(0,0,0.2,1);--blur-subtle:6px;--blur-light:8px;--blur-card:12px;--blur-normal:14px;--blur-heavy:24px;--blur-nav:28px;--z-bg:0;--z-base:1;--z-local:2;--z-page-header:50;--z-header:100;--z-shortcuts:190;--z-bottom-nav:200;--z-sos:300;--z-sos-drag:310;--z-reminder:999;--z-modal:1000;--z-modal-top:1200;--z-game:9999;--z-toast:9999}[data-theme=dark]{--primary:#4a9a4a;--primary-dark:#8adf8a;--primary-light:#1a3a1a;--primary-gradient:linear-gradient(135deg,#1a3a1a,#2d5a2d 40%,#3d7a3d 70%,#4a9a4a);--primary-gradient-strong:linear-gradient(135deg,#0e280e,#1a3a1a 40%,#2d5a2d 80%,#3d7a3d);--accent-warm:#8aaa40;--accent-calm:#4a9a4a;--accent-hope:#3d7a3d;--accent-sunset:#9ab840;--accent-banana:#5a6a28;--sos-red:#d07a58;--sos-orange:#d89a68;--sos-gradient:linear-gradient(135deg,#c96a4a,#d98a5c);--bg-page:#121a12;--bg-card:#1e261ec7;--bg-card-hover:#242e24d1;--bg-muted:#162216f2;--bg-overlay:#000000bf;--bg-glass:#121a12fa;--hero-glass:linear-gradient(160deg,#1e261edb,#222e22d6 30%,#1e261ed1 50%,#243024db 70%,#1e261ed6);--text-primary:#fff;--text-secondary:#cdddcd;--text-muted:#a9c6a9;--text-light:#fff;--text-link:#7fe07f;--border-light:#1e321e;--border-card:#223022;--diary-warm:#e8b050;--shadow-xs:0 1px 3px #0006;--shadow-sm:0 2px 8px #00000080;--shadow-md:0 4px 16px #0009;--shadow-lg:0 8px 28px #000000b3;--shadow-glow:0 0 20px #58b8584d}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px;overscroll-behavior:none;overscroll-behavior-x:none;overscroll-behavior-y:contain;scroll-behavior:smooth;touch-action:pan-y;-webkit-user-select:none;user-select:none}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch;color:#10281b;color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-family:var(--font-sans);height:100%;line-height:1.6;min-height:100vh;overflow-x:hidden;width:100%}#root,body{background:#0000;overscroll-behavior:none;position:fixed}#root{bottom:0;height:100vh;height:100dvh;left:0;overflow:hidden;right:0;top:0;z-index:1;z-index:var(--z-base)}.fs-nano{font-size:8px;font-size:var(--fs-nano)}.fs-micro,.fs-nano{letter-spacing:.2px;line-height:1.4}.fs-micro{font-size:9px;font-size:var(--fs-micro)}.fs-caption{font-size:10px;font-size:var(--fs-caption);letter-spacing:.3px;line-height:1.45}.fs-label{font-size:11px;font-size:var(--fs-label);letter-spacing:.4px;line-height:1.5}.fs-body-sm{font-size:12px;font-size:var(--fs-body-sm);letter-spacing:0;line-height:1.6}.fs-body{font-size:13px;font-size:var(--fs-body);letter-spacing:0;line-height:1.65}.fs-body-lg{font-size:14px;font-size:var(--fs-body-lg);letter-spacing:0;line-height:1.6}.fs-form{font-size:15px;font-size:var(--fs-form);letter-spacing:0;line-height:1.55}.fs-title{font-size:16px;font-size:var(--fs-title);letter-spacing:.2px;line-height:1.4}.fs-brand{font-size:17px;font-size:var(--fs-brand);letter-spacing:3px;line-height:1.2}.fs-title-lg{font-size:18px;font-size:var(--fs-title-lg);letter-spacing:.5px;line-height:1.35}.fs-hero{font-size:22px;font-size:var(--fs-hero);letter-spacing:1px;line-height:1.25}.fs-display{font-size:28px;font-size:var(--fs-display);letter-spacing:1.5px;line-height:1.2}.fw-400{font-weight:400}.fw-500{font-weight:500}.fw-600{font-weight:600}.fw-700{font-weight:700}.fw-800{font-weight:800}#root.bg-loading,body.bg-loading{background-color:#1a3a1a!important;transition:background-color .3s ease}#root.bg-loaded,body.bg-loaded{transition:background .6s ease}.app-container{box-shadow:0 6px 28px #10341c0f,0 2px 8px #00000008,inset 0 1px 0 #ffffff59;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;height:100%;margin:0 auto;max-width:480px;overflow:hidden;position:relative}.app-header{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#1a3a1a,#3d7a3d 30%,#4a9a4a 60%,#58b858);background:var(--primary-gradient-strong);border-bottom:2px solid #fffc;box-shadow:0 2px 16px #2d5a2d66;display:flex;justify-content:space-between;padding:8px 16px;padding:8px var(--space-lg) 8px;position:sticky;top:0;z-index:100;z-index:var(--z-header)}.app-header h1{color:#fff;color:var(--text-light);font-size:17px;font-weight:700;letter-spacing:3px;text-shadow:0 2px 6px #00000026}.app-header .slogan{color:#f0fbebf2;font-size:11px;font-weight:500;letter-spacing:1px}.app-header-icon{animation:headerFloat 3s ease-in-out infinite;filter:drop-shadow(0 2px 6px rgba(0,0,0,.15));font-size:26px}@keyframes headerFloat{0%,to{transform:translateY(0) rotate(0deg) scale(1)}25%{transform:translateY(-5px) rotate(3deg) scale(1.08)}50%{transform:translateY(0) rotate(0deg) scale(1)}75%{transform:translateY(3px) rotate(-3deg) scale(1.05)}}.page-layout{display:flex;flex:1 1;flex-direction:column;min-height:0;overflow:hidden;padding-bottom:64px;padding-bottom:var(--bottom-nav-height)}.app-container,.home-page{background:#0000}.home-page{background-attachment:local}.page-header{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:linear-gradient(135deg,#d8f0d0f5,#e8f5e0f5 50%,#f4faf0f5);border-bottom:2px solid #58b85859;display:flex;gap:12px;gap:var(--space-md);padding:12px 24px;padding:var(--space-md) var(--space-xl);position:sticky;top:0;z-index:50;z-index:var(--z-page-header)}.page-header .back-btn{align-items:center;background:linear-gradient(135deg,#4a9a4a,#2d5a2d);border:none;border-radius:50%;border-radius:var(--radius-full);box-shadow:0 2px 8px #2d5a2d59;color:#fff;cursor:pointer;display:flex;font-size:18px;height:36px;justify-content:center;overflow:hidden;position:relative;transition:all .25s ease;transition:all var(--transition-normal);width:36px}.page-header .back-btn:hover{background:linear-gradient(135deg,#58b858,#4a9a4a);box-shadow:0 4px 14px #2d5a2d80;transform:translateX(-2px)}.page-header .back-btn:active{background:linear-gradient(135deg,#2d5a2d,#1a3a1a);transform:scale(.9) translateX(-2px)}.back-arrow{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.back-btn:hover .back-arrow{transform:translateX(-3px)}.page-header h2{color:#10281b;color:var(--text-primary);font-size:18px;font-size:var(--font-size-lg);font-weight:600}.page-body{-webkit-overflow-scrolling:touch;backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);background:linear-gradient(180deg,#fffffff5,#fcfaf8eb 50%,#f8fcf5f5);background-attachment:local;box-shadow:inset 0 8px 30px #0000000a;flex:1 1;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:16px;padding:var(--space-lg);transform:translateZ(0);-webkit-transform:translateZ(0)}[data-theme=dark] .page-body{background:linear-gradient(180deg,#182218e0,#141e14d1 50%,#162016e0)}[data-theme=dark] .page-header{background:linear-gradient(135deg,#1e281ef0,#1a241af0 50%,#161e16f0);border-bottom-color:#58b85826}[data-theme=dark] .page-header h2{color:#d8e8d0}[data-theme=dark] .page-header .back-btn{box-shadow:0 2px 8px #00000059}[data-theme=dark] .bottom-nav{background:linear-gradient(180deg,#161e16cc,#121a12db);border-top-color:#ffffff1f;box-shadow:0 -4px 24px #0000004d,0 -1px 0 #ffffff14,inset 0 1px 0 #ffffff0f}[data-theme=dark] .nav-item{color:#7a8a72}[data-theme=dark] .nav-item.active{color:#8adf8a;color:var(--green-300)}[data-theme=dark] .sos-float-btn{box-shadow:0 4px 24px #f08a5f4d}@keyframes sosPulseDark{0%,to{box-shadow:0 4px 24px #f08a5f4d}50%{box-shadow:0 4px 32px #f08a5f73}}[data-theme=dark] .sos-float-btn{animation:sosPulseDark 3s ease-in-out infinite}.bottom-nav{backdrop-filter:blur(28px) saturate(1.6);-webkit-backdrop-filter:blur(28px) saturate(1.6);background:linear-gradient(180deg,#ffffffc2,#f8fcf5d1 50%,#f0f8ebe0);border-top:1px solid #ffffffb3;bottom:0;box-shadow:0 -4px 24px #1a3a1a1a,0 -1px 0 #fff9,inset 0 1px 0 #fff6;height:64px;height:var(--bottom-nav-height);justify-content:space-around;left:50%;max-width:480px;padding-bottom:env(safe-area-inset-bottom);position:fixed;transform:translateX(-50%);width:100%;z-index:200;z-index:var(--z-bottom-nav)}.bottom-nav,.nav-item{align-items:center;display:flex}.nav-item{-webkit-tap-highlight-color:transparent;background:#0000;border:none;color:#32543a;color:var(--text-muted);cursor:pointer;flex-direction:column;gap:2px;padding:4px 12px;padding:var(--space-xs) var(--space-md);position:relative;transition:all .25s ease;transition:all var(--transition-normal)}.nav-item .nav-icon{font-size:22px;transition:transform .5s cubic-bezier(.34,1.56,.64,1);transition:transform var(--transition-spring)}.nav-item .nav-label{font-size:11px;font-size:var(--font-size-xs);font-weight:500}.nav-item.active{color:#3d7a3d;color:var(--green-700);font-weight:700}.nav-item.active .nav-icon{transform:translateY(-2px) scale(1.15)}.nav-item.active:before{background:linear-gradient(90deg,#4a9a4a,#8adf8a);background:linear-gradient(90deg,var(--green-600),var(--green-300));border-radius:0 0 4px 4px;box-shadow:0 0 12px #4a9a4a80;content:"";height:4px;left:50%;position:absolute;top:-1px;transform:translateX(-50%);width:32px}.nav-item:after{background:#58b85840;border-radius:12px;content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .3s ease}.nav-item:active:after{animation:navRipple .4s ease-out;opacity:.6}@keyframes navRipple{0%{opacity:.6;transform:scale(.8)}to{opacity:0;transform:scale(1.5)}}.nav-dot{animation:navDotPop .3s cubic-bezier(.34,1.56,.64,1) both;background:#4a9a4a;border-radius:50%;bottom:-4px;box-shadow:0 0 10px #4a9a4acc;height:6px;left:50%;position:absolute;transform:translateX(-50%);width:6px}@keyframes navDotPop{0%{transform:translateX(-50%) scale(0)}to{transform:translateX(-50%) scale(1)}}.shortcuts-panel{animation:slideUpBounce .35s cubic-bezier(.34,1.56,.64,1);backdrop-filter:blur(28px) saturate(1.6);-webkit-backdrop-filter:blur(28px) saturate(1.6);background:linear-gradient(180deg,#fffffff5,#f8fcf5eb);border-radius:20px 20px 0 0;bottom:64px;bottom:var(--bottom-nav-height);box-shadow:0 -4px 24px #1a3a1a26,0 -1px 0 #fff9;left:50%;max-height:60vh;max-width:480px;overflow-y:auto;padding-bottom:env(safe-area-inset-bottom);position:fixed;transform:translateX(-50%);width:100%;z-index:190;z-index:var(--z-shortcuts)}.shortcuts-header{align-items:center;border-bottom:1px solid #0000000f;display:flex;justify-content:space-between;padding:16px 20px 12px}.shortcuts-title{color:#1a2e1a;font-size:15px;font-weight:700;letter-spacing:.5px}.shortcuts-close{align-items:center;background:#0000000f;border:none;border-radius:8px;color:#5a7a5a;cursor:pointer;display:flex;height:28px;justify-content:center;transition:all .2s ease;width:28px}.shortcuts-close:hover{background:#0000001a;color:#3a5a3a}.shortcuts-grid{grid-gap:8px;display:grid;gap:8px;grid-template-columns:repeat(4,1fr);padding:16px}.shortcut-item{align-items:center;background:#0000;border:none;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:6px;padding:12px 4px;transition:all .25s cubic-bezier(.34,1.56,.64,1)}.shortcut-item:hover{background:#4a9a4a14;transform:translateY(-2px)}.shortcut-item:active{transform:scale(.95)}.shortcut-icon{align-items:center;background:linear-gradient(135deg,#4a9a4a1f,#8adf8a14);border:1.5px solid #4a9a4a2e;border-radius:12px;box-shadow:0 2px 8px #4a9a4a1a;color:#3d7a3d;display:flex;font-size:22px;height:44px;justify-content:center;width:44px}.shortcut-item.recent .shortcut-icon{background:linear-gradient(135deg,#8b5cf61f,#a78bfa14);border-color:#8b5cf62e;color:#6d28d9}.shortcut-label{color:#3a5a3a;font-size:11px;font-weight:600;letter-spacing:.2px}.shortcut-item.recent .shortcut-label{color:#5b4a8a}.shortcuts-divider{background:linear-gradient(90deg,#0000,#00000014,#0000);height:1px;margin:4px 20px}.shortcuts-btn,.shortcuts-btn.active{color:#3d7a3d;color:var(--green-700)}.shortcuts-btn.active:before{background:linear-gradient(90deg,#4a9a4a,#8adf8a);background:linear-gradient(90deg,var(--green-600),var(--green-300));box-shadow:0 0 12px #4a9a4a80}.btn{-webkit-tap-highlight-color:transparent;align-items:center;border:none;border-radius:16px;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;font-size:15px;font-size:var(--font-size-md);font-weight:600;gap:8px;gap:var(--space-sm);justify-content:center;padding:12px 24px;transition:all .25s ease;transition:all var(--transition-normal);-webkit-user-select:none;user-select:none}.btn:active{transform:scale(.95);transition:transform .1s ease}.btn-primary{background:linear-gradient(135deg,#2d5a2d,#4a9a4a 50%,#58b858);box-shadow:0 4px 16px #2d5a2d80;color:#fff;color:var(--text-light);font-weight:700;overflow:hidden;position:relative}.btn-primary:hover{box-shadow:0 6px 24px #2d5a2d99}.btn-primary:before{background:linear-gradient(90deg,#0000,#fffc,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.btn-primary:hover:before{left:100%}.btn-danger{background:linear-gradient(135deg,#f08a5f,#f5ad7a);background:var(--sos-gradient);box-shadow:0 4px 16px #f08a5f59;color:#fff;color:var(--text-light)}.btn-outline{border:2px solid #58b858;border:2px solid var(--primary);color:#2d5a2d;color:var(--primary-dark)}.btn-ghost,.btn-outline{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:#fff9}.btn-ghost{color:#1c3a22;color:var(--text-secondary)}.btn-sm{border-radius:10px;border-radius:var(--radius-sm);font-size:13px;font-size:var(--font-size-sm);padding:8px 16px}.btn-lg{border-radius:24px;border-radius:var(--radius-lg);font-size:18px;font-size:var(--font-size-lg);padding:16px 32px}.btn-block{width:100%}.btn:disabled{cursor:not-allowed;opacity:.5;transform:none}.card{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:#fff9;background:var(--bg-card);border:1px solid #c8e8c8;border:1px solid var(--border-card);border-radius:16px;border-radius:var(--radius-md);box-shadow:0 3px 14px #10341c0a,0 1px 3px #00000005,inset 0 1px 0 #fff6;box-shadow:var(--shadow-sm);padding:24px;padding:var(--space-xl);transition:all .25s ease;transition:all var(--transition-normal)}.card:active{box-shadow:0 1px 3px #1a3a1a0d;box-shadow:var(--shadow-xs);transform:scale(.97);transition:all .1s ease}.card-hoverable{cursor:pointer;overflow:hidden;position:relative}.card-hoverable:hover{border-color:#58b85859;box-shadow:0 4px 16px #1a3a1a1a;box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-hoverable:after{background:radial-gradient(circle,#58b85838 0,#0000 70%);content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .3s ease}.card-hoverable:active:after{opacity:1;transition:opacity 0s}.input{background:#fff9;background:var(--bg-card);border:2px solid #b8e0b8;border:2px solid var(--border-light);border-radius:16px;border-radius:var(--radius-md);color:#10281b;color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-family:var(--font-sans);font-size:15px;font-size:var(--font-size-md);outline:none;padding:14px 16px;resize:vertical;transition:all .25s ease;transition:all var(--transition-normal);width:100%}.input:focus{border-color:#4a9a4a;box-shadow:0 0 0 4px #4a9a4a38;transform:translateY(-1px)}.input.breathing-hint::placeholder{animation:placeholderBreathe 2s ease-in-out infinite}@keyframes placeholderBreathe{0%,to{opacity:.5}50%{opacity:.8}}.input::placeholder{color:#32543a;color:var(--text-muted)}textarea.input{line-height:1.7;min-height:120px}.tag{-webkit-tap-highlight-color:transparent;align-items:center;background:#fff9;background:var(--bg-card);border:1.5px solid #b8e0b8;border:1.5px solid var(--border-light);border-radius:32px;border-radius:var(--radius-xl);color:#1c3a22;color:var(--text-secondary);cursor:pointer;display:inline-flex;font-size:13px;font-size:var(--font-size-sm);font-weight:500;padding:6px 14px;transition:all .15s ease;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap}.tag:active{transform:scale(.93);transition:transform .1s ease}.tag:hover{border-color:#4a9a4a;color:#2d5a2d}.tag.selected{animation:tagPopIn .3s cubic-bezier(.34,1.56,.64,1) both;background:linear-gradient(135deg,#a8eea8,#c8f5c8);border-color:#4a9a4a;box-shadow:0 2px 10px #4a9a4a4d;color:#1a3a1a;font-weight:700}@keyframes tagPopIn{0%{transform:scale(.8)}to{transform:scale(1)}}.toast{animation:toastIn .3s ease,toastOut .3s ease 2.2s forwards;background:linear-gradient(135deg,#2d5a2d,#4a9a4a);border-radius:24px;border-radius:var(--radius-lg);box-shadow:0 4px 20px #2d5a2d8c;color:#fff;font-size:13px;font-size:var(--font-size-sm);font-weight:600;left:50%;padding:12px 24px;pointer-events:none;position:fixed;top:20px;transform:translateX(-50%);z-index:9999;z-index:var(--z-toast)}@keyframes toastIn{0%{opacity:0;transform:translateX(-50%) translateY(-10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@keyframes toastOut{0%{opacity:1;transform:translateX(-50%) translateY(0)}to{opacity:0;transform:translateX(-50%) translateY(-10px)}}.modal-overlay{align-items:center;animation:fadeIn .25s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000073;background:var(--bg-overlay);display:flex;inset:0;justify-content:center;padding:24px;padding:var(--space-xl);position:fixed;z-index:1000;z-index:var(--z-modal)}.modal{animation:modalSlideUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff9;background:var(--bg-card);border-radius:24px;border-radius:var(--radius-lg);box-shadow:0 6px 28px #10341c0f,0 2px 8px #00000008,inset 0 1px 0 #ffffff59;box-shadow:var(--shadow-lg);max-width:360px;padding:32px;padding:var(--space-2xl);text-align:center;width:100%}.modal-icon{animation:modalIconPulse 2s ease-in-out infinite;font-size:56px;margin-bottom:16px;margin-bottom:var(--space-lg)}.modal-title{color:#10281b;color:var(--text-primary);font-size:22px;font-size:var(--font-size-xl);font-weight:700;margin-bottom:12px;margin-bottom:var(--space-md)}.modal-desc{color:#1c3a22;color:var(--text-secondary);font-size:15px;font-size:var(--font-size-md);line-height:1.7;margin-bottom:24px;margin-bottom:var(--space-xl)}.modal-actions{display:flex;flex-wrap:wrap;gap:12px;gap:var(--space-md);justify-content:center}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes modalIconPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.fade-in{animation:fadeInUp .4s ease both}.fade-in-delay-1{animation-delay:.1s}.fade-in-delay-2{animation-delay:.2s}.fade-in-delay-3{animation-delay:.3s}.fade-in-delay-4{animation-delay:.4s}.fade-in-delay-5{animation-delay:.5s}@keyframes spinnerSpin{to{transform:rotate(1turn)}}.problem-textarea:focus{background:#ffffffb8;background:var(--bg-card-hover);border-color:#e8a03059;box-shadow:0 6px 30px #e8a03026,0 0 0 5px #e8a0300d,inset 0 2px 4px #ffffff8c;transform:translateY(-2px)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.relax-tab{color:#32543a;color:var(--text-muted);transition:color .2s ease,transform .2s ease}.relax-tab:hover{transform:scale(1.05)}.relax-tab-on,.relax-tab:hover{color:inherit;color:var(--tab-col,inherit)}.relax-tab-on:hover{transform:none}.relax-game-link{outline:none}.relax-game-link:focus-visible,.relax-game-link:hover{box-shadow:0 8px 22px #e0609029!important;transform:translateY(-3px)}.games-cat-tab{background:#ffffffb8;background:var(--bg-card-hover);border:2px solid #0000;border-radius:16px;border-radius:var(--radius-md);box-shadow:0 2px 8px #00000008;color:#1c3a22;color:var(--text-secondary);font-weight:500;padding:7px 6px;transform:scale(1);transition:all .35s cubic-bezier(.34,1.56,.64,1)}.games-cat-tab:not(.games-cat-tab-on):hover{background:color-mix(in srgb,var(--cat) 8%,#ffffffb8);background:color-mix(in srgb,var(--cat) 8%,var(--bg-card-hover));border-color:color-mix(in srgb,var(--cat) 35%,#0000);box-shadow:0 5px 15px color-mix(in srgb,var(--cat) 15%,#0000);color:var(--cat);transform:scale(1.05)}.games-cat-tab-on{background:color-mix(in srgb,var(--cat) 15%,#ffffffb8);background:color-mix(in srgb,var(--cat) 15%,var(--bg-card-hover));border-color:var(--cat);box-shadow:0 6px 18px color-mix(in srgb,var(--cat) 20%,#0000),inset 0 1px 0 #fff9;color:var(--cat);font-weight:700}.games-cat-tab-on,.games-cat-tab-on:hover{transform:scale(1.06)}.games-cat-tab:focus-visible{outline:2px solid color-mix(in srgb,var(--cat) 60%,#0000);outline-offset:2px}.games-clear-recent{-webkit-tap-highlight-color:transparent;background:#0000;border:none;border-radius:10px;border-radius:var(--radius-sm);color:#32543a;color:var(--text-muted);cursor:pointer;font-size:11px;font-size:var(--font-size-xs,11px);font-weight:600;margin-left:auto;padding:4px 8px;transition:color .2s ease,background .2s ease}.games-clear-recent:hover{background:#e0553a14;color:#e0553a}.games-clear-recent:focus-visible{outline:2px solid #e0553a80;outline-offset:1px}.games-recent-card{border:1.5px solid color-mix(in srgb,var(--gcol) 20%,#0000);box-shadow:0 3px 12px #0000000a;transition:all .35s cubic-bezier(.34,1.56,.64,1)}.games-recent-card:hover{border-color:color-mix(in srgb,var(--gcol) 50%,#0000);box-shadow:0 8px 22px color-mix(in srgb,var(--gcol) 22%,#0000);transform:translateY(-3px) scale(1.03)}.games-recent-card:focus-visible{outline:2px solid color-mix(in srgb,var(--gcol) 60%,#0000);outline-offset:2px}.game-card-hoverable{border:1.5px solid #c8e8c8;border:1.5px solid var(--border-card);box-shadow:0 4px 16px #0000000a,inset 0 1px 0 #ffffffe6;transition:all .45s cubic-bezier(.34,1.56,.64,1)}.game-card-hoverable:hover{border-color:color-mix(in srgb,var(--gcol) 55%,#0000);box-shadow:0 16px 42px color-mix(in srgb,var(--gcol) 30%,#0000),0 0 0 2px color-mix(in srgb,var(--gcol) 30%,#0000);transform:translateY(-6px) scale(1.05)}.game-card-hoverable:hover .game-card-icon{transform:scale(1.12) rotate(5deg)}.game-card-hoverable:hover .game-card-glow{opacity:1}.game-card-hoverable:hover .game-card-indicator{width:42px}.game-card-hoverable:focus-visible{outline:2px solid color-mix(in srgb,var(--gcol) 60%,#0000);outline-offset:2px}.game-card-hoverable .game-card-icon{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}.game-card-hoverable .game-card-glow{opacity:.5;transition:opacity .35s ease}.game-card-hoverable .game-card-indicator{transition:width .4s ease;width:30px}.profile-theme-toggle{background:#fff9;background:var(--bg-card);transition:all .35s cubic-bezier(.34,1.56,.64,1)}.profile-theme-toggle:hover{background:#ffffffb8;background:var(--bg-card-hover);transform:translateY(-2px) scale(1.03)}.profile-theme-toggle:focus-visible{outline:2px solid color-mix(in srgb,#58b858 55%,#0000);outline:2px solid color-mix(in srgb,var(--primary) 55%,#0000);outline-offset:2px}.profile-quick-card{border:1.5px solid color-mix(in srgb,var(--qcolor) 35%,#0000);box-shadow:0 3px 16px color-mix(in srgb,var(--qcolor) 12%,#0000),0 0 0 1px color-mix(in srgb,var(--qcolor) 8%,#0000),inset 0 1px 0 #ffffff4d;transition:all .35s cubic-bezier(.34,1.56,.64,1)}.profile-quick-card:hover{border-color:color-mix(in srgb,var(--qaccent) 55%,#0000);box-shadow:0 8px 28px color-mix(in srgb,var(--qaccent) 28%,#0000),0 0 0 2px color-mix(in srgb,var(--qaccent) 22%,#0000),inset 0 1px 0 #ffffff4d;transform:translateY(-3px) scale(1.02)}.profile-quick-card:focus-visible{outline:2px solid color-mix(in srgb,var(--qaccent) 60%,#0000);outline-offset:2px}.profile-quick-card .profile-quick-glow{opacity:.6;transition:opacity .4s ease}.profile-quick-card:hover .profile-quick-glow{opacity:1}.profile-hover-card{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.profile-hover-card:hover{transform:translateY(-3px)}.profile-report-card{border:1.5px solid #8b5cf626;box-shadow:0 4px 20px #00000008,0 0 0 1px #8b5cf60f,inset 0 1px 0 #ffffff4d;transition:all .4s cubic-bezier(.34,1.56,.64,1)}.profile-report-card:hover{border-color:#8b5cf666;box-shadow:0 10px 32px #8b5cf624,0 0 0 2px #8b5cf62e,inset 0 1px 0 #ffffff4d;transform:translateY(-3px)}.profile-report-card:focus-visible{outline:2px solid #8b5cf680;outline-offset:2px}.profile-badge-tag:focus-visible{outline:2px solid color-mix(in srgb,#58b858 55%,#0000);outline:2px solid color-mix(in srgb,var(--primary) 55%,#0000);outline-offset:1px}.profile-collect-cell{transition:all .3s cubic-bezier(.34,1.56,.64,1)}.profile-collect-cell:hover{box-shadow:0 6px 16px #0000000f!important;transform:translateY(-2px)}.profile-collect-cell:focus-visible{outline:2px solid color-mix(in srgb,#58b858 55%,#0000);outline:2px solid color-mix(in srgb,var(--primary) 55%,#0000);outline-offset:1px}@keyframes breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.08)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes ripple{to{opacity:0;transform:scale(4)}}.page-enter{animation:pageSlideIn .35s cubic-bezier(.4,0,.2,1) both}.page-enter,.page-enter-forward{display:flex;flex:1 1;flex-direction:column;min-height:0;overflow:hidden}.page-enter-forward{animation:pageSlideForward .35s cubic-bezier(.4,0,.2,1) both}.page-enter-back{animation:pageSlideBack .35s cubic-bezier(.4,0,.2,1) both;display:flex;flex:1 1;flex-direction:column;min-height:0;overflow:hidden}@keyframes pageSlideIn{0%{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}@keyframes pageSlideForward{0%{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}@keyframes pageSlideBack{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#0000}::-webkit-scrollbar-thumb{background:#b8e0b8;background:var(--border-light);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#32543a;background:var(--text-muted)}::selection{background:#4a9a4a;color:#fff}@media (max-width:480px){.app-container{box-shadow:none;max-width:100%}.bottom-nav{max-width:100%}}@media (min-width:481px){.app-container{border-radius:24px;border-radius:var(--radius-lg);margin-bottom:20px;margin-top:20px;overflow:hidden}}.sos-float-btn{-webkit-tap-highlight-color:transparent;align-items:center;animation:sosPulse 4s ease-in-out infinite;background:linear-gradient(135deg,#f08a5f,#f5ad7a);background:var(--sos-gradient);border:none;border-radius:50%;border-radius:var(--radius-full);bottom:112px;box-shadow:0 4px 16px #f08a5f47;color:#fff;cursor:pointer;display:flex;flex-direction:column;font-size:12px;font-weight:700;gap:1px;height:50px;justify-content:center;letter-spacing:1px;position:fixed;right:18px;transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s ease;width:50px;will-change:transform,box-shadow;z-index:300;z-index:var(--z-sos)}.sos-float-btn.collapsed{height:40px;opacity:.88;width:40px}.sos-float-btn.collapsed .sos-text{display:none}.sos-float-btn.collapsed .sos-icon{transform:scale(.9)}.sos-float-btn .sos-icon{font-size:18px;line-height:1;transition:transform .3s ease}.sos-float-btn .sos-text{font-size:10px;line-height:1}.sos-float-btn:hover .sos-icon{transform:scale(1.15)}.sos-float-btn.pressed,.sos-float-btn:active{box-shadow:0 2px 10px #f08a5f73;transform:scale(.85)}.sos-float-btn.dragging{animation:none;box-shadow:0 6px 32px #f08a5f8c;cursor:grabbing;opacity:.9;transform:scale(1.1);z-index:310;z-index:var(--z-sos-drag)}@keyframes sosPulse{0%,to{box-shadow:0 4px 20px #f08a5f59}50%{box-shadow:0 4px 28px #f08a5f80}}@keyframes sosSheen{0%,28%{transform:translateX(0)}60%,to{transform:translateX(280%)}}@keyframes borderGlowRotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes fragmentFly{0%{opacity:1;transform:translate(0) rotate(0deg) scale(1)}to{opacity:0;transform:translate(40px,-40px) rotate(180deg) scale(0);transform:translate(var(--tx,40px),var(--ty,-40px)) rotate(var(--tr,180deg)) scale(0)}}@keyframes fragmentBurst{0%{opacity:1;transform:translate(0) rotate(0deg) scale(1.2)}30%{opacity:1}to{opacity:0;transform:translate(40px,-40px) rotate(180deg) scale(.2);transform:translate(var(--tx,40px),var(--ty,-40px)) rotate(var(--tr,180deg)) scale(.2)}}@keyframes gameShake{0%,to{transform:translate(0)}10%{transform:translate(-6px,2px)}20%{transform:translate(5px,-3px)}30%{transform:translate(-4px,-1px)}40%{transform:translate(3px,2px)}50%{transform:translate(-2px,-1px)}60%{transform:translate(2px,1px)}70%{transform:translate(-1px)}80%{transform:translate(1px)}90%{transform:translate(0)}}@keyframes comboPop{0%{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}@keyframes plateFlyIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(0deg);transform:translate(-50%,-50%) scale(.3) rotate(var(--start-rot,0deg))}20%{opacity:1}to{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(1turn);transform:translate(-50%,-50%) scale(1) rotate(var(--end-rot,1turn))}}@keyframes twinkle{0%,to{opacity:.2;transform:scale(1)}50%{opacity:1;transform:scale(1.5)}}@keyframes sliceFlash{0%{opacity:1;transform:scaleX(0)}30%{opacity:1;transform:scaleX(1)}to{opacity:0;transform:scaleX(1.5)}}@keyframes timePulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes sparkBurst{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(30px,-30px) scale(0);transform:translate(var(--sx,30px),var(--sy,-30px)) scale(0)}}@keyframes effectPop{0%{opacity:1;transform:translate(0) scale(.5)}50%{opacity:1;transform:translate(5px,-15px) scale(1.3);transform:translate(calc(var(--ex, 10px)*.5),calc(var(--ey, -30px)*.5)) scale(1.3)}to{opacity:0;transform:translate(10px,-40px) scale(.8);transform:translate(var(--ex,10px),var(--ey,-40px)) scale(.8)}}@keyframes auroraWave{0%,to{opacity:.6;transform:translateX(-5%) translateY(0)}25%{opacity:.8;transform:translateX(5%) translateY(-10px)}50%{opacity:.5;transform:translateX(-3%) translateY(5px)}75%{opacity:.7;transform:translateX(8%) translateY(-5px)}}@keyframes fadeInUpSoft{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes meteorShoot{0%{opacity:0;transform:translateX(0) translateY(0)}4%{opacity:1}30%{opacity:0;transform:translateX(350px) translateY(180px)}to{opacity:0;transform:translateX(350px) translateY(180px)}}@keyframes starBurst{0%{opacity:0;transform:scale(.2)}30%{opacity:1;transform:scale(1.5)}to{opacity:0;transform:scale(2.5)}}@keyframes starPulse{0%,to{box-shadow:0 0 4px currentColor,0 0 10px currentColor,inset 0 0 3px #fffc}50%{box-shadow:0 0 7px currentColor,0 0 18px currentColor,0 0 30px currentColor,inset 0 0 5px #fffc}}@keyframes meteorFall{0%{opacity:0;transform:translateY(0) translateX(0)}3%{opacity:1}15%{opacity:.9;transform:translateY(180px) translateX(220px)}20%{opacity:0;transform:translateY(250px) translateX(300px)}to{opacity:0;transform:translateY(250px) translateX(300px)}}@keyframes galaxyDrift{0%{opacity:.5;transform:rotate(-6deg) translateX(-2%)}50%{opacity:.75}to{opacity:.55;transform:rotate(-6deg) translateX(2%)}}@keyframes constellationReveal{0%{opacity:0;transform:translateX(-50%) translateY(16px) scale(.85)}60%{opacity:1;transform:translateX(-50%) translateY(-3px) scale(1.03)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}@keyframes galaxySlowDrift{0%{opacity:.4;transform:rotate(-5deg) translateX(-2%)}to{opacity:.65;transform:rotate(-5deg) translateX(2%)}}@keyframes comboPopup{0%{opacity:0;transform:translateX(-50%) scale(.6) translateY(10px)}30%{opacity:1;transform:translateX(-50%) scale(1.15) translateY(-4px)}50%{opacity:1;transform:translateX(-50%) scale(1) translateY(0)}80%{opacity:.8;transform:translateX(-50%) scale(.95) translateY(-2px)}to{opacity:0;transform:translateX(-50%) scale(.9) translateY(8px)}}@keyframes badgePopup{0%{opacity:0;transform:scale(.3) rotate(-12deg)}50%{opacity:1;transform:scale(1.2) rotate(3deg)}70%{transform:scale(.95) rotate(-1deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes hintPulse{0%,to{opacity:.15}50%{opacity:.35}}@keyframes undoPop{0%{transform:scale(1)}40%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes cardGlow{0%,to{box-shadow:0 2px 8px #6c5ce71a}50%{box-shadow:0 4px 20px #6c5ce740,0 0 30px #6c5ce714}}@keyframes noteGlow{0%{filter:brightness(1)}to{filter:brightness(1.3)}}@keyframes hitRipple{0%{opacity:1;transform:translate(-50%,-50%) scale(.3)}to{opacity:0;transform:translate(-50%,-50%) scale(2.5)}}@keyframes lanePulse{0%,to{background:#fffc}50%{background:#b4d7a8c7}}@keyframes asmrPress{0%{box-shadow:0 4px 16px #a29bfe33}50%{box-shadow:inset 0 4px 20px #00000026,0 0 30px #ef44444d}to{box-shadow:0 4px 16px #a29bfe33}}@keyframes shootingStar{0%{opacity:0;transform:translateX(0) translateY(0) rotate(-30deg)}10%{opacity:1}20%{opacity:0;transform:translateX(400px) translateY(200px) rotate(-30deg)}to{opacity:0;transform:translateX(400px) translateY(200px) rotate(-30deg)}}@media (hover:none) and (pointer:coarse){.card-hoverable,.nav-item,.tag,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.game-card-hoverable,.games-cat-tab,.games-recent-card{transition:transform .1s ease}.game-card-hoverable:active,.games-cat-tab:active,.games-recent-card:active{transform:scale(.96)}}.home-lift{transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .28s ease,border-color .28s ease}@media (hover:hover){.home-lift:hover{box-shadow:0 10px 26px #10341c24,0 2px 6px #00000008;transform:translateY(-2px)}}[data-theme=dark] .home-lift:hover{box-shadow:0 10px 26px #00000057,0 2px 6px #00000038}@media (hover:none) and (pointer:coarse){.home-pressable{transition:transform .1s ease}.card-hoverable:active,.home-pressable:active{transform:scale(.96)}.btn,.relax-game-link,.relax-tab,.tag{transition:transform .1s ease}.btn:active,.relax-game-link:active,.relax-tab:active,.tag:active{transform:scale(.96)}}:focus-visible{outline:3px solid #4a9aea8c;outline-offset:2px}@keyframes listItemSlideIn{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes skeletonShimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}.skeleton{animation:skeletonShimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,#d8f0d0f2 25%,#fff9 50%,#d8f0d0f2 75%);background:linear-gradient(90deg,var(--bg-muted) 25%,var(--bg-card) 50%,var(--bg-muted) 75%);background-size:200px 100%;border-radius:10px;border-radius:var(--radius-sm)}@keyframes progressPulse{0%,to{opacity:1}50%{opacity:.7}}.modal-actions .btn+.btn{margin-left:0}@keyframes numberPop{0%{opacity:0;transform:scale(.5)}60%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}@keyframes slideHint{0%,to{transform:translateX(0)}50%{transform:translateX(-6px)}}@supports (-webkit-overflow-scrolling:touch){.chat-messages,.page-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}}.empty-state{animation:fadeInUp .5s ease both;padding:48px 24px;padding:var(--space-3xl) var(--space-xl);text-align:center}.empty-state-icon{animation:float 3s ease-in-out infinite;font-size:56px;margin-bottom:16px;margin-bottom:var(--space-lg)}@keyframes musicIconPulse{0%,to{box-shadow:0 0 0 0 #58b85873;transform:scale(1)}50%{box-shadow:0 0 0 8px #58b85800;transform:scale(1.08)}}@keyframes musicBarBounce{0%,to{height:4px}50%{height:16px}}@keyframes greetingSlideIn{0%{opacity:0;transform:translateY(-12px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes greetingEmojiFloat{0%,to{transform:translateY(0) rotate(0deg) scale(1)}20%{transform:translateY(-8px) rotate(5deg) scale(1.08)}40%{transform:translateY(2px) rotate(-3deg) scale(.96)}60%{transform:translateY(-5px) rotate(2deg) scale(1.04)}80%{transform:translateY(3px) rotate(-2deg) scale(.98)}}@keyframes greetingParticleFloat{0%,to{opacity:0;transform:translate(0) scale(.6) rotate(0deg)}15%{opacity:.7;transform:translate(8px,-14px) scale(1.1) rotate(15deg)}35%{opacity:.5;transform:translate(-6px,-24px) scale(.9) rotate(-10deg)}55%{opacity:.65;transform:translate(12px,-10px) scale(1.05) rotate(8deg)}75%{opacity:.3;transform:translate(-10px,-20px) scale(.75) rotate(-15deg)}90%{opacity:.05;transform:translate(4px,-28px) scale(.4) rotate(5deg)}}@keyframes greetingGlowPulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}@keyframes floatParticle{0%,to{opacity:.12;transform:translateY(0) translateX(0) rotate(0deg)}25%{opacity:.2;transform:translateY(-15px) translateX(8px) rotate(10deg)}50%{opacity:.15;transform:translateY(-25px) translateX(-5px) rotate(-5deg)}75%{opacity:.18;transform:translateY(-10px) translateX(-10px) rotate(8deg)}}@keyframes greetDecoFloat{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-10px,-8px) scale(1.1)}}.greeting-bg-decoration{animation:greetDecoFloat 4s ease-in-out infinite;background:#b4d7a8c7;border-radius:50%;height:140px;position:absolute;right:-10%;top:-30%;width:140px}@keyframes usageReminderSlideIn{0%{opacity:0;transform:translateY(-44px)}to{opacity:1;transform:translateY(0)}}@keyframes reminderPulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}@keyframes cardShine{0%{transform:translateX(-100%) rotate(25deg)}to{transform:translateX(200%) rotate(25deg)}}.card-hoverable:hover .card-shine{animation:cardShine .8s ease-out}@keyframes contentScaleIn{0%{opacity:0;transform:scale(.96) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes iconBounce{0%,to{transform:scale(1)}40%{transform:scale(1.2)}60%{transform:scale(.95)}}.feature-card:hover .feature-icon{animation:iconBounce .6s cubic-bezier(.34,1.56,.64,1)}@keyframes recommendCardIn{0%{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.tag:hover{box-shadow:0 2px 8px #4a9a4a59;transform:scale(1.05)}@keyframes progressGlow{0%,to{box-shadow:0 0 4px #4a9a4a59}50%{box-shadow:0 0 12px #4a9a4aa6}}@keyframes bgBreathe{0%,to{background-position:0 50%}50%{background-position:100% 50%}}@keyframes auroraDrift{0%{opacity:.7;transform:translate(0) scale(1)}25%{opacity:.9;transform:translate(20px,-15px) scale(1.08)}50%{opacity:.6;transform:translate(-10px,10px) scale(.95)}75%{opacity:.85;transform:translate(-15px,-8px) scale(1.05)}to{opacity:.7;transform:translate(8px,5px) scale(1)}}@keyframes particleFloat{0%{opacity:.3;transform:translate(0) scale(1)}15%{opacity:.8;transform:translate(15px,-18px) scale(1.3);transform:translate(var(--drift,15px),-18px) scale(1.3)}35%{opacity:.5;transform:translate(-6px,-35px) scale(.9);transform:translate(calc(var(--drift, 10px)*-.6),-35px) scale(.9)}55%{opacity:.7;transform:translate(6px,-20px) scale(1.15);transform:translate(calc(var(--drift, 12px)*.5),-20px) scale(1.15)}75%{opacity:.35;transform:translate(-5.6px,-38px) scale(.7);transform:translate(calc(var(--drift, -8px)*.7),-38px) scale(.7)}90%{opacity:.15;transform:translate(1.5px,-42px) scale(.4);transform:translate(calc(var(--drift, 5px)*.3),-42px) scale(.4)}to{opacity:0;transform:translateY(-50px) scale(.2)}}@keyframes glowBreathe{0%,to{opacity:.5}25%{opacity:.9}50%{opacity:.6}75%{opacity:.85}}@keyframes glowPulse{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes auraBreathe{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.25)}}@keyframes gradientFlow{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes softBlink{0%,to{opacity:.15;transform:scale(1)}50%{opacity:.55;transform:scale(1.15)}}@keyframes fireflyFloat{0%{opacity:.15;transform:translate(0) scale(.6)}10%{opacity:.9;transform:translate(5px,-12px) scale(1.4);transform:translate(calc(var(--drift, 10px)*.5),-12px) scale(1.4)}25%{opacity:.4;transform:translate(-5.6px,-28px) scale(.8);transform:translate(calc(var(--drift, -8px)*.7),-28px) scale(.8)}40%{opacity:.75;transform:translate(6px,-18px) scale(1.25);transform:translate(calc(var(--drift, 15px)*.4),-18px) scale(1.25)}55%{opacity:.3;transform:translate(-7.2px,-36px) scale(.65);transform:translate(calc(var(--drift, -12px)*.6),-36px) scale(.65)}70%{opacity:.6;transform:translate(3px,-22px) scale(1.1);transform:translate(calc(var(--drift, 6px)*.5),-22px) scale(1.1)}85%{opacity:.18;transform:translate(-3px,-42px) scale(.5);transform:translate(calc(var(--drift, -10px)*.3),-42px) scale(.5)}to{opacity:0;transform:translateY(-55px) scale(.2)}}@keyframes leafDrift{0%{opacity:0;transform:translate(0) rotate(0deg)}5%{opacity:.18;opacity:var(--leaf-opacity,.18)}20%{transform:translate(9px,-25vh) rotate(45deg);transform:translate(calc(var(--sway, 30px)*.3),-25vh) rotate(45deg)}40%{transform:translate(-10px,-45vh) rotate(120deg);transform:translate(calc(var(--sway, -20px)*.5),-45vh) rotate(120deg)}60%{transform:translate(8px,-65vh) rotate(200deg);transform:translate(calc(var(--sway, 40px)*.2),-65vh) rotate(200deg)}80%{opacity:.08;transform:translate(-12px,-85vh) rotate(300deg);transform:translate(calc(var(--sway, -30px)*.4),-85vh) rotate(300deg)}to{opacity:0;transform:translate(3px,-105vh) rotate(380deg);transform:translate(calc(var(--sway, 10px)*.3),-105vh) rotate(380deg)}}@keyframes starTwinkle{0%,to{opacity:.15;transform:scale(.8)}20%{opacity:.9;transform:scale(1.4)}40%{opacity:.2;transform:scale(.7)}60%{opacity:.7;transform:scale(1.2)}80%{opacity:.25;transform:scale(.9)}}@keyframes starHint{0%,to{opacity:.22;transform:scale(1)}50%{opacity:.7;transform:scale(1.55)}}.night-mode-hint{background:linear-gradient(135deg,#1a1a2e10,#16213e10);border-color:#1a1a2e20!important}@keyframes typingDotBounce{0%,60%,to{opacity:.3;transform:translateY(0) scale(.8)}30%{opacity:1;transform:translateY(-10px) scale(1.2)}}@keyframes chatBubbleIn{0%{opacity:0;transform:translateY(12px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes welcomeFloat{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.05)}}.topic-chip:hover{background:#c8f5c8!important;background:var(--primary-light)!important;border-color:#58b858!important;border-color:var(--primary)!important;color:#2d5a2d!important;color:var(--primary-dark)!important;transform:translateY(-1px)}.topic-chip:active{transform:scale(.95)!important}.chat-input:focus{background:#fff!important;border-color:#58b858!important;border-color:var(--primary)!important;box-shadow:0 0 0 3px #58b85840!important}.chat-send-btn:active:not(:disabled){transform:scale(.88)!important;transition:transform .1s ease!important}.chat-bubble{transition:transform .2s ease}.chat-bubble:active{transform:scale(.98)}@keyframes fireAnim{0%,to{filter:brightness(1);transform:scale(1) rotate(0deg)}25%{filter:brightness(1.3);transform:scale(1.15) rotate(-5deg)}75%{filter:brightness(.8);transform:scale(.9) rotate(5deg)}}@keyframes bubbleAnim{0%,to{opacity:1;transform:scale(1) translateY(0)}50%{opacity:.7;transform:scale(1.2) translateY(-10px)}}@keyframes bubbleFloat{0%{opacity:.6;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-30px) scale(0)}}@keyframes destroyDonePop{0%{opacity:0;transform:scale(0) rotate(-30deg)}60%{opacity:1;transform:scale(1.3) rotate(5deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}@keyframes destroyDoneBtnIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes destroyBorderGlow{0%,to{box-shadow:0 0 10px #fffc,0 0 20px #ffffff0d}50%{box-shadow:0 0 20px #fffc,0 0 40px #ffffff1a}}.feature-card:hover .feature-icon{transform:scale(1.08);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.feature-card:hover .feature-arrow{transform:translateX(3px)}.feature-card:active{transform:scale(.97)!important;transition:transform .1s ease!important}.feature-card{border:1px solid #58b85826!important}.feature-card:hover{border-color:#58b85859!important;box-shadow:0 6px 24px #4a9a4a33!important}.feature-card-v3{overflow:hidden;position:relative;transition:all .35s cubic-bezier(.34,1.56,.64,1)}.feature-card-v3:hover{box-shadow:0 8px 28px #0000001a!important;transform:translateY(-3px)!important}.feature-card-v3:active{transform:translateY(1px) scale(.96)!important;transition:all .1s ease!important}.art-feature-card{transition:all .45s cubic-bezier(.16,1,.3,1)}.art-feature-card:hover{box-shadow:0 12px 36px #00000014!important;transform:translateY(-4px)!important}.art-feature-card:hover>div:nth-child(3){background:#00000008;transform:scale(1.12)}.art-feature-card:active{transform:translateY(0) scale(.97)!important;transition:all .1s ease!important}.feature-card-v3:before{animation:cardShineSweep 4s ease-in-out infinite;transform:skewX(-25deg);width:80%}.art-feature-card:before,.feature-card-v3:before{background:linear-gradient(90deg,#0000,#fffc 50%,#0000);content:"";height:100%;left:-100%;pointer-events:none;position:absolute;top:0;z-index:2;z-index:var(--z-local)}.art-feature-card:before{animation:artShineSweep 5s ease-in-out infinite;transform:skewX(-20deg);width:60%}.feature-card-v3:first-child:before{animation-delay:0s}.feature-card-v3:nth-child(2):before{animation-delay:.6s}.feature-card-v3:nth-child(3):before{animation-delay:1.2s}.feature-card-v3:nth-child(4):before{animation-delay:1.8s}.feature-card-v3:nth-child(5):before{animation-delay:2.4s}.feature-card-v3:nth-child(6):before{animation-delay:3s}.art-feature-card:first-child:before{animation-delay:0s}.art-feature-card:nth-child(2):before{animation-delay:.8s}.art-feature-card:nth-child(3):before{animation-delay:1.6s}.art-feature-card:nth-child(4):before{animation-delay:2.4s}.art-feature-card:nth-child(5):before{animation-delay:3.2s}.art-feature-card:nth-child(6):before{animation-delay:4s}@keyframes cardShineSweep{0%{left:-100%;opacity:0}15%{opacity:1}40%{opacity:1}50%{left:120%;opacity:0}to{left:120%;opacity:0}}@keyframes artShineSweep{0%{left:-100%;opacity:0}20%{opacity:.8}40%{opacity:.8}50%{left:110%;opacity:0}to{left:110%;opacity:0}}@keyframes capsuleProgress{0%{width:0}to{width:100%}}@keyframes heartPop{0%{transform:scale(1)}30%{transform:scale(1.4)}50%{transform:scale(.9)}70%{transform:scale(1.15)}to{transform:scale(1)}}.game-fullscreen-btn{align-items:center;background:#fff9;background:var(--bg-card);border:1.5px solid #b8e0b8;border:1.5px solid var(--border-light);border-radius:10px;color:#1c3a22;color:var(--text-secondary);cursor:pointer;display:flex;flex-shrink:0;font-size:20px;height:38px;justify-content:center;transition:all .2s ease;width:38px}.game-fullscreen-btn:hover{background:#c8f5c8;background:var(--primary-light);border-color:#58b858;border-color:var(--primary);color:#2d5a2d;color:var(--primary-dark);transform:scale(1.08)}.game-fullscreen-btn:active{transform:scale(.92)}.game-fullscreen-overlay{animation:gameFullscreenIn .3s cubic-bezier(.4,0,.2,1);background:#0000;background:var(--bg-page);display:flex;flex-direction:column;height:100vh;height:100dvh;left:0;overflow:hidden;position:fixed;top:0;width:100vw;z-index:9999;z-index:var(--z-game)}@keyframes gameFullscreenIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.game-fullscreen-bar{align-items:center;background:linear-gradient(135deg,#2d2d5e,#1a1a4a);box-shadow:0 2px 16px #0000004d;display:flex;flex-shrink:0;gap:10px;padding:10px 16px;z-index:1;z-index:var(--z-base)}.game-fullscreen-back{-webkit-tap-highlight-color:transparent;background:#b4d7a8c7;border:1px solid #fffc;border-radius:8px;color:#e8f6e2e8;cursor:pointer;font-size:13px;font-weight:600;padding:6px 14px;transition:all .2s ease;white-space:nowrap}.game-fullscreen-back:hover{background:#b4d7a8c7;border-color:#fffc}.game-fullscreen-back:active{transform:scale(.95)}.game-fullscreen-body{align-items:center;display:flex;flex:1 1;justify-content:center;min-height:0;overflow-x:hidden;overflow-y:auto;padding:8px}@keyframes meditateFloat{0%,to{opacity:.9;transform:translateY(0) scale(1)}25%{opacity:1;transform:translateY(-8px) scale(1.05)}50%{opacity:.9;transform:translateY(0) scale(1)}75%{opacity:.95;transform:translateY(-4px) scale(1.03)}}@keyframes leafSway{0%,to{transform:rotate(-3deg) translateX(0)}50%{transform:rotate(3deg) translateX(2px)}}@keyframes waterDrop{0%{opacity:0;transform:translateY(-20px) scale(0)}30%{opacity:1;transform:translateY(0) scale(1.2)}60%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(20px) scale(.5)}}@keyframes sproutGrow{0%{opacity:0;transform:scaleY(0)}60%{opacity:1;transform:scaleY(1.1)}to{opacity:1;transform:scaleY(1)}}@keyframes greenGlow{0%,to{box-shadow:0 0 20px #4a9a4a40,0 0 60px #4a9a4a1f}50%{box-shadow:0 0 40px #4a9a4a66,0 0 80px #6dcc6d40}}@keyframes filterDrop{0%{opacity:.8;transform:translateY(-30px)}to{opacity:0;transform:translateY(30px)}}@keyframes rippleExpand{0%{opacity:.6;transform:scale(0)}to{opacity:0;transform:scale(4)}}.green-card{background:linear-gradient(135deg,#e8fae8,#d8f5d0 30%,#eaf8e4);border:1px solid #58b85866;box-shadow:0 2px 12px #4a9a4a1f}.feature-card-green:hover{border-color:#58b858!important;border-color:var(--primary)!important;box-shadow:0 6px 24px #4a9a4a38!important}@keyframes filterCalm{0%{filter:blur(4px);opacity:.6;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.home-bg-pattern{background-image:radial-gradient(circle at 20% 80%,#4a9a4a14 0,#0000 50%),radial-gradient(circle at 80% 20%,#6dcc6d0f 0,#0000 50%),radial-gradient(circle at 50% 50%,#58b8580d 0,#0000 60%)}@keyframes cardBounceIn{0%{opacity:0;transform:translateY(24px) scale(.94)}60%{opacity:1;transform:translateY(-4px) scale(1.02)}80%{transform:translateY(2px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes softBreathe{0%,to{opacity:.9;transform:scale(1)}50%{opacity:1;transform:scale(1.04)}}@keyframes shineSweep{0%{left:-100%;opacity:0}30%{opacity:.6}60%{opacity:.6}to{left:100%;opacity:0}}@keyframes rotateBorder{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes particleRise{0%{opacity:.8;transform:translateY(0) scale(1)}50%{opacity:1}to{opacity:0;transform:translateY(-60px) scale(0)}}@keyframes elasticPop{0%{transform:scale(.6)}50%{transform:scale(1.15)}70%{transform:scale(.92)}to{transform:scale(1)}}@keyframes glowRotate{0%{transform:rotate(0deg) scale(1)}50%{transform:rotate(2deg) scale(1.02)}to{transform:rotate(0deg) scale(1)}}@keyframes ripplePulse{0%{box-shadow:0 0 0 0 #58b85873}70%{box-shadow:0 0 0 12px #58b85800}to{box-shadow:0 0 0 0 #58b85800}}@keyframes slideUpBounce{0%{opacity:0;transform:translateY(100%)}60%{opacity:1;transform:translateY(-8px)}80%{transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}@keyframes textReveal{0%{filter:blur(2px);opacity:0;transform:translateY(4px)}to{filter:blur(0);opacity:1;transform:translateY(0)}}@keyframes contentZoomIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slidePanelRight{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slidePanelLeft{0%{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes countPop{0%{opacity:0;transform:scale(.3)}50%{transform:scale(1.3)}70%{transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pullRefresh{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes badgePulse{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}@keyframes floatUpFade{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-40px) scale(.5)}}@keyframes confettiFall{0%{opacity:1;transform:translateY(-20px) rotate(0deg) scale(1)}to{opacity:0;transform:translateY(240px) rotate(2turn) scale(.3)}}@keyframes cursorBlink{0%,to{opacity:1}50%{opacity:0}}@keyframes heartbeat{0%{transform:scale(1)}15%{transform:scale(1.3)}30%{transform:scale(1)}45%{transform:scale(1.15)}60%{transform:scale(1)}}.animate-card-bounce{animation:cardBounceIn .5s cubic-bezier(.34,1.56,.64,1) both}.animate-soft-breathe{animation:softBreathe 3s ease-in-out infinite}.animate-shine{overflow:hidden;position:relative}.animate-shine:after{animation:shineSweep 3s ease-in-out infinite;background:linear-gradient(90deg,#0000,#fffc,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transform:skewX(-20deg);width:60%}.animate-elastic-pop{animation:elasticPop .4s cubic-bezier(.34,1.56,.64,1)}.animate-heartbeat{animation:heartbeat .6s ease}.animate-float-up{animation:floatUpFade 1.5s ease-out forwards}.animate-count-pop{animation:countPop .4s cubic-bezier(.34,1.56,.64,1)}.ripple-effect{overflow:hidden;position:relative}.ripple-effect:after{background:radial-gradient(circle,#58b85859 0,#0000 70%);content:"";inset:0;opacity:0;position:absolute;transition:opacity .3s ease}.ripple-effect:active:after{opacity:1;transition:opacity 0s}.highlight-stripe{animation:gradientFlow 3s ease infinite;background:linear-gradient(90deg,#0000,#58b85833 20%,#6dcc6d1f 50%,#58b85833 80%,#0000);background-size:200% 100%}.hover-lift{transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease}.hover-lift:hover{box-shadow:0 12px 32px #0000001f;transform:translateY(-4px)}.hover-lift:active{transform:translateY(-1px) scale(.98)}.glass-card{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#fffc;border:1px solid #fffc;box-shadow:0 6px 30px #00000024}[data-theme=dark] .glass-card{background:#252825eb;border-color:#fffc;box-shadow:0 4px 20px #0003}@keyframes successPopIn{0%{opacity:0;transform:scale(0) rotate(-20deg)}60%{transform:scale(1.2) rotate(5deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}.animate-success{animation:successPopIn .5s cubic-bezier(.34,1.56,.64,1) both}@keyframes sunRayRise{0%{opacity:.88;transform:rotate(-8deg) translateX(0)}25%{opacity:1;transform:rotate(-4deg) translateX(10px)}50%{opacity:.82;transform:rotate(-10deg) translateX(-6px)}75%{opacity:.96;transform:rotate(-5deg) translateX(8px)}to{opacity:.88;transform:rotate(-8deg) translateX(0)}}@keyframes bubbleRise{0%{opacity:0;transform:translateY(0) translateX(0) scale(.7)}8%{opacity:.75;transform:translateY(-5vh) translateX(calc(var(--wobble)*.3)) scale(1)}30%{opacity:.65;transform:translateY(-25vh) translateX(calc(var(--wobble)*-.5)) scale(1.05)}55%{opacity:.45;transform:translateY(-50vh) translateX(calc(var(--wobble)*.4)) scale(.95)}80%{opacity:.2;transform:translateY(-78vh) translateX(calc(var(--wobble)*-.3)) scale(.85)}to{opacity:0;transform:translateY(-110vh) translateX(0) scale(.5)}}@keyframes shimmerDrift{0%{opacity:0;transform:translateX(-40px) scaleX(.7)}25%{opacity:.9;transform:translateX(20px) scaleX(1)}50%{opacity:.5;transform:translateX(60px) scaleX(.85)}75%{opacity:.8;transform:translateX(100px) scaleX(1.05)}to{opacity:0;transform:translateX(150px) scaleX(.6)}}@keyframes orbFloat{0%{opacity:.5}33%{opacity:.8}66%{opacity:.6}to{opacity:.7}}@keyframes sunSparkle{0%,to{opacity:.3;transform:scale(.8) translateY(0)}30%{opacity:1;transform:scale(1.4) translateY(-3px)}50%{opacity:.5;transform:scale(1) translateY(-1px)}70%{opacity:.9;transform:scale(1.2) translateY(-2px)}}@keyframes mistFloat{0%,to{opacity:.12;transform:translateX(0) scale(1)}25%{opacity:.2;transform:translateX(8px) scale(1.03)}50%{opacity:.15;transform:translateX(-6px) scale(.98)}75%{opacity:.22;transform:translateX(10px) scale(1.05)}}@keyframes windBlow{0%{background-position:0 50%}to{background-position:200% 50%}}@keyframes windLine{0%{opacity:0;transform:translateX(-100%) rotate(-10deg);transform:translateX(-100%) rotate(var(--wind-angle,-10deg))}20%{opacity:.15}80%{opacity:.08}to{opacity:0;transform:translateX(200%) rotate(-10deg);transform:translateX(200%) rotate(var(--wind-angle,-10deg))}}@keyframes puddleForm{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}40%{opacity:.9;transform:translate(-50%,-50%) scale(1.2)}60%{opacity:1;transform:translate(-50%,-50%) scale(.95)}80%{opacity:.95;transform:translate(-50%,-50%) scale(1.04)}to{opacity:.85;transform:translate(-50%,-50%) scale(1)}}@keyframes waveMove{0%,to{opacity:.12;transform:translateX(0) scaleX(1)}25%{opacity:.18;transform:translateX(4px) scaleX(1.08)}50%{opacity:.14;transform:translateX(-3px) scaleX(.96)}75%{opacity:.16;transform:translateX(6px) scaleX(1.12)}}@keyframes lightningFlash{0%{opacity:0}5%{opacity:1}10%{opacity:.2}15%{opacity:.85}20%{opacity:.1}25%{opacity:.45}35%{opacity:0}to{opacity:0}}@keyframes rainDropTrail{0%{background-position:0 0}to{background-position:0 100%}}@keyframes splashParticleExpand{0%{opacity:1;transform:translate(-50%,-50%) scale(0)}50%{opacity:.7}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes likeHeartBeat{0%{transform:scale(1)}25%{transform:scale(1.3)}50%{transform:scale(1)}75%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes hugWiggle{0%,to{transform:rotate(0deg)}15%{transform:rotate(-8deg)}30%{transform:rotate(8deg)}45%{transform:rotate(-6deg)}60%{transform:rotate(6deg)}75%{transform:rotate(-3deg)}90%{transform:rotate(3deg)}}[data-theme=dark] .card{background:#1e261ec7;border-color:#58b85826}[data-theme=dark] .card-hoverable:hover{background:#242e24d1;border-color:#58b8584d}[data-theme=dark] .btn-outline{background:#1e261eb3;border-color:#58b85866;color:#8adf8a}[data-theme=dark] .btn-ghost{background:#1e261eb3;color:#a0b8a0}[data-theme=dark] .btn-primary{background:linear-gradient(135deg,#3d7a3d,#4a9a4a)}[data-theme=dark] .tag{background:#1e261eb3;border-color:#58b85833;color:#a0b8a0}[data-theme=dark] .tag:hover{border-color:#4a9a4a;color:#8adf8a}[data-theme=dark] .tag.selected{background:linear-gradient(135deg,#2d5a2d,#1a3a1a);border-color:#4a9a4a;color:#a8eea8}[data-theme=dark] .input{background:#161e16d9;border-color:#58b85833;color:#e0e8e0}[data-theme=dark] .input:focus{border-color:#4a9a4a;box-shadow:0 0 0 4px #4a9a4a2e}[data-theme=dark] .modal{background:#1a241af0;border:1px solid #58b85826}[data-theme=dark] .modal-title{color:#e0e8e0}[data-theme=dark] .modal-desc{color:#a0b8a0}[data-theme=dark] .toast{background:linear-gradient(135deg,#1a3a1a,#2d5a2d)}[data-theme=dark] .page-body{background:#121a12b8;box-shadow:inset 0 8px 30px #0000001f}[data-theme=dark] .green-card{background:linear-gradient(135deg,#1e2e1e,#1a2a1a,#1e2e1e);border-color:#58b85840}[data-theme=dark] ::-webkit-scrollbar-thumb{background:#3d5a3d}[data-theme=dark] ::-webkit-scrollbar-thumb:hover{background:#4a7a4a}[data-theme=dark] ::selection{background:#3d7a3d;color:#e0e8e0}[data-theme=dark] .skeleton{background:linear-gradient(90deg,#162216f2 25%,#1e261ec7 50%,#162216f2 75%)}[data-theme=dark] .game-fullscreen-overlay{background:#0a120a}[data-theme=dark] .game-fullscreen-bar{background:linear-gradient(135deg,#1a1a3a,#0e0e2a)}[data-theme=dark] .game-fullscreen-back{background:#1e261ecc;border-color:#ffffff26;color:#c0d0c0}[data-theme=dark] .game-fullscreen-btn{background:#1e261ecc;border-color:#58b85833;color:#a0b8a0}[data-theme=dark] .game-fullscreen-btn:hover{background:#1a3a1a99;border-color:#4a9a4a;color:#8adf8a}[data-theme=dark] .feature-card{border-color:#58b8581f!important}[data-theme=dark] .feature-card:hover{border-color:#58b85840!important}[data-theme=dark] .feature-card-green:hover{border-color:#4a9a4a!important}[data-theme=dark] .art-feature-card:hover{box-shadow:0 12px 36px #00000059!important}[data-theme=dark] .chat-input:focus{background:#161e16e6!important}[data-theme=dark] .app-header{border-bottom-color:#ffffff4d}[data-theme=dark] .home-bg-pattern{background-image:radial-gradient(circle at 20% 80%,#4a9a4a0f 0,#0000 50%),radial-gradient(circle at 80% 20%,#6dcc6d0a 0,#0000 50%),radial-gradient(circle at 50% 50%,#58b85808 0,#0000 60%)}[data-theme=dark] .topic-chip:hover{background:#1a3a1a99!important;border-color:#4a9a4a!important;color:#8adf8a!important}[data-theme=dark] .progress-bar-bg{background:#162216cc}[data-theme=dark] .highlight-stripe{background:linear-gradient(90deg,#0000,#58b8581f 20%,#6dcc6d12 50%,#58b8581f 80%,#0000)}[data-theme=dark] .hover-lift:hover{box-shadow:0 12px 32px #0000004d}[data-theme=dark] .empty-state{color:#a0b8a0}[data-theme=dark] .slide-panel{background:#121a12f5}[data-theme=dark] .divider{border-color:#58b8581f}[data-theme=dark] .list-item{border-bottom-color:#58b85814}[data-theme=dark] .night-mode-hint{background:linear-gradient(135deg,#0a0a1e10,#0a102e10);border-color:#1e283c4d!important}[data-theme=dark] .feature-card-v3:before{background:linear-gradient(90deg,#0000,#ffffff0f 50%,#0000)}[data-theme=dark] .art-feature-card:before{background:linear-gradient(90deg,#0000,#ffffff0d 50%,#0000)}[data-theme=dark] .input::placeholder{color:#4a6a4a}[data-theme=dark] .ripple-effect:after{background:radial-gradient(circle,#58b85840 0,#0000 70%)}[data-theme=dark] .game-area{background:#121a1280}[data-theme=dark] .game-card{background:#1e261ec7;border-color:#58b8581f}[data-theme=dark] .game-card:hover{background:#242e24d1;border-color:#58b85840}[data-theme=dark] .safe-area-bottom{background:#121a12e6}@keyframes sliceTrail{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.3) translate(-50%,-50%)}}@keyframes screenFlash{0%{opacity:.7}40%{opacity:0}to{opacity:0}}@keyframes noteComet{0%{opacity:.6;transform:scale(1.4) translate(-50%)}to{opacity:0;transform:scale(.3) translate(-50%,20px)}}@keyframes judgmentPop{0%{opacity:0;transform:translate(-50%) scale(.3)}40%{opacity:1;transform:translate(-50%,-8px) scale(1.4)}70%{opacity:.9;transform:translate(-50%,-12px) scale(.95)}to{opacity:0;transform:translate(-50%,-20px) scale(1)}}@keyframes beatPulse{0%{opacity:.08}50%{opacity:.18}to{opacity:.08}}@keyframes popRingExpand{0%{border-width:4px;opacity:.8;transform:translate(-50%,-50%) scale(.3)}to{border-width:.5px;opacity:0;transform:translate(-50%,-50%) scale(2.5)}}@keyframes waveClearPulse{0%{box-shadow:0 0 0 0 #8b5cf680;transform:scale(1)}50%{box-shadow:0 0 30px #8b5cf64d;transform:scale(1.03)}to{box-shadow:0 0 0 0 #8b5cf600;transform:scale(1)}}@keyframes lineClearParticle{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(30px,-60px) scale(0);transform:translate(var(--px,30px),var(--py,-60px)) scale(0)}}@keyframes lockFlash{0%{box-shadow:inset 0 0 20px #fff9}to{box-shadow:inset 0 0 0 #fff0}}@keyframes levelUpBurst{0%{opacity:1;transform:scale(0)}60%{opacity:.8;transform:scale(1.15)}to{opacity:0;transform:scale(1)}}@keyframes rageFlash{0%{opacity:.5;transform:translate(0)}10%{opacity:.3;transform:translate(-4px,2px)}20%{opacity:.4;transform:translate(3px,-1px)}30%{opacity:.2;transform:translate(-2px,-2px)}40%{opacity:.35;transform:translate(1px,3px)}50%{opacity:.15;transform:translate(-3px,-1px)}60%{opacity:.3;transform:translate(2px,1px)}70%{opacity:.1;transform:translate(-1px,-2px)}to{opacity:0;transform:translate(0)}}@keyframes comboPillar{0%{opacity:.9;transform:translate(-50%,-50%) scale(.2)}to{opacity:0;transform:translate(-50%,-50%) scale(2)}}@keyframes particleTrailPulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.6)}}@keyframes haloBreathe{0%,to{opacity:.15;transform:translate(-50%,-50%) scale(1)}50%{opacity:.35;transform:translate(-50%,-50%) scale(1.3)}}@keyframes phaseTransitionFlash{0%{opacity:.4}to{opacity:0}}@keyframes brushPulse{0%,to{opacity:.15}50%{opacity:.35}}.gpu-layer{backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(0);will-change:transform,opacity}.global-particles-canvas{height:100vh;left:0;opacity:.55;pointer-events:none;position:fixed;top:0;width:100vw;z-index:0;z-index:var(--z-bg)}@keyframes ambientGlow{0%,to{filter:blur(40px) brightness(1);opacity:.5}50%{filter:blur(60px) brightness(1.15);opacity:.8}}@keyframes card3DFloat{0%,to{transform:perspective(800px) rotateX(0deg) rotateY(0deg) translateY(0)}25%{transform:perspective(800px) rotateX(2deg) rotateY(-2deg) translateY(-4px)}50%{transform:perspective(800px) rotateX(0deg) rotateY(0deg) translateY(-2px)}75%{transform:perspective(800px) rotateX(-1deg) rotateY(2deg) translateY(-3px)}}@keyframes flowingBorder{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.flowing-border-wrap{animation:flowingBorder 4s linear infinite;background:linear-gradient(270deg,#2d5a2d,#4a9a4a,#6dcc6d,#8adf8a,#a8eea8,#8adf8a,#6dcc6d,#4a9a4a,#2d5a2d);background-size:600% 100%;border-radius:16px;border-radius:var(--radius-md);padding:2px;position:relative}.flowing-border-wrap>*{background:#fff9;background:var(--bg-card);border-radius:14px;border-radius:calc(var(--radius-md) - 2px)}.glass-premium{backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);background:#ffffff8c;border:1px solid #ffffff73;box-shadow:0 4px 24px #1a3a1a0f,inset 0 1px 0 #fff9}[data-theme=dark] .glass-premium{background:#1e261eb3;border-color:#ffffff14;box-shadow:0 4px 24px #0003,inset 0 1px 0 #ffffff0a}.text-glow{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#2d5a2d,#4a9a4a,#6dcc6d);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 2px 4px rgba(74,154,74,.3));text-shadow:none}@keyframes textGlowPulse{0%,to{filter:drop-shadow(0 2px 4px rgba(74,154,74,.3))}50%{filter:drop-shadow(0 2px 12px rgba(74,154,74,.55))}}.text-glow-pulse{animation:textGlowPulse 3s ease-in-out infinite}@keyframes springIn{0%{opacity:0;transform:scale(.6) translateY(16px)}50%{opacity:1;transform:scale(1.08) translateY(-4px)}70%{transform:scale(.96) translateY(2px)}85%{transform:scale(1.02) translateY(-1px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes slideUpEase{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftIn{0%{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:translateX(0)}}@keyframes slideRightIn{0%{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)}}@keyframes zoomIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes blurIn{0%{filter:blur(8px);opacity:0}to{filter:blur(0);opacity:1}}.hover-float{transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease}.hover-float:hover{box-shadow:0 12px 32px #1a3a1a1f;transform:translateY(-6px)}.hover-float:active{transform:translateY(-2px) scale(.97);transition:transform .1s ease}.press-scale{transition:transform .15s cubic-bezier(.34,1.56,.64,1)}.press-scale:active{transform:scale(.93)}@keyframes magneticSnap{0%{transform:scale(1)}30%{transform:scale(1.04)}60%{transform:scale(.97)}to{transform:scale(1)}}@keyframes softGlow{0%,to{box-shadow:0 0 8px #4a9a4a33,0 0 24px #4a9a4a14}50%{box-shadow:0 0 16px #4a9a4a59,0 0 48px #4a9a4a29}}.animate-soft-glow{animation:softGlow 3s ease-in-out infinite}@keyframes wavePulse{0%{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes bounceDot{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes stardustSpin{0%{transform:rotate(0deg) translateX(8px) rotate(0deg)}to{transform:rotate(1turn) translateX(8px) rotate(-1turn)}}@keyframes lightTrail{0%{opacity:0;transform:translate(0) scale(.3)}20%{opacity:.8;transform:translate(12px,-16px) scale(1.2)}40%{opacity:.6;transform:translate(-8px,-32px) scale(.9)}60%{opacity:.9;transform:translate(16px,-20px) scale(1.1)}80%{opacity:.3;transform:translate(-12px,-36px) scale(.6)}to{opacity:0;transform:translate(4px,-48px) scale(.2)}}@keyframes bubbleFloatPremium{0%{opacity:0;transform:translateY(0) translateX(0) scale(.6)}10%{opacity:.7;transform:translateY(-8px) translateX(4px) scale(1)}40%{opacity:.55;transform:translateY(-30px) translateX(-8px) scale(1.05)}70%{opacity:.25;transform:translateY(-55px) translateX(12px) scale(.9)}to{opacity:0;transform:translateY(-80px) translateX(-4px) scale(.5)}}@keyframes polygonFloat{0%,to{opacity:.06;transform:translate(0) rotate(0deg) scale(1)}25%{opacity:.09;transform:translate(15px,-10px) rotate(5deg) scale(1.05)}50%{opacity:.07;transform:translate(-10px,-5px) rotate(-3deg) scale(.95)}75%{opacity:.08;transform:translate(-15px,5px) rotate(2deg) scale(1.02)}}@keyframes blobDrift{0%{transform:translate(0) scale(1) rotate(0deg)}33%{transform:translate(3%,-2%) scale(1.1) rotate(3deg)}66%{transform:translate(-2%,3%) scale(.95) rotate(-2deg)}to{transform:translate(0) scale(1) rotate(0deg)}}.stagger-list>*{animation:staggerItemIn .5s cubic-bezier(.34,1.56,.64,1) forwards;opacity:0}.stagger-list>:first-child{animation-delay:.05s}.stagger-list>:nth-child(2){animation-delay:.1s}.stagger-list>:nth-child(3){animation-delay:.15s}.stagger-list>:nth-child(4){animation-delay:.2s}.stagger-list>:nth-child(5){animation-delay:.25s}.stagger-list>:nth-child(6){animation-delay:.3s}.stagger-list>:nth-child(7){animation-delay:.35s}.stagger-list>:nth-child(8){animation-delay:.4s}.stagger-list>:nth-child(9){animation-delay:.45s}.stagger-list>:nth-child(10){animation-delay:.5s}@keyframes staggerItemIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes particleExplosion{0%{opacity:1;transform:translate(0) scale(1.5) rotate(0deg)}40%{opacity:.8;transform:translate(20px,-20px) scale(1) rotate(90deg);transform:translate(var(--px,20px),var(--py,-20px)) scale(1) rotate(var(--pr,90deg))}to{opacity:0;transform:translate(40px,-50px) scale(.2) rotate(180deg);transform:translate(var(--px2,40px),var(--py2,-50px)) scale(.2) rotate(var(--pr2,180deg))}}@keyframes scoreFloatUp{0%{opacity:0;transform:translateY(0) scale(.5)}20%{opacity:1;transform:translateY(-8px) scale(1.2)}to{opacity:0;transform:translateY(-40px) scale(1)}}@keyframes lineClearGlow{0%{filter:brightness(1) blur(0);opacity:0}30%{filter:brightness(2.5) blur(2px);opacity:1}to{filter:brightness(1) blur(8px);opacity:0}}@keyframes pageEnterPremium{0%{filter:blur(2px);opacity:0;transform:scale(.96) translateY(12px)}to{filter:blur(0);opacity:1;transform:scale(1) translateY(0)}}@keyframes modalPopIn{0%{opacity:0;transform:scale(.8) translateY(20px)}60%{opacity:1;transform:scale(1.03) translateY(-4px)}80%{transform:scale(.98) translateY(1px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes fadeUpSoft{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes rainbowFlow{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.rainbow-border{animation:rainbowFlow 6s linear infinite;background:linear-gradient(270deg,#ff6b6b,#ffd93d,#6bcb77,#4d96ff,#ff6b6b,#ffd93d,#6bcb77,#4d96ff);background-size:800% 100%}@keyframes gridShimmer{0%,to{opacity:.03}50%{opacity:.08}}@keyframes iceRefract{0%{opacity:.3;transform:translateX(-10%) rotate(-5deg) skewX(-3deg)}50%{opacity:.7;transform:translateX(10%) rotate(5deg) skewX(3deg)}to{opacity:.3;transform:translateX(-10%) rotate(-5deg) skewX(-3deg)}}@keyframes energyRipple{0%{border-width:3px;opacity:.8;transform:scale(.5)}to{border-width:.5px;opacity:0;transform:scale(3)}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.anim-delay-1{animation-delay:.1s}.anim-delay-2{animation-delay:.2s}.anim-delay-3{animation-delay:.3s}.anim-delay-4{animation-delay:.4s}.anim-delay-5{animation-delay:.5s}.anim-delay-6{animation-delay:.6s}.anim-delay-7{animation-delay:.7s}.anim-delay-8{animation-delay:.8s}.anim-spring-in{animation:springIn .6s cubic-bezier(.34,1.56,.64,1) both}.anim-slide-up{animation:slideUpEase .5s cubic-bezier(.16,1,.3,1) both}.anim-slide-left{animation:slideLeftIn .45s cubic-bezier(.16,1,.3,1) both}.anim-slide-right{animation:slideRightIn .45s cubic-bezier(.16,1,.3,1) both}.anim-zoom-in{animation:zoomIn .4s cubic-bezier(.16,1,.3,1) both}.anim-blur-in{animation:blurIn .5s ease both}.anim-fade-up{animation:fadeUpSoft .4s ease both}.anim-score-float{animation:scoreFloatUp .8s ease-out forwards}.anim-particle-burst{animation:particleExplosion .7s ease-out forwards}.anim-float-inf{animation:float 3s ease-in-out infinite}.anim-breathe-inf{animation:softBreathe 3s ease-in-out infinite}.anim-glow-inf{animation:softGlow 3s ease-in-out infinite}.anim-pulse-inf{animation:pulse 2s ease-in-out infinite}@keyframes streakFlicker{0%,to{transform:scale(1) rotate(-3deg)}50%{transform:scale(1.18) rotate(4deg)}}@keyframes streakBurst{0%{box-shadow:0 0 0 0 #ffa04680;transform:scale(1)}40%{box-shadow:0 0 0 12px #ffa04600;transform:scale(1.22)}to{box-shadow:0 0 0 0 #ffa04600;transform:scale(1)}}.streak-fire{will-change:transform}.streak-fire-burst{animation:streakBurst .8s ease-out 3}