/* Party presentation: bold silhouettes, deliberate movement and quiet controls. */
.piece-icon{width:26px;height:26px;display:inline-block;vertical-align:middle;flex:none}
.person-dot,.tv-badge{position:relative}
.person-dot .piece-icon{width:28px;height:28px}
.person-dot>b,.tv-badge>b{position:absolute;bottom:-5px;right:-5px;background:#fffdf1;border:1px solid #173d32;border-radius:50%;width:17px;height:17px;display:grid;place-items:center;font:850 11px/1 system-ui;color:#102c29}
.tv-badge{width:36px;height:36px;border-radius:50%}
.piece-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:14px 0 22px}
.piece-choice{position:relative;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:92px;margin:0!important;padding:10px 3px!important;background:#f5f5e9;border:1px solid #c5d2bd;border-radius:12px;color:#244839;cursor:pointer;text-align:center}
.piece-choice .piece-icon{width:34px;height:34px}
.piece-choice span{font-size:12px;font-weight:750}
.piece-choice small{font-size:10px;color:#55705c}
.piece-choice input{position:absolute;width:16px;height:16px;top:5px;left:5px;accent-color:#24533e}
.piece-choice.selected,.piece-choice:has(input:checked){background:#dcebc9;border:2px solid #315e42;box-shadow:0 0 0 2px #fffdf1 inset}
.piece-choice:has(input:focus-visible){outline:3px solid #ad5b23;outline-offset:2px}
.piece-choice.taken,.piece-choice:disabled{opacity:.45;cursor:not-allowed}
.join-form{max-width:500px}
.join-form h3{margin-top:20px}
.lobby-code .button+.button,.lobby-code label,.phone-shell .panel>.full{margin-top:12px}
.lobby-code label{display:block;text-align:left}
.phone-alert-toggle{background:transparent;border:0;padding:10px 4px;color:#315c49;font-size:12px;text-decoration:underline;display:block;margin:0 auto}
.presentation-wait{background:linear-gradient(120deg,#edf1da,#dcebcf)}
.presentation-wait [data-countdown]{font-variant-numeric:tabular-nums}
.watch-label{font-size:10px;font-weight:800;letter-spacing:.08em;background:#dfead4;color:#204b36;padding:6px;border-radius:6px}
.spectator-count{padding:0 14px 12px;font-size:12px;color:#54705c}
.up-next{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#eaf0dd;padding:9px 14px;border-block:1px solid #d1ddc7}
.up-next>span{font-size:10px;font-weight:800;letter-spacing:.08em}
.up-next>strong{font-size:15px;max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.up-next .piece-icon{width:22px;height:22px}
.tv-controls[open]>div{max-height:calc(100dvh - 95px);overflow:auto;min-width:240px}
.tv-controls label{font-size:12px;color:#204637;font-weight:650;display:grid;gap:4px}
.tv-controls select{padding:8px;margin:0;min-width:0;font-size:14px}
.tv-button:disabled{opacity:.4;cursor:default}
.dice-3d{--die:clamp(30px,5.6cqw,62px);gap:16px;padding:10px 0}
.die-scene{width:var(--die);height:var(--die);perspective:500px;flex:none;margin:3px}
.die-cube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry))}
.die-face{position:absolute;inset:0;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:14%;gap:7%;border:1px solid #c5b998;border-radius:12%;background:#fff7dc;backface-visibility:hidden;box-shadow:inset 0 0 8px #b4a2703a}
.die-face i{display:block;border-radius:50%;background:#244939;box-shadow:inset 0 1px 2px #0005}
.face-1{transform:translateZ(calc(var(--die)/2))}
.face-2{transform:rotateY(180deg) translateZ(calc(var(--die)/2))}
.face-3{transform:rotateY(90deg) translateZ(calc(var(--die)/2))}
.face-4{transform:rotateY(-90deg) translateZ(calc(var(--die)/2))}
.face-5{transform:rotateX(90deg) translateZ(calc(var(--die)/2))}
.face-6{transform:rotateX(-90deg) translateZ(calc(var(--die)/2))}
.dice-3d.rolling .die-cube{animation:die-tumble .7s linear infinite;animation-delay:var(--delay)}
.dice-3d.rolling{animation:none!important}
.dice-3d.revealed .die-scene{animation:die-settle .6s ease-out}
.dice-3d>small{max-width:55px}
.tv-celebration{padding:8px 14px;border-radius:99px;background:#f4d487;color:#513d1f;font-size:clamp(12px,1.8cqw,21px);font-weight:850;letter-spacing:.07em;box-shadow:0 3px 0 #956c3230}
.effects-on .tv-celebration{animation:celebrate-in .6s cubic-bezier(.2,.8,.3,1.3)}
.effects-on .tv-center[data-stage=land] .tv-property{animation:land-card .55s ease-out}
.effects-on .tv-center[data-stage=result] .tv-card, .effects-on .tv-center[data-stage=card] .tv-card{animation:card-flip .8s ease-out;transform-origin:50% 0}
.effects-on .tv-board[data-stage=land] .active-token .piece-body{animation:piece-bounce .7s ease-out;transform-box:fill-box;transform-origin:center}
.effects-on .tv-cash-change{animation:cash-reveal .7s ease-out}
.board-space.is-step .tile-bg{stroke:#c08a2d;stroke-width:6;fill:#fff0b2}
.theme-midnight .board-space.is-step .tile-bg{fill:#70613a}
.confetti{position:absolute;inset:15%;pointer-events:none;overflow:hidden;border-radius:20px}
.confetti i{position:absolute;top:-12px;left:calc(var(--i)*6.25%);width:9px;height:15px;background:var(--color);opacity:0;animation:confetti-fall 2.7s ease-out forwards;animation-delay:calc(var(--i)*.045s)}
.money-flight{position:fixed;left:0;top:0;z-index:90;pointer-events:none;border:2px solid #967326;border-radius:30px;background:#ffdf88;color:#4a3515;font-size:20px;font-weight:850;padding:8px 14px;box-shadow:0 6px 18px #32221030;margin-left:-35px;margin-top:-18px;will-change:transform,opacity}
.effects-off .tv-center *,.effects-off .piece-body{animation:none!important}
@keyframes die-tumble{0%{transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg)}100%{transform:rotateX(360deg) rotateY(720deg) rotateZ(360deg)}}
@keyframes die-settle{0%{transform:translateY(-10px) rotate(-8deg)}40%{transform:translateY(4px) rotate(4deg)}75%{transform:translateY(-3px)}100%{transform:none}}
@keyframes celebrate-in{0%{transform:scale(.8);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes land-card{0%{transform:translateY(15px);opacity:.4}100%{transform:none;opacity:1}}
@keyframes card-flip{0%{transform:perspective(500px) rotateX(-70deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes piece-bounce{0%,100%{transform:translateY(0)}35%{transform:translateY(-10px)}70%{transform:translateY(-3px)}}
@keyframes cash-reveal{0%{transform:translateY(12px);opacity:0}100%{transform:none;opacity:1}}
@keyframes confetti-fall{0%{opacity:0;transform:translateY(0) rotate(0)}10%{opacity:1}100%{opacity:0;transform:translateY(450px) rotate(550deg)}}
@media(max-width:500px){.piece-picker{gap:6px}.piece-choice{min-height:85px}.dice-3d{gap:9px;padding:4px 0;--die:28px}.tv-celebration{font-size:10px;padding:5px 8px}.watch-label{font-size:8px}.tv-toolbar-actions{gap:5px}.tv-badge .piece-icon{width:24px;height:24px}.tv-owner .tv-badge .piece-icon{width:16px;height:16px}.tv-owner .tv-badge>b{width:12px;height:12px;font-size:8px}.tv-dice>small{font-size:8px}.money-flight{font-size:14px;padding:5px 8px}}
@media(prefers-reduced-motion:reduce){.die-cube,.die-scene,.confetti i,.piece-body,.tv-center *,.tv-cash-change{animation:none!important}.confetti,.money-flight{display:none!important}}

.join-qr{display:grid;justify-items:center;gap:6px;margin:8px auto 20px}.join-qr img,.watch-qr{border:1px solid #c4cfb8;border-radius:10px;background:#fff;max-width:100%;height:auto}.join-qr span{font-size:11px;font-weight:800;letter-spacing:.1em}.watch-qr{display:block;margin:18px auto}

.turn-identity{display:flex;align-items:center;justify-content:center;gap:12px}.turn-identity .tv-badge{width:38px;height:38px}.token-connector{pointer-events:none;opacity:.7}.tv-board[data-stage=move] .token-connector{visibility:hidden}@media(max-width:500px){.turn-identity{gap:6px}.turn-identity .tv-badge{width:24px;height:24px}.turn-identity .piece-icon{width:18px;height:18px}}

.tv-moment{font-size:clamp(12px,1.7cqw,20px);font-weight:850;letter-spacing:.1em;border-block:2px solid currentColor;padding:8px 16px}.finished h1{animation:celebrate-in .8s ease-out}

.spectator-summary{display:none}@media(max-width:1000px){.spectator-summary{display:block;max-width:850px;margin:0 auto 12px;padding:16px;background:#fffdf4;border:1px solid #c7d2bf;border-radius:12px}.spectator-summary h2{font-size:23px;line-height:1.25;margin:7px 0}.spectator-summary p{font-size:14px;line-height:1.45;margin-top:8px}}

/* Computer styles stay in the lobby; live standings use the compact style label. */
.bot-add-panel{margin:18px 0;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.bot-add-panel label{display:grid;gap:8px;font-weight:700}
.bot-add-panel p,.player-row .bot-seat-description{font-size:.875rem;line-height:1.45;color:var(--muted);margin:9px 0 0}
.bot-add-panel .button{margin:14px 0 0}
.player-row .bot-seat-style{display:block;margin-top:8px}
.player-row .bot-seat-style select{width:100%;max-width:210px;min-height:40px;padding:7px 28px 7px 10px;font-size:.9rem}
.lobby .player-row>div:nth-child(2){min-width:0}
.lobby .player-row .player-cash{align-self:start;padding-top:4px}
@media(max-width:520px){.bot-add-panel{padding:14px}.lobby .player-row:has(.bot-seat-style){align-items:flex-start}.lobby .player-row:has(.bot-seat-style) .player-cash{display:none}.player-row .bot-seat-description{max-width:29ch}}
