@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--red: #ef4444;--blue: #3b82f6;--green: #22c55e;--yellow: #eab308;--black: #1e293b;--bg: #0c0f1a;--surface: #1a1f35;--surface-raised: #232a45;--text: #f1f5f9;--text-muted: #64748b;--accent: #f43f5e;--accent-glow: rgba(244, 63, 94, .25);--gold: #fbbf24;--green-bright: #34d399;--border-subtle: rgba(255, 255, 255, .06);--space-xs: .25rem;--space-sm: .5rem;--space-md: .75rem;--space-lg: 1rem;--space-xl: 1.5rem;--space-2xl: 2rem;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px}body{font-family:Inter,-apple-system,sans-serif;background:linear-gradient(165deg,var(--bg) 0%,#0f172a 50%,#0c1220 100%);color:var(--text);min-height:100dvh;overflow-x:hidden;-webkit-tap-highlight-color:transparent}.app{min-height:100dvh;display:flex;flex-direction:column}.screen{flex:1;display:flex;flex-direction:column;padding:1rem;max-width:480px;margin:0 auto;width:100%;animation:screenEnter .35s cubic-bezier(.34,1.56,.64,1)}@keyframes screenEnter{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.error-banner{background:var(--red);color:#fff;padding:.75rem 1rem;text-align:center;cursor:pointer;font-size:.9rem}.uno-hand.sending{opacity:.5;pointer-events:none}.countdown-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;position:relative}.countdown-leave{position:absolute;top:1rem;left:1rem;background:none;border:none;color:var(--text-muted);font-size:1.2rem;padding:.5rem;cursor:pointer}.countdown-game-name{font-size:1.8rem;font-weight:900;color:var(--accent);letter-spacing:.1em}.countdown-number{font-size:8rem;font-weight:900;animation:countPop .4s ease-out}.countdown-number.go{color:var(--green);font-size:5rem}@keyframes countPop{0%{transform:scale(2);opacity:0}60%{transform:scale(.95);opacity:1}to{transform:scale(1)}}.back-btn{align-self:flex-start;background:none;border:none;color:var(--text-muted);font-size:1.2rem;padding:.5rem;cursor:pointer}.btn{padding:1rem;border:none;border-radius:var(--radius-sm);font-size:1.1rem;font-weight:600;cursor:pointer;transition:opacity .2s,transform .1s}.btn:active{transform:scale(.96) translateY(1px);filter:brightness(.88);box-shadow:none;transition:all .06s ease-out}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 4px 12px #f43f5e4d,inset 0 1px #ffffff26;transition:all .15s ease-out}.btn-primary:active{background:#e11d48;box-shadow:0 1px 4px #f43f5e33,inset 0 2px 4px #0003}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid #333}.join-screen{padding:1.5rem 1rem}.title{text-align:center;font-size:2.8rem;margin:1.5rem 0 1rem;font-weight:900;letter-spacing:.05em;background:linear-gradient(120deg,var(--accent) 0%,#ff6b8a 25%,var(--accent) 50%,#ff6b8a 75%,var(--accent) 100%);background-size:200% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:titleShimmer 3s ease-in-out infinite;filter:drop-shadow(0 0 20px rgba(244,63,94,.3))}@keyframes titleShimmer{0%,to{background-position:200% center}50%{background-position:0% center}}.qr-code-container{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin:1rem 0;padding:1.2rem;background:#f43f5e0d;border-radius:16px;border:1px solid rgba(244,63,94,.15)}.qr-code-img{border-radius:var(--radius-sm);border:2px solid rgba(244,63,94,.2)}.qr-hint{color:var(--text-muted);font-size:.75rem}.btn-chest-toggle{background:var(--surface);border:1.5px solid rgba(244,63,94,.2);color:var(--text);padding:.6rem 1.2rem;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;cursor:pointer;margin-bottom:.5rem}.mode-toggle{display:flex;margin-bottom:1.5rem;border-radius:12px;overflow:hidden;gap:4px;background:#0003;padding:4px}.toggle-btn{flex:1;padding:.85rem;border:none;background:transparent;color:var(--text-muted);font-size:1rem;font-weight:600;cursor:pointer;border-radius:var(--radius-sm);transition:all .2s}.toggle-btn.active{background:var(--accent);color:#fff;box-shadow:0 4px 12px #f43f5e4d}.join-form{display:flex;flex-direction:column;gap:1.2rem}.input{padding:1.1rem;border:2px solid rgba(255,255,255,.1);border-radius:12px;background:#1a1f35cc;color:var(--text);font-size:1.1rem;outline:none;transition:all .2s}.input:focus{border-color:var(--accent);background:var(--surface);box-shadow:0 0 12px #f43f5e33}.code-input{text-align:center;letter-spacing:.5em;font-size:1.5rem;text-transform:uppercase}.lobby-header{text-align:center;margin-bottom:1.5rem;padding:1.5rem;background:linear-gradient(135deg,#f43f5e0f,#3b82f60f);border:1px solid rgba(244,63,94,.12);border-radius:16px}.lobby-code{font-size:3.5rem;font-weight:900;letter-spacing:.4em;color:var(--accent);margin-top:.5rem;text-shadow:0 0 12px rgba(244,63,94,.3)}.player-list{margin-bottom:1.5rem;background:#1a1f3580;border-radius:12px;padding:1rem;border:1px solid rgba(244,63,94,.08)}.player-list h3{margin-bottom:.75rem;color:var(--accent);font-weight:700}.player-item{padding:.85rem 1rem;background:var(--surface);border-radius:var(--radius-sm);margin-bottom:.5rem;display:flex;justify-content:space-between;align-items:center;border-left:4px solid transparent;transition:all .2s;animation:playerSlideIn .4s cubic-bezier(.34,1.56,.64,1) backwards}.player-item:nth-child(1){animation-delay:0ms}.player-item:nth-child(2){animation-delay:60ms}.player-item:nth-child(3){animation-delay:.12s}.player-item:nth-child(4){animation-delay:.18s}.player-item:nth-child(5){animation-delay:.24s}@keyframes playerSlideIn{0%{opacity:0;transform:translate(-16px) scale(.95)}to{opacity:1;transform:translate(0) scale(1)}}.player-item.me{border-left-color:var(--accent);background:#f43f5e0f}.player-item.disconnected{opacity:.5}.player-item-actions{display:flex;align-items:center;gap:.5rem}.status-badge{font-size:.75rem;color:var(--red)}.kick-btn{background:none;border:1px solid rgba(239,68,68,.4);color:var(--red);width:28px;height:28px;border-radius:50%;font-size:1.1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center}.game-selection{margin-bottom:1.5rem;background:#1a1f3580;border-radius:12px;padding:1rem;border:1px solid rgba(244,63,94,.08)}.game-selection h3{margin-bottom:.75rem;color:var(--accent);font-weight:700}.game-cards{display:flex;flex-direction:column;gap:.75rem}.game-card{width:100%;padding:1.1rem;background:var(--surface);border:2px solid #333;border-radius:var(--radius-md);color:var(--text);text-align:left;display:flex;align-items:center;gap:1.2rem;cursor:pointer;transition:all .2s}.game-card:active:not(:disabled){transform:scale(.97);box-shadow:0 6px 16px #0000004d}.game-card:disabled{opacity:.35;cursor:not-allowed}.game-card-kes{border-color:var(--red)}.game-card-icon{width:50px;height:50px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.game-icon-kes{font-size:1.3rem;font-weight:900;color:var(--red);text-shadow:0 0 8px rgba(239,68,68,.4)}.game-icon-fourbe{font-size:2rem}.game-card-info{display:flex;flex-direction:column;gap:.2rem}.game-title{font-size:1.1rem}.game-title-kes{color:var(--red)}.game-desc{font-size:.85rem;color:var(--text-muted)}.game-players{font-size:.75rem;color:var(--accent)}.waiting-text{text-align:center;color:var(--text-muted);padding:2rem 0}.music-player{display:flex;align-items:center;gap:.5rem;padding:.4rem .75rem;background:var(--surface);border-bottom:1px solid #222}.music-btn{background:none;border:none;color:var(--text);font-size:1rem;cursor:pointer;padding:.25rem}.music-name{font-size:.75rem;color:var(--text-muted);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.volume-slider{width:50px;height:4px;-webkit-appearance:none;background:#444;border-radius:2px;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--accent);cursor:pointer}.uno-player-view{padding:.4rem;gap:.35rem}.uno-top-bar{display:flex;justify-content:space-between;align-items:center}.kes-title{font-size:1.2rem;font-weight:900;color:var(--red);letter-spacing:.1em}.uno-info-bar{display:flex;justify-content:space-between;align-items:center;padding:.55rem 1rem;background:linear-gradient(135deg,#1a1f35e6,#232a45b3);border-radius:var(--radius-sm);border:1px solid var(--border-subtle);box-shadow:inset 0 1px #ffffff0a,0 2px 8px #0003;position:relative;overflow:hidden}.uno-info-bar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 0%,rgba(244,63,94,.04) 50%,transparent 100%);pointer-events:none}.turn-indicator{font-weight:600;color:var(--text-muted);font-size:.9rem}.turn-indicator.my-turn{color:var(--green-bright);font-weight:800;font-size:1.05rem;text-shadow:0 0 8px rgba(52,211,153,.6),0 0 16px rgba(52,211,153,.3);animation:turnPulse 1s ease-in-out infinite alternate}@keyframes turnPulse{0%{text-shadow:0 0 4px rgba(52,211,153,.4);transform:scale(1)}to{text-shadow:0 0 20px rgba(52,211,153,.8);transform:scale(1.02)}}.action-error{background:linear-gradient(135deg,#ef4444e6,#dc2626e6);color:#fff;padding:.75rem 1rem;border-radius:var(--radius-sm);text-align:center;font-size:.9rem;font-weight:600;cursor:pointer;border:1px solid rgba(255,255,255,.2);animation:slideInError .3s ease-out}@keyframes slideInError{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.uno-game-area{flex:1;display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto 1fr;align-items:center;justify-items:center;gap:.4rem;min-height:0}.uno-table>.uno-card{animation:tableCardBreathe 3s ease-in-out infinite}@keyframes tableCardBreathe{0%,to{transform:rotate(-1.5deg) scale(1)}50%{transform:rotate(.5deg) scale(1.015)}}.uno-table{grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:center;gap:1.2rem;padding:1.2rem 2rem;background:radial-gradient(ellipse at center,rgba(34,197,94,.06) 0%,transparent 70%),linear-gradient(135deg,#1a3a2a,#1e4d35,#1a3a2a,#1e4d35,#1a3a2a);border-radius:var(--radius-lg);border:2px solid rgba(34,197,94,.12);box-shadow:inset 0 1px 3px #0006,0 8px 24px #0000004d}.opponents-1 .pos-top{grid-column:1 / -1;grid-row:1}.opponents-2 .pos-left{grid-column:1;grid-row:1 / -1}.opponents-2 .pos-right{grid-column:3;grid-row:1 / -1}.opponents-3 .pos-left{grid-column:1;grid-row:2}.opponents-3 .pos-top{grid-column:1 / -1;grid-row:1}.opponents-3 .pos-right{grid-column:3;grid-row:2}.other-player{background:linear-gradient(135deg,#1a1f35cc,#0c0f1a99);padding:.6rem .7rem;border-radius:10px;font-size:.8rem;display:flex;flex-direction:column;gap:.4rem;align-items:center;border:2px solid rgba(244,63,94,.12);transition:all .3s;min-width:80px}.other-player.is-turn{border-color:#34d39999;box-shadow:0 0 16px #34d39933;background:linear-gradient(135deg,#1a2d23b3,#0c191499);animation:opponentTurn 1.5s ease-in-out infinite}@keyframes opponentTurn{0%,to{border-color:#34d39966}50%{border-color:#34d399cc}}.other-player-info{display:flex;flex-direction:column;gap:.2rem;align-items:center}.other-name{font-weight:800;font-size:.82rem;letter-spacing:.02em;text-shadow:0 1px 3px rgba(0,0,0,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72px}.other-cards{color:var(--text);font-size:.75rem;font-weight:700;padding:2px 8px;background:#f43f5e26;border-radius:6px;border:1px solid rgba(244,63,94,.2);letter-spacing:.05em;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.direction{display:inline-block;animation:arrowBob 1.8s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(244,63,94,.2))}@keyframes arrowBob{0%,to{transform:translate(0) scale(1);opacity:.7}50%{transform:translate(3px) scale(1.1);opacity:1}}.other-player-cards{display:flex}.other-player-cards .uno-card-back.small{width:20px;height:30px;border-radius:3px;margin-left:-5px;border-width:1px}.other-player-cards .uno-card-back.small:first-child{margin-left:0}.other-player-cards .uno-card-back.small .card-back-text{font-size:.12rem}.more-cards{font-size:.5rem;color:var(--text-muted);display:flex;align-items:center;margin-left:2px}.uno-card{width:68px;height:102px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.4);border:2px solid rgba(255,255,255,.2);transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;-webkit-user-select:none;user-select:none;position:relative;box-shadow:0 2px 4px #0003,0 4px 8px #00000026;overflow:hidden}.card-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;position:relative}.card-corner-top{font-size:.55rem;font-weight:900;opacity:.8;position:absolute;top:4px;left:5px}.card-corner-bottom{font-size:.55rem;font-weight:900;opacity:.8;position:absolute;bottom:4px;right:5px;transform:rotate(180deg)}.card-value{font-size:1.6rem;font-weight:900;line-height:1}.uno-card.playable{cursor:pointer;transform:translateY(-8px);border-color:#f43f5e99;box-shadow:0 4px 12px #0000004d,0 0 20px var(--accent-glow),inset 0 1px 2px #ffffff1a;animation:cardGlow 1.8s ease-in-out infinite alternate}.uno-card.playable:active{transform:scale(1.12) translateY(-14px);box-shadow:0 12px 32px #f43f5e40,0 0 40px var(--accent-glow)}@keyframes cardGlow{0%{box-shadow:0 4px 8px #0003,0 0 14px var(--accent-glow)}to{box-shadow:0 6px 16px #0000004d,0 0 28px #f43f5e59}}.uno-card.small{width:44px;height:66px}.uno-card.small .card-value{font-size:1rem}.uno-card-red{background:linear-gradient(135deg,#f33,#e00);box-shadow:0 2px 4px #0003,0 0 12px #ff33334d}.uno-card-blue{background:linear-gradient(135deg,#1e90ff,#06f);box-shadow:0 2px 4px #0003,0 0 12px #1e90ff4d}.uno-card-green{background:linear-gradient(135deg,#00e060,#00b840);box-shadow:0 2px 4px #0003,0 0 12px #00e0604d}.uno-card-yellow{background:linear-gradient(135deg,#fd0,#fa0);color:#000;text-shadow:none;box-shadow:0 2px 4px #0003,0 0 12px #ffdd0059}.uno-card-black{background:linear-gradient(135deg,#1a1a2e,#000);box-shadow:0 2px 4px #0000004d,0 0 10px #f43f5e33}.wild-colors{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;width:32px;height:32px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.3)}.wc-red{background:#ef4444}.wc-blue{background:#3b82f6}.wc-green{background:#22c55e}.wc-yellow{background:#eab308}.uno-card-back{width:68px;height:102px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1f35,#0c0f1a);border:2px solid rgba(244,63,94,.3);box-shadow:0 2px 4px #0003;-webkit-user-select:none;user-select:none;overflow:hidden}.uno-card-back.small{width:44px;height:66px}.card-back-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.card-back-text{font-size:.4rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);opacity:.8}.draw-pile-card{width:68px;height:102px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a2f45,#1a1f35);color:var(--accent);border:2.5px dashed rgba(244,63,94,.4);box-shadow:0 2px 6px #0000004d;cursor:pointer;transition:all .2s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.draw-pile-card:not(:disabled){animation:drawPilePulse 1.5s ease-in-out infinite,drawPileFloat 2.4s ease-in-out infinite}@keyframes drawPileFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.draw-pile-card:not(:disabled):active{transform:scale(1.15);border-color:#f43f5ecc;box-shadow:0 0 16px var(--accent-glow)}.draw-pile-card:disabled{opacity:.35;cursor:not-allowed;border-color:#f43f5e26;animation:none}@keyframes drawPilePulse{0%,to{border-color:#f43f5e4d}50%{border-color:#f43f5e99}}.draw-pile-count{position:absolute;top:-6px;right:-6px;background:var(--accent);color:#fff;font-size:.65rem;font-weight:700;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000004d}.uno-hand{display:flex;flex-wrap:nowrap;justify-content:safe center;align-items:flex-end;padding:.6rem .8rem 1.2rem;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;background:linear-gradient(180deg,#0c0f1a4d,#0f172ab3);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:16px 16px 0 0;border:2px solid rgba(244,63,94,.25);border-bottom:none;box-shadow:inset 0 2px 8px #ffffff0a,0 -4px 20px #0000004d}.uno-hand .uno-card{flex-shrink:0;margin:0 -6px;scroll-snap-align:center;transition:all .25s cubic-bezier(.34,1.56,.64,1)}.uno-hand .uno-card:nth-child(1){animation:dealCard .5s 0ms cubic-bezier(.34,1.56,.64,1) backwards}.uno-hand .uno-card:nth-child(2){animation:dealCard .5s 60ms cubic-bezier(.34,1.56,.64,1) backwards}.uno-hand .uno-card:nth-child(3){animation:dealCard .5s .12s cubic-bezier(.34,1.56,.64,1) backwards}.uno-hand .uno-card:nth-child(4){animation:dealCard .5s .18s cubic-bezier(.34,1.56,.64,1) backwards}.uno-hand .uno-card:nth-child(5){animation:dealCard .5s .24s cubic-bezier(.34,1.56,.64,1) backwards}.uno-hand .uno-card:nth-child(6){animation:dealCard .5s .3s cubic-bezier(.34,1.56,.64,1) backwards}.uno-hand .uno-card:nth-child(7){animation:dealCard .5s .36s cubic-bezier(.34,1.56,.64,1) backwards}@keyframes dealCard{0%{opacity:0;transform:translateY(-40px) scale(.7) rotate(-10deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}.my-turn-hand{box-shadow:inset 0 2px 8px #00000080,0 0 24px #34d39926;border-color:#34d39940;animation:handPulse 2s ease-in-out infinite}@keyframes handPulse{0%,to{border-color:#34d39933}50%{border-color:#34d39966}}.flying-card-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;pointer-events:none}.flying-card{position:absolute;width:68px;height:102px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:1.6rem;border:2px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #00000080}.fly-to-table .flying-card{left:var(--fly-sx);top:var(--fly-sy);animation:flyToTable .35s cubic-bezier(.2,.8,.3,1) forwards}@keyframes flyToTable{0%{left:var(--fly-sx);top:var(--fly-sy);transform:scale(1) rotate(0);opacity:1}60%{transform:scale(1.1) rotate(-5deg)}to{left:var(--fly-ex);top:var(--fly-ey);transform:scale(.9) rotate(0);opacity:0}}.fly-to-hand .flying-card{left:var(--fly-sx);top:var(--fly-sy);animation:flyToHand .3s cubic-bezier(.2,.8,.3,1) forwards}@keyframes flyToHand{0%{left:var(--fly-sx);top:var(--fly-sy);transform:scale(.7);opacity:.7}50%{transform:scale(1.1) rotate(4deg);opacity:1}to{left:var(--fly-ex);top:var(--fly-ey);transform:scale(1);opacity:0}}.special-effect{position:fixed;top:0;right:0;bottom:0;left:0;z-index:180;pointer-events:none;display:flex;align-items:center;justify-content:center}.se-icon{font-size:5rem;font-weight:900;text-shadow:0 0 60px currentColor,0 0 120px currentColor;animation:sePopIn .7s cubic-bezier(.16,1,.3,1);filter:drop-shadow(0 0 20px currentColor)}.se-icon.se-spin{animation:seSpinIn .7s cubic-bezier(.2,.8,.3,1)}.se-icon.se-big{font-size:6.5rem}.effect-skip{color:var(--red);background:radial-gradient(circle,rgba(239,68,68,.12),transparent 60%)}.effect-reverse{color:var(--blue);background:radial-gradient(circle,rgba(59,130,246,.12),transparent 60%)}.effect-draw2{color:var(--yellow);background:radial-gradient(circle,rgba(234,179,8,.12),transparent 60%)}.effect-wild-draw4{color:var(--accent);background:radial-gradient(circle,rgba(244,63,94,.2),transparent 70%)}.effect-swap{color:#8b5cf6;background:radial-gradient(circle,rgba(139,92,246,.12),transparent 60%)}@keyframes sePopIn{0%{transform:scale(0);opacity:0}35%{transform:scale(1.2);opacity:1}65%{transform:scale(1.05)}to{transform:scale(.95);opacity:0}}@keyframes seSpinIn{0%{transform:scale(2) rotate(0);opacity:0}30%{opacity:1}to{transform:scale(1) rotate(360deg);opacity:0}}.btn-uno{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;padding:.9rem;font-size:1.3rem;font-weight:800;border:2px solid #dc2626;border-radius:10px;cursor:pointer;width:100%;text-shadow:0 1px 2px rgba(0,0,0,.3);box-shadow:0 4px 12px #ef44444d;letter-spacing:.05em;animation:ultroPulse .5s ease-in-out infinite alternate,kesShake .3s ease-in-out .8s 3}@keyframes kesShake{0%,to{transform:translate(0) scale(1.03)}25%{transform:translate(-4px) scale(1.03)}75%{transform:translate(4px) scale(1.03)}}.btn-uno:disabled{opacity:.4;animation:none;cursor:not-allowed}@keyframes ultroPulse{0%{transform:scale(1);box-shadow:0 4px 12px #ef44444d}to{transform:scale(1.06);box-shadow:0 8px 24px #ef444480}}.caisse-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:200;pointer-events:none;background:radial-gradient(circle,rgba(244,63,94,.15) 0%,transparent 60%)}.caisse-text{font-size:5rem;font-weight:900;color:#fff;text-shadow:0 0 40px var(--accent),0 0 80px var(--accent),0 4px 0 rgba(0,0,0,.3);animation:caisseAnim .3s cubic-bezier(.2,.8,.3,1);letter-spacing:.15em}.caisse-player{font-size:1.5rem;font-weight:700;color:var(--gold);text-shadow:0 0 10px rgba(251,191,36,.5);animation:caisseAnim .3s ease-out .1s both}@keyframes caisseAnim{0%{transform:scale(3);opacity:0}50%{transform:scale(.9);opacity:1}to{transform:scale(1)}}.confetti-container{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:150;overflow:hidden}.confetti-particle{position:absolute;top:-10px;border-radius:2px;animation:confettiFall linear forwards}@keyframes confettiFall{0%{transform:translateY(0) rotate(0) rotateX(0);opacity:1}80%{opacity:1}to{transform:translateY(100vh) rotate(720deg) rotateX(360deg);opacity:0}}.uno-finished{align-items:center;justify-content:center;gap:1.5rem;position:relative;overflow:hidden;padding:2rem 1rem}.uno-finished h2{font-size:2.2rem;color:var(--accent);font-weight:900}.win-title{font-size:3rem!important;color:var(--gold)!important;position:relative;overflow:hidden;text-shadow:0 0 20px rgba(251,191,36,.6),0 0 40px rgba(251,191,36,.3),0 4px 8px rgba(0,0,0,.4);animation:winPulse .9s ease-in-out infinite alternate;letter-spacing:.05em}.win-title:after{content:"";position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.25) 50%,transparent 60%);animation:winSheen 2.5s ease-in-out .5s infinite;pointer-events:none}@keyframes winSheen{0%{transform:translate(0);opacity:0}10%{opacity:1}to{transform:translate(450%);opacity:0}}@keyframes winPulse{0%{transform:scale(1)}to{transform:scale(1.08);text-shadow:0 0 30px rgba(251,191,36,.8),0 0 60px rgba(251,191,36,.5)}}.new-badge-popup{background:linear-gradient(135deg,#2a3a4a,#1a2a35);border:3px solid var(--gold);border-radius:16px;padding:1.5rem 2rem;display:flex;align-items:center;gap:1rem;animation:badgeSlide .5s cubic-bezier(.34,1.56,.64,1);box-shadow:0 8px 32px #fbbf2426}.new-badge-icon{font-size:2.5rem;animation:badgeBounce .6s ease-out}.new-badge-label{font-size:1.1rem;font-weight:700;color:var(--gold)}@keyframes badgeSlide{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes badgeBounce{0%{transform:scale(0) rotate(-180deg)}70%{transform:scale(1.1)}to{transform:scale(1) rotate(0)}}.badge-chest{width:100%;max-width:440px;background:linear-gradient(135deg,#1a1f35e6,#0c0f1acc);border:2px solid rgba(244,63,94,.2);border-radius:16px;padding:1.25rem;overflow-y:auto;max-height:280px}.chest-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.chest-icon{font-size:1.5rem}.chest-title{font-weight:700;font-size:1rem;flex:1}.chest-count{font-size:.8rem;color:var(--text-muted)}.chest-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}.chest-badge{display:flex;flex-direction:column;align-items:center;padding:.5rem .3rem;border-radius:var(--radius-sm);text-align:center;gap:.2rem;transition:all .2s}.chest-badge.earned{background:#f43f5e1f;border:1.5px solid rgba(244,63,94,.25)}.chest-badge.locked{opacity:.25}.chest-badge-icon{font-size:1.5rem}.chest-badge-name{font-size:.55rem;font-weight:700;line-height:1.1}.chest-badge-req{font-size:.5rem;color:var(--text-muted);font-weight:600}.color-picker-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:100}.color-picker{background:linear-gradient(135deg,var(--surface),rgba(12,15,26,.9));padding:2rem 1.5rem;border-radius:16px;text-align:center;display:flex;flex-direction:column;gap:1.5rem;border:1px solid rgba(244,63,94,.2);box-shadow:0 20px 60px #0009}.color-picker p{font-size:1.2rem;font-weight:700}.color-options{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.color-btn{width:72px;height:72px;border-radius:50%;border:3px solid rgba(255,255,255,.2);cursor:pointer;transition:all .25s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 12px #0000004d,inset 0 -3px 6px #0003,inset 0 2px 4px #ffffff26;position:relative}.color-btn:after{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:50%;border:2px solid rgba(255,255,255,.08);pointer-events:none}.color-btn:active{transform:scale(1.18);border-color:#ffffffe6}.color-red:active{box-shadow:0 0 28px var(--red),0 8px 20px #0006}.color-blue:active{box-shadow:0 0 28px var(--blue),0 8px 20px #0006}.color-green:active{box-shadow:0 0 28px var(--green),0 8px 20px #0006}.color-yellow:active{box-shadow:0 0 28px var(--yellow),0 8px 20px #0006}.color-red{background:var(--red)}.color-blue{background:var(--blue)}.color-green{background:var(--green)}.color-yellow{background:var(--yellow)}.swap-picker{background:linear-gradient(135deg,var(--surface),rgba(12,15,26,.9));padding:2rem 1.5rem;border-radius:16px;text-align:center;display:flex;flex-direction:column;gap:1rem;min-width:250px;border:1px solid rgba(244,63,94,.2);box-shadow:0 20px 60px #0009}.swap-picker p{font-size:1.2rem;font-weight:700}.swap-options{display:flex;flex-direction:column;gap:.5rem}.swap-player-btn{padding:.85rem 1rem;background:var(--bg);border:2px solid #333;border-radius:var(--radius-sm);color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:1rem;transition:border-color .2s}.swap-player-btn:active{border-color:var(--accent);transform:scale(.98)}.swap-player-name{font-weight:600}.swap-player-cards{color:var(--text-muted);font-size:.85rem}.fourbe-view{--fourbe-primary: #8b5cf6;--fourbe-accent: #ff6b6b;--fourbe-success: #34d399;--fourbe-highlight: #fcd34d;--fourbe-surface: #1e2436;gap:1.25rem;padding:1.25rem 1rem;background:radial-gradient(ellipse at 50% 0%,rgba(139,92,246,.08) 0%,transparent 60%);animation:fourbePhaseIn .4s ease-out both}.fourbe-view>*:nth-child(1){animation:fourbeChildIn .4s cubic-bezier(.34,1.56,.64,1) .05s both}.fourbe-view>*:nth-child(2){animation:fourbeChildIn .4s cubic-bezier(.34,1.56,.64,1) .1s both}.fourbe-view>*:nth-child(3){animation:fourbeChildIn .4s cubic-bezier(.34,1.56,.64,1) .15s both}.fourbe-view>*:nth-child(4){animation:fourbeChildIn .4s cubic-bezier(.34,1.56,.64,1) .2s both}.fourbe-view>*:nth-child(5){animation:fourbeChildIn .4s cubic-bezier(.34,1.56,.64,1) .25s both}.fourbe-view>*:nth-child(6){animation:fourbeChildIn .4s cubic-bezier(.34,1.56,.64,1) .3s both}@keyframes fourbePhaseIn{0%{opacity:0}to{opacity:1}}@keyframes fourbeChildIn{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.fourbe-header{display:flex;justify-content:space-between;align-items:center}.fourbe-title{font-size:1.2rem;font-weight:900;color:var(--fourbe-primary);letter-spacing:.1em;text-transform:uppercase}.fourbe-category{text-align:center;color:var(--text-muted);font-size:.85rem;background:#8b5cf614;padding:.4rem 1rem;border-radius:100px;border:1px solid rgba(139,92,246,.15);align-self:center}.fourbe-word-card{background:var(--fourbe-surface);border:2px solid rgba(139,92,246,.25);border-radius:24px;padding:2.5rem 2rem;text-align:center;margin:.5rem 0;position:relative;box-shadow:0 8px 32px #0000004d,0 0 0 1px #8b5cf61a;overflow:hidden}.fourbe-word-card:before{display:none}.fourbe-word-card:after{display:none}.fourbe-role-good{font-size:.8rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.15em;margin-bottom:.75rem}.fourbe-word{font-size:3rem;font-weight:900;color:var(--fourbe-highlight);line-height:1.1;animation:fourbeWordReveal .6s cubic-bezier(.34,1.56,.64,1) both}.fourbe-role-bad{font-size:1.8rem;font-weight:900;color:var(--fourbe-accent);animation:fourbeStamp .5s cubic-bezier(.34,1.56,.64,1) both}.fourbe-role-hint{color:var(--text-muted);margin-top:.75rem;font-size:.9rem}.fourbe-waiting{text-align:center;color:var(--text-muted);padding:1rem 0;font-size:.9rem}@keyframes fourbeStamp{0%{transform:scale(2.5) rotate(-5deg);opacity:0}60%{transform:scale(.95) rotate(1deg);opacity:1}80%{transform:scale(1.05)}to{transform:scale(1) rotate(0)}}@keyframes fourbeWordReveal{0%{opacity:0;transform:translateY(8px) scale(.95);filter:blur(6px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}.fourbe-my-word{background:var(--fourbe-surface);padding:.5rem 1rem;border-radius:12px;text-align:center;font-size:.9rem;border:1px solid rgba(139,92,246,.12)}.fourbe-my-word strong{color:var(--fourbe-highlight)}.fourbe-my-word.fourbe-impostor{color:var(--fourbe-accent);border-color:#ff6b6b4d;background:linear-gradient(135deg,rgba(255,107,107,.06),var(--fourbe-surface));position:relative;overflow:hidden;animation:fourbeImpostorPulse 3s ease-in-out infinite}.fourbe-my-word.fourbe-impostor:after{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,107,107,.05),transparent);animation:fourbeImpostorScan 4s linear infinite;pointer-events:none}@keyframes fourbeImpostorPulse{0%,to{border-color:#ff6b6b33}50%{border-color:#ff6b6b73;box-shadow:0 0 12px #ff6b6b1a}}@keyframes fourbeImpostorScan{0%{left:-50%}to{left:150%}}.fourbe-discussion{background:var(--fourbe-surface);border-radius:20px;border:1px solid rgba(139,92,246,.12);padding:2.5rem 1.5rem;text-align:center;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem}.fourbe-round{color:var(--fourbe-primary);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.15em;background:#8b5cf61a;padding:.3rem 1rem;border-radius:100px;border:1px solid rgba(139,92,246,.2)}.fourbe-speaker{font-size:1rem;color:var(--text-muted)}.fourbe-speaker strong{display:block;font-size:2.5rem;font-weight:900;color:var(--fourbe-highlight);animation:fourbeSpeakerBounce .5s cubic-bezier(.34,1.56,.64,1) both}@keyframes fourbeSpeakerBounce{0%{opacity:0;transform:scale(.5) translateY(10px)}70%{transform:scale(1.08) translateY(-2px)}to{opacity:1;transform:scale(1) translateY(0)}}.fourbe-host-controls{display:flex;gap:.75rem}.fourbe-host-controls .btn{flex:1}.fourbe-config{background:var(--fourbe-surface);border-radius:16px;padding:1.5rem;display:flex;flex-direction:column;gap:1rem;border:2px solid rgba(139,92,246,.2)}.fourbe-config h3{color:var(--fourbe-primary);text-align:center;font-size:1.1rem}.config-row{display:flex;justify-content:space-between;align-items:center}.config-row label{font-size:.9rem;font-weight:600}.config-counter{display:flex;align-items:center;gap:.75rem}.config-counter button{width:36px;height:36px;border-radius:50%;border:2px solid var(--fourbe-primary);background:transparent;color:var(--fourbe-primary);font-size:1.2rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s cubic-bezier(.34,1.56,.64,1)}.config-counter button:active{background:#8b5cf633;transform:scale(.92)}.config-counter span{font-size:1.3rem;font-weight:800;min-width:24px;text-align:center}.config-summary{text-align:center;color:var(--text-muted);font-size:.85rem}.config-buttons{display:flex;gap:.75rem}.config-buttons .btn{flex:1}.fourbe-vote-title{text-align:center;color:var(--fourbe-primary);font-size:1.3rem;font-weight:800;letter-spacing:.05em}.fourbe-vote-list{display:flex;flex-direction:column;gap:.6rem;flex:1;animation:fourbeVoteListIn .4s ease-out both}.fourbe-vote-btn{padding:1.1rem 1.2rem;background:var(--fourbe-surface);border:2px solid rgba(139,92,246,.2);border-radius:16px;color:var(--text);font-size:1.15rem;font-weight:700;cursor:pointer;transition:all .15s cubic-bezier(.34,1.56,.64,1);overflow:hidden}.fourbe-vote-btn:before{display:none}.fourbe-vote-btn:active{border-color:var(--fourbe-accent);background:#ff6b6b1f;transform:scale(.96);box-shadow:0 0 16px #ff6b6b33}@keyframes fourbeVoteListIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.fourbe-result{text-align:center;display:flex;flex-direction:column;gap:1.25rem;flex:1;animation:fourbeResultIn .5s cubic-bezier(.34,1.56,.64,1) both}.fourbe-result-win{color:var(--fourbe-success);font-size:2.2rem;font-weight:900;animation:fourbeResultBounce .6s cubic-bezier(.34,1.56,.64,1) both}.fourbe-result-lose{color:var(--fourbe-accent);font-size:2.2rem;font-weight:900;animation:fourbeResultBounce .6s cubic-bezier(.34,1.56,.64,1) both}@keyframes fourbeResultBounce{0%{opacity:0;transform:scale(.5)}60%{transform:scale(1.1)}80%{transform:scale(.97)}to{opacity:1;transform:scale(1)}}.fourbe-win-celebration{text-align:center}.fourbe-win-emoji{font-size:4rem;display:inline-block;animation:fourbeEmojiDrop .6s cubic-bezier(.34,1.56,.64,1) both}@keyframes fourbeEmojiDrop{0%{opacity:0;transform:scale(0) rotate(-30deg) translateY(-40px)}60%{transform:scale(1.2) rotate(5deg) translateY(0)}80%{transform:scale(.95) rotate(-2deg)}to{opacity:1;transform:scale(1) rotate(0)}}.fourbe-reveal{background:var(--fourbe-surface);padding:1.25rem;border-radius:16px;border:1px solid rgba(139,92,246,.12);font-size:1rem}.fourbe-reveal-word{margin-bottom:.3rem}.fourbe-reveal-word strong{color:var(--fourbe-highlight)}.fourbe-roles-reveal{display:flex;flex-direction:column;gap:.4rem;margin-top:.75rem}.fourbe-role-line{font-weight:600;font-size:.95rem;padding:.5rem .75rem;border-left:3px solid currentColor;border-radius:0 8px 8px 0;background:#ffffff08;animation:fourbeRoleLineIn .4s cubic-bezier(.34,1.56,.64,1) both}.fourbe-roles-reveal .fourbe-role-line:nth-child(1){animation-delay:.15s}.fourbe-roles-reveal .fourbe-role-line:nth-child(2){animation-delay:.35s}.fourbe-roles-reveal .fourbe-role-line:nth-child(3){animation-delay:.55s}.fourbe-roles-reveal .fourbe-role-line:nth-child(4){animation-delay:.75s}.fourbe-roles-reveal .fourbe-role-line:nth-child(5){animation-delay:.95s}.fourbe-votes-list{text-align:left;background:#00000026;border-radius:12px;padding:.75rem 1rem;border:1px solid rgba(139,92,246,.08)}.fourbe-votes-list h4{color:var(--fourbe-primary);margin-bottom:.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;padding-bottom:.4rem;border-bottom:1px solid rgba(139,92,246,.12)}.fourbe-vote-result{padding:.4rem .6rem;font-size:.9rem;border-radius:6px;margin-bottom:.2rem}.fourbe-vote-result.correct{color:var(--fourbe-success);background:#34d39914;border-left:2px solid var(--fourbe-success)}.fourbe-vote-result.wrong{color:var(--text-muted);background:#ffffff05;border-left:2px solid rgba(100,116,139,.3);opacity:.7}@keyframes fourbeResultIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes fourbeRoleLineIn{0%{opacity:0;transform:translate(-16px) scale(.95)}to{opacity:1;transform:translate(0) scale(1)}}.p4-view{gap:.5rem;padding:.5rem}.p4-top{display:flex;justify-content:space-between;align-items:center}.p4-title{font-size:1.2rem;font-weight:900;color:var(--accent);letter-spacing:.05em}.p4-match{font-size:.8rem;color:var(--text-muted)}.p4-players-bar{display:flex;align-items:center;justify-content:center;gap:.75rem}.p4-player-tag{padding:.4rem 1rem;border-radius:100px;font-weight:700;font-size:.9rem}.p4-disc-1{background:#ef444426;color:#ef4444;border:2px solid rgba(239,68,68,.3)}.p4-disc-2{background:#eab30826;color:#eab308;border:2px solid rgba(234,179,8,.3)}.p4-player-tag.me{box-shadow:0 0 12px #f43f5e4d}.p4-vs{font-weight:900;color:var(--text-muted);font-size:.8rem}.p4-status{text-align:center;font-size:.9rem;color:var(--text-muted);padding:.25rem 0}.p4-my-turn{color:var(--green-bright);font-weight:700;animation:turnPulse 1s ease-in-out infinite alternate}.p4-winner{color:var(--gold);font-weight:800;font-size:1.1rem}.p4-spectator{font-style:italic}.p4-grid-wrapper{display:flex;flex-direction:column;align-items:center;position:relative}.p4-grid{background:linear-gradient(135deg,#1e3a8a,#1e40af);border-radius:14px;padding:6px;display:flex;flex-direction:column;gap:3px;box-shadow:0 8px 32px #00000080,inset 0 1px #ffffff1a,0 0 0 2px #1e3a8a80}.p4-row{display:flex;gap:3px}.p4-cell{width:44px;height:44px;border-radius:50%;background:#080e1f;cursor:pointer;border:2px solid rgba(0,0,0,.4);box-shadow:inset 0 2px 4px #00000080;transition:background .15s}.p4-cell.empty:active{background:#8b5cf626}.p4-cell.disc-1{background:radial-gradient(circle at 35% 35%,#ff8a8a,#ef4444,#b91c1c);box-shadow:inset 0 -3px 6px #0000004d,inset 0 2px 4px #ffffff26,0 0 10px #ef444466;cursor:default}.p4-cell.disc-2{background:radial-gradient(circle at 35% 35%,#fde68a,#eab308,#a16207);box-shadow:inset 0 -3px 6px #0000004d,inset 0 2px 4px #ffffff26,0 0 10px #eab30866;cursor:default}.p4-cell.just-dropped{animation:p4DropBounce .5s cubic-bezier(.2,.8,.3,1)}@keyframes p4DropBounce{0%{transform:translateY(-200px) scale(.9);opacity:.5}60%{transform:translateY(6px) scale(1.05);opacity:1}80%{transform:translateY(-3px) scale(.98)}to{transform:translateY(0) scale(1)}}.p4-cell.win-cell{animation:p4WinPulse .5s ease-in-out infinite alternate!important}@keyframes p4WinPulse{0%{transform:scale(1);box-shadow:0 0 10px #ffffff4d}to{transform:scale(1.12);box-shadow:0 0 24px #ffffffb3,0 0 40px #ffffff4d}}.p4-col-indicators{display:flex;gap:3px;padding:0 6px;margin-bottom:4px}.p4-col-hint{width:44px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px 8px 0 0;transition:background .15s}.p4-col-hint.available:active{background:#8b5cf626}.p4-col-hint.full{opacity:.15;cursor:not-allowed}.p4-hint-disc{width:20px;height:20px;border-radius:50%;opacity:.4;transition:opacity .15s}.p4-col-hint.available:active .p4-hint-disc{opacity:.8}.hint-red{background:#ef4444}.hint-yellow{background:#eab308}.p4-actions{display:flex;gap:.5rem}.p4-actions .btn{flex:1}.p4-scores{background:var(--surface);border-radius:12px;padding:.75rem}.p4-scores-title{font-size:.75rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.5rem}.p4-score-row{display:flex;align-items:center;gap:.5rem;padding:.3rem .4rem;font-size:.85rem;border-radius:6px}.p4-score-row.me{background:#f43f5e14}.p4-rank{color:var(--text-muted);font-weight:700;min-width:20px}.p4-score-name{flex:1;font-weight:600}.p4-score-wins{color:var(--gold);font-weight:700;font-size:.8rem}.p4-mode-select{display:flex;flex-direction:column;gap:.5rem}.p4-mode-btn{background:var(--surface);border:2px solid #333;border-radius:12px;padding:1rem;text-align:left;cursor:pointer;color:var(--text);transition:all .15s;display:flex;flex-direction:column;gap:.2rem}.p4-mode-btn strong{font-size:1rem}.p4-mode-btn span{font-size:.8rem;color:var(--text-muted)}.p4-mode-btn.active{border-color:#3b82f6;background:#3b82f61a}.p4-mode-btn:active{transform:scale(.98)}.p4-tournament-banner{text-align:center;font-size:.8rem;color:var(--text-muted);background:#3b82f614;padding:.35rem .75rem;border-radius:100px;border:1px solid rgba(59,130,246,.15)}.p4-final-banner{color:var(--gold);background:#fbbf2414;border-color:#fbbf2433;font-weight:700}.p4-streak{font-size:.75rem;color:#ef4444;font-weight:700}.p4-champion-screen{text-align:center;padding:2rem 0}.p4-champion-title{font-size:2rem;font-weight:900;color:var(--gold);animation:fourbeResultBounce .6s cubic-bezier(.34,1.56,.64,1) both}.p4-final-score{color:var(--text-muted);margin-top:.5rem}.p4-score-row.first{background:#fbbf2414;border-left:3px solid var(--gold)}.game-icon-power4{font-size:1.5rem}.game-card-power4{border-color:#3b82f6}.game-title-power4{color:#3b82f6}@media(max-height:700px){.uno-player-view{padding:.2rem;gap:.2rem}.uno-info-bar{padding:.3rem .6rem;font-size:.8rem}.uno-table{padding:.7rem 1rem;gap:.7rem}.uno-card{width:56px;height:84px;border-radius:8px}.uno-card .card-value{font-size:1.2rem}.uno-card .card-corner-top,.uno-card .card-corner-bottom{font-size:.4rem}.uno-hand{padding:.4rem .3rem}.draw-pile-card,.uno-card-back{width:56px;height:84px;border-radius:8px}.flying-card{width:56px;height:84px;border-radius:8px;font-size:1.2rem}.other-player{padding:.3rem .4rem}.other-player-cards .uno-card-back.small{width:16px;height:24px;margin-left:-4px}.btn-uno{padding:.5rem;font-size:1rem}}@media(max-width:360px){.screen{padding:.5rem}.lobby-code{font-size:2.2rem}.title{font-size:2rem}.uno-table{padding:.6rem .8rem}}@media(min-height:800px){.uno-game-area{gap:.6rem}.uno-table{padding:1.5rem 2.5rem}}@media(orientation:landscape)and (max-height:500px){.uno-player-view{flex-direction:row;flex-wrap:wrap;padding:.2rem}.uno-top-bar,.uno-info-bar{width:100%}.uno-game-area{flex:1;min-width:50%}.uno-hand{flex:1;min-width:40%;max-height:100%;flex-direction:column;overflow-y:auto;overflow-x:hidden}.uno-card,.draw-pile-card{width:45px;height:68px}}.sel-view{display:flex;flex-direction:column;gap:.5rem;padding:.8rem;align-items:center}.sel-top{display:flex;align-items:center;width:100%;gap:.5rem}.sel-game-title{flex:1;font-size:1.1rem;font-weight:800;background:linear-gradient(135deg,var(--green),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sel-my-pos{font-size:.85rem;color:var(--text-muted);font-weight:600}.sel-status{font-size:1rem;font-weight:600;text-align:center}.sel-my-turn{color:var(--green);animation:turnPulse 1s infinite}.sel-pending-turn{color:var(--accent);animation:turnPulse 1s infinite}.sel-wait-turn{color:var(--text-muted)}.sel-event-banner{background:#ffffff0f;border-radius:8px;padding:.5rem .8rem;font-size:.9rem;text-align:center;width:100%;animation:selEventSlideIn .3s ease-out}@keyframes selEventSlideIn{0%{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:1}}.sel-dice-area{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin:.3rem 0}.sel-roll-btn{width:100px;height:100px;border-radius:20px;border:3px solid rgba(255,255,255,.15);background:linear-gradient(145deg,var(--surface),rgba(255,255,255,.05));display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease;color:var(--text);font-size:1rem;font-weight:700}.sel-roll-active{border-color:var(--green);box-shadow:0 0 20px #22c55e4d;animation:selRollGlow 1.5s infinite}.sel-roll-active:active{transform:scale(.92)}.sel-roll-disabled{opacity:.4;cursor:not-allowed}.sel-roll-anim{animation:selDiceShake .6s ease}@keyframes selRollGlow{0%,to{box-shadow:0 0 15px #22c55e33}50%{box-shadow:0 0 30px #22c55e66}}@keyframes selDiceShake{0%{transform:rotate(0) scale(1)}15%{transform:rotate(15deg) scale(1.1)}30%{transform:rotate(-12deg) scale(1.08)}45%{transform:rotate(8deg) scale(1.05)}60%{transform:rotate(-5deg) scale(1.02)}to{transform:rotate(0) scale(1)}}.sel-dice-face{width:64px;height:64px;background:linear-gradient(145deg,#fff,#e0e0e0);border-radius:12px;display:grid;grid-template:repeat(3,1fr) / repeat(3,1fr);padding:8px;box-shadow:0 3px 10px #0000004d;animation:selFacePop .35s cubic-bezier(.34,1.56,.64,1)}.sel-dice-dot{width:11px;height:11px;background:#1a1a2e;border-radius:50%;align-self:center;justify-self:center}@keyframes selFacePop{0%{transform:scale(.3) rotate(90deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.sel-dice-rolling{font-size:2.5rem;animation:selDiceShake .6s ease infinite}.sel-dice-label{font-size:1.1rem}.sel-six-count{color:var(--yellow);font-size:.85rem;font-weight:700}.sel-buffs{display:flex;gap:.5rem;justify-content:center}.sel-buff{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:1.1rem;background:#ffffff14;border:2px solid rgba(255,255,255,.15)}.sel-buff-shield{border-color:var(--blue);color:var(--blue)}.sel-buff-double{border-color:var(--yellow);color:var(--yellow);font-size:.9rem;font-weight:800}.sel-buff-frozen{border-color:#67e8f9;color:#67e8f9}.sel-target-picker{width:100%}.sel-target-picker h3{font-size:1rem;text-align:center;margin:0 0 .5rem;color:var(--accent)}.sel-target-list{display:flex;flex-direction:column;gap:.4rem}.sel-target-btn{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;border-radius:10px;border:2px solid;background:#ffffff0a;color:var(--text);cursor:pointer;transition:all .15s;font-size:1rem}.sel-target-btn:active{transform:scale(.96);background:#ffffff14}.sel-target-color{width:14px;height:14px;border-radius:50%;flex-shrink:0}.sel-target-name{flex:1;font-weight:600}.sel-target-pos{color:var(--text-muted);font-size:.85rem}.sel-mini-board-wrap{position:relative;width:100%;max-width:320px;aspect-ratio:1;border-radius:10px;overflow:hidden;border:4px solid #5b3a1a;box-shadow:inset 0 0 0 1px #d4a373,inset 0 0 0 2px #8b5e34,0 4px 14px #00000073;background:#1a0f08}.sel-mini-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:2}.sel-mini-board{display:grid;grid-template-rows:repeat(10,1fr);width:100%;height:100%;position:relative;z-index:1}.sel-mini-row{display:grid;grid-template-columns:repeat(10,1fr)}.sel-mini-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:.5px solid rgba(0,0,0,.18);position:relative;box-shadow:inset 0 1px #ffffff4d}.sel-mini-c0{background:linear-gradient(135deg,#fde68a,#fbbf24)}.sel-mini-c1{background:linear-gradient(135deg,#fecaca,#f87171)}.sel-mini-c2{background:linear-gradient(135deg,#bfdbfe,#60a5fa)}.sel-mini-c3{background:linear-gradient(135deg,#bbf7d0,#4ade80)}.sel-mini-me{box-shadow:inset 0 0 0 2px #fff,0 0 8px #fff9;z-index:2}.sel-mini-start{background:linear-gradient(135deg,#d1fae5,#10b981)!important}.sel-mini-star{background:linear-gradient(135deg,#fef9c3,#facc15)!important}.sel-mini-trap{background:linear-gradient(135deg,#fecaca,#ef4444)!important}.sel-mini-boost{background:linear-gradient(135deg,#c7d2fe,#6366f1)!important}.sel-mini-snake-head{box-shadow:inset 0 0 0 2px var(--accent-c),inset 0 0 8px #0000004d}.sel-mini-snake-head:before{content:"";position:absolute;top:1px;right:1px;width:5px;height:5px;border-radius:50%;background:var(--accent-c);box-shadow:0 0 4px var(--accent-c);z-index:3}.sel-mini-snake-tail{box-shadow:inset 0 0 0 2px var(--accent-c);opacity:.95}.sel-mini-ladder-base{box-shadow:inset 0 -2px 0 0 var(--accent-c, #f6c441),inset 0 0 6px #fbbf2440}.sel-mini-ladder-top{box-shadow:inset 0 2px 0 0 var(--accent-c, #f6c441),inset 0 0 6px #fbbf2440}.sel-mini-finish{background:linear-gradient(135deg,#f59e0b,#b45309)!important;box-shadow:inset 0 0 0 1px #fde047}.sel-mini-token{width:8px;height:8px;border-radius:50%;border:1px solid rgba(255,255,255,.5);position:absolute}.sel-players-bar{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;width:100%}.sel-player-chip{display:flex;align-items:center;gap:.3rem;padding:.3rem .5rem;border-radius:6px;background:#ffffff0a;font-size:.75rem}.sel-chip-active{background:#ffffff1a;box-shadow:inset 2px 0 0 var(--accent)}.sel-chip-me{border:1px solid rgba(255,255,255,.15)}.sel-chip-color{width:8px;height:8px;border-radius:50%}.sel-chip-name{font-weight:600;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sel-chip-pos{color:var(--text-muted)}.sel-finish-screen{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem 0}.sel-finish-title{font-size:1.6rem;font-weight:800;color:var(--gold);text-align:center}.sel-final-ranks{width:100%;display:flex;flex-direction:column;gap:.3rem}.sel-rank-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .8rem;border-radius:8px;background:#ffffff0a}.sel-rank-me{background:#ffffff14;border:1px solid rgba(255,255,255,.12)}.sel-rank-first{background:#fbbf241a;border:1px solid rgba(251,191,36,.3)}.sel-rank-num{font-weight:700;width:28px;text-align:center}.sel-rank-name{font-weight:600}.game-card-serpents{border-color:#22c55e4d}.game-card-serpents:hover{border-color:#22c55e99;box-shadow:0 0 20px #22c55e26}.game-title-serpents{color:var(--green)}.game-icon-serpents{font-size:2rem}@media(max-height:700px){.sel-roll-btn{width:80px;height:80px;border-radius:16px}.sel-dice-face{width:52px;height:52px;padding:6px}.sel-dice-dot{width:9px;height:9px}.sel-mini-board{max-width:260px}}@media(max-width:360px){.sel-mini-board-wrap{max-width:240px}.sel-roll-btn{width:72px;height:72px}}@media(max-width:480px){.sel-mini-board-wrap{max-width:260px}}.sel-token-hidden{opacity:0!important;transition:none!important}.sel-snake.sel-snake-striking .sel-snake-head-grp{animation:selHeadDartMini .2s ease-out;filter:drop-shadow(0 0 4px rgba(239,68,68,.85))}.sel-snake.sel-snake-striking .sel-snake-eye{animation:selEyeFlashMini .25s ease-out}@keyframes selHeadDartMini{0%{transform:translate(0) scale(1)}60%{transform:translate(.06px) scale(1.18)}to{transform:translate(0) scale(1)}}@keyframes selEyeFlashMini{0%{fill:inherit}50%{fill:#ef4444}to{fill:inherit}}.sel-ladder.sel-ladder-charging{filter:drop-shadow(0 0 4px rgba(251,191,36,.7))}.sel-ladder-rung-glow{stroke:#fde047!important;filter:drop-shadow(0 0 2px #fbbf24) drop-shadow(0 0 4px #f59e0b)}.sel-mini-overlay .sel-snake-eye{animation:selSnakeBlinkMini 9s ease-in-out infinite}.sel-mini-overlay .sel-snake:nth-child(2n) .sel-snake-eye{animation-delay:-3s}.sel-mini-overlay .sel-snake:nth-child(3n) .sel-snake-eye{animation-delay:-6s}@keyframes selSnakeBlinkMini{0%,92%,to{transform:scaleY(1)}95%,96%{transform:scaleY(.05)}97%{transform:scaleY(1)}}.sel-mini-board-wrap.sel-board-shake{animation:selBoardShakeMini .22s ease-in-out 1.08s}@keyframes selBoardShakeMini{0%,to{transform:translate(0)}15%{transform:translate(-2px,1px)}30%{transform:translate(2px,-1px)}45%{transform:translate(-1px,2px)}60%{transform:translate(2px,-1px)}75%{transform:translate(-1px,1px)}}.sel-mini-board-wrap .sel-fx-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.sel-fx-cell-flash{position:absolute;width:10%;height:10%;transform:translate(-50%,-50%);border-radius:4px;opacity:0;animation:selCellFlashMini .38s ease-out forwards}.sel-fx-cell-flash-red{background:radial-gradient(circle,#ef4444d9,#ef444400)}.sel-fx-cell-flash-gold{background:radial-gradient(circle,#fbbf24e6,#fbbf2400)}@keyframes selCellFlashMini{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}40%{opacity:.95;transform:translate(-50%,-50%) scale(1.4)}to{opacity:0;transform:translate(-50%,-50%) scale(2)}}.sel-fx-dust{position:absolute;width:0;height:0;transform:translate(-50%,-50%)}.sel-fx-dust-p{position:absolute;border-radius:50%;opacity:0;transform:translate(-50%,-50%);animation:selDustBurstMini .56s ease-out forwards;box-shadow:0 0 3px currentColor}@keyframes selDustBurstMini{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}10%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--dx, 0px)),calc(-50% + var(--dy, 0px))) scale(.6)}}.sel-snake-bump,.sel-snake-capture{filter:drop-shadow(0 0 3px rgba(0,0,0,.6));pointer-events:none}.sel-ladder-token{filter:drop-shadow(0 0 4px rgba(251,191,36,.7)) drop-shadow(0 0 6px rgba(255,255,255,.4));pointer-events:none}
