:root{--bg-ink:#0f1219;--bg-deep:#0a0d14;--bg-glow:#2c3b58;--accent-gold:#f5c556;--accent-mint:#7de1c3;--accent-coral:#ff7c7c;--accent-indigo:#7c8cff;--panel:#131a26;--panel-soft:#1b2436;--text:#f4f6fb;--text-muted:#b8c1d9;--grid-line:rgba(255,255,255,.06)}*{box-sizing:border-box}body{font-family:Manrope,Segoe UI,sans-serif;background:radial-gradient(1100px 700px at 10% 15%,#7c8cff29,#0a0d1400 60%),radial-gradient(900px 600px at 90% 20%,#ff7c7c2e,#0a0d1400 62%),radial-gradient(800px 600px at 70% 85%,#7de1c329,#0a0d1400 58%),linear-gradient(160deg,var(--bg-deep) 0%,var(--bg-ink) 55%,#151e2c 100%);color:var(--text);margin:0;min-height:100vh}.app{max-width:1280px;margin:0 auto;padding:32px 22px 56px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px}.brand{display:flex;flex-direction:column;gap:6px}.brand-tag{text-transform:uppercase;letter-spacing:.26em;font-size:12px;color:var(--accent-gold);font-weight:700}h1{font-family:Archivo Black,Impact,sans-serif;font-size:42px;letter-spacing:.04em;margin:0}.brand-sub{margin:0;color:var(--text-muted);font-weight:600}.score-strip{display:flex;gap:16px;flex-wrap:wrap;justify-content:flex-end;align-items:stretch}.score-card{background:linear-gradient(140deg,#1b2436e6,#131a26cc);border:1px solid rgba(255,255,255,.08);padding:12px 18px;border-radius:16px;min-width:130px;box-shadow:0 18px 40px #00000059;display:flex;flex-direction:column;gap:6px;justify-content:center}.score-card .label{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}.score-card .value{font-size:32px;font-weight:800;color:var(--text)}.board-row{display:grid;grid-template-columns:minmax(250px,320px) minmax(320px,680px) minmax(280px,360px);gap:28px;align-items:start;justify-content:center}.board-wrap{width:min(70vmin,680px);height:min(70vmin,680px);position:relative;border-radius:10px;overflow:hidden;background:#f5f5f5;box-shadow:0 20px 30px #00000059,inset 0 0 0 4px #fff;border:6px solid #111;justify-self:center}.move-indicator{display:none}.move-indicator.active{opacity:1;transform:translate(-50%)}.board-glow{display:none}#board{width:100%;height:100%;display:grid;grid-template-columns:repeat(10,1fr);background:#fff;position:relative;z-index:1}.cell{border:2px solid #111;position:relative;display:flex;align-items:flex-end;justify-content:flex-end;padding:6px;overflow:hidden}.cell:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.1;background:radial-gradient(circle at 20% 20%,#ffffff73,#fff0)}.cell span{font-family:Archivo Black,Impact,sans-serif;font-size:16px;font-weight:800;color:#fff;text-shadow:1px 1px 0 #111,-1px 1px 0 #111,1px -1px 0 #111,-1px -1px 0 #111,0 2px 0 rgba(0,0,0,.5);z-index:1}.c0{background:#f1272b}.c1{background:#f7d31a}.c2{background:#2c90d6}.c3{background:#a4d338}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none}#player-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none}.player-token{position:absolute;width:34px;height:34px;border-radius:45% 45% 55% 55%;--body:linear-gradient(160deg, #ffd56b, #ff7b59);--eye:#161616;background:radial-gradient(circle at 28% 18%,#ffffffbf,#fff0 45%),radial-gradient(circle at 34% 42%,var(--eye) 0 2px,transparent 3px),radial-gradient(circle at 66% 42%,var(--eye) 0 2px,transparent 3px),radial-gradient(ellipse at 50% 70%,rgba(0,0,0,.55) 0 3px,transparent 4px),radial-gradient(circle at 26% 68%,rgba(255,120,160,.55) 0 4px,transparent 5px),radial-gradient(circle at 74% 68%,rgba(255,120,160,.55) 0 4px,transparent 5px),var(--body);border:2px solid rgba(0,0,0,.55);transform:translate(-50%,-50%);box-shadow:0 10px 16px #00000073,inset 0 -4px 6px #00000040;animation:token-float 1.9s ease-in-out infinite}.player-token:after{content:"";position:absolute;left:50%;transform:translate(-50%);top:-18px;width:8px;height:8px;border-radius:50%;background:#ffe38a;box-shadow:0 2px #00000040}.player-1{--body:linear-gradient(160deg, #ffe9a3, #ff8a5e)}.player-2{--body:linear-gradient(160deg, #7fe5ff, #5c7cff);--eye:#0a1b33;animation-delay:.35s}.player-1:before,.player-2:before{content:"";position:absolute;left:50%;transform:translate(-50%);top:-12px}.player-1:before{width:16px;height:18px;background:repeating-linear-gradient(45deg,#ff5d8f 0,#ff5d8f 4px,#ffe38a 4px,#ffe38a 8px);clip-path:polygon(50% 0,0 100%,100% 100%);border-radius:2px;box-shadow:0 2px #00000040}.player-2:before{width:6px;height:14px;background:linear-gradient(180deg,#9bf9ff,#2e7cff);border-radius:6px;box-shadow:0 0 0 1px #00000059}.player-2:after{top:-20px;width:10px;height:10px;background:radial-gradient(circle at 35% 35%,#fff,#87f3ff 55%,#4c7cff);box-shadow:0 0 10px #87f3ffb3}.player-3{--body:linear-gradient(160deg, #c6ffb2, #39c978);--eye:#113321;animation-delay:.55s}.player-4{--body:linear-gradient(160deg, #ffd1f1, #d062c9);--eye:#35103a;animation-delay:.8s}.player-3:before,.player-4:before{content:"";position:absolute;left:50%;transform:translate(-50%);top:-12px}.player-3:before{width:14px;height:14px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 35% 35%,#f7ffe8,#82e5ad 55%,#1d9f63);box-shadow:0 0 0 2px #092e1c2e}.player-4:before{width:18px;height:8px;border-radius:999px;background:linear-gradient(90deg,#fff0fb,#ef89dd 55%,#b64cb0);box-shadow:0 2px #0000002e}.player-4:after{top:-20px;width:10px;height:10px;background:radial-gradient(circle at 35% 35%,#fff7ff,#f9a7eb 58%,#b64cb0);box-shadow:0 0 10px #ef89dda6}@keyframes token-float{0%,to{transform:translate(-50%,-50%) rotate(-2deg)}50%{transform:translate(-50%,-52%) rotate(3deg)}}.side-panel{display:flex;flex-direction:column;gap:18px;align-self:start;width:100%;max-width:360px}.side-panel-left{justify-self:end}.side-panel-right{justify-self:start}.side-panel>*{width:100%}.online-panel{background:linear-gradient(160deg,#1b2436f2,#0f141ff2);border-radius:18px;padding:20px 18px;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 30px #00000059;display:flex;flex-direction:column;gap:12px;align-items:stretch}.chat-panel{background:linear-gradient(180deg,#141d2df5,#0b111bfa);border-radius:18px;padding:18px;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 30px #00000052;display:flex;flex-direction:column;gap:12px}.field-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);font-weight:700}.control-input{width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:var(--text);padding:12px 14px;font:inherit;outline:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease}.control-input:focus{border-color:#7c8cff8c;box-shadow:0 0 0 4px #7c8cff24;background:#ffffff14}.control-input::placeholder{color:#b8c1d9b3}#local-player-count{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:44px;background-image:linear-gradient(180deg,#ffffff14,#ffffff05),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6.5L8 10L12 6.5' stroke='%23E6ECFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat,no-repeat;background-position:0 0,calc(100% - 14px) 50%;background-size:auto,14px 14px}#local-player-count option{color:#f4f6fb;background:#1c2537}#local-player-count[data-player-count="2"]{border-color:#ff8a5e57;background-color:#ff8a5e1f;color:#ffe9de;box-shadow:inset 0 1px #ffffff0d}#local-player-count[data-player-count="2"]:focus{border-color:#ff8a5e94;box-shadow:0 0 0 4px #ff8a5e24}#local-player-count[data-player-count="3"]{border-color:#39c97857;background-color:#39c9781f;color:#e3ffed;box-shadow:inset 0 1px #ffffff0d}#local-player-count[data-player-count="3"]:focus{border-color:#39c97894;box-shadow:0 0 0 4px #39c97824}#local-player-count[data-player-count="4"]{border-color:#d062c95c;background-color:#d062c91f;color:#ffe6fd;box-shadow:inset 0 1px #ffffff0d}#local-player-count[data-player-count="4"]:focus{border-color:#d062c994;box-shadow:0 0 0 4px #d062c924}.online-actions,.online-join-row,.room-share-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.room-share-row-chat{margin-top:-2px}.whatsapp-btn{border-color:#25d36673;background:#25d36624}.chat-messages{min-height:220px;max-height:320px;overflow-y:auto;padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#ffffff0a,#ffffff05),radial-gradient(circle at top,#7c8cff24,#7c8cff00 45%);display:flex;flex-direction:column;gap:10px}.chat-empty{margin:auto 0;color:var(--text-muted);font-weight:600;line-height:1.5;text-align:center}.chat-item{display:flex;flex-direction:column;gap:4px;align-self:flex-start;max-width:86%}.chat-item.self{align-self:flex-end}.chat-item.system{align-self:center;max-width:100%;padding:8px 10px;border-radius:999px;background:#ffffff0f;color:var(--text-muted);font-size:12px;font-weight:700;letter-spacing:.04em;text-align:center}.chat-meta{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#e4ebffb8}.chat-item.self .chat-meta{text-align:right}.chat-bubble{padding:10px 12px;border-radius:14px 14px 14px 6px;background:#7c8cff29;color:var(--text);font-weight:700;line-height:1.4;word-break:break-word;box-shadow:0 10px 18px #00000038}.chat-item.self .chat-bubble{border-radius:14px 14px 6px;background:linear-gradient(135deg,#f5c556f2,#f09b3ceb);color:#151515}.chat-item.reaction .chat-bubble{padding:10px 14px;border-radius:999px;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.reaction-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.reaction-btn{min-height:42px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:var(--text);font:inherit;font-weight:800;letter-spacing:.08em;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease}.reaction-btn:hover{transform:translateY(-2px);border-color:#7c8cff66;background:#7c8cff29}.reaction-btn:disabled{cursor:not-allowed;opacity:.55;transform:none}.chat-compose-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:stretch}.chat-input{min-width:0}.chat-send-btn{width:auto;min-width:92px}.dice-panel{background:linear-gradient(160deg,#1b2436f2,#0f141ff2);border-radius:18px;padding:20px 18px;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 30px #00000059;display:flex;flex-direction:column;align-items:stretch;gap:12px}.panel-title{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted);font-weight:700;text-align:left}.dice{width:110px;height:110px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);border-radius:20px;background:linear-gradient(150deg,#fdf1cf,#f7d27b);box-shadow:0 16px 24px #00000059,inset 0 0 0 2px #fffc;position:relative;transform-origin:center;transition:background .25s ease,box-shadow .25s ease,transform .25s ease}.dice.shared-dice{background:linear-gradient(150deg,#fdf1cf,#f7d27b);box-shadow:0 16px 24px #00000059,0 0 22px #f5c5562e,inset 0 0 0 2px #fffc}.dice:after{content:"";position:absolute;top:8px;right:8px;bottom:8px;left:8px;border-radius:14px;background:linear-gradient(160deg,#ffffff8c,#0000001a);pointer-events:none}.dice.player-1-turn{background:linear-gradient(150deg,#ffe4ac,#ff9d69);box-shadow:0 16px 24px #00000059,0 0 24px #ff8a5e47,inset 0 0 0 2px #fffc}.dice.player-2-turn{background:linear-gradient(150deg,#d9fbff,#7d96ff);box-shadow:0 16px 24px #00000059,0 0 24px #5c7cff4d,inset 0 0 0 2px #fffc}.dice.rolling{animation:dice-roll .8s cubic-bezier(.2,.7,.2,1) infinite}@keyframes dice-roll{0%{transform:translate(0) rotate(0) scale(1)}20%{transform:translate(-4px,-6px) rotate(20deg) scale(1.04)}45%{transform:translate(6px,-10px) rotate(120deg) scale(1.08)}70%{transform:translate(-6px,-4px) rotate(240deg) scale(1.04)}to{transform:translate(0) rotate(360deg) scale(1)}}.pip{width:14px;height:14px;border-radius:50%;background:#1b1b1b;opacity:0;place-self:center;box-shadow:0 2px 2px #00000059}.dice.face-1 .pip:nth-child(5){opacity:1}.dice.face-2 .pip:nth-child(1),.dice.face-2 .pip:nth-child(9){opacity:1}.dice.face-3 .pip:nth-child(1),.dice.face-3 .pip:nth-child(5),.dice.face-3 .pip:nth-child(9){opacity:1}.dice.face-4 .pip:nth-child(1),.dice.face-4 .pip:nth-child(3),.dice.face-4 .pip:nth-child(7),.dice.face-4 .pip:nth-child(9){opacity:1}.dice.face-5 .pip:nth-child(1),.dice.face-5 .pip:nth-child(3),.dice.face-5 .pip:nth-child(5),.dice.face-5 .pip:nth-child(7),.dice.face-5 .pip:nth-child(9){opacity:1}.dice.face-6 .pip:nth-child(1),.dice.face-6 .pip:nth-child(3),.dice.face-6 .pip:nth-child(4),.dice.face-6 .pip:nth-child(6),.dice.face-6 .pip:nth-child(7),.dice.face-6 .pip:nth-child(9){opacity:1}.controls{background:linear-gradient(180deg,#161f2ff7,#0e141ffa);border-radius:20px;padding:18px 16px 16px;border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:10px;box-shadow:0 18px 30px #00000047;align-items:stretch}.player-roll-list{display:flex;flex-direction:column;gap:0;border:1px solid rgba(255,255,255,.08);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#1d2638f5,#161d2cf5);box-shadow:inset 0 1px #ffffff08}.player-roll-group{--player-accent:rgba(124,140,255,.18);--player-accent-strong:#7c8cff;position:relative;min-height:0;padding:11px 14px 11px 18px;display:flex;align-items:center;gap:10px;background:transparent;transition:background .2s ease,color .2s ease,box-shadow .2s ease}.player-roll-group+.player-roll-group{border-top:1px solid rgba(255,255,255,.06)}.player-roll-group:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--player-accent-strong);box-shadow:0 0 0 4px color-mix(in srgb,var(--player-accent-strong) 18%,transparent);flex:0 0 auto}.player-roll-group.active{background:linear-gradient(90deg,var(--player-accent),rgba(255,255,255,.02) 72%)}.player-roll-group.rolling-turn{animation:player-turn-pulse 1s ease-in-out infinite;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--player-accent-strong) 35%,rgba(255,255,255,.1))}.player-roll-1{--player-accent:rgba(255,138,94,.16);--player-accent-strong:#ff8a5e}.player-roll-2{--player-accent:rgba(92,124,255,.16);--player-accent-strong:#6d8cff}.player-roll-3{--player-accent:rgba(57,201,120,.16);--player-accent-strong:#39c978}.player-roll-4{--player-accent:rgba(208,98,201,.18);--player-accent-strong:#d062c9}.player-roll-arrow{width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid var(--player-accent-strong);opacity:0;transform:translate(-4px);transition:opacity .2s ease,transform .2s ease;flex:0 0 auto}.player-roll-group.active .player-roll-arrow{opacity:1;transform:translate(0)}.player-roll-name{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#e4ebffdb;line-height:1.1}.player-roll-group.active .player-roll-name{color:#fff}.turn-state,.player-roll-meta,.player-roll-label,.player-roll-value,.player-roll-head{display:none}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes player-turn-pulse{0%,to{background:linear-gradient(90deg,var(--player-accent),rgba(255,255,255,.02) 72%)}50%{background:linear-gradient(90deg,color-mix(in srgb,var(--player-accent-strong) 26%,transparent),#ffffff0a 72%)}}.primary-btn{font-size:16px;font-weight:700;padding:12px 18px;border:none;background:linear-gradient(135deg,var(--accent-gold),#f09b3c);color:#151515;border-radius:12px;cursor:pointer;box-shadow:0 10px 18px #0000004d;transition:transform .2s ease,box-shadow .2s ease;width:100%;min-height:48px}.primary-btn:hover{transform:translateY(-2px);box-shadow:0 16px 24px #00000059}.primary-btn:disabled,.secondary-btn:disabled,.ghost-btn:disabled{cursor:not-allowed;opacity:.6;transform:none;box-shadow:0 8px 14px #0003}.secondary-btn,.ghost-btn{font-size:15px;font-weight:700;padding:12px 16px;border-radius:12px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;width:100%;min-height:46px}.secondary-btn{border:1px solid rgba(124,140,255,.34);background:#7c8cff1f;color:var(--text);box-shadow:0 10px 18px #00000038}.ghost-btn{border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:var(--text-muted)}.secondary-btn:hover,.ghost-btn:hover{transform:translateY(-2px)}.player-1-btn{background:linear-gradient(135deg,#ffd38a,#ff8a5e)}.player-2-btn{background:linear-gradient(135deg,#b9f5ff,#6d8cff);color:#0f1830}.meta-line{margin:0;font-weight:600;color:var(--text-muted);text-align:left}.meta-strong{color:var(--text)}#room-code-display,#multiplayer-status,#dice,#dice-owner{line-height:1.45}.dice-panel .dice{align-self:center}.dice-panel .meta-line{text-align:center}.shared-roll-btn{margin-top:4px}.turn-chip{margin:0;border-top:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#2f3a70b8,#252e59e6);color:#f6f8ff;font-weight:700;padding:12px 14px;font-size:13px;line-height:1.4;box-shadow:inset 0 1px #ffffff0a}.toast-container{position:fixed;right:20px;top:20px;display:flex;flex-direction:column;gap:10px;z-index:9999;pointer-events:none}.toast{min-width:180px;max-width:260px;background:#111;color:#fff;padding:12px 16px;border-radius:12px;box-shadow:0 12px 24px #0000004d;font-weight:600;letter-spacing:.2px;opacity:0;transform:translateY(10px);animation:toast-in .25s ease-out forwards}.toast.info{background:#1b2234}.toast.success{background:#16a34a}.toast.warn{background:#f97316}.toast.win{background:#7c3aed}.toast.fade-out{animation:toast-out .25s ease-in forwards}@keyframes toast-in{to{opacity:1;transform:translateY(0)}}@keyframes toast-out{to{opacity:0;transform:translateY(10px)}}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0a0c12b8;opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:10000}.win-overlay.active{opacity:1;pointer-events:auto}.win-card{position:relative;background:linear-gradient(160deg,#141a28f5,#0a0d14f5);border:1px solid rgba(255,255,255,.14);padding:26px 28px 22px;border-radius:22px;text-align:center;min-width:260px;max-width:320px;box-shadow:0 24px 60px #00000080;transform:translateY(12px) scale(.96);opacity:0;overflow:hidden}.win-overlay.active .win-card{animation:win-pop .55s cubic-bezier(.2,.8,.2,1) forwards,win-glow-pulse 2.8s ease-in-out .6s infinite}.win-card:after{content:"";position:absolute;top:-30%;right:-30%;bottom:-30%;left:-30%;background:radial-gradient(circle,#ffffff2e,#fff0 40%),radial-gradient(circle at 20% 30%,#7c8cff3d,#7c8cff00 42%),radial-gradient(circle at 80% 70%,#ffd93d47,#ffd93d00 40%);opacity:.6;mix-blend-mode:screen;animation:sparkle-drift 6s linear infinite;pointer-events:none}.win-glow{position:absolute;top:-40px;right:-40px;bottom:-40px;left:-40px;background:radial-gradient(circle,#ffd93d57,#7c8cff33,#141a2800);filter:blur(6px);z-index:-1}.win-kicker{margin:0;font-size:12px;letter-spacing:.34em;text-transform:uppercase;color:var(--accent-gold);font-weight:700}#win-message{font-family:Archivo Black,Impact,sans-serif;font-size:28px;margin:10px 0 8px}.win-sub{margin:0 0 16px;color:var(--text-muted);font-weight:600}.win-actions{display:flex;gap:10px;justify-content:center}.win-btn{border:none;background:linear-gradient(135deg,var(--accent-gold),#f09b3c);color:#151515;padding:10px 16px;border-radius:12px;font-weight:700;cursor:pointer;box-shadow:0 10px 18px #0000004d;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.win-btn.secondary{background:#7c8cff33;color:var(--text);border:1px solid rgba(255,255,255,.18);box-shadow:none}.win-btn:hover{transform:translateY(-2px);box-shadow:0 16px 24px #00000059}.win-btn.secondary:hover{background:#7c8cff59}@keyframes win-pop{0%{transform:translateY(14px) scale(.94);opacity:0}60%{transform:translateY(-4px) scale(1.03);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@keyframes win-glow-pulse{0%{box-shadow:0 24px 60px #00000080;border-color:#ffffff24}50%{box-shadow:0 28px 70px #0009;border-color:#ffffff47}to{box-shadow:0 24px 60px #00000080;border-color:#ffffff24}}@keyframes sparkle-drift{0%{transform:translate3d(-2%,-3%,0) rotate(0)}50%{transform:translate3d(2%,2%,0) rotate(180deg)}to{transform:translate3d(-2%,-3%,0) rotate(360deg)}}.celebration-rain{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;overflow:hidden}.rain-item{position:absolute;top:-40px;left:0;width:var(--size, 16px);height:var(--size, 16px);opacity:0;transform:translate3d(0,-20px,0) rotate(0);animation:rain-fall var(--dur, 3.2s) linear var(--delay, 0ms) forwards;filter:drop-shadow(0 8px 10px rgba(0,0,0,.35))}.rain-item.paper{height:calc(var(--size, 16px) * .6);border-radius:3px;background:linear-gradient(140deg,#fff4c7,#ffd9b0);box-shadow:inset 0 0 0 1px #0000001a}.rain-item.dice{border-radius:4px;background:radial-gradient(circle at 30% 30%,#1b1b1b 0 22%,transparent 24%),radial-gradient(circle at 70% 70%,#1b1b1b 0 22%,transparent 24%),linear-gradient(150deg,#fdf1cf,#f7d27b);box-shadow:inset 0 0 0 2px #fff9}.rain-item.ladder{background:linear-gradient(90deg,#0000 20%,#f6d39a 20%,#f6d39a 28%,#0000 28%,#0000 72%,#f6d39a 72%,#f6d39a 80%,#0000 80%),repeating-linear-gradient(0deg,#0000 0,#0000 18%,#d1a86d 18%,#d1a86d 26%,#0000 26%,#0000 36%);border-radius:4px}.rain-item.snake{height:calc(var(--size, 16px) * .4);border-radius:999px;background:linear-gradient(90deg,#48d16a,#2f6b2b);box-shadow:inset 0 0 0 1px #1f4d24}.rain-item.star{background:#ffd93d;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}@keyframes rain-fall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}10%{opacity:1}to{opacity:0;transform:translate3d(var(--drift, 40px),110vh,0) rotate(var(--rot, 180deg))}}.confetti-corner{position:fixed;top:0;right:0;width:280px;height:280px;pointer-events:none;z-index:10001;overflow:visible}.confetti-piece{position:absolute;top:18px;right:18px;width:var(--size, 10px);height:calc(var(--size, 10px) * .6);background:var(--color, #ffd93d);border-radius:2px;opacity:0;transform:translate(0) rotate(0);animation:confetti-fly var(--dur, 1.1s) ease-out var(--delay, 0ms) forwards;box-shadow:0 6px 12px #0003}.confetti-piece.is-circle{border-radius:50%;height:var(--size, 10px)}.confetti-piece.is-tri{clip-path:polygon(50% 0,0 100%,100% 100%);border-radius:0;height:var(--size, 10px)}.confetti-piece.is-ribbon{height:calc(var(--size, 10px) * 1.6)}.burst-ring{position:absolute;top:20px;right:20px;width:28px;height:28px;border-radius:50%;border:2px solid rgba(255,255,255,.8);opacity:0;transform:scale(.5);animation:burst-ring 1.2s ease-out var(--delay, 0ms) forwards}@keyframes burst-ring{0%{opacity:0;transform:scale(.4)}20%{opacity:.9}to{opacity:0;transform:scale(3.2)}}@keyframes confetti-fly{0%{opacity:0;transform:translate(0) rotate(0) scale(.8)}12%{opacity:1}to{opacity:0;transform:translate(var(--x, -120px),var(--y, 160px)) rotate(var(--rot, 220deg)) scale(1)}}@media (max-width: 980px){.board-row{grid-template-columns:1fr;gap:22px;justify-items:center}.board-wrap{width:min(86vmin,620px);height:min(86vmin,620px);margin:0 auto}.side-panel{flex-direction:row;flex-wrap:wrap;width:100%;max-width:100%;justify-content:center}.online-panel,.chat-panel,.dice-panel,.controls{flex:1 1 260px;max-width:380px}.online-actions,.online-join-row,.room-share-row{grid-template-columns:1fr}}@media (max-width: 600px){.topbar{align-items:flex-start}.app{padding:24px 14px 40px}h1{font-size:34px}.score-strip{width:100%;justify-content:stretch}.score-card{flex:1 1 140px;min-width:0}.player-roll-group{padding:10px 12px 10px 16px;gap:8px}.player-roll-arrow{border-top-width:5px;border-bottom-width:5px;border-left-width:8px}.player-roll-name{font-size:11px}.reaction-row{grid-template-columns:repeat(2,minmax(0,1fr))}.chat-compose-row{grid-template-columns:1fr}.chat-send-btn{width:100%}}