/* Cards have a physical edge; animation never delays the state transition. */
.secret,.m-role,.room-secret{position:relative;transform-origin:50% 50%;backface-visibility:hidden;box-shadow:0 12px 28px -18px #24251f66,inset 0 -3px 0 #24251f15}.secret.hidden,.room-secret{box-shadow:0 14px 30px -18px #24251f88,inset 0 1px 0 #ffffff1f}.m-role{animation:none}.m-sealed{box-shadow:0 12px 24px -16px #17223088}.bottle-board{background:radial-gradient(ellipse at 40% 30%,#f0f3e8,#dce6c9 75%);box-shadow:inset 0 2px 3px #ffffffaa,inset 0 -4px 5px #80936a33,0 15px 24px -18px #24251f80}.bottle-rotor svg{filter:drop-shadow(6px 9px 4px #1d352b40)}.bottle-player.selected{outline:2px solid var(--paper);outline-offset:2px}.room-spin{height:160px;display:grid;place-items:center}.room-spin svg{height:140px;width:70px;filter:drop-shadow(5px 8px 4px #1d352b33)}
.game-confetti{position:fixed;inset:0;z-index:40;pointer-events:none;overflow:hidden}.game-confetti i{position:absolute;left:50%;top:32%;width:7px;height:12px;background:var(--color);border-radius:2px;opacity:0;animation:party-finish 1000ms var(--delay) cubic-bezier(.15,.65,.35,1) both}@keyframes party-finish{0%{opacity:0;transform:translate(0,0) rotate(0)}15%{opacity:1}100%{opacity:0;transform:translate(var(--x),240px) rotate(var(--r))}}
html[data-motion=off] *,html[data-motion=off] *::before,html[data-motion=off] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}@media(prefers-reduced-motion:reduce){.game-confetti{display:none}}

/* Scene artwork is decorative and never keyed to a player's secret role. */
.moment-art{display:block;width:100%;height:210px;object-fit:cover;border-radius:14px;margin:20px auto;pointer-events:none}
.moment-night{object-position:center 40%;background:#202b39}
.moment-finish{max-width:400px;height:180px;object-fit:contain}
.m-sealed{overflow:hidden}.m-sealed .moment-art{height:100%;margin:0;object-position:center}
.secret.hidden .moment-secret{width:110px;height:74px;object-fit:cover;margin:0 auto 10px;border-radius:9px}
@media(max-width:760px){.moment-art{height:160px;margin:14px auto}.moment-finish{height:125px}.m-sealed .moment-art{height:100%}.secret.hidden .moment-secret{width:96px;height:64px}}
@media(max-height:640px){.moment-night,.moment-finish,.secret.hidden .moment-secret{display:none}}
.m-sealed{display:block;background:#eee4d2}.m-sealed .moment-art{object-fit:contain;border-radius:0}
.moment-night{object-position:center top}

/* Private portraits: the enclosing secret panel controls visibility. */
.role-portrait{display:block;width:176px;height:176px;object-fit:cover;border-radius:18px;margin:0 auto 14px;box-shadow:0 6px 16px #17223022;flex-shrink:0}
.m-role:has(.role-portrait){padding:22px;min-height:0}.m-role:has(.role-portrait) h2{margin:2px 0 5px}.m-role:has(.role-portrait) p{margin-bottom:0}
.room-secret .role-portrait{width:144px;height:144px;margin-top:8px}
@media(max-width:600px){.role-portrait{width:140px;height:140px;margin-bottom:10px}.m-role:has(.role-portrait){padding:16px;margin-block:16px}.m-role:has(.role-portrait) p{font-size:14px;line-height:1.5}.m-role:has(.role-portrait) h2{font-size:23px}}
@media(max-height:640px){.role-portrait,.room-secret .role-portrait{width:88px;height:88px}}