@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700;800;900&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap";:root{--font-display:"Outfit", sans-serif;--font-sans:"Plus Jakarta Sans", sans-serif;--bg-primary:#060912;--bg-secondary:#0a0e1a;--bg-tertiary:#10162a;--color-red:#f36;--color-green:#00f5d4;--color-blue:#00bbf9;--color-yellow:#fee440;--color-wild:#9b5de5;--color-red-glow:#f366;--color-green-glow:#00f5d466;--color-blue-glow:#00bff966;--color-yellow-glow:#fee44066;--color-wild-glow:#9b5de566;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#475569;--border-glass:#ffffff14;--bg-glass:#0a0e1ae6;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1);--card-width:96px;--card-height:144px;--card-overlap:-48px;--card-radius:16px;--card-corner-font:13px;--card-oval-inset:12px;--card-center-font:40px;--card-icon-size:32px;--card-icon-font:22px;--card-selected-translate:-24px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);background-image:radial-gradient(at 0 0,#9b5de51a 0,#0000 50%),radial-gradient(at 100% 100%,#00bff91a 0,#0000 50%),radial-gradient(#0a0e1acc 0,#0000 80%);width:100%;min-height:100vh;overflow:hidden auto}h1,h2,h3,h4,.font-display{font-family:var(--font-display);letter-spacing:-.02em;font-weight:800}.glass-panel{background:var(--bg-glass);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-glass);border-radius:24px;box-shadow:0 20px 50px #0009,inset 0 1px #ffffff1a}button,.btn{font-family:var(--font-sans);cursor:pointer;transition:var(--transition-smooth);border:none;outline:none;justify-content:center;align-items:center;font-weight:700;display:inline-flex}button:active{transform:scale(.96)}input[type=text],input[type=number],select{font-family:var(--font-sans);background-color:var(--bg-tertiary);border:1px solid var(--border-glass);color:#fff;transition:var(--transition-smooth);border-radius:12px;outline:none}input[type=text]:focus,input[type=number]:focus,select:focus{border-color:var(--color-blue);box-shadow:0 0 0 3px #00bff933}.color-bg-red{background-color:var(--color-red)}.color-bg-green{background-color:var(--color-green)}.color-bg-blue{background-color:var(--color-blue)}.color-bg-yellow{background-color:var(--color-yellow)}.color-text-red{color:var(--color-red)}.color-text-green{color:var(--color-green)}.color-text-blue{color:var(--color-blue)}.color-text-yellow{color:var(--color-yellow)}.lobby-container{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.lobby-logo{text-align:center;flex-direction:column;align-items:center;gap:4px;margin-bottom:32px;display:flex}.lobby-title{letter-spacing:.1em;text-transform:uppercase;background:linear-gradient(90deg, var(--color-red), var(--color-wild), var(--color-blue), var(--color-yellow));color:#0000;filter:drop-shadow(0 4px 12px #00000080);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;font-size:72px;font-style:italic;font-weight:950;animation:6s infinite logo-flow}@keyframes logo-flow{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.lobby-subtitle{color:var(--text-secondary);letter-spacing:.2em;text-transform:uppercase;margin-top:4px;font-size:11px;font-weight:800}.lobby-card{flex-direction:column;gap:28px;width:100%;max-width:440px;padding:40px;display:flex}.status-bar{text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:16px;font-size:11px;font-weight:700;display:flex}.status-dot{border-radius:50%;width:10px;height:10px;margin-right:6px;display:inline-block}.status-dot.connected{background-color:var(--color-green);box-shadow:0 0 10px var(--color-green-glow)}.status-dot.disconnected{background-color:var(--color-red);box-shadow:0 0 10px var(--color-red-glow)}.error-box{color:#ff809f;text-align:center;background-color:#ff33661a;border:1px solid #ff336640;border-radius:12px;padding:12px 16px;font-size:13px;font-weight:600;line-height:1.4}.form-group{flex-direction:column;gap:10px;width:100%;display:flex}.form-label{color:var(--text-secondary);letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:800}.input-text{width:100%;padding:14px 18px;font-size:15px;font-weight:600}.emoji-grid-container{flex-direction:column;gap:10px;display:flex}.emoji-grid{grid-template-columns:repeat(6,1fr);gap:8px;padding:4px 0;display:grid}.emoji-btn{aspect-ratio:1;width:100%;transition:var(--transition-smooth);background-color:#ffffff08;border:1px solid #ffffff0d;border-radius:14px;justify-content:center;align-items:center;padding:0;font-size:22px;line-height:1;display:flex}.emoji-btn:hover{background-color:#ffffff0f;transform:translateY(-2px)}.emoji-btn.selected{border:2px solid var(--color-blue);background-color:#00bbf90d;box-shadow:inset 0 0 8px #00bbf91a,0 0 12px #00bbf940}.btn-create{color:#fff;background:linear-gradient(135deg,#7c3aed 0%,#4f46e5 100%);border-radius:14px;gap:8px;width:100%;padding:16px 20px;font-size:16px;font-weight:800;box-shadow:0 8px 24px #6366f14d}.btn-create:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 12px 30px #6366f173}.btn-create:disabled,.btn-join:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none}.divider{justify-content:center;align-items:center;width:100%;margin:8px 0;display:flex}.divider-line{background-color:#ffffff14;flex:1;height:1px}.divider-text{color:var(--text-muted);letter-spacing:.15em;padding:0 16px;font-size:11px;font-weight:800}.input-code{letter-spacing:.25em;text-align:center;text-transform:uppercase;width:100%;padding:14px 18px;font-size:18px;font-weight:900}.input-code::placeholder{letter-spacing:normal;text-transform:none;font-size:13px;font-weight:600}.btn-join{color:#fff;background:linear-gradient(135deg,#0ea5e9 0%,#2563eb 100%);border-radius:14px;gap:8px;width:100%;margin-top:10px;padding:16px 20px;font-size:16px;font-weight:800;box-shadow:0 8px 24px #0ea5e94d}.btn-join:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 12px 30px #0ea5e973}.lobby-footer{color:var(--text-muted);gap:20px;margin-top:32px;font-size:11px;font-weight:600;display:flex}.lobby-footer-item{align-items:center;gap:6px;display:flex}.waiting-container{flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:680px;min-height:100vh;margin:0 auto;padding:24px;display:flex}.waiting-top-bar{justify-content:space-between;width:100%;margin-bottom:24px;display:flex}.btn-back,.btn-settings-cog{border:1px solid var(--border-glass);color:var(--text-secondary);background-color:#ffffff0a;border-radius:10px;gap:6px;padding:8px 16px;font-size:12px;font-weight:700}.btn-back:hover,.btn-settings-cog:hover{color:#fff;background-color:#ffffff14}.btn-settings-cog.active{color:var(--color-blue);background-color:#00bbf91a;border-color:#00bbf94d}.waiting-card{flex-direction:column;gap:32px;width:100%;padding:40px;display:flex}.waiting-code-section{border-bottom:1px solid #ffffff14;flex-direction:column;align-items:center;gap:6px;padding-bottom:28px;display:flex}.code-title{color:var(--text-muted);letter-spacing:.15em;text-transform:uppercase;font-size:11px;font-weight:800}.code-display{color:var(--color-blue);letter-spacing:.05em;font-size:54px;font-weight:900}.invite-widget{background-color:var(--bg-tertiary);border:1px solid var(--border-glass);border-radius:12px;align-items:center;gap:12px;width:100%;max-width:380px;margin-top:16px;padding:8px 12px 8px 16px;display:flex;overflow:hidden}.invite-url{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;flex:1;font-family:monospace;font-size:12px;overflow:hidden}.btn-copy{color:var(--text-secondary);background-color:#0000;border-radius:8px;padding:6px}.btn-copy:hover{color:#fff;background-color:#ffffff0f}.players-header{color:var(--text-secondary);letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;margin-bottom:8px;font-size:11px;font-weight:800;display:flex}.players-list{flex-direction:column;gap:10px;max-height:220px;display:flex;overflow-y:auto}.player-row{border:1px solid var(--border-glass);transition:var(--transition-smooth);background-color:#141b304d;border-radius:14px;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.player-row.me{background-color:#00bbf908;border-color:#00bbf933}.player-info{align-items:center;gap:14px;display:flex}.player-avatar{font-size:26px}.player-name-container{flex-direction:column;gap:2px;display:flex}.player-name{color:#fff;align-items:center;gap:6px;font-size:14px;font-weight:700;display:flex}.badge-you{color:var(--color-blue);background-color:#00bbf926;border-radius:4px;padding:1px 6px;font-size:9px;font-weight:800}.badge-host{letter-spacing:.05em;text-transform:uppercase;color:var(--color-wild);font-size:8px;font-weight:800}.player-status-badge{text-transform:uppercase;letter-spacing:.05em;border-radius:20px;padding:4px 12px;font-size:10px;font-weight:800}.player-status-badge.host{color:#c084fc;background-color:#9b5de526}.player-status-badge.ready{color:#2dd4bf;background-color:#00f5d426}.player-status-badge.not-ready{color:#facc15;background-color:#fee4401f}.btn-start-game{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border-radius:14px;gap:8px;width:100%;padding:16px 20px;font-size:18px;font-weight:800;box-shadow:0 8px 24px #10b9814d}.btn-start-game:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 12px 30px #10b98173}.btn-ready-toggle{color:#fff;border-radius:14px;width:100%;padding:16px 20px;font-size:16px;font-weight:800}.btn-ready-toggle.ready{background:linear-gradient(135deg,#ea580c 0%,#c2410c 100%);box-shadow:0 8px 24px #ea580c40}.btn-ready-toggle.not-ready{background:linear-gradient(135deg,#059669 0%,#047857 100%);box-shadow:0 8px 24px #05966940}.btn-ready-toggle:hover{filter:brightness(1.1);transform:translateY(-2px)}.rules-preview{border:1px solid var(--border-glass);width:100%;color:var(--text-secondary);background-color:#0f15264d;border-radius:14px;flex-direction:column;gap:12px;margin-top:8px;padding:18px 24px;font-size:12px;display:flex}.rules-preview-title{color:#fff;text-transform:uppercase;letter-spacing:.05em;font-weight:800}.rules-preview-grid{grid-template-cols:1fr 1fr;gap:8px 16px;display:grid}.rules-preview-item strong{color:#fff}.modal-overlay{z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background-color:#0009;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-content{flex-direction:column;gap:24px;width:100%;max-width:480px;padding:28px;display:flex}.modal-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:14px;display:flex}.modal-title-area{align-items:center;gap:10px;display:flex}.modal-title{color:#fff;font-size:20px;font-weight:800}.btn-close{color:var(--text-secondary);background-color:#0000;border-radius:8px;padding:6px}.btn-close:hover{color:#fff;background-color:#ffffff0f}.modal-warning{color:#fef08a;background-color:#f59e0b0f;border:1px solid #f59e0b33;border-radius:10px;align-items:center;gap:10px;padding:12px 16px;font-size:12px;line-height:1.4;display:flex}.settings-form{flex-direction:column;gap:18px;max-height:50vh;padding-right:4px;display:flex;overflow-y:auto}.setting-item{flex-direction:column;gap:6px;display:flex}.setting-label{color:var(--text-secondary);font-size:13px;font-weight:700}.setting-input{padding:10px 14px;font-size:14px;font-weight:600}.setting-desc{color:var(--text-muted);font-size:10px;line-height:1.4}.setting-row{border-top:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:12px 0;display:flex}.setting-row-info{flex-direction:column;gap:4px;padding-right:16px;display:flex}.setting-checkbox{width:18px;height:18px;accent-color:var(--color-blue);cursor:pointer;border-radius:4px}.modal-actions{border-top:1px solid #ffffff14;justify-content:flex-end;padding-top:18px;display:flex}.btn-save-settings{color:#fff;background-color:var(--color-blue);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;box-shadow:0 4px 14px #00bbf94d}.btn-save-settings:hover{background-color:#0096c7;transform:translateY(-1px)}.game-arena{background-color:var(--bg-primary);grid-template-rows:60px 1fr 180px;width:100vw;height:100vh;display:grid;position:relative;overflow:hidden}.game-header{border-bottom:1px solid var(--border-glass);z-index:10;background-color:#0a0e1a99;justify-content:space-between;align-items:center;padding:0 24px;display:flex}.header-left,.header-right{align-items:center;gap:16px;display:flex}.header-item{color:var(--text-secondary);font-size:12px}.header-item strong{color:var(--color-blue);font-family:monospace;font-weight:800}.btn-header{border:1px solid var(--border-glass);color:var(--text-secondary);background-color:#ffffff0a;border-radius:8px;gap:6px;padding:8px 14px;font-size:12px}.btn-header:hover{color:#fff;background-color:#ffffff14}.btn-header.active{color:var(--color-blue);background-color:#00bbf91a;border-color:#00bbf94d}.game-table-container{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.game-table{border:4px solid var(--border-glass);background:radial-gradient(circle,#0e1428 20%,#050810 100%);border-radius:50%;justify-content:center;align-items:center;width:75%;height:65%;display:flex;position:relative;box-shadow:inset 0 0 60px #000000e6,0 0 40px #00000080}.direction-ring{pointer-events:none;width:220px;height:220px;transition:var(--transition-smooth);border:3px dashed #ffffff0d;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute}.direction-ring.red{border-color:var(--color-red-glow);box-shadow:0 0 20px #ff336626}.direction-ring.green{border-color:var(--color-green-glow);box-shadow:0 0 20px #00f5d426}.direction-ring.blue{border-color:var(--color-blue-glow);box-shadow:0 0 20px #00bff926}.direction-ring.yellow{border-color:var(--color-yellow-glow);box-shadow:0 0 20px #fee44026}.center-piles{z-index:5;gap:20px;display:flex}.draw-pile-btn{width:var(--card-width);height:var(--card-height);border-radius:var(--card-radius);transition:var(--transition-smooth);border:2px dashed #fff3;justify-content:center;align-items:center;display:flex;position:relative;box-shadow:0 10px 25px #00000080}.draw-pile-btn:hover{transform:scale(1.05)}.draw-pile-inner{background-color:#0009;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:6px;display:flex;position:absolute;inset:8px}.draw-pile-label{color:var(--text-secondary);letter-spacing:.05em;font-size:11px;font-weight:800}.draw-pile-count{color:var(--text-secondary);font-mono:true;background-color:#ffffff0f;border-radius:6px;padding:2px 8px;font-size:10px}.opponent-seat{z-index:10;transition:var(--transition-smooth);flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute}.opponent-seat.active-turn .opponent-avatar-container{box-shadow:0 0 20px var(--color-blue-glow);border-color:var(--color-blue);animation:1.5s ease-in-out infinite pulse-avatar}.opponent-avatar-container{background-color:var(--bg-tertiary);border:2px solid var(--border-glass);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:26px;display:flex;position:relative;box-shadow:0 6px 16px #0006}.opponent-card-count{background-color:var(--color-wild);color:#fff;border:1.5px solid var(--bg-secondary);border-radius:8px;padding:1px 6px;font-size:10px;font-weight:900;position:absolute;bottom:-4px;right:-4px}.opponent-info{flex-direction:column;align-items:center;display:flex}.opponent-name{color:#fff;text-overflow:ellipsis;white-space:nowrap;max-width:80px;font-size:12px;font-weight:700;overflow:hidden}.opponent-score{color:var(--text-secondary);margin-top:1px;font-size:9px;font-weight:600}.player-hand-container{z-index:10;border-bottom:0;border-radius:32px 32px 0 0;flex-direction:column;justify-content:flex-end;align-items:center;width:100%;padding-bottom:12px;display:flex}.player-status-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;width:100%;padding:12px 32px;display:flex}.player-status-left{align-items:center;gap:12px;display:flex}.player-status-avatar{font-size:24px}.player-status-info{flex-direction:column;gap:2px;display:flex}.player-status-title{color:#fff;font-size:13px;font-weight:700}.player-status-subtitle{color:var(--text-secondary);font-size:10px}.player-status-right{align-items:center;gap:12px;display:flex}.playable-drawn-alert{color:#34d399;text-transform:uppercase;background-color:#10b9811a;border:1px solid #10b98133;border-radius:8px;align-items:center;gap:8px;padding:4px 10px;font-size:10px;font-weight:700;display:flex}.btn-action{text-transform:uppercase;letter-spacing:.05em;color:#fff;border-radius:8px;padding:8px 16px;font-size:11px;font-weight:800}.btn-action.uno{background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%)}.btn-action.play{background:linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);animation:1.5s ease-in-out infinite pulse-glow;box-shadow:0 0 15px #3b82f659}.btn-action.pass{background-color:#334155}.badge-uno-called{color:#34d399;text-transform:uppercase;letter-spacing:.05em;background-color:#10b9811f;border:1px solid #10b9814d;border-radius:6px;padding:4px 10px;font-size:10px;font-weight:800}.player-hand{justify-content:center;align-items:center;width:90%;max-width:920px;height:130px;margin-top:8px;display:flex}.hand-card-wrapper{margin-left:var(--card-overlap);transition:var(--transition-smooth)}.hand-card-wrapper:first-child{margin-left:0}.uno-card{width:var(--card-width);height:var(--card-height);border-radius:var(--card-radius);cursor:pointer;-webkit-user-select:none;user-select:none;border:2px solid #0000;flex-direction:column;justify-content:space-between;padding:8px;transition:all .25s cubic-bezier(.25,.8,.25,1);display:flex;position:relative;overflow:hidden;box-shadow:0 6px 14px #0000004d}.uno-card.selected{box-shadow:0 15px 30px #00000080,0 0 0 3px #fff;z-index:100!important;transform:translateY(-24px)scale(1.08)rotate(0)!important}.uno-card.dimmed{opacity:.6;filter:saturate(.5)}.uno-card.dimmed:hover{opacity:1;filter:saturate()}.uno-card.red{background:linear-gradient(135deg,#f43f5e 0%,#be123c 100%);border-color:#fb7185;box-shadow:0 6px 15px #f43f5e4d}.uno-card.green{background:linear-gradient(135deg,#10b981 0%,#047857 100%);border-color:#34d399;box-shadow:0 6px 15px #10b9814d}.uno-card.blue{background:linear-gradient(135deg,#0ea5e9 0%,#1d4ed8 100%);border-color:#38bdf8;box-shadow:0 6px 15px #0ea5e94d}.uno-card.yellow{background:linear-gradient(135deg,#facc15 0%,#c5a300 100%);border-color:#fef08a;box-shadow:0 6px 15px #facc154d}.uno-card.wild{background:linear-gradient(135deg,#8b5cf6 0%,#6d28d9 100%);border-color:#a78bfa;box-shadow:0 6px 15px #8b5cf64d}.uno-card-wild-bg{grid-template-cols:1fr 1fr;opacity:.25;pointer-events:none;grid-template-rows:1fr 1fr;display:grid;position:absolute;inset:0}.uno-card-wild-bg .quad-red{background-color:var(--color-red)}.uno-card-wild-bg .quad-blue{background-color:var(--color-blue)}.uno-card-wild-bg .quad-yellow{background-color:var(--color-yellow)}.uno-card-wild-bg .quad-green{background-color:var(--color-green)}.uno-card-corner{font-family:var(--font-display);font-weight:900;font-size:var(--card-corner-font);color:#fff;text-shadow:0 2px 4px #00000080;line-height:1}.uno-card-corner.bottom{align-self:flex-end;transform:rotate(180deg)}.uno-card-oval{inset:var(--card-oval-inset);background-color:#00000059;border:1px solid #ffffff14;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;transform:rotate(12deg)}.uno-card-center-value{color:#fff;font-family:var(--font-display);font-style:italic;font-weight:900;font-size:var(--card-center-font);text-shadow:0 3px 8px #0009;justify-content:center;align-items:center;display:flex;transform:rotate(-12deg)}.uno-card-back{background:linear-gradient(135deg,#1e1b4b 0%,#0f172a 100%);border-color:#334155;box-shadow:0 6px 14px #0006}.uno-card-back-inner{background:repeating-linear-gradient(45deg,#1e293b,#1e293b 8px,#0f172a 8px 16px);border:1px solid #ffffff08;border-radius:10px;justify-content:center;align-items:center;display:flex;position:absolute;inset:8px;transform:rotate(12deg)}.uno-card-back-text{font-family:var(--font-display);color:var(--color-red);letter-spacing:.1em;text-shadow:0 2px 5px #000c;font-size:22px;font-style:italic;font-weight:950;animation:4s infinite logo-flow;transform:rotate(-12deg)}.stack-alert-badge{background-color:var(--color-red);color:#fff;letter-spacing:.05em;text-transform:uppercase;border:1px solid #fda4af;border-radius:20px;padding:6px 18px;font-size:11px;font-weight:800;box-shadow:0 0 15px #f366}.score-card{flex-direction:column;gap:24px;width:100%;max-width:420px;padding:32px;display:flex}.score-card-header{flex-direction:column;align-items:center;gap:12px;display:flex}.score-award-icon{width:60px;height:60px;color:var(--color-yellow);filter:drop-shadow(0 0 10px var(--color-yellow-glow))}.score-card-title{color:#fff;text-transform:uppercase;font-size:26px;font-style:italic;font-weight:800}.score-card-winner{color:var(--text-secondary);font-size:14px}.score-card-winner strong{color:var(--color-green)}.score-table{border:1px solid var(--border-glass);background-color:#0003;border-radius:16px;flex-direction:column;gap:2px;padding:16px;display:flex}.score-table-header{color:var(--text-muted);text-transform:uppercase;border-bottom:1px solid #ffffff0f;justify-content:space-between;margin-bottom:6px;padding-bottom:8px;font-size:10px;font-weight:800;display:flex}.score-row{justify-content:space-between;align-items:center;padding:8px 0;font-size:14px;display:flex}.score-row-player{align-items:center;gap:10px;display:flex}.score-row-player.winner{color:var(--color-green);font-weight:700}.score-row-pts{color:#fff;font-family:monospace;font-weight:700}.btn-next-round{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border-radius:12px;width:100%;padding:14px 20px;font-size:16px;font-weight:800}.btn-next-round:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 14px #10b98159}.score-waiting-msg{color:var(--text-muted);text-align:center;font-size:11px;font-style:italic}.log-row{color:var(--text-secondary);background-color:#ffffff05;border:1px solid #ffffff0a;border-radius:6px;padding:6px 10px;line-height:1.4}.log-row-time{color:var(--text-muted);margin-right:8px;font-family:monospace;font-size:9px}@keyframes throw-and-bounce{0%{left:var(--from-x);top:var(--from-y);opacity:1;animation-timing-function:cubic-bezier(.1,.8,.3,1);transform:translate(-50%,-50%)scale(.4)rotate(0)}60%{left:var(--to-x);top:var(--to-y);opacity:1;filter:drop-shadow(0 8px 12px #0009);animation-timing-function:cubic-bezier(.25,1,.5,1);transform:translate(-50%,-50%)scale(1.15)rotate(540deg)}75%{left:var(--to-x);top:var(--to-y);transform:translate(calc(-50% + var(--bx) * .6), calc(-50% + var(--by) - 20px)) scale(.9) rotate(580deg);opacity:1;animation-timing-function:cubic-bezier(.55,.055,.675,.19)}88%{left:var(--to-x);top:var(--to-y);transform:translate(calc(-50% + var(--bx)), calc(-50% + var(--by))) scale(.8) rotate(610deg);opacity:1;animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{left:var(--to-x);top:var(--to-y);transform:translate(calc(-50% + var(--bx) * 1.3), calc(-50% + var(--by) + 60px)) scale(.5) rotate(640deg);opacity:0}}.btn-target-throw{border:1px solid var(--border-glass);cursor:pointer;z-index:20;background-color:#ffffff26;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;transition:all .2s cubic-bezier(.25,.8,.25,1);display:flex;position:absolute;top:4px;right:-28px;box-shadow:0 2px 8px #0000004d}.btn-target-throw:hover{background-color:#ffffff59;transform:scale(1.15);box-shadow:0 4px 12px #00000073}.btn-target-throw img{object-fit:contain;filter:drop-shadow(0 1px 2px #0000004d);width:14px;height:14px}.overlay-pane{z-index:150;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background-color:#000000a6;justify-content:center;align-items:center;padding:16px;animation:.25s ease-out fade-in;display:flex;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.discard-pile-empty{width:var(--card-width);height:var(--card-height);border-radius:var(--card-radius);background-color:var(--bg-secondary);border:2px solid var(--border-glass);color:var(--text-muted);justify-content:center;align-items:center;display:flex}.seat-badge{color:#fff;white-space:nowrap;text-transform:uppercase;z-index:15;font-weight:800;position:absolute}.seat-badge.catch-uno-btn{background-color:var(--color-red);cursor:pointer;border:1px solid #fda4af;border-radius:6px;padding:6px 10px;font-size:10px;animation:.2s infinite shake;top:-44px;box-shadow:0 4px 12px #0000004d}.seat-badge.uno-safe-badge{background-color:var(--color-green);border:1px solid #6ee7b7;border-radius:4px;padding:2px 8px;font-size:9px;top:-34px;box-shadow:0 4px 10px #0003}.seat-badge.forfeited-badge{background-color:var(--color-red);border:1px solid #fda4af;border-radius:4px;padding:2px 8px;font-size:9px;top:-34px;box-shadow:0 4px 10px #0003}.turn-indicator-bubble{background-color:var(--color-blue);color:#fff;border:1.5px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:10px;font-weight:700;animation:1.5s infinite pulse-avatar;display:flex;position:absolute;top:-12px;left:-12px;box-shadow:0 4px 10px #0000004d}.btn-throw-hand{color:#fff;cursor:pointer;background-color:#ffffff14;border:1.5px dashed #ffffff40;border-radius:10px;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex;box-shadow:0 4px 10px #0000001a}.btn-throw-hand:hover{background-color:#ffffff26;transform:translateY(-1px)}.btn-throw-hand img{object-fit:contain;width:18px;height:18px}.color-picker-grid{grid-template-columns:1fr 1fr;gap:16px;width:100%;max-width:280px;display:grid}.color-slice-btn{font-family:var(--font-display);color:#fff;text-shadow:0 2px 4px #00000080;cursor:pointer;transition:var(--transition-smooth);border-radius:12px;padding:16px 20px;font-size:14px;font-weight:900;box-shadow:0 4px 12px #00000040}.color-slice-btn:hover{filter:brightness(1.1);transform:scale(1.05);box-shadow:0 6px 16px #00000059}@media (width<=480px){.lobby-container{padding:16px 12px}.lobby-card{gap:20px;padding:24px 16px}.waiting-container{padding:16px 12px}.waiting-card{padding:24px 16px}:root{--card-width:64px;--card-height:96px;--card-overlap:-32px;--card-radius:10px;--card-corner-font:10px;--card-oval-inset:8px;--card-center-font:26px;--card-icon-size:22px;--card-icon-font:16px;--card-selected-translate:-16px}.game-arena{grid-template-rows:50px 1fr 180px}.game-header{height:50px;padding:0 12px}.header-left,.header-right{gap:8px}.btn-header{padding:6px 8px;font-size:11px}.btn-header .btn-text,.header-item span{display:none}.header-item{font-size:11px}.direction-info{display:none}.game-table{width:94%;height:52%}.direction-ring{width:160px;height:160px}.center-piles{gap:12px}.draw-pile-inner{border-radius:6px;gap:2px;inset:4px}.draw-pile-label{font-size:8px}.draw-pile-count{border-radius:4px;padding:1px 4px;font-size:8px}.stack-alert-badge{padding:4px 10px;font-size:9px}.opponent-seat{gap:3px}.opponent-avatar-container{border-width:1.5px;width:40px;height:40px;font-size:20px}.opponent-card-count{border-width:1px;border-radius:6px;padding:1px 4px;font-size:8px;bottom:-3px;right:-3px}.opponent-name{max-width:64px;font-size:10px}.opponent-score{font-size:8px}.btn-target-throw{width:18px;height:18px;top:0;right:-20px}.btn-target-throw img{width:10px;height:10px}.seat-badge.catch-uno-btn{padding:4px 8px;font-size:8px;top:-34px}.seat-badge.uno-safe-badge,.seat-badge.forfeited-badge{padding:2px 6px;font-size:7.5px;top:-26px}.turn-indicator-bubble{border-width:1px;width:18px;height:18px;font-size:8px;top:-8px;left:-8px}.player-status-row{padding:8px 16px}.player-status-avatar{font-size:18px}.player-status-title{font-size:11px}.player-status-subtitle{font-size:9px}.btn-action{padding:6px 12px;font-size:10px}.btn-throw-hand{border-radius:8px;gap:4px;padding:6px 10px;font-size:10px}.btn-throw-hand img{width:12px;height:12px}.player-hand{height:116px;margin-top:12px}.player-hand.hand-scrollable{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;justify-content:flex-start;padding-left:20px;padding-right:20px;overflow:auto hidden}.color-picker-grid{gap:10px;max-width:220px}.color-slice-btn{border-radius:10px;padding:12px 14px;font-size:12px}}
