/* tavern-games.css — the Crooked Laurel's games (tavern-games.js) inside the training yard's modal frame (dialog.tg, training-games.css):
   the table the figures stand behind (cut at the hips: --table its height, --floor where their feet would be), the knucklebone
   board, the arms close-up, the lean meter, the stakes. */
dialog.tv{--pad:calc(132px + env(safe-area-inset-bottom))}
dialog.tv[data-game=tali]{--pad:calc(92px + env(safe-area-inset-bottom))}
.tv-bg{object-position:30% 62%}
.tv-table{position:absolute;left:0;right:0;bottom:0;z-index:4;height:var(--table,40%);border-top:3px solid var(--ss-ink,#2b1709);background:linear-gradient(#c89456,#a8743f 14px,#2b170966 14px 17px,#0000 17px),repeating-linear-gradient(90deg,#0000 0 118px,#2b170938 118px 121px),linear-gradient(#9a6a3a,#7a4c26 55%,#5a381c);box-shadow:0 -8px 16px #0005}
/* the knucklebone board: green cloth on the table, Petra's row above yours */
.tv-board{position:absolute;z-index:5;left:50%;bottom:calc(var(--table,40%) * .1);transform:translateX(-50%);width:min(94%,470px);display:grid;gap:8px;padding:10px 12px;border:3px solid var(--ss-ink,#2b1709);border-radius:14px;background:radial-gradient(ellipse at 50% 35%,#4a8a58,#2a5236 75%);box-shadow:inset 0 2px 10px #000a,0 4px 0 var(--ss-ink,#2b1709),0 10px 18px #0007}
.tv-row{display:grid;grid-template-columns:78px minmax(0,1fr);align-items:center;gap:8px}
.tv-row.you{padding-top:8px;border-top:2px dashed #ffffff30}
.tv-who{font:400 14px/1.05 var(--ss-font-display,'Lilita One',sans-serif);letter-spacing:.02em;color:#fff3dc;text-shadow:var(--ss-outline-sm,0 1px 0 #2b1709)}
.tv-who b{display:block;margin-top:2px;font-size:26px;font-weight:400;color:var(--ss-gold,#ffd24a)}
.tv-row[data-rank=venus] .tv-who b{color:#aef0ff;text-shadow:var(--ss-outline-sm,0 1px 0 #2b1709),0 0 10px #aef0ff}
.tv-row[data-rank=dogs] .tv-who b{color:#ff8a6a}
.tv-bones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;min-height:44px}
dialog.tv .tv-bone{position:relative;display:block;margin:0;padding:0;border:0;border-radius:10px;background:none;aspect-ratio:64/44;cursor:pointer;filter:drop-shadow(0 3px 1px #0008);transition:transform .15s}
dialog.tv .tv-bone:disabled{cursor:default;opacity:1;filter:drop-shadow(0 3px 1px #0008)}
.tv-bone-svg{display:block;width:100%;height:100%;overflow:visible}
dialog.tv .tv-bone.marked{transform:translateY(-7px);filter:drop-shadow(0 0 6px #ff8a3c) drop-shadow(0 3px 1px #0008)}
.tv-bone.marked:after{content:'↻';position:absolute;right:-5px;top:-9px;width:22px;height:22px;display:grid;place-items:center;border:2px solid var(--ss-ink,#2b1709);border-radius:50%;background:#e0452f;color:#fff;font:700 14px/1 var(--font,'DM Sans',sans-serif)}
dialog.tv .tv-bone:focus-visible{outline:3px solid var(--ss-gold,#ffd24a);outline-offset:3px}
.tv-tali-pad{display:flex;gap:10px;width:min(560px,100%)}
dialog.tv .tv-cmd{flex:1;min-height:58px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 12px;font-size:23px;line-height:1}
dialog.tv .tv-cmd[hidden]{display:none}
dialog.tv .tv-cmd .icon{width:24px;height:24px;stroke-width:2.4}
dialog.tv .tv-throw{color:var(--ss-parch-ink,#3a220f);background:linear-gradient(#ffe08f,#f0b955 48%,#d18f3a);text-shadow:0 1px 0 #fff4}
dialog.tv .tv-stand{color:#fff0d2;background:linear-gradient(#8c5b31,#6b4424 55%,#5a361b);text-shadow:0 1px 0 var(--ss-ink,#2b1709)}
dialog.tv .tv-again{color:#fff;background:linear-gradient(#ff8a6a,#d8452e 55%,#a8231a);text-shadow:0 1px 0 var(--ss-ink,#2b1709)}
dialog.tv .tv-cmd:disabled{filter:saturate(.35) brightness(.8);cursor:default}
/* the arms close-up on the table and Petra's lean meter */
.tv-arms{position:absolute;z-index:5;left:50%;bottom:calc(var(--table,40%) * .06);transform:translateX(-50%);width:var(--arms,min(86%,440px));aspect-ratio:400/250}
.tv-arms-svg{display:block;width:100%;height:100%;overflow:visible}
.tv-sweat path{transition:opacity .2s}
.tv-lean{flex:1;min-width:0;display:flex;align-items:center}
.tv-lean-track{position:relative;flex:1;height:20px;border:2px solid var(--ss-ink,#2b1709);border-radius:11px;background:linear-gradient(90deg,#c0392b,#e0782c 30%,#f3e3bd 50%,#8ed06a 70%,#3f8f2a);box-shadow:0 3px 0 #1a0b03a6}
.tv-lean-track:before{content:'';position:absolute;left:50%;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--ss-ink,#2b1709)}
.tv-lean-track i{position:absolute;top:-8px;bottom:-8px;left:50%;width:10px;margin-left:-5px;border-radius:5px;background:#fff;border:2px solid var(--ss-ink,#2b1709);box-shadow:0 2px 6px #000a}
dialog.tv.heaving .tv-lean-track{box-shadow:0 0 0 3px #ff5a3a,0 0 16px #ff5a3a}
dialog.tv.heaving .tv-petra .combat-rig{filter:drop-shadow(0 0 7px #ff4a2acc)}
dialog.tv .tv-push{width:min(560px,100%)}
/* the intro card's stakes and the result */
.tv-stakes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 8px}
dialog.tv .tv-stake-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:60px;padding:6px 4px;color:var(--ss-parch-ink,#3a220f);background:linear-gradient(#ffe08f,#f0b955 48%,#d18f3a);font-size:23px;line-height:1}
dialog.tv .tv-stake-btn .icon{width:18px;height:18px}
dialog.tv .tv-stake-btn small{font:700 10.5px/1.2 var(--font,'DM Sans',sans-serif);letter-spacing:.04em;text-transform:uppercase}
dialog.tv .tv-stake-btn:disabled{filter:saturate(.2) brightness(.85);opacity:.6;cursor:not-allowed}
dialog.tv .tg-card .tv-verdict.lose{color:#ff7a5a}
dialog.tv .tg-card .tv-verdict.push{color:#f3e3bd}
.tv-detail{margin:4px 0 8px;text-align:center;font:600 14px/1.4 var(--font,'DM Sans',sans-serif)}
.tg-chip.lost .icon{color:#ff7a5a}
@media (max-height:520px) and (min-aspect-ratio:1/1){
 dialog.tv{--pad:calc(76px + env(safe-area-inset-bottom))}
 dialog.tv[data-game=tali]{--pad:calc(70px + env(safe-area-inset-bottom))}
 dialog.tv[data-game=arm] .tg-pad{flex-direction:row;gap:14px;padding-top:8px}
 dialog.tv .tv-push{width:auto;min-width:180px}
 dialog.tv .tv-cmd{min-height:50px;font-size:20px}
 .tv-board{padding:6px 10px;gap:4px;width:min(70%,440px)}.tv-bones{min-height:34px}.tv-who b{font-size:21px}
 .tv-stakes{margin-bottom:6px}dialog.tv .tv-stake-btn{min-height:44px;flex-direction:row;gap:6px;font-size:19px}dialog.tv .tv-stake-btn small{display:none}
 dialog.tv .tg-card .tg-quote{display:none}
}