@font-face{font-family:"Baloo 2";font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/baloo2-latin-ext-400-800.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Baloo 2";font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/baloo2-latin-400-800.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Fredoka One;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/fredoka-one-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Patrick Hand;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/patrick-hand-latin-ext-400.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Patrick Hand;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/patrick-hand-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg-primary: #F4E4C1;--bg-secondary: #ECD4A6;--bg-tertiary: #FFF8E7;--accent-primary: #4FC3F7;--accent-primary-hover: #39A8DB;--accent-primary-glow: rgba(79, 195, 247, .3);--accent-primary-subtle: rgba(79, 195, 247, .1);--accent-secondary: #FF6B9D;--accent-secondary-hover: #F43F5E;--accent-secondary-glow: rgba(255, 107, 157, .3);--color-success: #10B981;--color-success-subtle: rgba(16, 185, 129, .1);--color-success-text: #059669;--color-error: #EF4444;--color-error-subtle: rgba(239, 68, 68, .1);--color-warning: #F59E0B;--color-warning-subtle: rgba(245, 158, 11, .1);--color-info: #3B82F6;--color-info-subtle: rgba(59, 130, 246, .1);--text-primary: #3E2E1F;--text-secondary: #6B5A48;--text-tertiary: #9E8B76;--text-muted: #B0A08C;--text-on-color: #FFFFFF;--border-default: #E9ECEF;--border-interactive: #D5D8DC;--parasol-blue: #B8E6FC;--parasol-pink: #FFC4D9;--parasol-yellow: #FFF0B8;--parasol-green: #C8E6C9;--gradient-primary: linear-gradient(135deg, var(--accent-primary) 0%, var(--accent-secondary) 100%);--gradient-bg: linear-gradient(180deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);--power-wave: #0277BD;--power-wave-bg: linear-gradient(135deg, rgba(225, 245, 254, .9), rgba(179, 229, 252, .9));--power-wave-border: rgba(79, 195, 247, .4);--power-buoy: #E65100;--power-buoy-bg: linear-gradient(135deg, rgba(255, 243, 224, .9), rgba(255, 224, 178, .9));--power-buoy-border: rgba(255, 152, 0, .4);--power-bigbuoy: #BF360C;--power-bigbuoy-bg: linear-gradient(135deg, rgba(255, 243, 224, .92), rgba(255, 204, 128, .92));--power-bigbuoy-border: rgba(230, 81, 0, .45);--power-fog: #546E7A;--power-fog-bg: linear-gradient(135deg, rgba(236, 239, 241, .92), rgba(207, 216, 220, .92));--power-fog-border: rgba(144, 164, 174, .45);--power-net: #5D4037;--power-net-bg: linear-gradient(135deg, rgba(215, 204, 200, .92), rgba(188, 170, 164, .92));--power-net-border: rgba(141, 110, 99, .45);--power-shield: #B8860B;--power-shield-bg: linear-gradient(135deg, rgba(255, 248, 220, .92), rgba(255, 215, 0, .25));--power-shield-border: rgba(218, 165, 32, .45);--blur-sm: blur(12px);--blur-md: blur(24px);--blur-lg: blur(32px);--z-base: 0;--z-above: 1;--z-toast: 50;--z-picker: 30;--z-overlay: 100;--z-modal: 1000;--accent-primary-rgb: 79, 195, 247;--accent-secondary-rgb: 255, 107, 157;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .08), 0 2px 4px -2px rgba(0, 0, 0, .04);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -4px rgba(0, 0, 0, .03);--shadow-glow-blue: 0 0 20px var(--accent-primary-glow);--shadow-glow-success: 0 0 20px rgba(16, 185, 129, .3);--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 18px;--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--font-family: "Baloo 2", cursive;--font-weight-normal: 400;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-display: 3rem;--font-size-h1: 2.25rem;--font-size-h2: 1.5rem;--font-size-h3: 1.25rem;--font-size-body-lg: 1.125rem;--font-size-body: 1rem;--font-size-body-sm: .875rem;--font-size-caption: .75rem;--font-size-grid-letter: 2rem;--font-size-grid-number: .688rem;--font-size-score: 2.5rem;--font-size-stat: 1.5rem;--line-height-tight: 1.1;--line-height-snug: 1.2;--line-height-normal: 1.4;--line-height-relaxed: 1.6;--spacing-section: 48px;--spacing-element: 24px;--spacing-paragraph: 12px;--touch-target-min: 44px;--touch-target-comfortable: 48px}.cell-state-empty{background-color:var(--bg-tertiary);border-color:var(--border-default)}.cell-state-active{border-color:var(--accent-primary);background-color:var(--accent-primary-subtle);box-shadow:var(--shadow-glow-blue)}.cell-state-correct{border-color:var(--color-success);background-color:var(--color-success-subtle);box-shadow:var(--shadow-glow-success)}.cell-state-incorrect{border-color:var(--color-error);background-color:var(--color-error-subtle)}.btn{border:1px solid rgba(255,255,255,.35);border-radius:16px;padding:.75rem 1.5rem;font-size:1rem;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.02em;cursor:pointer;background:linear-gradient(135deg,#ffffff4d,#4fc3f726);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 4px 20px #4fc3f726,inset 0 1px #fff6;position:relative;transition:all .35s cubic-bezier(.34,1.56,.64,1)}.btn:hover{transform:translateY(-3px);box-shadow:0 8px 32px #4fc3f740,inset 0 1px #ffffff80}.btn:active{transform:translateY(0) scale(.97);box-shadow:0 2px 10px #4fc3f71a;transition:all .1s ease}.btn-secondary{background:linear-gradient(135deg,#fff6,#4fc3f71a);border:1px solid rgba(255,255,255,.45);color:var(--text-primary)}.btn-secondary:hover{background:linear-gradient(135deg,#ffffff80,#4fc3f733);border-color:#fff9;box-shadow:0 8px 32px #4fc3f726,inset 0 1px #ffffff80}.btn-primary{background:linear-gradient(135deg,#ffffff59,#4fc3f759);border:1px solid rgba(255,255,255,.4);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.15);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.btn-primary:hover{background:linear-gradient(135deg,#ffffff73,#4fc3f773);border-color:#ffffff8c;box-shadow:0 8px 32px #4fc3f74d,inset 0 1px #ffffff80}.btn-social{background:linear-gradient(135deg,#ffffff4d,#ff6b9d4d);border:1px solid rgba(255,255,255,.35);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.15);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.btn-social:hover{background:linear-gradient(135deg,#fff6,#ff6b9d66);border-color:#ffffff80;box-shadow:0 8px 32px #ff6b9d40,inset 0 1px #ffffff80}.btn-help{background:linear-gradient(135deg,#ffffff4d,#f59e0b4d);border:1px solid rgba(255,255,255,.35);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.15);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.btn-help:hover{background:linear-gradient(135deg,#fff6,#f59e0b66);border-color:#ffffff80;box-shadow:0 8px 32px #f59e0b40,inset 0 1px #ffffff80}.btn-ghost{background:linear-gradient(135deg,#fff3,#4fc3f71a);border:1px solid rgba(255,255,255,.3);color:var(--accent-primary);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.btn-ghost:hover{background:linear-gradient(135deg,#ffffff4d,#4fc3f733);border-color:#ffffff73;box-shadow:0 8px 32px #4fc3f733,inset 0 1px #fff6}.btn-disabled,.btn:disabled{background:#ffffff26;border:1px solid rgba(255,255,255,.2);color:var(--text-tertiary);cursor:not-allowed;box-shadow:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);text-shadow:none}.btn-disabled:hover,.btn:disabled:hover{transform:none;box-shadow:none;background:#ffffff26}.gamification-streak{border-color:var(--color-warning);color:var(--color-warning)}.gamification-score{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.gamification-progress{background-color:var(--bg-tertiary)}.gamification-progress-fill,.gamification-badge{background:var(--gradient-primary)}@keyframes goldenPulse{0%,to{box-shadow:0 0 #d4b87a33}50%{box-shadow:0 0 0 6px #d4b87a1a}}*{box-sizing:border-box;margin:0;padding:0}:root{font-family:var(--font-family);line-height:1.5;font-weight:var(--font-weight-normal);color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh;min-width:320px;background-color:var(--bg-primary)}#root{min-height:100vh;display:flex;flex-direction:column}h1,h2,h3{line-height:1.2;color:var(--text-primary)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-interactive);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}::selection{background-color:#d4c4a0;color:var(--text-primary)}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.text-display{font-size:var(--font-size-display);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight)}h1,.text-h1{font-size:var(--font-size-h1);font-weight:var(--font-weight-bold);line-height:var(--line-height-snug)}h2,.text-h2{font-size:var(--font-size-h2);font-weight:var(--font-weight-bold);line-height:1.3}h3,.text-h3{font-size:var(--font-size-h3);font-weight:var(--font-weight-semibold);line-height:var(--line-height-normal)}.text-body-lg{font-size:var(--font-size-body-lg);font-weight:var(--font-weight-medium);line-height:var(--line-height-relaxed)}.text-body{font-size:var(--font-size-body);font-weight:var(--font-weight-normal);line-height:var(--line-height-relaxed)}.text-body-sm{font-size:var(--font-size-body-sm);font-weight:var(--font-weight-normal);line-height:1.5;color:var(--text-secondary)}.text-caption{font-size:var(--font-size-caption);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);color:var(--text-tertiary);letter-spacing:.05em;text-transform:uppercase}.text-grid-letter{font-size:var(--font-size-grid-letter);font-weight:var(--font-weight-semibold);color:var(--text-primary)}.text-grid-number{font-size:var(--font-size-grid-number);font-weight:var(--font-weight-semibold);color:var(--text-secondary)}.text-score{font-size:var(--font-size-score);font-weight:var(--font-weight-bold);line-height:1}.text-stat{font-size:var(--font-size-stat);font-weight:var(--font-weight-bold)}@media(max-width:1024px){.text-display{font-size:calc(var(--font-size-display) * .9)}h1,.text-h1{font-size:calc(var(--font-size-h1) * .9)}}@media(max-width:768px){.text-display{font-size:calc(var(--font-size-display) * .8)}h1,.text-h1{font-size:calc(var(--font-size-h1) * .8)}}.logo{display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.logo-small{position:relative;--logo-scale: .45;width:calc(600px * var(--logo-scale));height:calc(120px * var(--logo-scale));overflow:visible}.logo-scene-mini{position:absolute;top:0;left:0;display:flex;align-items:flex-end;transform:scale(var(--logo-scale, .45));transform-origin:top left;pointer-events:none}.logo-scene-mini .tile{animation:none!important;opacity:1;transform:rotate(var(--rot, 0deg));transition:none}.logo-scene-mini .buoy-wrap{animation:none!important;transform:translate(-50%,-50%)}.logo-scene-mini .tile:hover{cursor:default;transform:rotate(var(--rot, 0deg))!important}.logo-clickable{cursor:pointer;transition:transform .2s ease}.logo-clickable:hover{transform:scale(1.05)}.logo-large{height:auto}.logo-scene{position:relative;z-index:20;display:flex;flex-direction:column;align-items:center;overflow:visible;transform:scale(.65);transform-origin:center center;margin:-38px 0 -40px}.logo-row{display:flex;align-items:flex-end;gap:0px;overflow:visible;padding:50px 20px 40px}.parasol-arrow{position:absolute;right:100%;top:50%;transform:translateY(-50%);width:50px;height:50px;margin-right:4px;z-index:20;pointer-events:none;opacity:1;animation:parasol-bob 5s ease-in-out infinite;filter:drop-shadow(0 3px 6px rgba(0,0,0,.15))}@keyframes parasol-enter{0%{opacity:0;transform:translateY(-50%) translate(-20px) rotate(-10deg)}to{opacity:1;transform:translateY(-50%) translate(0) rotate(0)}}@keyframes parasol-bob{0%,to{transform:translateY(-50%) translate(0) rotate(-3deg)}45%{transform:translateY(-50%) translate(-6px) rotate(2deg)}}.parasol-arrow-down{position:absolute;top:-44px;left:50%;transform:translate(-50%);width:44px;height:44px;z-index:20;pointer-events:none;opacity:1;animation:parasol-down-bob 5.5s ease-in-out infinite;filter:drop-shadow(0 3px 6px rgba(0,0,0,.15))}@keyframes parasol-down-enter{0%{opacity:0;transform:translate(-50%) translateY(-16px) rotate(8deg)}to{opacity:1;transform:translate(-50%) translateY(0) rotate(0)}}@keyframes parasol-down-bob{0%,to{transform:translate(-50%) translateY(0) rotate(2deg)}45%{transform:translate(-50%) translateY(-5px) rotate(-2deg)}}.tile{position:relative;overflow:visible;flex-shrink:0;opacity:1;animation:tileFloat var(--fd, 3s) ease-in-out infinite;will-change:transform;transition:transform .22s cubic-bezier(.34,1.56,.64,1)}.tile-m{--dd:.05s;--fd:6.8s;--rot:-4deg;--r0:-4deg;--r1:0deg;--r2:1.5deg;--r3:-1deg;width:108px;height:108px;margin-bottom:0;margin-right:-20px;z-index:1}.tile-o{--dd:.15s;--fd:5.4s;--rot: 3deg;--r0:3deg;--r1:5deg;--r2:1.5deg;--r3:4deg;width:96px;height:96px;margin-bottom:22px;margin-right:-18px;z-index:2}.tile-f{--dd:.24s;--fd:7.4s;--rot:-6deg;--r0:-6deg;--r1:-3.5deg;--r2:-1deg;--r3:-5deg;width:102px;height:102px;margin-bottom:8px;margin-right:-20px;z-index:3}.tile-l{--dd:.1s;--fd:6.2s;--rot: 5deg;--r0:5deg;--r1:2deg;--r2:6.5deg;--r3:3deg;width:88px;height:88px;margin-bottom:32px;margin-right:-16px;z-index:4}.tile-e{--dd:.3s;--fd:7.6s;--rot:-2deg;--r0:-2deg;--r1:.5deg;--r2:-3deg;--r3:1deg;width:106px;height:106px;margin-bottom:0;margin-right:-20px;z-index:5}.tile-c{--dd:.2s;--fd:5.8s;--rot: 6deg;--r0:6deg;--r1:4deg;--r2:8deg;--r3:5deg;width:102px;height:102px;margin-bottom:14px;margin-right:-20px;z-index:6}.tile-h{--dd:.36s;--fd:6.4s;--rot:-3deg;--r0:-3deg;--r1:1deg;--r2:-2deg;--r3:-2.5deg;width:112px;height:112px;margin-bottom:0;z-index:7}@keyframes tileDrop{0%{transform:translateY(-380px) rotate(calc(var(--rot, -2deg) - 20deg)) scale(.55);opacity:0}60%{opacity:1}to{transform:translateY(0) rotate(var(--rot, 0deg)) scale(1);opacity:1}}@keyframes tileFloat{0%{transform:translateY(0) rotate(var(--r0, -2deg))}28%{transform:translateY(-6px) rotate(var(--r1, 1deg))}55%{transform:translateY(-10px) rotate(var(--r2, 2.5deg))}78%{transform:translateY(-4px) rotate(var(--r3, -.5deg))}to{transform:translateY(0) rotate(var(--r0, -2deg))}}.tile-glass{position:absolute;inset:0;border-radius:20px;background:#ffffff61;backdrop-filter:blur(20px) saturate(1.6) brightness(1.06);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.06);border:2px solid rgba(255,255,255,.78);border-top-color:#fffffff7;border-left-color:#ffffffe0;box-shadow:0 14px 44px #00000024,0 3px 10px #00000014,inset 0 2px #fffffff2,inset 0 -2px #8cc3e61f;overflow:hidden;transition:box-shadow .22s ease,transform .22s ease}.tile-glass:before{content:"";position:absolute;top:5px;left:8px;right:8px;height:45%;background:linear-gradient(180deg,#ffffffa6,#fff0);border-radius:12px 12px 50% 50%;pointer-events:none}.tile-glass:after{content:"";position:absolute;bottom:0;left:0;right:0;height:28%;background:linear-gradient(0deg,rgba(130,190,228,.12) 0%,transparent 100%);border-radius:0 0 20px 20px;pointer-events:none}.tile:hover{animation-play-state:paused;cursor:pointer;transform:translateY(-8px) scale(1.12) rotate(0)!important}.tile:hover .tile-glass{box-shadow:0 22px 60px #0003,0 6px 18px #0000001a,inset 0 2px #fffffff2}.tile-shadow{position:absolute;bottom:-24px;left:12%;width:76%;height:13px;background:#1c589e33;border-radius:50%;filter:blur(7px);animation:shadowPulse var(--fd, 3s) ease-in-out infinite}@keyframes shadowPulse{0%,to{transform:scaleX(1);opacity:.52}55%{transform:scaleX(.52);opacity:.16}}.splash:before,.splash:after{content:"";position:absolute;bottom:-16px;left:50%;width:56px;height:15px;margin-left:-28px;border:2px solid rgba(255,255,255,.7);border-radius:50%;animation:none;opacity:0}@keyframes splashRing{0%{transform:scale(.18);opacity:.88}to{transform:scale(4.2);opacity:0}}.tile-letter{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:Fredoka One,cursive;line-height:1;z-index:10;-webkit-text-stroke:7px white;paint-order:stroke fill;white-space:nowrap;pointer-events:none;transition:filter .22s ease;filter:drop-shadow(0 5px 4px rgba(0,0,0,.22)) drop-shadow(0 14px 26px rgba(0,0,0,.13))}.tile-m .tile-letter{font-size:82px}.tile-f .tile-letter{font-size:76px}.tile-l .tile-letter{font-size:65px}.tile-e .tile-letter{font-size:80px}.tile-c .tile-letter{font-size:76px}.tile-h .tile-letter{font-size:85px}.letter-blue{color:#5ba3d9}.letter-pink{color:#f06292}.letter-green{color:#81c784}.letter-yellow{color:#f4b800}.buoy-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:84px;height:84px;object-fit:contain;z-index:10;pointer-events:none;transition:filter .22s ease;filter:drop-shadow(0 5px 4px rgba(0,0,0,.22)) drop-shadow(0 14px 26px rgba(0,0,0,.13));animation:buoySpin 36s ease-in-out infinite}@keyframes buoySpin{0%{transform:translate(-50%,-50%) rotate(0)}28%{transform:translate(-50%,-50%) rotate(280deg)}42%{transform:translate(-50%,-50%) rotate(160deg)}70%{transform:translate(-50%,-50%) rotate(520deg)}82%{transform:translate(-50%,-50%) rotate(380deg)}to{transform:translate(-50%,-50%) rotate(720deg)}}.star{position:absolute;pointer-events:none;z-index:15;font-size:16px;animation:starTwinkle ease-in-out infinite}@keyframes starTwinkle{0%,to{opacity:0;transform:scale(.2) rotate(0)}40%{opacity:1;transform:scale(1.2) rotate(20deg)}60%{opacity:.9;transform:scale(1) rotate(30deg)}}.star-1{top:15px;left:30px;color:#ffd54f;font-size:18px;text-shadow:0 0 8px #FFD54F,0 0 18px #FFD54F;animation-duration:2.8s;animation-delay:0s}.star-2{bottom:25px;left:80px;color:#5ba3d9;font-size:13px;text-shadow:0 0 8px #5BA3D9,0 0 18px #5BA3D9;animation-duration:2.3s;animation-delay:.7s}.star-3{top:-15px;left:300px;color:#f06292;font-size:20px;text-shadow:0 0 8px #F06292,0 0 18px #F06292;animation-duration:3.1s;animation-delay:1.4s}.star-5{bottom:20px;right:60px;color:#ffd54f;font-size:16px;text-shadow:0 0 8px #FFD54F,0 0 18px #FFD54F;animation-duration:3.4s;animation-delay:1.9s}.star-7{top:-8px;right:25px;color:#f06292;font-size:15px;text-shadow:0 0 8px #F06292,0 0 18px #F06292;animation-duration:2.9s;animation-delay:2.2s}.star-l1{top:72%;left:-18px;color:#81c784;font-size:14px;text-shadow:0 0 8px #81C784,0 0 18px #81C784;animation-duration:3.3s;animation-delay:.4s}.star-l2{top:62%;left:10px;color:#ffd54f;font-size:11px;text-shadow:0 0 8px #FFD54F,0 0 18px #FFD54F;animation-duration:2.5s;animation-delay:1.6s}.star-r1{top:38%;right:-15px;color:#5ba3d9;font-size:15px;text-shadow:0 0 8px #5BA3D9,0 0 18px #5BA3D9;animation-duration:2.7s;animation-delay:.9s}.star-r2{top:58%;right:12px;color:#f4b800;font-size:12px;text-shadow:0 0 8px #F4B800,0 0 18px #F4B800;animation-duration:3.5s;animation-delay:2.5s}@media(prefers-reduced-motion:reduce){.tile{animation:none!important;transform:rotate(var(--rot, 0deg));opacity:1}.parasol-arrow,.parasol-arrow-down{animation:none!important;opacity:1}.tile-shadow,.buoy-wrap,.star{animation:none!important}.splash:before,.splash:after{animation:none!important}}@media(max-width:600px){.logo-scene{transform:scale(.5);margin:-50px 0 -52px}}.grid-miniature-wrapper{transform:rotate(-2.5deg) scale(1.05);background:#ffffff08;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:7px;box-shadow:none;display:flex;flex-direction:column;align-items:center;gap:5px}.grid-miniature{display:grid;gap:1px;width:140px;height:140px}.mini-cell{border-radius:1.5px}.mini-cell-clue{opacity:.9}.mini-parasol-0{background:#96d6facc}.mini-parasol-1{background:#ffb4cfcc}.mini-parasol-2{background:#ffe491cc}.mini-parasol-3{background:#a5dca8cc}.mini-cell-answer{background-color:#ecd4a673;display:flex;align-items:center;justify-content:center;overflow:hidden}.mini-cell-letter{font-family:var(--font-family);font-size:6px;font-weight:800;color:#d4b87a;line-height:1;text-transform:uppercase;filter:blur(.8px);-webkit-user-select:none;user-select:none}.mini-cell-empty{background-color:transparent}.shell-rating{display:inline-flex;gap:2px;align-items:center}.shell{transition:all .8s ease-out;font-size:inherit;display:inline-block}.shell-active{opacity:1;transform:scale(1);filter:none}.shell-inactive{opacity:.45;transform:scale(.85);filter:grayscale(80%) sepia(30%)}.shell-rating-sm .shell{font-size:.85rem}.shell-rating-md .shell{font-size:.58rem}.shell-rating-lg .shell{font-size:.72rem}@keyframes shellPop{0%{opacity:0;transform:scale(0)}70%{opacity:1;transform:scale(1.3)}to{opacity:1;transform:scale(1)}}.shell-pop{animation:shellPop .4s cubic-bezier(.34,1.56,.64,1) forwards}.shell-threatened{animation:shellTremble 1.4s ease-in-out infinite}@keyframes shellTremble{0%,to{transform:scale(1) rotate(0) translateY(0)}25%{transform:scale(1) rotate(calc(var(--shell-urgency, 0) * -3.5deg)) translateY(calc(var(--shell-urgency, 0) * -.5px))}50%{transform:scale(1) rotate(calc(var(--shell-urgency, 0) * 1.5deg)) translateY(0)}75%{transform:scale(1) rotate(calc(var(--shell-urgency, 0) * -2deg)) translateY(calc(var(--shell-urgency, 0) * .3px))}}.grid-carousel{display:flex;align-items:center;justify-content:center;gap:2rem;outline:none;margin-bottom:.4rem}.carousel-arrow{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:#ffffff40;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-primary);padding:0;flex-shrink:0;transition:all .3s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 8px #0000000f,inset 0 1px #ffffff80}.carousel-arrow:hover:not(:disabled){background:#ffffff61;border-color:#ffffff8c;transform:scale(1.08)}.carousel-arrow:disabled{opacity:.3;cursor:default}.carousel-track{position:relative;overflow:visible;max-width:200px;cursor:grab}.carousel-track:active{cursor:grabbing}.carousel-item-active{position:relative}.carousel-item-exiting{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .35s ease}.carousel-item-active.slide-in-right{animation:slide-from-right .35s cubic-bezier(.34,1.56,.64,1)}.carousel-item-active.slide-in-left{animation:slide-from-left .35s cubic-bezier(.34,1.56,.64,1)}@keyframes slide-from-right{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slide-from-left{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.carousel-grid-name{font-family:var(--font-family);font-size:.72rem;font-weight:800;color:var(--text-primary);background:#ffffff8c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:2px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.35);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:140px;text-align:center}.carousel-item-active .grid-miniature-wrapper{position:relative}.carousel-today-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;font-family:var(--font-family);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:#fff;background:#50c3ffd9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:4px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.35);white-space:nowrap;box-shadow:0 2px 8px #50c3ff59}.carousel-placeholder{width:120px;height:120px;display:flex;align-items:center;justify-content:center;background:#ffffff0f;border-radius:8px}.carousel-placeholder-spinner{width:24px;height:24px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--accent-primary, #FF9A5C);border-radius:50%;animation:carousel-spin .8s linear infinite}@keyframes carousel-spin{to{transform:rotate(360deg)}}.carousel-perf{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px;font-family:var(--font-family);margin-top:4px}.carousel-perf-time{font-size:.7rem;font-weight:700;color:#f5a623}.carousel-perf-unplayed{font-size:10px;font-weight:600;color:#f5a623}.carousel-perf-shells-grey{display:flex;gap:1px}.carousel-perf-shell-grey{font-size:.85rem;opacity:.22;transform:scale(.78);filter:grayscale(100%)}@media(max-width:600px){.carousel-arrow{width:30px;height:30px}.carousel-arrow svg{width:14px;height:14px}}.home-page{display:flex;flex-direction:column;align-items:center;padding:0 .5rem .5rem;gap:.4rem;font-family:var(--font-family);font-weight:800;width:100%;max-width:1000px;box-sizing:border-box}.home-center{display:grid;grid-template-columns:1fr 280px;gap:2rem;width:100%;max-width:none}.home-panel{background:linear-gradient(150deg,#ffffff52,#ffffff2e,#fff5f024);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border:1.5px solid rgba(255,255,255,.42);border-top-color:#ffffffbf;border-left-color:#ffffff94;border-radius:var(--radius-xl);padding:1rem 0;display:flex;flex-direction:row;align-items:stretch;justify-content:center;gap:0;overflow:hidden;box-shadow:0 8px 32px #0000000f,inset 0 1.5px #ffffffa6,inset 0 0 24px #ffffff1a}.home-panel-lb{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:.6rem .8rem;min-height:0;overflow:hidden}.home-panel-profile{flex:1;flex-basis:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 2rem;min-height:0;border-right:2px solid rgba(255,255,255,.25)}.home-panel-hint{margin:0 0 1.2rem;position:relative;z-index:1;font-family:var(--font-family);font-size:1rem;line-height:1.2;font-weight:800;color:#fff;-webkit-text-stroke:4px #D4B87A;paint-order:stroke fill;text-shadow:0 2px 4px rgba(0,0,0,.1);text-align:center}.home-panel-modes{flex:1;flex-basis:50%;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:.6rem 2rem}.home-panel-buttons{display:flex;flex-direction:column;align-items:center;gap:.5rem}.avatar-wrapper{position:relative;display:inline-block}.avatar-circle{width:125px;height:125px;border-radius:50%;border:3.5px solid #fff;display:flex;align-items:center;justify-content:center;overflow:visible;transition:background-color .3s ease,box-shadow .3s ease,border-color .3s ease;position:relative;box-shadow:0 6px 24px #0000001a,0 2px 8px #ffb4781f,inset 0 2px 4px #ffffff80,inset 0 -1px 3px #0000000a}.avatar-wrapper:hover .avatar-circle{box-shadow:0 8px 32px #0000001f,0 4px 12px #ffb4782e,inset 0 2px 4px #ffffff8c,inset 0 -1px 3px #0000000a;border-color:#fff}.avatar-img{width:110%;height:110%;object-fit:contain;position:absolute;bottom:5%;transition:transform .3s ease}.avatar-wrapper:hover .avatar-img{transform:scale(1.05)}.avatar-refresh{position:absolute;bottom:2px;right:2px;width:30px;height:30px;border-radius:50%;border:1.5px solid rgba(255,255,255,.5);border-top-color:#fffc;background:#ffffffeb;backdrop-filter:blur(12px) saturate(1.3);-webkit-backdrop-filter:blur(12px) saturate(1.3);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s cubic-bezier(.34,1.56,.64,1);padding:0;color:var(--text-primary);box-shadow:0 3px 10px #00000014,inset 0 1px #fff9}.avatar-refresh:hover{transform:scale(1.1);background:#ffffff80;border-color:#ffffffb3;box-shadow:0 4px 14px #0000001a,inset 0 1px #ffffffb3}.avatar-refresh:active{transform:scale(.95) rotate(90deg)}.pseudo-input{width:auto;min-width:120px;max-width:100%;padding:.35rem .7rem;border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.4);background:#ffffff4d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-family:var(--font-family);font-size:.85rem;font-weight:800;color:var(--text-primary);text-align:center;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.pseudo-input.pseudo-auto{color:#4a4a5266}.pseudo-input::placeholder{color:var(--text-tertiary);font-weight:var(--font-weight-normal)}.pseudo-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-primary-glow)}.pseudo-hint{font-size:.7rem;color:var(--text-tertiary);font-weight:500;margin-top:2px;animation:hintPulse 2.5s ease-in-out infinite;pointer-events:none}@keyframes hintPulse{0%,to{opacity:.55}50%{opacity:.9}}.badges-row{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:1.2rem}.streak-badge-wrapper{position:relative;display:inline-flex;justify-content:center}.streak-tooltip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%) translateY(4px);width:max-content;max-width:240px;padding:.5rem .75rem;border-radius:12px;background:linear-gradient(150deg,#fff,#fffffff2);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.6);box-shadow:0 4px 20px #00000014;font-family:var(--font-family);font-size:.62rem;font-weight:600;line-height:1.4;color:var(--text-primary);text-align:center;pointer-events:none;opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:10}.streak-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#fff9}.streak-badge-wrapper:hover .streak-tooltip{opacity:1;transform:translate(-50%) translateY(0)}.streak-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#4fc3f71f,#ff6b9d14);border:1px solid rgba(79,195,247,.25);border-radius:999px;padding:4px 14px 4px 9px}.streak-count{font-weight:900;font-size:18px;line-height:1;background:linear-gradient(135deg,#4fc3f7,#7ab8f0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.streak-label{font-weight:600;font-size:10px;color:#7c838a;margin-top:1px}.streak-wave{display:inline-block;font-size:16px;animation:streakWave 2.2s ease-in-out infinite}@keyframes streakWave{0%,to{transform:translateY(0) rotate(0)}30%{transform:translateY(-3px) rotate(-10deg)}70%{transform:translateY(1px) rotate(6deg)}}@media(prefers-reduced-motion:reduce){.streak-wave{animation:none}}.streak-badge--shell{background:linear-gradient(135deg,#ff7f501f,#ff6b6b14);border-color:#ff7f504d}.streak-count--shell{background:linear-gradient(135deg,coral,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.week-tracker{display:flex;gap:6px;align-items:flex-start;justify-content:center}.wt-day{display:flex;flex-direction:column;align-items:center;gap:5px}.wt-label{font-size:9px;font-weight:800;text-transform:uppercase;line-height:1}.wt-done .wt-label{color:#7c838a}.wt-today .wt-label{color:#ff9a5c}.wt-missed .wt-label{color:#7c838a}.wt-future .wt-label{color:#ccc}.wt-square{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800}.wt-done .wt-square{background:conic-gradient(#b8e6fc 0deg 90deg,#ffc4d9 90deg 180deg,#fff0b8 180deg 270deg,#c8e6c9 270deg 360deg);color:#5ba3d9;border:1.5px solid rgba(255,255,255,.6);box-shadow:0 2px 8px #00000014,inset 0 1px #fff6;text-shadow:none}.wt-today .wt-square{background:#ffffff59;border:1.5px dashed #FF9A5C;animation:wtPulse 2.5s ease-in-out infinite}.wt-missed .wt-square,.wt-future .wt-square{background:#dec89b80;border:1px solid rgba(0,0,0,.08);box-shadow:inset 0 1px 2px #0000000a}.wt-shells{display:flex;gap:1px;justify-content:center}.wt-shell{font-size:11px;line-height:1;display:inline-block}.wt-shell-earned{filter:none;opacity:1;transform:scale(1)}.wt-shell-grey{filter:grayscale(1);opacity:.22;transform:scale(.78)}@keyframes wtPulse{0%,to{box-shadow:0 0 8px #ff9a5c40}50%{box-shadow:0 0 18px #ff9a5c80}}@media(prefers-reduced-motion:reduce){.wt-today .wt-square{animation:none}}.mode-btn{width:250px;padding:.45rem 1.2rem;border-radius:999px;border:1px solid rgba(135,206,235,.4);font-size:1rem;white-space:nowrap;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.2);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.6rem;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);position:relative;overflow:hidden;transition:all .35s cubic-bezier(.34,1.56,.64,1)}.mode-btn:before{content:"";position:absolute;top:0;left:0;width:60%;height:50%;background:linear-gradient(135deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:999px;pointer-events:none}.mode-btn:hover{transform:translateY(-4px)}.mode-btn:active{transform:scale(.97);transition:all .1s ease}.mode-solo,.mode-multi{background:linear-gradient(135deg,#ff9a5c,#ff6b6b);border:2px solid rgba(255,255,255,.4);box-shadow:0 8px 28px #ff6b6b59,inset 0 2px #ffffff4d}.mode-btn-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.mode-solo:hover,.mode-multi:hover{transform:translateY(-4px) scale(1.02);background:linear-gradient(135deg,#ffb07c,#ff7b7b);border-color:#ffffff80;box-shadow:0 14px 40px #ff6b6b73,inset 0 2px #ffffff59}.home-error-toast{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);background:#ef4444e6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;padding:.75rem 1.5rem;border-radius:var(--radius-lg);font-family:var(--font-family);font-size:var(--font-size-body-sm);font-weight:800;box-shadow:0 4px 16px #ef44444d;animation:toast-in .3s ease;z-index:100}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.shake{animation:shake .5s ease}@keyframes shake{0%,to{transform:translate(0)}15%{transform:translate(-6px)}30%{transform:translate(5px)}45%{transform:translate(-4px)}60%{transform:translate(3px)}75%{transform:translate(-2px)}}@media(max-width:900px){.home-center{grid-template-columns:1fr;justify-items:stretch;width:95%}.home-panel{flex-direction:column;padding:1.25rem;gap:1rem}.home-panel-profile{min-height:auto;border-right:none;border-bottom:none;padding:1rem 0;align-items:center;order:2}.home-panel-modes{width:100%;padding:1rem 0;order:1;border-bottom:2px solid rgba(255,255,255,.25)}.home-panel-buttons{width:100%}.mode-btn{width:100%;max-width:400px}.home-panel-lb{width:100%;max-width:none;max-height:320px}}@media(max-width:600px){.home-panel{backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2)}.avatar-circle{width:70px;height:70px}.avatar-refresh{width:24px;height:24px}.avatar-refresh svg{width:13px;height:13px}.mode-btn{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}}@media(max-width:480px){.home-center{justify-items:stretch}.home-page{padding:.5rem 1rem 1rem;gap:.5rem}.home-panel{padding:.6rem;gap:.5rem}.home-panel-profile{align-items:center;gap:.5rem;padding-bottom:.5rem;border-bottom:none}.home-panel-modes{gap:.4rem;padding-top:.5rem}.home-panel-buttons{width:100%;gap:.5rem}.avatar-circle{width:96px;height:96px;border-width:2px}.avatar-refresh{width:32px;height:32px}.avatar-refresh svg{width:15px;height:15px}.pseudo-input{width:auto;min-width:120px;max-width:100%;padding:.45rem .75rem;font-size:.85rem}.mode-btn{width:100%;padding:.85rem 1.2rem;font-size:1.1rem}.home-panel-lb{padding:.6rem;max-width:none;width:100%}.week-tracker{gap:4px}.wt-square{width:28px;height:28px;font-size:12px}.wt-label{font-size:8px}.wt-shell{font-size:9px}}.app-footer{width:100%;padding:1.25rem 1rem 1.5rem;background:#ffffff26;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid rgba(255,255,255,.3);box-sizing:border-box}.app-footer-inner{max-width:1000px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem .75rem;font-family:var(--font-family);font-size:.85rem;font-weight:var(--font-weight-medium);color:var(--text-secondary);text-align:center}.app-footer-copy{color:var(--text-secondary)}.app-footer-sep{color:var(--text-tertiary);-webkit-user-select:none;user-select:none}.app-footer-link{color:var(--text-primary);text-decoration:none;font-weight:var(--font-weight-semibold);transition:color var(--transition-fast)}.app-footer-link-button{background:none;border:none;padding:0;margin:0;font:inherit;cursor:pointer}.app-footer-link:hover{color:var(--accent-primary);text-decoration:underline}.app-footer-link:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:var(--radius-sm)}@media(max-width:480px){.app-footer{padding:1rem .75rem 1.25rem}.app-footer-inner{flex-direction:column;gap:.35rem;font-size:.8rem}.app-footer-sep{display:none}}.cookie-banner.cookie-banner{position:fixed;bottom:16px;left:50%;transform:translate(-50%);width:calc(100% - 32px);max-width:520px;z-index:100;box-sizing:border-box;padding:.85rem 1rem .95rem;background:#ffffffb3;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.55);border-radius:var(--radius-xl);box-shadow:0 8px 32px #0000001f;overflow:hidden;display:flex;flex-direction:column;gap:.7rem;font-family:var(--font-family);animation:cookie-banner-slide-up .4s cubic-bezier(.34,1.56,.64,1)}@keyframes cookie-banner-slide-up{0%{transform:translate(-50%,120%);opacity:0}to{transform:translate(-50%);opacity:1}}.cookie-banner-text{margin:0;min-width:0;font-size:.8rem;font-weight:var(--font-weight-normal);color:var(--text-primary);line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.cookie-banner-link{color:var(--accent-primary);text-decoration:none;font-weight:var(--font-weight-semibold);transition:color var(--transition-fast)}.cookie-banner-link:hover{color:var(--accent-primary-hover);text-decoration:underline}.cookie-banner-actions{display:flex;gap:.5rem;justify-content:flex-end;flex-shrink:0}.cookie-banner-btn{padding:.4rem 1.05rem;border-radius:var(--radius-lg);font-family:var(--font-family);font-size:.8rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-normal);border:1px solid}.cookie-banner-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.cookie-banner-btn-refuse{background:#ffffff80;border-color:#fff9;color:var(--text-secondary)}.cookie-banner-btn-refuse:hover{background:#ffffffbf;color:var(--text-primary)}.cookie-banner-btn-accept{background:linear-gradient(135deg,#4fc3f7eb,#4fc3f7b8);border-color:#4fc3f773;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.12);box-shadow:0 2px 8px #4fc3f740}.cookie-banner-btn-accept:hover{background:linear-gradient(135deg,#39a8db,#39a8dbd9);transform:translateY(-1px);box-shadow:0 4px 16px #4fc3f759}@media(min-width:1024px){.cookie-banner.cookie-banner{max-width:980px;flex-direction:row;align-items:center;gap:1.25rem;padding:.7rem 1.25rem}.cookie-banner-text{flex:1;white-space:nowrap;text-overflow:ellipsis}}@media(max-width:480px){.cookie-banner.cookie-banner{bottom:8px;padding:.75rem .9rem .85rem;gap:.55rem}.cookie-banner-text{font-size:.78rem;line-height:1.45}.cookie-banner-actions{justify-content:stretch}.cookie-banner-btn{flex:1;padding:.5rem .75rem}}.app{min-height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden}.app>*{position:relative;z-index:1}.main{flex:1;display:flex;justify-content:center;align-items:flex-start;padding:.5rem 1rem}.app-bottom-bar{position:fixed;bottom:12px;right:12px;z-index:999;display:flex;align-items:center;gap:8px}.app-bottom-bar .app-bottom-btn{position:static}.mute-btn{width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(91,181,162,.3);background:#ffffff73;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 2px 8px #00000014;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:.8;transition:opacity .2s,background .2s,border-color .2s,transform .15s;padding:0}.mute-btn:hover{opacity:1;background:#fff9;transform:scale(1.08)}.mute-btn--muted{border-color:#e8838a4d;opacity:.65}.mute-btn--muted:hover{opacity:.9}.app-bottom-bar .btn-back-glass{width:36px;height:36px;display:none}@media(max-width:980px){.app-bottom-bar .btn-back-glass{display:flex}.app-game>.app-bottom-bar{display:none}.page-header>.btn-back-glass,.lobby-top-bar>.btn-back-glass{display:none}}.btn-back-glass{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:#ffffff40;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-primary);padding:0;flex-shrink:0;transition:all .3s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 8px #0000000f,inset 0 1px #ffffff80}.btn-back-glass:hover{background:#ffffff61;border-color:#ffffff8c;transform:translate(-2px)}.error-container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem}.error{color:var(--color-error);font-size:.875rem;text-align:center}.socket-error,.connection-status{position:fixed;bottom:1rem;left:50%;transform:translate(-50%);padding:.75rem 1.5rem;border-radius:var(--radius-md);font-size:.875rem;z-index:50}.socket-error{background:#ef444426;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(239,68,68,.35);color:var(--color-error)}.connection-status{background:#ffffff40;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);color:var(--text-secondary)}.socket-error p,.connection-status p{margin:0}@media(max-width:480px){.main{padding:1rem .5rem}}