/* The table is scenery. All cells, routes, pawns and the die remain interactive. */
#app{background:#08162c url('meja-nusantara-scene.webp') center/cover no-repeat}
#app:before{opacity:1;background:radial-gradient(ellipse at 50% 42%,transparent 35%,#020a2240 100%);mask-image:none;pointer-events:none}
#home,#play{position:relative;z-index:1}
#play>header{height:54px;padding:6px 16px;background:linear-gradient(90deg,#09172cc9,#10264466,#09172cc9);border-bottom:1px solid #d1a84d45}
#play header>div{text-align:center}#play header strong{font:1000 21px 'Baloo 2',Nunito;letter-spacing:1.2px;color:#ffe9a2;text-shadow:0 2px #855011,0 4px #041126}#play header small{color:#d4ddea;font-size:10px}
#play .round,#home .round{color:#ffe59b;border:1px solid #d9ba7377;background:linear-gradient(145deg,#203d59,#0c1a31);box-shadow:inset 0 1px #fff2,0 3px #040c1d}
.match{max-width:1180px;width:100%;margin:0 auto;min-height:0;position:relative}
#play>.match{height:calc(100% - 54px)}
.match[data-layout=wide]{display:grid;grid-template-columns:minmax(0,1fr) var(--board-size) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 112px;padding:8px 18px 18px;gap:12px 16px;justify-content:center;align-items:center}
.match[data-layout=wide]>.board-side{grid-column:2;grid-row:1}
.match[data-layout=wide]>#players{grid-column:1/4;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr) var(--board-size) minmax(0,1fr);grid-template-rows:1fr 1fr;align-items:center;gap:14px 16px;width:100%;height:100%;margin:0;pointer-events:none}
.match[data-layout=wide] .player{width:var(--seat-width);max-width:100%;justify-self:center}
.match[data-layout=wide] .player[data-player="0"]{grid-column:1;grid-row:1}.match[data-layout=wide] .player[data-player="3"]{grid-column:1;grid-row:2}.match[data-layout=wide] .player[data-player="1"]{grid-column:3;grid-row:1}.match[data-layout=wide] .player[data-player="2"]{grid-column:3;grid-row:2}
.match[data-layout=wide] #players[data-count="2"] .player{grid-row:1/3}
.board-side{position:relative;perspective:calc(var(--board-size)*2.7);perspective-origin:50% 50%;width:var(--board-size);z-index:2;flex:none}
.board-frame{--tilt:20deg;width:100%;aspect-ratio:1;border:9px solid transparent;border-radius:20px;background:linear-gradient(#d79a2a,#b87d1e) padding-box,linear-gradient(135deg,#fff7c2,#e5a22c 15%,#fff2a0 30%,#b97913 48%,#ffe697 65%,#9a5e0e 83%,#ffe9a6) border-box;transform:rotateX(var(--tilt));transform-style:preserve-3d;box-shadow:0 2px #fff1b9,0 6px #c48a22,0 10px #79501c,0 15px 0 -1px #322820,0 26px 28px #01071999;touch-action:manipulation}
.board-frame:before{content:'';position:absolute;inset:-6px;border:1px solid #fff5b4b3;border-radius:14px;pointer-events:none}
.board-frame:after{content:'';position:absolute;inset:0;border:1px solid #64411588;border-radius:10px;pointer-events:none;transform:translateZ(1px)}
#board svg{border-radius:10px}#board{transform:translateZ(.3px)}#pieces{transform-style:preserve-3d}
.pawn{width:8.6%;height:11.1%;transform:translate(-50%,-90%) rotateX(calc(0deg - var(--tilt)));transform-origin:50% 90%;filter:drop-shadow(2px 4px 2px #152d4666)}
.pawn svg{overflow:visible}.pawn.selectable{z-index:8}.pawn.selectable:before{inset:76% -3% -2%;border:2px solid #fff5af;background:#ffd43433;box-shadow:0 0 0 2px #aa6e19,0 0 12px #ffdf66;z-index:-1}
.pawn.moving{filter:drop-shadow(3px 7px 3px #14223877)}
.route-line{stroke:#19364f;stroke-width:3;stroke-dasharray:2 6}.route-dot{fill:#ffdd71;stroke:#77521b;stroke-width:1.2}#route{transform:translateZ(1px)}#target{border:2px solid #956a22;background:#ffe25877;box-shadow:0 0 0 2px #fff4c6;transform:translate(-50%,-50%) translateZ(1px)}
#board .home-light{transition:opacity .25s}#board[data-player="0"] [data-player="0"] .home-light,#board[data-player="1"] [data-player="1"] .home-light,#board[data-player="2"] [data-player="2"] .home-light,#board[data-player="3"] [data-player="3"] .home-light{opacity:1}
.match .player{display:flex;align-items:center;gap:8px;min-width:0;min-height:86px;height:auto;position:relative;padding:10px 9px;color:#f0f5ff;border:2px solid var(--color);border-radius:14px;background:linear-gradient(140deg,color-mix(in srgb,var(--color) 21%,#06142c),#071329eb);box-shadow:inset 0 1px #fff3,0 4px #02091888,0 0 12px color-mix(in srgb,var(--color) 15%,transparent)}
.match .player.active{background:linear-gradient(135deg,color-mix(in srgb,var(--color) 38%,#132341),#0c1c34);color:#fff2c6;outline:1px solid #ffe49a;outline-offset:3px;box-shadow:inset 0 1px #fff4,0 4px #02091888,0 0 21px #ffc35444}
.player:after{width:7px;height:7px;top:10px;right:8px;box-shadow:0 0 8px var(--color);border:1px solid #fffa}
.seat-avatar{width:38px;height:38px;flex:none;display:block;border:2px solid var(--color);border-radius:50%;background:#f4e5c5;box-shadow:0 2px 4px #0007;overflow:hidden}.seat-avatar svg{width:100%;height:100%}
.seat-info{min-width:0;flex:1}.match .player strong{padding-right:6px;font-size:12px;line-height:1.25;white-space:normal}.match .player small{font-size:9px;line-height:1.4;margin-top:3px;color:#d7deeb}
.seat-track{display:block;height:3px;border-radius:4px;background:#ffffff1a;margin-top:6px;overflow:hidden}.seat-track i{display:block;height:100%;background:var(--color)}
.seat-pawns{display:flex;align-items:end;gap:1px;height:24px;margin-top:4px}.seat-pawns i{display:block;width:16px;height:24px;opacity:.8}.seat-pawns i.home{filter:drop-shadow(0 0 3px #fff3a0);opacity:1}.seat-pawns svg{width:100%;height:100%}
.match[data-layout=wide]>.controls{grid-column:1/4;grid-row:2;align-self:stretch;width:100%;display:grid;grid-template-columns:160px minmax(90px,1fr) 184px 140px;grid-template-rows:22px 26px 24px;gap:4px 14px;align-items:center;text-align:left;padding:10px 14px;background:linear-gradient(145deg,#173451ee,#07152bf2);border:1px solid #ba975d99;border-radius:18px;box-shadow:inset 0 1px #fff2,0 4px #030b1d,0 10px 25px #02071877;z-index:5}
.controls .turn-heading{grid-column:2;grid-row:1;background:none;border:0;padding:0;gap:6px}.controls .turn-heading small{display:none}.controls .turn-heading h2{font-size:14px;color:#fff0bf;margin:0}.controls #turnNumber{color:#a4bcd9;font-size:9px}.controls #turnDot{width:9px;height:9px;box-shadow:0 0 8px var(--turn-color)}
.controls #instruction{grid-column:2;grid-row:2;min-height:0;font-size:11px;line-height:1.3;padding:0;color:#d7e8f5;align-self:center}
.controls #feedback{grid-column:2;grid-row:3;min-height:24px;max-height:28px;margin:0;font-size:10px;line-height:1.25;color:#ffe4a3;align-self:start}
.controls #roll{grid-column:1;grid-row:1/4;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0;min-height:72px;height:72px;width:160px;padding:0 9px 0 2px;border:1px solid #fff4c6;border-radius:16px;background:linear-gradient(150deg,#fff2bc,#ffd352 45%,#e59c19);box-shadow:inset 0 1px #fff,0 4px #9f6717;color:#213b4e}
.controls #roll:disabled{background:linear-gradient(145deg,#294b62,#152e47);border-color:#a8bfd955;box-shadow:inset 0 1px #fff2,0 3px #050e23}.controls #roll:not(:disabled):hover{filter:brightness(1.1)}
.controls #die{--edge:42px;flex:none;width:70px;height:70px}.controls #rollLabel{color:#28394a;font-size:10px;line-height:1.35;letter-spacing:.3px;white-space:normal;max-width:64px}.controls #roll:disabled #rollLabel{color:#d0e0f2}
.controls #choices{grid-column:3;grid-row:1/4;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;min-height:80px;width:100%;align-items:center}
.controls .choice{display:flex;max-width:none;min-height:44px;padding:1px 5px 1px 1px;gap:2px;border-radius:10px;border:1px solid #b7cce266;background:linear-gradient(#2e4c67,#132b44);color:#edf5ff;box-shadow:0 2px #030d20}
.controls .choice:hover{background:#355976}.controls .choice.preview{outline:2px solid #ffe383;outline-offset:1px}.choice-pawn{width:27px;height:38px;flex:none}.choice-pawn svg{width:100%;height:100%}.choice span:last-child{font-size:10px}.waiting-pawns{grid-column:1/3;display:flex;align-items:center;justify-content:center;gap:5px;min-height:62px;border:1px solid #aec2de33;background:#06162b70;border-radius:12px}.waiting-pawns i{display:block;width:29px;height:46px;opacity:.75}.waiting-pawns i.home{filter:drop-shadow(0 0 4px #ffe892)}.waiting-pawns svg{width:100%;height:100%}
.table-tools{grid-column:4;grid-row:1/4;display:flex;gap:5px;justify-content:center;align-items:center}.table-tools button{min-width:40px;min-height:57px;width:43px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:4px 1px;font-size:8px;color:#d8e4f7;border:1px solid #9bb5d044;border-radius:10px;background:linear-gradient(#29425d,#132840);box-shadow:0 2px #030b1e}.table-tools button>span{font-size:20px;line-height:22px;color:#f7dfa2}.controls .legend{display:none}.controls #saveNote{grid-column:1/-1;font-size:9px;position:absolute;bottom:-12px}
.match[data-layout=stack]{display:flex;flex-direction:column;justify-content:center;gap:18px;padding:8px 8px 14px}
.match[data-layout=stack]>.board-side{max-width:none}.match[data-layout=stack] .board-frame{--tilt:10deg;border-width:6px;border-radius:15px}.match[data-layout=stack] .board-frame:before{inset:-4px;border-radius:11px}
.match[data-layout=stack]>#players{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:100%;height:auto;margin:0}
.match[data-layout=stack]>#players[data-count="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.match[data-layout=stack] .player{padding:6px;min-height:54px;gap:6px;border-width:1px;border-top:3px solid var(--color);border-radius:11px}.match[data-layout=stack] .seat-avatar{width:28px;height:28px}.match[data-layout=stack] .seat-track{display:none}.match[data-layout=stack] .seat-pawns{height:17px;margin-top:2px}.match[data-layout=stack] .seat-pawns i{width:12px;height:17px}.match[data-layout=stack] .player strong{font-size:11px}.match[data-layout=stack] .player small{font-size:9px}
.match[data-layout=stack] #players[data-count="4"] .player{display:block;text-align:center;padding:5px 2px;min-height:54px}.match[data-layout=stack] #players[data-count="4"] .seat-avatar{display:none}.match[data-layout=stack] #players[data-count="4"] .seat-pawns{justify-content:center}.match[data-layout=stack] #players[data-count="4"] .player:after{display:none}.match[data-layout=stack] #players[data-count="4"] .player small{font-size:8px}
.match[data-layout=stack] .controls{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 110px;grid-template-rows:20px 28px 48px 27px;gap:4px 8px;padding:9px 10px;background:linear-gradient(145deg,#203b57f2,#09172df2);border:1px solid #ceae6b88;border-radius:17px;box-shadow:inset 0 1px #fff2,0 4px #020b1f;position:relative;z-index:5}
.match[data-layout=stack] .turn-heading{grid-column:1;grid-row:1}.match[data-layout=stack] .turn-heading>div{display:block}.match[data-layout=stack] .turn-heading h2{font-size:14px}.match[data-layout=stack] #instruction{grid-column:1;grid-row:2;font-size:11px;line-height:1.3;max-width:none}.match[data-layout=stack] #roll{grid-column:2;grid-row:1/3;width:110px;min-height:56px;height:56px;border-radius:12px;padding:0 6px 0 0}.match[data-layout=stack] #die{--edge:32px;width:50px;height:52px}.match[data-layout=stack] #rollLabel{font-size:9px;line-height:1.2;max-width:53px}.match[data-layout=stack] #choices{grid-column:1/3;grid-row:3;display:flex;gap:5px;min-height:48px}.match[data-layout=stack] .choice{flex:1;min-height:44px}.match[data-layout=stack] .choice-pawn{width:27px;height:37px}.match[data-layout=stack] .waiting-pawns{width:100%;min-height:44px;height:44px;gap:10px}.match[data-layout=stack] .waiting-pawns i{width:22px;height:36px}.match[data-layout=stack] #feedback{grid-column:1/3;grid-row:4;height:27px;min-height:27px;font-size:10px}.match[data-layout=stack] .table-tools{display:none}
dialog{background:linear-gradient(145deg,#264b65,#0a1d34);color:#fff0c5;border:2px solid #e6be63;border-radius:25px;box-shadow:inset 0 0 0 4px #fff1,0 6px #785321,0 25px 70px #0009}dialog::backdrop{background:#030a206b;backdrop-filter:blur(3px)}dialog:before{background:linear-gradient(#fff2b2,#e9ad2c);border-color:#fff3ba;color:#765019;box-shadow:0 3px #9f6a23}dialog h2{color:#fff0bd}dialog p{color:#d0e2ed}dialog .primary{background:linear-gradient(#fff2b4,#ffd04c 60%,#e4a025);border-color:#fff0b2;color:#253e4b;text-shadow:0 1px #fff7dc;box-shadow:0 4px #9e6b22}dialog .secondary{background:linear-gradient(#31546d,#1a324a);border-color:#a0b6c955;color:#e8f1ff;box-shadow:0 2px #050f23}dialog .secondary:hover{background:#31546d}#diceMotionSetting{color:#d3e1ee}.result-score{color:#ffdb79}.result-grid{color:#c1d2e2}.result-grid b{color:#fff2c5}
/* Same physical board and pieces in the lobby; no competing static illustration. */
body:not(.cover) #home .welcome{height:calc(100% - 52px);padding:12px 24px 24px}body:not(.cover) #home .intro{display:grid;width:min(1080px,100%);height:100%;grid-template-columns:minmax(260px,39%) minmax(0,1fr);grid-template-rows:auto auto 1fr auto auto auto;gap:10px 38px;align-items:center;align-content:center}#home .intro>.eyebrow{display:none}#home .intro>h1{grid-column:1;grid-row:1;justify-self:center}#home .intro>.tagline{grid-column:1;grid-row:2;margin:0;color:#e3eaff}body:not(.cover) #home .intro>.hero{grid-column:2;grid-row:1/7;width:min(100%,calc(100dvh - 150px));height:auto;aspect-ratio:1;max-height:none;margin:auto;padding:8px;transform:rotate(-3deg);background:linear-gradient(135deg,#fff2ae,#c98b1e 28%,#ffeba8 49%,#af741d 80%,#ffe589);box-shadow:0 6px #aa7822,0 10px #4b3318,0 24px 45px #01071d99;border-radius:18px}#home .intro>.setup{grid-column:1;grid-row:3;width:100%;max-width:100%;margin:0;padding:12px;background:linear-gradient(#1e3a54dd,#0a1a30ee);border:1px solid #c6a76877;border-radius:18px;gap:9px}#home .picker button{background:linear-gradient(#2e4b67,#152b43);color:#e3efff;border-color:#b2c6de44;min-height:44px}#home .picker button[aria-pressed=true]{background:linear-gradient(#fff2be,#eec357);color:#253d4d;border-color:#fff1b4;box-shadow:0 3px #a16a1c}#home .intro>[data-dh-main]{grid-column:1;grid-row:4;width:100%}#home .intro>#homeNote{grid-column:1;grid-row:5;color:#dfebfc;margin:2px 0}#home .intro>[data-dh-menu]{grid-column:1;grid-row:6}.hero-token{position:absolute;width:9%;height:12%;transform:translate(-50%,-83%);filter:drop-shadow(1px 3px 1px #10264066)}.hero-token svg{width:100%;height:100%}
@media(max-width:699px) and (orientation:portrait){#play>header{height:46px;padding:4px 10px}#play>header strong{font-size:17px}#play>.match{height:calc(100% - 46px)}body:not(.cover) #home .welcome{height:calc(100% - 52px);padding:6px 14px 16px}body:not(.cover) #home .intro{grid-template-columns:1fr;grid-template-rows:auto auto minmax(40px,1fr) auto auto auto auto;gap:7px;max-width:430px}#home .intro>h1{grid-row:1}#home .letters i{width:45px;height:47px;font-size:43px}#home h1 small{font-size:12px;margin-top:10px}#home .intro>.tagline{grid-row:2;font-size:11px}body:not(.cover) #home .intro>.hero{grid-column:1;grid-row:3;height:100%;width:auto;max-height:290px;max-width:74vw;min-height:0;padding:5px;border-radius:12px}#home .intro>.setup{grid-row:4;padding:7px;gap:6px}#home .picker button{min-height:36px;padding:5px;font-size:12px}#home .intro>[data-dh-main]{grid-row:5}#home .intro>#homeNote{grid-row:6;font-size:10px}#home .intro>[data-dh-menu]{grid-row:7}}
@media(max-height:740px) and (orientation:portrait){#play>header{height:42px}#play>header strong{font-size:15px}#play>.match{height:calc(100% - 42px)}.match[data-layout=stack]{gap:14px;padding:5px 8px 10px}.match[data-layout=stack] .player{min-height:45px;padding:4px}.match[data-layout=stack] #players[data-count="4"] .player{min-height:45px;padding:3px 1px}.match[data-layout=stack] .seat-pawns{height:13px;margin-top:0}.match[data-layout=stack] .seat-pawns i{width:10px;height:14px}.match[data-layout=stack] .player strong{font-size:10px}.match[data-layout=stack] .player small{font-size:8px}.match[data-layout=stack] .controls{padding:6px 8px;grid-template-rows:17px 26px 44px 25px;gap:3px 7px}.match[data-layout=stack] #choices{min-height:44px}.match[data-layout=stack] #roll{height:48px;min-height:48px}.match[data-layout=stack] #die{--edge:29px;width:47px;height:47px}.match[data-layout=stack] #rollLabel{font-size:8px}.match[data-layout=stack] #feedback{height:25px;min-height:25px;font-size:9px}.match[data-layout=stack] .turn-heading h2{font-size:13px}body:not(.cover) #home .welcome{height:calc(100% - 44px);padding:4px 12px 10px}body:not(.cover) #home .intro{gap:5px}#home .letters i{width:35px;height:37px;font-size:34px}#home h1 small{font-size:10px;margin-top:7px}#home .intro>.tagline{font-size:10px}#home .intro>.setup{padding:5px;gap:5px}#home .picker button{min-height:32px;font-size:10px}#home .picker small{font-size:8px}}
@media(min-width:560px) and (max-height:520px){#play>header{height:40px;padding:3px 12px}#play>header strong{font-size:16px}#play>header small{font-size:9px}#play .round{width:32px;height:32px;border-radius:10px;font-size:22px}#play>.match{height:calc(100% - 40px)}.match[data-layout=wide]{grid-template-columns:var(--board-size) var(--control-width);grid-template-rows:1fr;gap:12px;padding:10px 14px 14px}.match[data-layout=wide]>.board-side{grid-column:1;grid-row:1}.match[data-layout=wide]>.board-side .board-frame{--tilt:14deg;border-width:6px;border-radius:15px}.match[data-layout=wide]>#players{grid-column:2;grid-row:1;align-self:start;display:flex;gap:4px;pointer-events:none;width:100%;height:auto}.match[data-layout=wide] .player{width:auto;flex:1;min-height:43px;padding:4px 3px;border-width:1px;border-top:3px solid var(--color);border-radius:9px;display:block}.match[data-layout=wide] .player strong{font-size:9px;line-height:1.2;padding:0}.match[data-layout=wide] .player small{font-size:8px;line-height:1.2}.match[data-layout=wide] .seat-avatar,.match[data-layout=wide] .seat-pawns,.match[data-layout=wide] .seat-track,.match[data-layout=wide] .player:after{display:none}.match[data-layout=wide]>.controls{grid-column:2;grid-row:1;align-self:end;display:grid;grid-template-columns:minmax(0,1fr) 86px;grid-template-rows:20px 35px 92px 30px;gap:4px 7px;padding:9px;border-radius:16px}.match[data-layout=wide] .turn-heading{grid-column:1;grid-row:1}.match[data-layout=wide] #instruction{grid-column:1;grid-row:2;font-size:10px}.match[data-layout=wide] #roll{grid-column:2;grid-row:1/3;width:86px;min-height:57px;height:57px;padding:0;gap:0;flex-direction:column;border-radius:12px}.match[data-layout=wide] #die{--edge:28px;width:43px;height:40px}.match[data-layout=wide] #rollLabel{font-size:8px;line-height:1.1;max-width:none}.match[data-layout=wide] #choices{grid-column:1/3;grid-row:3;min-height:92px;gap:5px}.match[data-layout=wide] #feedback{grid-column:1/3;grid-row:4;font-size:10px;min-height:27px}.match[data-layout=wide] .table-tools{display:none}.match[data-layout=wide] .waiting-pawns{height:65px}.match[data-layout=wide] .choice{min-height:44px}body:not(.cover) #home .welcome{height:calc(100% - 44px);padding:7px 16px 12px}body:not(.cover) #home .intro{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5px 24px}#home .letters i{width:32px;height:34px;font-size:31px}#home h1 small{font-size:10px;margin-top:6px}#home .intro>.tagline{display:none}#home .intro>.setup{padding:5px;gap:4px;grid-row:2/4}#home .picker button{min-height:28px;padding:3px;font-size:10px}#home .picker small{font-size:8px}#home .intro>#homeNote{font-size:8px}}
@media(prefers-reduced-motion:reduce){#board .home-light{transition:none}}
@media(min-height:521px){
 .match[data-layout=wide] #roll{width:160px;min-height:72px;height:72px;padding:0 9px 0 2px;gap:0;flex-direction:row}
 .match[data-layout=wide] #die{--edge:42px;width:70px;height:70px}
 .match[data-layout=wide] #rollLabel{font-size:10px}
 .match[data-layout=wide] .turn-heading{padding:0;background:none;border:0;border-radius:0;align-self:center}
 .match[data-layout=wide] #instruction{min-height:0;align-self:center;font-size:11px}
 .match[data-layout=wide] #feedback{min-height:24px;margin:0;font-size:10px}
 .match[data-layout=wide] #choices{min-height:80px}
 .match[data-layout=wide]>#players{grid-template-rows:auto auto;align-content:start;padding-top:34px}
 .match[data-layout=wide]>#players[data-count="2"]{align-content:center;padding-top:0}
}
#play header .table-brand{display:grid;grid-template-columns:repeat(4,22px);gap:3px;justify-content:center;line-height:1;text-shadow:0 2px #663818,0 3px #07152c}
.table-brand b{display:grid;place-items:center;height:24px;font:1000 24px 'Baloo 2',Nunito;color:#fff;border:1px solid #fff3c9;border-radius:6px;background:linear-gradient(#ff6b78,#cf173c);box-shadow:0 2px #341b28;transform:rotate(-5deg)}.table-brand b:nth-child(2){background:linear-gradient(#5eeba8,#079958);transform:rotate(5deg)}.table-brand b:nth-child(3){background:linear-gradient(#67d9ff,#0877d3);transform:rotate(-4deg)}.table-brand b:nth-child(4){background:linear-gradient(#ffe66a,#eea714);transform:rotate(5deg)}.table-brand em{grid-column:1/5;font:1000 8px Nunito;letter-spacing:2px;color:#ffe080;font-style:normal;padding-top:3px}
#play header small{font-size:9px;margin-top:2px}
#matchSummary{display:none}
@media(min-height:521px){.match[data-layout=wide][data-details="true"]>#matchSummary{display:block;grid-column:1;grid-row:1;align-self:end;justify-self:center;width:var(--seat-width);max-width:100%;padding:14px 12px;margin-bottom:18px;background:linear-gradient(#102745ed,#06152ced);border:1px solid #b69a655e;border-radius:13px;color:#dce8fb;box-shadow:inset 0 1px #fff1,0 3px #0004;pointer-events:none}.match[data-layout=wide] #matchSummary small{display:block;font-size:8px;letter-spacing:1.3px;color:#efcc78;margin-bottom:10px}#matchSummary strong{display:block;font-size:12px;line-height:1.4}#matchSummary span{display:block;font-size:9px;line-height:1.5;color:#b7cce2;margin-top:3px}#matchSummary hr{border:0;border-top:1px solid #aabed433;margin:11px 0}}
@media(min-width:560px) and (max-height:520px){#play header .table-brand{grid-template-columns:repeat(4,17px);gap:2px}.table-brand b{height:18px;font-size:18px;border-radius:4px}.table-brand em{font-size:6px;padding-top:2px}#play header small{font-size:8px}.match[data-layout=wide] .turn-heading{padding:0;border:0;background:none;border-radius:0}.match[data-layout=wide] #instruction{min-height:0;align-self:center}}
#play header>div{display:flex;align-items:center;justify-content:center;gap:14px;min-width:0}#play header .table-brand{flex:none}#matchType{max-width:150px;line-height:1.3;text-align:left}
@media(max-width:699px) and (orientation:portrait){#play header>div{gap:9px}#play header .table-brand{grid-template-columns:repeat(4,18px);gap:2px}.table-brand b{height:20px;font-size:20px}.table-brand em{font-size:6px;letter-spacing:1.5px;padding-top:2px}#matchType{max-width:104px;font-size:8px!important}}
.pawn svg image,.choice-pawn svg image,.seat-pawns svg image{filter:brightness(1.15) saturate(1.06)}
.pawn.finished{pointer-events:none;filter:drop-shadow(0 1px 1px #30241299) drop-shadow(0 0 2px #ffe68b);transition:none}
.pawn.captured{transition:none;z-index:18;pointer-events:none}
#impactLayer{position:absolute;inset:0;pointer-events:none;z-index:35;overflow:visible}
.capture-burst{position:absolute;width:0;height:0}
.impact-ring,.impact-core,.impact-spark{position:absolute;display:block;pointer-events:none}
.impact-ring{width:72px;height:72px;border:4px solid #ffe27b;border-radius:50%;box-shadow:0 0 12px #ffcf72,inset 0 0 10px var(--impact-color);transform:translate(-50%,-50%)}
.impact-core{width:78px;height:78px;border-radius:50%;background:radial-gradient(circle,#fff6c6 0,#ffe27bbb 25%,transparent 68%);transform:translate(-50%,-50%)}
.impact-spark{width:4px;height:13px;left:-2px;top:-6px;border-radius:50%;background:linear-gradient(#fff9d8,#ffc953);box-shadow:0 0 4px var(--impact-color);transform-origin:50% 50%}
.capture-banner{position:absolute;left:50%;top:40%;width:max-content;max-width:94%;text-align:center;transform:translate(-50%,-50%);padding:8px 18px;border:1px solid #ffe5a577;border-radius:15px;background:linear-gradient(110deg,#07162de6,#1a3559eb,#07162de6);box-shadow:0 4px 18px #02081a66;color:#ffe59a}
.capture-banner b{display:block;font:1000 clamp(20px,4vw,30px)/1.1 'Baloo 2',Nunito;letter-spacing:.5px;text-shadow:0 2px #6c3d16}
.capture-banner small{display:block;margin-top:4px;font:800 11px/1.3 Nunito;color:#f2f5ff}
.capture-burst.calm .impact-core,.capture-burst.calm .impact-spark{display:none}
.capture-burst.calm .impact-ring{width:42px;height:42px;border-width:2px;box-shadow:none}
/* A sibling projection layer avoids Canvas being buried in the board's 3D context. */
.board-side{--rim:9px;--tilt:20deg}
#diceThrow{inset:var(--rim);transform:rotateX(var(--tilt));z-index:25}
.match[data-layout=stack] .board-side{--rim:6px;--tilt:10deg}
@media(min-width:560px) and (max-height:520px){.match[data-layout=wide] .board-side{--rim:6px;--tilt:14deg}}