*{box-sizing:border-box;margin:0;padding:0}:root{--bg-color: #1a1a2e;--surface-color: #16213e;--primary-color: #e94560;--secondary-color: #0f3460;--text-color: #eee;--text-muted: #888;--small-color: #4CAF50;--mid-color: #8BC34A;--big-color: #CDDC39;--dessert-color: #FF9800;--special-color: #2196F3;--super-color: #9C27B0;--top-color: #E91E63;--tea-color: #795548;--takeaway-color: #607D8B;--card-bg: #fff;--card-text: #333}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--bg-color);color:var(--text-color);min-height:100vh}#app{max-width:1400px;margin:0 auto;padding:20px}.screen{display:none}.screen.active{display:block}#lobby{max-width:480px;margin:0 auto;text-align:center;padding:20px 20px 0}.lobby-header{margin:-20px -20px 1.5rem;padding:3rem 1.5rem 2rem;background:linear-gradient(to bottom,#1a1a2e1a,#1a1a2eb3 70%,#1a1a2e),url(dimsum-bg.svg) center center / cover no-repeat;border-radius:0 0 24px 24px;position:relative}#lobby h1{font-size:3.5rem;margin-bottom:.25rem;color:#fff;text-shadow:2px 2px 8px rgba(0,0,0,.5);font-weight:700}#lobby h1:after{content:"\98f2\8336";display:block;font-size:1.5rem;color:var(--primary-color);text-shadow:1px 1px 4px rgba(0,0,0,.5);margin-top:.25rem}.subtitle{color:#ffffffe6;margin-bottom:0;font-size:1.1rem;text-shadow:1px 1px 4px rgba(0,0,0,.5)}.lobby-help-btn{margin-top:1rem;background:#ffffff26;backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.3)}.lobby-help-btn:hover{background:#ffffff40}.welcome-card{background:var(--surface-color);border-radius:16px;padding:1.5rem;margin-bottom:1.5rem;border:1px solid rgba(255,255,255,.1)}.welcome-card.signed-in{background:linear-gradient(135deg,var(--surface-color) 0%,rgba(233,69,96,.1) 100%);border-color:var(--primary-color)}.signin-prompt{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.user-welcome{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;text-align:left}.user-welcome-text{flex:1;display:flex;flex-direction:column}.welcome-label{font-size:.8rem;color:var(--text-muted)}.user-name-display{font-size:1.25rem;font-weight:600;color:var(--text-color)}.btn-icon{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:8px;border-radius:8px;transition:all .2s}.btn-icon:hover{background:#ffffff1a;color:var(--text-color)}.my-room-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem 1.5rem;font-size:1.1rem}.my-room-icon{font-size:1.5rem}.my-room-text{display:flex;flex-direction:column;align-items:flex-start}.my-room-label{font-size:.85rem;opacity:.9}.my-room-code{font-family:monospace;font-size:1.25rem;font-weight:700;letter-spacing:2px}.admin-link{display:block;margin-top:12px;color:var(--text-muted);font-size:.85rem;text-decoration:none;text-align:center}.admin-link:hover{color:var(--primary-color)}.play-options{display:flex;flex-direction:column;gap:1.25rem}.play-section{background:var(--surface-color);border-radius:12px;padding:1.25rem;text-align:left}.section-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.section-header h3{margin:0;font-size:1.1rem;color:var(--text-color)}.section-icon{font-size:1.25rem}.section-subtitle{color:var(--text-muted);font-size:.85rem;margin:0 0 1rem}.private-room-options{display:flex;flex-direction:column;gap:.75rem}.join-room-inline{display:flex;gap:.5rem}.join-room-inline input{flex:1;text-transform:uppercase;text-align:center;letter-spacing:.3em;font-weight:700;font-size:1.1rem;padding:12px}.join-room-inline .btn{padding:12px 20px}.room-code-hint{color:#e74c3c;font-size:.85rem;margin-top:.5rem;min-height:1.2em}.form-group{margin-bottom:1rem;text-align:left}.form-group label{display:block;margin-bottom:.5rem;color:var(--text-muted);font-size:.875rem}input{width:100%;padding:12px 16px;border:2px solid var(--secondary-color);border-radius:8px;background:var(--surface-color);color:var(--text-color);font-size:1rem}input:focus{outline:none;border-color:var(--primary-color)}input.highlight-input{animation:pulse-highlight .5s ease-in-out 3;border-color:var(--primary-color);box-shadow:0 0 0 4px #e945604d}@keyframes pulse-highlight{0%,to{box-shadow:0 0 0 4px #e945604d}50%{box-shadow:0 0 0 8px #e9456080}}input::placeholder{color:var(--text-muted)}#room-code{text-transform:uppercase;text-align:center;letter-spacing:.5em;font-weight:700}.button-group{margin:1rem 0;display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}.btn{padding:12px 24px;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:all .2s;font-weight:600}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--primary-color);color:#fff}.btn.primary:hover:not(:disabled){background:#d63850}.btn.secondary{background:var(--secondary-color);color:#fff}.btn.secondary:hover:not(:disabled){background:#1a4a7a}.btn.small{padding:8px 16px;font-size:.875rem}.divider{margin:1.5rem 0;color:var(--text-muted);position:relative}.divider:before,.divider:after{content:"";position:absolute;top:50%;width:40%;height:1px;background:var(--secondary-color)}.divider:before{left:0}.divider:after{right:0}.error-message{color:var(--primary-color);margin:.5rem 0;min-height:1.25rem;font-size:.9rem}#lobby .error-message{margin:0;min-height:0}#lobby .error-message:not(:empty){margin-bottom:1rem;min-height:1.25rem}.quick-play-section{margin:1.5rem 0;text-align:center}.quick-play-section h3{color:var(--primary-color);margin-bottom:.25rem;font-size:1.1rem}.quick-play-subtitle{color:var(--text-muted);font-size:.8rem;margin-bottom:.75rem}.public-rooms-grid{display:flex;flex-direction:column;gap:.5rem}.room-card{background:var(--surface-color);border:2px solid var(--secondary-color);border-radius:10px;padding:.75rem;display:flex;align-items:center;justify-content:space-between;transition:border-color .2s,transform .2s}.room-card:hover{border-color:var(--primary-color);transform:translateY(-1px)}.room-card-info{display:flex;align-items:center;gap:.6rem;text-align:left}.room-emoji{font-size:1.5rem}.room-details{display:flex;flex-direction:column}.room-name{font-weight:600;color:var(--text-color);font-size:.9rem}.room-status{font-size:.7rem;color:var(--text-muted);margin-top:1px}.room-status.waiting{color:var(--small-color)}.room-status.playing{color:var(--dessert-color)}.room-players{font-size:.65rem;color:var(--text-muted);margin-top:2px;max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-card-actions{display:flex;align-items:center;gap:.4rem}.room-card .btn{padding:6px 12px;font-size:.8rem}.room-card .btn.watch{background:var(--tea-color)}.room-card .btn.watch:hover{background:#6d4c41}.spectator-badge{font-size:.7rem;color:var(--text-muted);display:flex;align-items:center;gap:3px}.loading-rooms{color:var(--text-muted);padding:.75rem;font-size:.85rem}.spectator-indicator{background:var(--tea-color);color:#fff;padding:4px 10px;border-radius:4px;font-size:.7rem;display:flex;align-items:center;gap:5px}.spectator-count{color:var(--text-muted);font-size:.75rem;display:flex;align-items:center;gap:4px}.spectator-count:not(:empty):before{content:"\1f441"}.spectator-hand-message{color:var(--text-muted);text-align:center;padding:2rem;font-style:italic}#waiting-room{max-width:500px;margin:60px auto;text-align:center}#waiting-room h2{margin-bottom:2rem}#display-room-code{color:var(--primary-color);letter-spacing:.2em;font-size:1.5em}.invite-section{background:var(--surface-color);border-radius:12px;padding:1rem 1.5rem;margin-bottom:1.5rem}.invite-section p{color:var(--text-muted);margin-bottom:.75rem;font-size:.9rem}.invite-link-container{display:flex;gap:.5rem}.invite-link-container input{flex:1;padding:10px 12px;font-size:.875rem;background:var(--bg-color);border:1px solid var(--secondary-color);border-radius:6px;color:var(--text-color);cursor:pointer}.invite-link-container input:focus{outline:none;border-color:var(--primary-color)}.copy-feedback{color:var(--small-color);font-size:.85rem;margin-top:.5rem;opacity:0;transition:opacity .2s}.copy-feedback.show{opacity:1}.players-list{background:var(--surface-color);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.players-list h3{margin-bottom:1rem;color:var(--text-muted)}.players-list ul{list-style:none}.players-list li{padding:.75rem;border-bottom:1px solid var(--secondary-color);display:flex;align-items:center;justify-content:space-between}.players-list li:last-child{border-bottom:none}.host-badge,.bot-badge{padding:2px 8px;border-radius:4px;font-size:.75rem;margin-left:.5rem}.host-badge{background:var(--primary-color);color:#fff}.bot-badge{background:var(--special-color);color:#fff}.player-badges{display:flex;align-items:center;gap:.25rem}.remove-bot-btn{background:transparent;border:1px solid var(--primary-color);color:var(--primary-color);padding:2px 8px;border-radius:4px;font-size:.75rem;cursor:pointer;margin-left:.5rem}.remove-bot-btn:hover{background:var(--primary-color);color:#fff}#waiting-message{color:var(--text-muted);margin-bottom:1.5rem}#game.active{height:calc(100vh - 40px);display:flex;flex-direction:column}.game-header{display:flex;flex-direction:column;gap:.5rem;padding:.75rem 1rem;background:var(--surface-color);border-radius:8px;margin-bottom:1rem}.game-header-row{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.game-header-top{flex-wrap:wrap}.game-header-bottom{padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1)}.header-left-group{display:flex;align-items:center;gap:.75rem}.header-buttons{display:flex;align-items:center;gap:.5rem}.room-info{color:var(--text-muted);display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}#game-room-code{color:var(--primary-color);font-weight:700}.round-info{background:var(--secondary-color);padding:4px 10px;border-radius:4px;font-size:.8rem}.leave-btn{background:#e9456033;color:var(--primary-color);border:1px solid var(--primary-color)}.leave-btn:hover{background:var(--primary-color);color:#fff}.autoplay-btn{background:#ffc10726;color:#ffc107;border:1px solid #ffc107}.autoplay-btn:hover{background:#ffc1074d}.autoplay-btn.active{background:#ffc107;color:#1a1a2e;font-weight:700}.autoplay-btn.active:hover{background:#ffca2c}#turn-indicator{font-weight:700;padding:6px 14px;border-radius:8px;transition:all .3s ease;font-size:.9rem;flex-shrink:1;text-align:center}#turn-indicator.your-turn{color:var(--small-color);background:#4caf5033}#turn-indicator.round-complete{color:gold;background:#ffd70033;animation:pulse 1.5s ease-in-out infinite;font-size:1.1rem}#turn-indicator.clickable{cursor:pointer;text-decoration:underline;text-underline-offset:4px}#turn-indicator.clickable:hover{background:#ffd70066}#turn-indicator .click-hint{font-size:.75rem;font-weight:400;opacity:.8}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.game-layout{flex:1;display:flex;gap:1rem}.scoreboard{width:200px;background:var(--surface-color);border-radius:8px;padding:.75rem;flex-shrink:0}.scoreboard h3{margin-bottom:1rem;color:var(--text-muted);font-size:.875rem;text-transform:uppercase}.score-section{margin-bottom:.75rem}.score-section:last-child{margin-bottom:0}.score-section-header{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;margin-bottom:.25rem;padding-bottom:.2rem;border-bottom:1px solid var(--border-color)}.score-entry{display:flex;align-items:center;justify-content:space-between;padding:.2rem 0;font-size:.8rem}.score-entry.current{color:var(--accent-color)}.score-entry .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1;margin-right:.5rem}.score-entry .score{font-weight:700;color:var(--primary-color);flex-shrink:0}.game-board{flex:1;display:flex;flex-direction:column;gap:1rem;min-width:0}.other-players{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;padding:1rem;background:var(--surface-color);border-radius:8px}.opponent{text-align:center;padding:.5rem 1rem;border-radius:8px;background:var(--secondary-color);min-width:100px}.opponent.current-turn{border:2px solid var(--primary-color)}.opponent .name{font-weight:700;margin-bottom:.25rem;font-size:.875rem}.opponent .cards{color:var(--text-muted);font-size:.75rem}.opponent .score{color:var(--primary-color);font-size:.75rem;margin-top:.25rem}.opponent-pet{font-size:1.5rem;margin-bottom:.25rem;position:relative;display:inline-block;animation:pet-idle 3s ease-in-out infinite}.opponent-pet[data-rarity=rare],.opponent-pet[data-rarity=epic],.opponent-pet[data-rarity=legendary]{filter:drop-shadow(0 0 3px rgba(255,215,0,.5))}.opponent-pet[data-rarity=legendary]{animation:pet-legendary 2s ease-in-out infinite}@keyframes pet-idle{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes pet-legendary{0%,to{transform:translateY(0) scale(1);filter:drop-shadow(0 0 5px rgba(255,215,0,.7))}50%{transform:translateY(-4px) scale(1.05);filter:drop-shadow(0 0 10px rgba(255,215,0,1))}}.pet-speech{position:absolute;bottom:100%;left:50%;transform:translate(-50%) scale(0);background:#fff;color:#333;padding:4px 8px;border-radius:10px;font-size:.7rem;white-space:nowrap;opacity:0;transition:all .3s ease;pointer-events:none;z-index:10;box-shadow:0 2px 8px #0003}.pet-speech:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:#fff}.pet-speech.visible{opacity:1;transform:translate(-50%) scale(1)}.my-pet-container{position:fixed;bottom:20px;left:20px;z-index:100;display:flex;flex-direction:column;align-items:center}.my-pet{font-size:2.5rem;cursor:pointer;transition:transform .2s;position:relative;animation:pet-idle 3s ease-in-out infinite}.my-pet:hover{transform:scale(1.2)}.my-pet.jumping{animation:pet-jump-to-center 1.5s ease-in-out forwards;z-index:1000}@keyframes pet-jump-to-center{0%{transform:translate(0) scale(1) rotate(0)}10%{transform:translateY(-30px) scale(1.2) rotate(-10deg)}30%{transform:translate(calc(50vw - 50px),-50vh) scale(1.8) rotate(15deg)}50%{transform:translate(calc(50vw - 30px),calc(-50vh + 50px)) scale(2) rotate(0)}70%{transform:translate(25vw,-30vh) scale(1.5) rotate(-10deg)}85%{transform:translate(50px,-50px) scale(1.2) rotate(5deg)}to{transform:translate(0) scale(1) rotate(0)}}.my-pet.fire-pulse{animation:fire-pulse 1.5s ease-in-out forwards!important;z-index:1000}@keyframes fire-pulse{0%,to{transform:scale(1);filter:brightness(1) drop-shadow(0 0 5px rgba(255,100,0,.5))}15%{transform:scale(1.3) translateY(-20px);filter:brightness(1.5) drop-shadow(0 0 20px rgba(255,100,0,.9))}30%{transform:scale(1.5) translateY(-40px);filter:brightness(1.8) drop-shadow(0 0 30px rgba(255,50,0,1))}50%{transform:scale(1.8) translateY(-60px) rotate(10deg);filter:brightness(2) drop-shadow(0 0 40px rgba(255,200,0,1))}70%{transform:scale(1.4) translateY(-30px) rotate(-5deg);filter:brightness(1.5) drop-shadow(0 0 25px rgba(255,100,0,.8))}85%{transform:scale(1.1) translateY(-10px);filter:brightness(1.2) drop-shadow(0 0 10px rgba(255,100,0,.6))}}.my-pet.water-wobble{animation:water-wobble 1.5s ease-in-out forwards!important;z-index:1000}@keyframes water-wobble{0%,to{transform:scale(1) rotate(0);filter:brightness(1)}10%{transform:scale(1.1) rotate(-5deg) translateY(-10px);filter:brightness(1.1) drop-shadow(0 0 10px rgba(0,150,255,.5))}25%{transform:scale(1.3) rotate(5deg) translateY(-30px);filter:brightness(1.2) drop-shadow(0 0 20px rgba(0,200,255,.7))}40%{transform:scale(1.4) rotate(-8deg) translateY(-50px);filter:brightness(1.3) drop-shadow(0 0 25px rgba(0,220,255,.8))}55%{transform:scale(1.3) rotate(8deg) translateY(-40px);filter:brightness(1.2) drop-shadow(0 0 20px rgba(0,200,255,.7))}70%{transform:scale(1.2) rotate(-5deg) translateY(-25px);filter:brightness(1.1) drop-shadow(0 0 15px rgba(0,150,255,.5))}85%{transform:scale(1.1) rotate(3deg) translateY(-10px)}}.my-pet.grass-sway{animation:grass-sway 1.5s ease-in-out forwards!important;z-index:1000}@keyframes grass-sway{0%,to{transform:scale(1) rotate(0)}15%{transform:scale(1.2) rotate(-15deg) translateY(-20px);filter:drop-shadow(0 0 15px rgba(0,200,0,.6))}30%{transform:scale(1.3) rotate(15deg) translateY(-35px);filter:drop-shadow(0 0 20px rgba(100,255,100,.7))}45%{transform:scale(1.4) rotate(-10deg) translateY(-45px);filter:drop-shadow(0 0 25px rgba(50,255,50,.8))}60%{transform:scale(1.3) rotate(10deg) translateY(-35px);filter:drop-shadow(0 0 20px rgba(100,255,100,.7))}75%{transform:scale(1.2) rotate(-5deg) translateY(-20px);filter:drop-shadow(0 0 15px rgba(0,200,0,.5))}90%{transform:scale(1.1) rotate(3deg) translateY(-10px)}}.my-pet.rock-shake{animation:rock-shake 1.5s ease-in-out forwards!important;z-index:1000}@keyframes rock-shake{0%,to{transform:scale(1) translateY(0)}10%{transform:scale(1.1) translateY(-5px) translate(-5px);filter:drop-shadow(0 5px 10px rgba(139,90,43,.5))}20%{transform:scale(1.2) translateY(-15px) translate(5px);filter:drop-shadow(0 8px 15px rgba(139,90,43,.6))}30%{transform:scale(1.4) translateY(-25px) translate(-8px);filter:drop-shadow(0 10px 20px rgba(139,90,43,.7))}40%{transform:scale(1.5) translateY(-10px) translate(8px);filter:drop-shadow(0 15px 25px rgba(139,90,43,.8))}50%{transform:scale(1.6) translateY(5px) translate(-5px);filter:drop-shadow(0 20px 30px rgba(139,90,43,.9))}60%{transform:scale(1.4) translateY(-5px) translate(5px)}70%{transform:scale(1.3) translateY(-10px) translate(-3px)}85%{transform:scale(1.1) translateY(-5px)}}.my-pet.electric-spark{animation:electric-spark 1.5s ease-in-out forwards!important;z-index:1000}@keyframes electric-spark{0%,to{transform:scale(1);filter:brightness(1)}5%{transform:scale(1.2) translate(10px);filter:brightness(2) drop-shadow(0 0 20px rgba(255,255,0,1))}10%{transform:scale(1.1) translate(-10px);filter:brightness(1.5)}20%{transform:scale(1.4) translateY(-30px);filter:brightness(2.5) drop-shadow(0 0 30px rgba(255,255,0,1))}25%{transform:scale(1.3) translateY(-35px) translate(15px);filter:brightness(1.8)}35%{transform:scale(1.5) translateY(-50px);filter:brightness(3) drop-shadow(0 0 40px rgba(255,200,0,1))}45%{transform:scale(1.4) translateY(-40px) translate(-15px);filter:brightness(2)}55%{transform:scale(1.3) translateY(-30px);filter:brightness(2.5) drop-shadow(0 0 25px rgba(255,255,0,.8))}70%{transform:scale(1.2) translateY(-15px) translate(5px);filter:brightness(1.5)}85%{transform:scale(1.1) translateY(-5px);filter:brightness(1.2)}}.my-pet.ice-shimmer{animation:ice-shimmer 1.5s ease-in-out forwards!important;z-index:1000}@keyframes ice-shimmer{0%,to{transform:scale(1);filter:brightness(1) hue-rotate(0deg)}20%{transform:scale(1.2) translateY(-20px) rotate(-5deg);filter:brightness(1.3) hue-rotate(10deg) drop-shadow(0 0 15px rgba(150,220,255,.7))}40%{transform:scale(1.4) translateY(-40px) rotate(5deg);filter:brightness(1.5) hue-rotate(-10deg) drop-shadow(0 0 25px rgba(200,240,255,.9))}60%{transform:scale(1.3) translateY(-30px) rotate(-3deg);filter:brightness(1.4) hue-rotate(15deg) drop-shadow(0 0 20px rgba(180,230,255,.8))}80%{transform:scale(1.1) translateY(-10px) rotate(2deg);filter:brightness(1.2) hue-rotate(-5deg) drop-shadow(0 0 10px rgba(150,220,255,.5))}}.my-pet.dark-fade{animation:dark-fade 1.5s ease-in-out forwards!important;z-index:1000}@keyframes dark-fade{0%,to{transform:scale(1);opacity:1;filter:brightness(1)}15%{transform:scale(1.1) translateY(-10px);opacity:.7;filter:brightness(.8) drop-shadow(0 0 15px rgba(100,0,150,.6))}30%{transform:scale(1.3) translateY(-30px) translate(20px);opacity:.4;filter:brightness(.6) drop-shadow(0 0 20px rgba(80,0,120,.8))}45%{transform:scale(1.5) translateY(-50px) translate(-30px);opacity:.2;filter:brightness(.4) drop-shadow(0 0 30px rgba(60,0,100,1))}55%{transform:scale(1.4) translateY(-40px) translate(25px);opacity:.3;filter:brightness(.5)}70%{transform:scale(1.2) translateY(-25px) translate(-15px);opacity:.6;filter:brightness(.7)}85%{transform:scale(1.1) translateY(-10px);opacity:.85;filter:brightness(.9)}}.my-pet.light-glow{animation:light-glow 3s ease-in-out forwards!important;z-index:1000}@keyframes light-glow{0%{transform:scale(1) translate(0) rotate(0);filter:brightness(1)}5%{transform:scale(1.2) translateY(-30px) rotate(15deg);filter:brightness(1.5) drop-shadow(0 0 20px rgba(255,255,200,.8))}10%{transform:scale(1.4) translate(30px,-60px) rotate(-15deg);filter:brightness(2) drop-shadow(0 0 30px rgba(255,255,150,1))}15%{transform:scale(1.5) translate(80px,-40px) rotate(20deg);filter:brightness(2.2) drop-shadow(0 0 40px rgba(255,220,100,1))}20%{transform:scale(1.6) translate(120px,-80px) rotate(-10deg);filter:brightness(2.5) drop-shadow(0 0 50px rgba(255,200,50,1))}25%{transform:scale(1.8) translate(calc(40vw - 100px),-120px) rotate(180deg);filter:brightness(2.8) drop-shadow(0 0 60px rgba(255,255,100,1))}30%{transform:scale(2) translate(calc(40vw - 80px),-150px) rotate(360deg);filter:brightness(3) drop-shadow(0 0 70px rgba(255,255,50,1)) drop-shadow(0 0 100px rgba(255,200,0,.8))}38%{transform:scale(1.8) translate(20vw,-100px) rotate(380deg);filter:brightness(2.5) drop-shadow(0 0 50px rgba(255,220,100,1))}45%{transform:scale(1.6) translate(-50px,-80px) rotate(400deg);filter:brightness(2.2) drop-shadow(0 0 40px rgba(255,200,150,.9))}50%{transform:scale(1.8) translate(-80px,-120px) rotate(350deg);filter:brightness(2.5) drop-shadow(0 0 50px rgba(255,255,100,1))}55%{transform:scale(1.5) translate(-40px,-60px) rotate(370deg);filter:brightness(2) drop-shadow(0 0 35px rgba(255,220,150,.9))}62%{transform:scale(1.6) translate(50px,-100px) rotate(400deg);filter:brightness(2.2) drop-shadow(0 0 40px rgba(255,255,150,1))}70%{transform:scale(1.4) translate(100px,-70px) rotate(380deg);filter:brightness(1.8) drop-shadow(0 0 30px rgba(255,220,100,.8))}80%{transform:scale(1.3) translate(50px,-40px) rotate(720deg);filter:brightness(1.5) drop-shadow(0 0 20px rgba(255,255,200,.7))}90%{transform:scale(1.1) translate(15px,-15px) rotate(705deg);filter:brightness(1.2) drop-shadow(0 0 10px rgba(255,255,200,.5))}to{transform:scale(1) translate(0) rotate(720deg);filter:brightness(1)}}.my-pet[data-rarity=rare],.my-pet[data-rarity=epic],.my-pet[data-rarity=legendary]{filter:drop-shadow(0 0 5px rgba(255,215,0,.6))}.my-pet[data-rarity=legendary]{animation:pet-legendary 2s ease-in-out infinite}#my-pet-speech{position:absolute;bottom:100%;left:50%;transform:translate(-50%) scale(0);background:#fff;color:#333;padding:6px 12px;border-radius:12px;font-size:.85rem;white-space:nowrap;opacity:0;transition:all .3s ease;pointer-events:none;box-shadow:0 2px 10px #0003;margin-bottom:8px}#my-pet-speech:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#fff}#my-pet-speech.visible{opacity:1;transform:translate(-50%) scale(1)}.my-pet-name{font-size:.7rem;color:var(--text-muted);margin-top:4px}.center-area{display:flex;gap:2rem;padding:1rem;background:var(--surface-color);border-radius:8px}.deck-area{text-align:center;flex-shrink:0}.card-stack{width:90px;height:126px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s;position:relative}.card-stack:hover{transform:scale(1.05)}.deck{background:linear-gradient(135deg,var(--primary-color),#d63850);box-shadow:3px 3px 0 var(--secondary-color),6px 6px 0 var(--secondary-color)}.deck .card-count{color:#fff;font-size:1.5rem;font-weight:700}.center-cards-area{flex:1;min-width:0}.center-cards{display:flex;flex-wrap:wrap;gap:8px;min-height:112px;padding:8px;background:#0003;border-radius:8px;align-content:flex-start}.center-cards .card{cursor:pointer}.center-cards .card:hover{transform:translateY(-4px)}.empty-center{color:var(--text-muted);display:flex;align-items:center;justify-content:center;width:100%;font-size:.875rem}.label{display:block;margin-top:.5rem;color:var(--text-muted);font-size:.75rem}.bot-notification{text-align:center;padding:.75rem 1rem;background:var(--secondary-color);border-radius:8px;animation:fadeIn .3s ease-in}.bot-notification span{color:var(--special-color)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.action-buttons{display:flex;justify-content:center;gap:1rem;padding:1rem}.hand-area{background:var(--surface-color);border-radius:8px;padding:1rem;margin-top:auto}.hand-area h3{text-align:center;margin-bottom:1rem;color:var(--text-muted);font-size:.875rem}.hand{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;padding-bottom:10px}.card{width:90px;height:126px;background:var(--card-bg);border-radius:8px;padding:8px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:transform .2s,box-shadow .2s;color:var(--card-text);font-size:.75rem;position:relative;user-select:none}.card:hover{transform:translateY(-8px);box-shadow:0 8px 16px #0000004d}.card.selected{transform:translateY(-16px);box-shadow:0 12px 24px #0006;outline:3px solid var(--primary-color)}.card .tier-indicator{position:absolute;top:4px;right:4px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.7rem;font-weight:700}.card.tier-small .tier-indicator{background:var(--small-color)}.card.tier-mid .tier-indicator{background:var(--mid-color)}.card.tier-big .tier-indicator{background:var(--big-color)}.card.tier-dessert .tier-indicator{background:var(--dessert-color)}.card.tier-special .tier-indicator{background:var(--special-color)}.card.tier-super .tier-indicator{background:var(--super-color)}.card.tier-top .tier-indicator{background:var(--top-color)}.card.tea .tier-indicator{background:var(--tea-color)}.card.takeaway .tier-indicator{background:var(--takeaway-color)}.card .card-image{width:100%;max-height:44px;object-fit:contain;margin:2px 0 0}.card .card-chinese{text-align:center;font-size:.95rem;font-weight:700;color:#333;line-height:1}.card .card-name{text-align:center;font-weight:600;padding:1px 2px;line-height:1.1;font-size:.55rem;color:#333}.card .card-type{text-align:center;color:#666;font-size:.6rem;text-transform:uppercase}.card .card-points{position:absolute;bottom:3px;left:3px;background:#000000b3;color:#fff;padding:1px 4px;border-radius:3px;font-size:.5rem;font-weight:700}.card.tier-small{border-bottom:3px solid var(--small-color)}.card.tier-mid{border-bottom:3px solid var(--mid-color)}.card.tier-big{border-bottom:3px solid var(--big-color)}.card.tier-dessert{border-bottom:3px solid var(--dessert-color)}.card.tier-special{border-bottom:3px solid var(--special-color)}.card.tier-super{border-bottom:3px solid var(--super-color)}.card.tier-top{border-bottom:3px solid var(--top-color)}.card.tea{border-bottom:3px solid var(--tea-color)}.card.takeaway{border-bottom:3px solid var(--takeaway-color)}.floating-banner{position:fixed;top:0;left:0;right:0;z-index:1000;background:linear-gradient(135deg,var(--surface-color),var(--secondary-color));padding:12px 20px;display:flex;justify-content:center;align-items:center;gap:20px;box-shadow:0 4px 20px #00000080;animation:slideDown .3s ease-out;flex-wrap:wrap}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.floating-banner>span{font-size:1.25rem;font-weight:700;color:gold}.floating-banner-buttons{display:flex;gap:10px;align-items:center}.floating-banner .btn.primary{animation:pulse 1.5s ease-in-out infinite}.floating-banner .btn.secondary{background:transparent;border:1px solid var(--text-muted);color:var(--text-color)}.floating-banner .btn.secondary:hover{background:#ffffff1a}#round-end,#game-over{max-width:700px;margin:40px auto;text-align:center}#round-end h2,#game-over h2{font-size:2rem;margin-bottom:1.5rem;color:var(--primary-color)}#round-winner-info,#final-winner-info{font-size:1.25rem;margin-bottom:1.5rem}.winning-hand{background:var(--surface-color);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.winning-hand h4{margin-bottom:1rem;color:var(--text-muted)}.winning-hand .sets{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem}.winning-hand .set-group{text-align:center}.winning-hand .set-label{margin-bottom:.5rem;color:var(--text-muted);font-size:.75rem}.winning-hand .set-cards{display:flex;gap:4px;justify-content:center}.winning-hand .card{width:70px;height:98px;font-size:.6rem}.winning-hand .card .card-image{max-height:32px}.winning-hand .card .card-chinese{font-size:.8rem}.winning-hand .card .card-name{font-size:.45rem}.winning-hand .card:hover{transform:none}.score-breakdown{margin-top:1rem;padding:1rem;background:#0003;border-radius:8px;font-size:.875rem}.score-breakdown .total{font-size:1.25rem;font-weight:700;color:var(--primary-color);margin-top:.5rem}.round-scores,.final-standings{background:var(--surface-color);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.round-scores h4,.final-standings h4{margin-bottom:1rem;color:var(--text-muted)}.standings-table{width:100%;text-align:left}.standings-table th,.standings-table td{padding:.75rem;border-bottom:1px solid var(--secondary-color)}.standings-table th{color:var(--text-muted);font-weight:400;font-size:.75rem;text-transform:uppercase}.standings-table tr:last-child td{border-bottom:none}.standings-table .rank-1{color:gold}.standings-table .rank-2{color:silver}.standings-table .rank-3{color:#cd7f32}@media(max-width:900px){.game-layout{flex-direction:column}.scoreboard{width:100%;display:flex;gap:1rem;align-items:center}.scoreboard h3{margin-bottom:0;white-space:nowrap}#scoreboard-list{display:flex;flex-wrap:wrap;gap:.5rem;flex:1}.score-entry{margin-bottom:0;padding:.25rem .5rem}}@media(max-width:600px){#app{padding:10px 10px 100px}.game-header{padding:.5rem .75rem;gap:.4rem}.game-header-row{gap:.4rem}.game-header-bottom{padding-top:.4rem}.lobby-header{margin:-10px -10px 1.5rem;padding:2.5rem 1rem 1.5rem;border-radius:0 0 20px 20px}#lobby h1{font-size:2.5rem}#lobby h1:after{font-size:1.2rem}.subtitle{font-size:.95rem}.room-info{font-size:.85rem;gap:.5rem}.round-info{padding:2px 8px;font-size:.75rem}#turn-indicator{font-size:.85rem;padding:4px 10px;max-width:45%;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-buttons{gap:.35rem}.header-buttons .btn.small{padding:4px 8px;font-size:.75rem;min-width:auto}.sound-btn{padding:4px 6px!important;min-width:32px!important;font-size:1rem}.help-btn{padding:4px 8px!important;min-width:28px!important}.leave-btn{padding:4px 10px!important}.autoplay-btn{padding:4px 8px!important;font-size:.7rem!important}.card{width:68px;height:95px;font-size:.6rem;padding:6px}.card .card-image{max-height:28px}.card .card-chinese{font-size:.8rem}.card .card-name{font-size:.45rem}.card .tier-indicator{min-width:18px;height:18px;font-size:.55rem;padding:0 4px}.center-area{flex-direction:column;align-items:center}.card-stack{width:68px;height:95px}.action-buttons{flex-wrap:wrap}.btn{padding:10px 16px;font-size:.875rem}.scoreboard{flex-direction:column;align-items:stretch}#scoreboard-list{flex-direction:column}.floating-banner{top:auto;bottom:0;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}#game.active{height:auto;min-height:auto}.game-layout{min-height:auto}#round-end,#game-over{margin-top:40px;padding:1.5rem;background:var(--surface-color);border-radius:12px;border:2px solid var(--primary-color);position:relative;z-index:10}#round-end:before,#game-over:before{content:"";display:block;height:20px;background:var(--bg-color);position:absolute;top:-22px;left:-10px;right:-10px}#round-end h2,#game-over h2{font-size:1.25rem}.hand-area{margin-bottom:80px}.winning-hand .card{width:60px;height:84px}.winning-hand .card .card-image{max-height:24px}.winning-hand .card .card-chinese{font-size:.7rem}}.timer-toggle-container{display:flex;justify-content:center;margin:15px 0}.timer-toggle-label{display:flex;align-items:center;gap:10px;cursor:pointer;padding:10px 15px;background:var(--surface-color);border-radius:8px;border:1px solid var(--secondary-color);transition:border-color .2s}.timer-toggle-label:hover{border-color:var(--primary-color)}.timer-toggle-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--primary-color)}.toggle-text{color:var(--text-color);font-size:.9rem}.turn-timer{display:flex;align-items:center;gap:4px;padding:6px 12px;background:var(--secondary-color);border-radius:20px;font-weight:700;font-size:.9rem;color:var(--text-color);transition:all .3s ease}.turn-timer .timer-icon{font-size:1rem}.turn-timer.urgent{background:var(--primary-color);color:#fff;animation:pulse-timer 1s infinite}.turn-timer.my-turn{border:2px solid #fff;box-shadow:0 0 10px #e9456080}@keyframes pulse-timer{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@media(max-width:600px){.turn-timer{padding:4px 8px;font-size:.8rem}.timer-toggle-label{padding:8px 12px}.toggle-text{font-size:.85rem}}.sound-btn{font-size:1.1rem;padding:4px 8px;min-width:36px;background:var(--secondary-color);border:none;cursor:pointer;transition:transform .2s,background-color .2s}.sound-btn:hover{background:var(--surface-color);transform:scale(1.1)}.sound-btn:active{transform:scale(.95)}.deck-draw{animation:deck-pulse .3s ease}@keyframes deck-pulse{0%{transform:scale(1)}50%{transform:scale(.95)}to{transform:scale(1)}}.card-pickup{animation:card-pickup .3s ease forwards}@keyframes card-pickup{0%{transform:scale(1);opacity:1}to{transform:scale(.8) translateY(-30px);opacity:0}}.card-discard{animation:card-discard .25s ease forwards}@keyframes card-discard{0%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-50px) scale(.9);opacity:.5}}.card-dealing{animation:card-deal .4s ease backwards}@keyframes card-deal{0%{transform:translate(-100px) translateY(-50px) rotate(-10deg);opacity:0}to{transform:translate(0) translateY(0) rotate(0);opacity:1}}.card.clickable{transition:transform .15s ease,box-shadow .15s ease}.card.clickable:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 8px 20px #0000004d}.card.clickable:active{transform:translateY(-4px) scale(.98)}.card.selected{animation:card-selected-pulse .8s ease infinite}@keyframes card-selected-pulse{0%,to{box-shadow:0 0 0 3px var(--primary-color)}50%{box-shadow:0 0 15px 5px var(--primary-color)}}.center-area .card.clickable:hover{box-shadow:0 0 20px #e9456099}.winning-hand .card,#round-winning-hand .card{transition:all .3s ease}@keyframes shuffle-effect{0%,to{transform:rotate(0)}25%{transform:rotate(-2deg) translate(-2px)}75%{transform:rotate(2deg) translate(2px)}}.deck-shuffling{animation:shuffle-effect .1s ease infinite}#turn-indicator.my-turn{animation:turn-pulse 1.5s ease infinite}@keyframes turn-pulse{0%,to{background-color:var(--primary-color)}50%{background-color:#ff6b7a}}#bot-notification{animation:slide-in-notification .3s ease}@keyframes slide-in-notification{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}#floating-round-banner{animation:banner-slide-up .4s ease}@keyframes banner-slide-up{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes score-flash{0%{background-color:var(--primary-color)}to{background-color:transparent}}.score-updated{animation:score-flash .5s ease}.auth-section{margin-bottom:1.25rem}.google-btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;background:#fff;color:#444;border:1px solid #ddd;padding:12px 24px;font-size:1rem;font-weight:500;border-radius:8px;cursor:pointer;transition:all .2s;width:100%}.google-btn:hover{background:#f5f5f5;box-shadow:0 2px 8px #00000026}.google-btn svg{flex-shrink:0}.auth-hint{color:var(--text-muted);font-size:.8rem;margin:.5rem 0 0}.user-photo{width:48px;height:48px;border-radius:50%;border:2px solid var(--primary-color);object-fit:cover}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;z-index:2000;overflow-y:auto;padding:20px}.modal.visible{display:flex;justify-content:center;align-items:flex-start}.modal-content{background:var(--surface-color);border-radius:16px;max-width:600px;width:100%;margin:20px auto;box-shadow:0 20px 60px #00000080;animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.1)}.modal-header h2{margin:0;font-size:1.5rem;color:var(--primary-color)}.modal-close{background:none;border:none;color:var(--text-muted);font-size:2rem;cursor:pointer;padding:0;line-height:1;transition:color .2s}.modal-close:hover{color:var(--text-color)}.modal-body{padding:24px}.signed-in-buttons{display:flex;flex-direction:column;gap:.75rem}.profile-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem}.profile-btn-pet{font-size:1.25rem}.profile-modal-content{max-width:400px}.profile-modal-body{text-align:center}.profile-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;text-align:left}.profile-avatar{width:64px;height:64px;border-radius:50%;border:3px solid var(--primary-color)}.profile-avatar:not([src]),.profile-avatar[src=""]{display:none}.profile-info{flex:1}.profile-name{font-size:1.25rem;font-weight:600;margin-bottom:.25rem}.profile-email{font-size:.8rem;color:#666;margin-bottom:.5rem}.level-badge{background:linear-gradient(135deg,var(--primary-color),#ff6b8a);color:#fff;padding:4px 12px;border-radius:12px;font-size:.875rem;font-weight:600}.profile-xp-section{margin-bottom:1.5rem}.xp-bar-container{background:var(--secondary-color);height:12px;border-radius:6px;overflow:hidden;margin-bottom:.5rem}.xp-bar{height:100%;background:linear-gradient(90deg,var(--primary-color),#ff6b8a);border-radius:6px;transition:width .3s ease}.xp-text{font-size:.85rem;color:var(--text-muted)}.profile-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}.profile-stat{background:var(--surface-color);padding:1rem;border-radius:8px}.profile-stat-value{font-size:1.5rem;font-weight:700;color:var(--primary-color)}.profile-stat-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.profile-pet-section{margin-bottom:1.5rem}.profile-pet-section h3{font-size:.9rem;color:var(--text-muted);margin-bottom:.5rem}.profile-active-pet{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem;background:var(--surface-color);border-radius:8px}.profile-active-pet .pet-emoji{font-size:1.5rem}.profile-active-pet .pet-name{font-weight:500}.profile-buttons{display:flex;gap:.75rem}.profile-buttons .btn{flex:1}.pet-shop-modal-content{max-width:500px}.shop-balance{text-align:center;font-size:1.1rem;margin-bottom:1rem;padding:.75rem;background:var(--surface-color);border-radius:8px}.shop-balance span{color:var(--primary-color);font-weight:700}.pet-shop-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-height:400px;overflow-y:auto}.pet-card{background:var(--surface-color);border-radius:12px;padding:1rem;text-align:center;border:2px solid transparent;transition:border-color .2s,transform .2s}.pet-card:hover{border-color:var(--secondary-color);transform:translateY(-2px)}.pet-card.owned{border-color:var(--small-color)}.pet-card.active{border-color:var(--primary-color);box-shadow:0 0 12px #e945604d}.pet-card-emoji{font-size:2.5rem;margin-bottom:.5rem}.pet-card-name{font-weight:600;margin-bottom:.25rem}.pet-card-chinese{font-size:.85rem;color:var(--text-muted);margin-bottom:.5rem}.pet-card-rarity{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;padding:2px 8px;border-radius:4px;margin-bottom:.5rem;display:inline-block}.pet-card-rarity.starter{background:var(--text-muted);color:#fff}.pet-card-rarity.common{background:var(--small-color);color:#fff}.pet-card-rarity.uncommon{background:var(--mid-color);color:#333}.pet-card-rarity.rare{background:var(--special-color);color:#fff}.pet-card-rarity.epic{background:var(--super-color);color:#fff}.pet-card-rarity.legendary{background:linear-gradient(135deg,gold,orange);color:#333}.pet-card-type{font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;padding:2px 6px;border-radius:4px;margin-left:4px;display:inline-block}.pet-card-type.normal{background:#a8a878;color:#fff}.pet-card-type.fire{background:#f08030;color:#fff}.pet-card-type.water{background:#6890f0;color:#fff}.pet-card-type.grass{background:#78c850;color:#fff}.pet-card-type.rock{background:#b8a038;color:#fff}.pet-card-type.electric{background:#f8d030;color:#333}.pet-card-type.ice{background:#98d8d8;color:#333}.pet-card-type.dark{background:#705848;color:#fff}.pet-card-type.light{background:#f8e8a0;color:#333}.pet-card-badges{display:flex;justify-content:center;gap:4px;margin-bottom:.5rem;flex-wrap:wrap}.pet-card-price{font-size:.9rem;margin-bottom:.75rem}.pet-card-price.free{color:var(--small-color)}.pet-card .btn{width:100%;padding:8px 12px;font-size:.85rem}.pet-card .btn.active-indicator{background:var(--small-color);cursor:default}.my-pets-modal-content{max-width:450px}.my-pets-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-height:400px;overflow-y:auto}.my-pets-empty{grid-column:1 / -1;text-align:center;color:var(--text-muted);padding:2rem}.rewards-toast{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:10000;animation:slideDown .3s ease,fadeOut .3s ease 2.7s forwards}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.rewards-toast-content{background:linear-gradient(135deg,var(--surface-color),rgba(233,69,96,.2));border:2px solid var(--primary-color);border-radius:12px;padding:1rem 1.5rem;text-align:center;box-shadow:0 8px 32px #0000004d}.rewards-title{font-size:1rem;font-weight:600;margin-bottom:.5rem;color:var(--primary-color)}.rewards-items{display:flex;gap:1.5rem;justify-content:center}.reward-item{font-size:1.1rem;font-weight:500}.reward-item span{color:var(--primary-color)}.reward-levelup{margin-top:.5rem;font-size:1rem;font-weight:700;color:var(--special-color);animation:pulse .5s ease infinite alternate}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.1)}}.player-pet{margin-left:.25rem}.guestbook-section{margin-top:32px;padding:24px;background:#ffffff08;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.guestbook-section .section-header{margin-bottom:16px}.guestbook-section .section-header h3{color:#14b8a6}.guestbook-tabs{display:flex;gap:4px;margin-bottom:16px;background:#0003;border-radius:8px;padding:4px}.guestbook-tab{flex:1;padding:10px 16px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:6px;font-size:.9rem;transition:all .2s ease}.guestbook-tab:hover{color:var(--text-color);background:#ffffff0d}.guestbook-tab.active{background:linear-gradient(135deg,#14b8a6,#0d9488);color:#fff}.guestbook-tab.disabled{opacity:.5;cursor:not-allowed}.guestbook-tab-content{display:none}.guestbook-tab-content.active{display:block}.guestbook-entries{max-height:350px;overflow-y:auto;padding-right:8px}.guestbook-entry{background:#ffffff0d;border-radius:8px;padding:12px;margin-bottom:12px}.guestbook-entry-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.guestbook-entry-name{font-weight:700;color:#14b8a6}.guestbook-entry-date{font-size:.85rem;color:var(--text-muted);display:flex;align-items:center;gap:8px}.guestbook-delete-btn{background:#ff646433;border:none;color:#ff6b6b;width:20px;height:20px;border-radius:4px;cursor:pointer;font-size:14px;line-height:1;padding:0}.guestbook-delete-btn:hover{background:#ff646466}.guestbook-entry-message{color:var(--text-color);line-height:1.5;word-wrap:break-word}.guestbook-form{padding:0}.guestbook-form-intro{color:var(--text-muted);margin-bottom:12px;font-size:.9rem}.guestbook-form textarea{width:100%;min-height:80px;padding:12px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff0d;color:var(--text-color);font-family:inherit;font-size:1rem;resize:vertical}.guestbook-form textarea:focus{outline:none;border-color:var(--primary-color)}.guestbook-form-footer{display:flex;justify-content:space-between;align-items:center;margin-top:8px}#guestbook-char-count{font-size:.85rem;color:var(--text-muted)}.guestbook-signin-prompt{text-align:center;padding:32px 16px;color:var(--text-color);background:#14b8a61a;border-radius:8px;border:1px dashed rgba(20,184,166,.3)}.guestbook-signin-prompt p{margin-bottom:8px}.guestbook-signin-prompt .hint{font-size:.85rem;color:var(--text-muted)}#guestbook-submit-btn{background:linear-gradient(135deg,#14b8a6,#0d9488);border-color:#14b8a6}#guestbook-submit-btn:hover{background:linear-gradient(135deg,#0d9488,#0f766e)}.guestbook-empty{text-align:center;color:var(--text-muted);padding:24px}.rules-quick-ref{background:#e9456026;border:1px solid var(--primary-color);border-radius:8px;padding:16px;margin-bottom:24px;text-align:center;font-size:1.1rem}.rules-quick-ref .highlight{color:var(--primary-color);font-weight:700}.rules-section{margin-bottom:24px}.rules-section h3{color:var(--text-color);margin-bottom:12px;font-size:1.1rem}.rules-section p,.rules-section li{color:var(--text-muted);line-height:1.6;margin-bottom:8px}.rules-section ol,.rules-section ul{padding-left:24px}.rules-section strong{color:var(--text-color)}.chinese-text{display:block;color:#fff9;font-size:.9em;margin-top:2px}.rules-quick-ref .chinese-text{margin-top:8px}.tier-info{margin-top:12px;display:flex;flex-direction:column;gap:8px}.tier-row{display:flex;align-items:center;gap:8px;color:var(--text-muted)}.tier-badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:12px;font-size:.75rem;font-weight:700;color:#fff}.tier-badge.tier-small{background:var(--small-color)}.tier-badge.tier-mid{background:var(--mid-color)}.tier-badge.tier-big{background:var(--big-color)}.tier-badge.tier-dessert{background:var(--dessert-color)}.tier-badge.tier-special{background:var(--special-color)}.tier-badge.tier-super{background:var(--super-color)}.tier-badge.tier-top{background:var(--top-color)}.room-highscores{background:var(--surface-color);border-radius:12px;padding:16px;margin:32px 0 16px;border:1px solid rgba(255,255,255,.1)}.room-highscores h4{margin:0 0 12px;color:var(--primary-color);font-size:1rem;text-align:center}.highscores-list{display:flex;flex-direction:column;gap:8px}.highscore-entry{display:flex;align-items:center;gap:12px;padding:10px 12px;background:#ffffff0d;border-radius:8px}.highscore-rank{font-size:1.25rem;width:32px;text-align:center}.highscore-rank.gold{color:gold}.highscore-rank.silver{color:silver}.highscore-rank.bronze{color:#cd7f32}.highscore-info{flex:1;min-width:0}.highscore-name{font-weight:600;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.highscore-time{font-size:.75rem;color:var(--text-muted)}.highscore-score{font-size:1.25rem;font-weight:700;color:var(--primary-color);min-width:40px;text-align:right}.highscores-empty{text-align:center;color:var(--text-muted);font-size:.875rem;padding:8px}#yumcha-btn.ready{animation:yumchaGlow 1s ease-in-out infinite;box-shadow:0 0 20px var(--primary-color),0 0 40px var(--primary-color);transform:scale(1.05)}#yumcha-btn.ready:not(:disabled){background:linear-gradient(135deg,var(--primary-color),#ff6b7a)}@keyframes yumchaGlow{0%,to{box-shadow:0 0 20px var(--primary-color),0 0 40px #e9456080}50%{box-shadow:0 0 30px var(--primary-color),0 0 60px #e94560cc}}.help-btn{font-weight:700;font-size:1rem;min-width:36px}.lobby-help-btn{margin-top:12px;background:transparent;border:1px solid var(--text-muted);color:var(--text-muted)}.lobby-help-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background:transparent}@media(max-width:600px){.modal{padding:10px}.modal-content{margin:10px auto;border-radius:12px}.modal-header{padding:16px}.modal-header h2{font-size:1.25rem}.modal-body{padding:16px}.rules-quick-ref{font-size:1rem;padding:12px}.rules-section h3{font-size:1rem}.tier-row{flex-wrap:wrap}}.lobby-buttons{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}.learn-modal-content{max-width:900px;max-height:90vh}.learn-modal-body{max-height:70vh;overflow-y:auto}.learn-intro{text-align:center;margin-bottom:1.5rem;color:var(--text-muted);font-size:1.1rem}.learn-intro .chinese-text{margin-top:.5rem}.learn-categories{display:flex;flex-direction:column;gap:2rem}.learn-category h3{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid rgba(255,255,255,.1);font-size:1.2rem}.learn-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.learn-item{background:#ffffff0d;border-radius:12px;padding:1rem;display:flex;gap:1rem;transition:transform .2s,background .2s;border:1px solid rgba(255,255,255,.1)}.learn-item:hover{background:#ffffff1a;transform:translateY(-2px)}.learn-item-image{flex-shrink:0;width:70px;height:70px;display:flex;align-items:center;justify-content:center}.learn-item-image img{max-width:100%;max-height:100%;object-fit:contain}.learn-item-info{flex:1;min-width:0}.learn-item-name{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;margin-bottom:.5rem}.learn-item-name .chinese{font-size:1.4rem;font-weight:700;color:var(--primary-color)}.learn-item-name .pinyin{font-size:.95rem;color:var(--text-muted);font-style:italic}.learn-item-name .english{font-size:.9rem;color:var(--text-color);font-weight:500}.learn-item-audio{display:flex;gap:.5rem;margin-bottom:.5rem}.audio-btn{background:var(--secondary-color);border:1px solid rgba(255,255,255,.2);color:var(--text-color);padding:4px 10px;border-radius:6px;cursor:pointer;font-size:.8rem;transition:all .2s;display:flex;align-items:center;gap:4px}.audio-btn:hover{background:var(--primary-color);transform:scale(1.05)}.audio-btn:active{transform:scale(.95)}.audio-btn.playing{background:var(--primary-color);animation:pulse-audio .5s ease infinite}@keyframes pulse-audio{0%,to{opacity:1}50%{opacity:.7}}.learn-item-desc{font-size:.85rem;color:var(--text-muted);line-height:1.5;margin:0}.learn-item-desc.chinese-text{margin-top:.25rem;font-size:.8rem}.audio-btn.desc-audio{margin-top:.5rem;background:linear-gradient(135deg,#4a90a4,#357a8c);font-size:.75rem;padding:4px 10px}.audio-btn.desc-audio:hover{background:linear-gradient(135deg,#357a8c,#2a6270)}@media(max-width:600px){.learn-modal-content{max-height:95vh}.learn-modal-body{max-height:80vh;padding:12px}.learn-intro{font-size:.95rem}.learn-items{grid-template-columns:1fr}.learn-item{padding:.75rem}.learn-item-image{width:55px;height:55px}.learn-item-name .chinese{font-size:1.2rem}.learn-item-name .pinyin{font-size:.85rem}.learn-item-name .english{font-size:.8rem;width:100%}.learn-item-desc{font-size:.8rem}.audio-btn{padding:3px 8px;font-size:.75rem}.lobby-buttons{flex-direction:column;align-items:center}.lobby-buttons .btn{width:100%;max-width:200px}}