/* V3.1: reference-directed scenery and seating; keyed gameplay regions stay intact. */
body { background-color:#382043;background-image:url('../assets/scenery/club-v31.png'),url('../assets/scenery/mahjong-v3.svg');background-position:center top;background-size:auto 115svh,cover;background-attachment:fixed;color:#fff2dc; }
.game-screen,.game-screen::before,.start-screen::before { background:none; }
.gamebar,.sitebar { border-color:#ffd8a655;background:linear-gradient(90deg,#30172ca8,#41244988,#30172ca8);border-radius:0 0 15px 15px; }
.brand-lockup,.brand-lockup small,.round-readout,.round-readout b { color:#fff0da; }
.brand-mark { background:linear-gradient(145deg,#e479dd,#783188);box-shadow:0 0 15px #ec76d977;border-color:#ffe0a3; }
.icon-button,.quiet-button { background:#311c3acc;color:#fff0dc;border-color:#ecca96; }
.game-layout::before { inset:115px 45px 0;filter:drop-shadow(0 18px 18px #170d2e88); }
.visual-v31 .game-layout::after { content:'';position:absolute;inset:115px 45px 0;z-index:3;pointer-events:none;background:url('../assets/scenery/table-v21.svg') center/100% 100% no-repeat;clip-path:polygon(0 0,19% 0,12% 77%,88% 77%,81% 0,100% 0,100% 100%,0 100%); }
.visual-v31 .anime-seat { z-index:auto; }
.visual-v31 .anime-seat.is-winner { z-index:6; }
.visual-v31 .seat-avatar { z-index:2; }
.visual-v31 .table-center { z-index:5; }
.visual-v31 .seat-avatar { isolation:isolate; }
.visual-v31 .seat-avatar::before { content:'';position:absolute;inset:30% 10% 8%;border-radius:48% 48% 28% 28%;background:linear-gradient(110deg,#915072,#482644 45%,#bd7a94);border:3px solid #dfb76c;box-shadow:0 9px 15px #170a2388;z-index:-1; }
.visual-v31 .character-figure { mask-image:linear-gradient(to bottom,#000 0 77%,#000d 87%,transparent 100%); }
.visual-v31 .character-figure img { filter:drop-shadow(0 8px 6px #23112b99) drop-shadow(0 0 3px #ffd09b77); }
.visual-v31 .seat--1 .character-figure img,.visual-v31 .seat--3 .character-figure img { mask-image:linear-gradient(to bottom,#000 0 64%,#000a 77%,transparent 91%); }
.visual-v31 .seat--1 .seat-avatar,.visual-v31 .seat--3 .seat-avatar,.visual-v31 .seat--1 .character-figure,.visual-v31 .seat--3 .character-figure { width:300px;height:390px; }
.visual-v31 .seat--3 .seat-avatar { left:28px; }
.visual-v31 .seat--1 .seat-avatar { right:28px; }
.visual-v31 .seat--2 .seat-avatar,.visual-v31 .seat--2 .character-figure { width:290px;height:220px; }
.visual-v31 .seat--2 .seat-avatar::before { inset:25% 17% 1%; }
.visual-v31 .seat--2 .seat-copy { left:calc(50% + 145px);bottom:70px; }
.visual-v31 .seat-copy { position:relative;z-index:8;border:1px solid #dfb87988;border-radius:12px;padding:5px 10px;background:#42234aaa;backdrop-filter:blur(5px); }
.visual-v31 .seat-copy b,.visual-v31 .seat-copy > span,.visual-v31 .anime-seat.is-active .seat-copy b { color:#fff1e2;text-shadow:0 1px 3px #251127; }
.visual-v31 .seat--2 .back-row,.visual-v31 .seat--1 .back-row,.visual-v31 .seat--3 .back-row { z-index:8; }
.visual-v31 .seat--2 .back-row { top:188px; }
.visual-v31 .seat--2 .meld-row { z-index:8; }
/* The exact original painting is feathered, never repainted or face-warped. */
.visual-v31 .anime-seat[data-character-id="purple"] .character-figure { mask-image:radial-gradient(ellipse at 53% 40%,#000 30%,#000e 49%,transparent 72%); }
.visual-v31 .anime-seat[data-character-id="purple"] .character-figure img { object-fit:cover;object-position:50% 22%; }
.visual-v31 .anime-seat[data-character-id="purple"] .seat-avatar::before { opacity:.5; }
.visual-v31 .player-console { z-index:9; }
.visual-v31 .human-seat .seat-copy { padding:3px 8px;background:#512b65b3; }
.table-seal { border-radius:50%;background:radial-gradient(ellipse,#6d3787,#342343);border:2px solid #edc77e;box-shadow:0 0 0 4px #a268be77,0 5px 8px #183d3b77; }
.tile-art { box-shadow:0 2px 0 #ead8b7,0 5px 0 #a065bd,0 8px 9px #173b3877; }
.tile-assist { position:absolute;z-index:3;left:5%;top:2%;font:800 clamp(5px,calc(var(--tile-width,48px) * .18),10px)/1.05 Arial,sans-serif;color:#59334d;pointer-events:none;background:#fff7e6e8;border-radius:2px;padding:0 1px; }
.player-hand .tile-assist { font-size:9px; }
.tile-back .tile-assist { display:none; }
.reaction-panel { background:linear-gradient(125deg,#4e245eea,#7e3286ee);box-shadow:0 4px 0 #4b225e,0 0 22px #df87d960,inset 0 1px #fdd9ee; }
.reaction-heading h2,.reaction-heading span { color:#fff0dc; }
.action-button,.reaction-panel .action-button { background:linear-gradient(145deg,#b053a8,#572361);color:#fff1e4;border-radius:19px;border-color:#efd18d;box-shadow:inset 0 2px 3px #ffb7ebaa,0 4px 0 #3e1b4d,0 0 10px #f1a2d766; }
.action-button--win,.reaction-panel .action-button--win { background:linear-gradient(145deg,#f686dd,#a52a9a);color:#fff8df;box-shadow:inset 0 2px #ffe7ff,0 4px 0 #622467,0 0 24px #fc8ee9aa; }
.action-button--pass,.reaction-panel .action-button--pass { background:linear-gradient(145deg,#7e518f,#432649);color:#f4dfef; }
.banter-bubble { background:#fff1f6f2;color:#593155;border-color:#edbabe;box-shadow:0 5px 15px #22112955; }
@media(min-width:1101px) {
 .visual-v31 .seat--1 .seat-avatar,.visual-v31 .seat--3 .seat-avatar,.visual-v31 .seat--1 .character-figure,.visual-v31 .seat--3 .character-figure { width:360px;height:470px; }
 .visual-v31 .seat--2 .seat-avatar,.visual-v31 .seat--2 .character-figure { width:370px;height:280px; }
 .visual-v31 .seat--2 .seat-avatar { clip-path:inset(0 0 85px); }
 .visual-v31 .seat--2 .wind-tag { bottom:92px; }
 .visual-v31 .seat--2 .seat-copy { left:calc(50% + 185px);bottom:110px; }
 .visual-v31 .game-layout::before,.visual-v31 .game-layout::after { background-image:url('../assets/scenery/table-v31.svg'); }
 .visual-v31 .seat--3 .back-row { left:110%;transform:translate(-50%,-50%) rotate(105deg); }
 .visual-v31 .seat--1 .back-row { right:110%;transform:translate(50%,-50%) rotate(-105deg); }
}
@media(max-width:1100px) {
 .player-hand .tile-assist { font-size:8px; }
 .game-layout::before { inset:85px 45px 0; }
 .visual-v31 .game-layout::after { inset:85px 45px 0; }
 .visual-v31 .seat--1 .seat-avatar,.visual-v31 .seat--3 .seat-avatar,.visual-v31 .seat--1 .character-figure,.visual-v31 .seat--3 .character-figure { width:218px;height:315px; }
 .visual-v31 .seat--3 .seat-avatar { left:20px; }.visual-v31 .seat--1 .seat-avatar { right:20px; }
 .visual-v31 .seat--2 .seat-avatar,.visual-v31 .seat--2 .character-figure { width:235px;height:190px; }
 .visual-v31 .seat--2 .seat-copy { left:calc(50% + 118px);bottom:60px; }.visual-v31 .seat--2 .back-row { top:165px; }
}
@media(max-width:800px) {
 .player-hand .tile-assist { font-size:7px; }
 .game-layout::before { inset:108px 10px 20px; }
 .visual-v31 .game-layout::after { inset:108px 10px 20px; }
 .visual-v31 .seat--1 .seat-avatar,.visual-v31 .seat--3 .seat-avatar,.visual-v31 .seat--1 .character-figure,.visual-v31 .seat--3 .character-figure { width:154px;height:245px; }
 .visual-v31 .seat--3 .seat-avatar { left:12px; }.visual-v31 .seat--1 .seat-avatar { right:12px; }
 .visual-v31 .seat--2 .seat-avatar,.visual-v31 .seat--2 .character-figure { width:228px;height:205px; }.visual-v31 .seat--2 .back-row { top:178px; }
 .visual-v31 .seat--2 .seat-copy { left:calc(50% + 115px);bottom:65px; }
 .visual-v31 .seat-copy { padding:4px 6px; }
}
@media(max-width:520px) {
 .player-hand .tile-assist { font-size:6px; }
 .game-layout::before { inset:106px -7px 79px; }
 .visual-v31 .game-layout::after { inset:106px -7px 79px; }
 body { background-position:52% top;background-size:auto 100svh; }
 .visual-v31 .seat--1 .seat-avatar,.visual-v31 .seat--3 .seat-avatar,.visual-v31 .seat--1 .character-figure,.visual-v31 .seat--3 .character-figure { width:92px;height:170px; }
 .visual-v31 .seat--3 .seat-avatar { left:5px; }.visual-v31 .seat--1 .seat-avatar { right:5px; }
 .visual-v31 .seat--2 .seat-avatar,.visual-v31 .seat--2 .character-figure { width:160px;height:163px; }.visual-v31 .seat--2 .back-row { top:143px; }
 .visual-v31 .seat--2 .seat-copy { left:calc(50% + 78px);bottom:50px; }.visual-v31 .seat-copy { padding:3px; }
 .visual-v31 .seat-avatar::before { border-width:1px; }
 .tile-assist { font-size:clamp(4px,calc(var(--tile-width,24px) * .2),7px); }
 .reaction-panel .action-button { border-radius:14px; }
}