/* Small, optional layers. Nothing moves the betting controls during a hand. */
.move-guide{display:grid;gap:12px;margin-block:16px}
.move-guide section{padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--raised)}
.move-guide h3{font-size:16px;margin:0 0 6px}.move-guide p{font-size:14px;line-height:1.55;margin:0}
.session-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.session-summary>div{padding:14px;border:1px solid var(--line);border-radius:6px}
.session-summary strong,.session-summary span{display:block}.session-summary strong{font-size:22px}
.session-summary span{font-size:12px;color:var(--muted);margin-top:4px}
.story-break{min-height:44px;font-size:12px;text-align:left;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
@media(max-width:600px){
 .actions button small{display:block;font-size:12px;line-height:1.2;opacity:1;margin-top:2px}
 .actions button,.actions button.primary{padding:4px 2px}
}
@media(max-width:600px) and (max-height:700px){
 .stage:not([data-phase=finished]):not([data-phase=revealing]){height:clamp(222px,calc(100svh - 354px),292px)}
}
.hand-story{border-top:1px solid var(--line);background:var(--surface);padding:14px 18px;display:grid;gap:10px}
.hand-story[hidden]{display:none}.story-event strong{font:600 22px/1.1 var(--font-display);display:block}
.story-event p{font-size:12px;line-height:1.5;color:var(--muted);margin:5px 0 0}
.story-goal{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;min-height:48px;border:1px solid var(--line);border-radius:5px;padding:9px 12px}
.story-goal strong,.story-goal small{display:block}.story-goal strong{font-size:13px}.story-goal small{font-size:12px;color:var(--muted);margin-top:3px}
.net-result{display:inline-block;font-variant-numeric:tabular-nums;color:var(--text);font-weight:700}
.skill-tracks{display:grid;gap:10px;margin:18px 0}.skill-track{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;padding:14px;background:var(--raised);border:1px solid var(--line);border-radius:7px}
.skill-medal{width:44px;height:48px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);border-radius:50% 50% 40% 40%;font:600 23px var(--font-display);color:var(--muted)}
.skill-track.complete .skill-medal{background:#d8bb79;border-color:#e9d3a2;color:#302512}
.skill-track strong{font-size:15px}.skill-track p{font-size:12px;line-height:1.5;color:var(--muted);margin:5px 0}
.skill-track progress{width:100%;height:5px;accent-color:var(--america-red);display:block}
.skill-track small{display:block;font-size:12px;color:var(--muted);margin-top:6px}
.skill-board{margin:16px 0;text-align:center}.skill-board .hand-art{justify-content:center;gap:5px}
.skill-board small,.skill-holes small{display:block;font-size:12px;color:var(--muted);margin-bottom:9px}
.skill-holes{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:center;margin:16px 0}.skill-holes.single{grid-template-columns:1fr}
.skill-holes .hand-art{justify-content:center;gap:5px}.skill-holes .card,.skill-board .card{width:46px;height:63px;font-size:21px}
.skill-options{display:grid;gap:8px}.skill-options button{min-height:48px;text-align:left;padding:12px 16px}
.skill-options .correct{border-color:var(--accent);background:var(--raised);font-weight:700}
.skill-explanation{margin-top:14px;font-size:14px;line-height:1.55}.skill-explanation p{margin:8px 0 12px;color:var(--muted)}
.skill-explanation .modal-buttons{margin-top:12px}.skill-explanation:empty{display:none}
.earned-medal{width:60px;height:66px;display:grid;place-items:center;background:#d8bb79;color:#302512;border:3px double #856327;border-radius:50% 50% 40% 40%;font:600 30px var(--font-display);margin:8px 0 16px}
.puzzle-prompt{font:600 26px/1.1 var(--font-display);margin:16px 0}
.skill-best{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}.skill-best .hand-art{justify-content:center;gap:4px;margin:8px 0 14px}
.skill-best .card{width:39px;height:54px;font-size:18px}.skill-best small{font-size:12px;color:var(--muted)}
.rival-list{display:grid;gap:10px;margin:15px 0}.rival-card{border:1px solid var(--line);border-left:4px solid var(--rival);padding:14px;border-radius:6px;background:var(--raised)}
.rival-heading{display:flex;gap:12px;align-items:center}.rival-mark{height:44px;width:44px;border-radius:50%;display:grid;place-items:center;background:var(--rival);color:white;font:600 25px var(--font-display)}
.rival-card h3{font:600 23px var(--font-display)}.rival-card small{font-size:12px;color:var(--muted)}
.rival-card p{font-size:13px;line-height:1.6;margin-top:10px;color:var(--muted)}
.rival-card .rival-stack{color:var(--text);font-size:12px}
.seat.folded .nameplate{opacity:1}.seat.folded{opacity:1}.seat.folded .hole,.seat.folded .seat-action{opacity:.45}
.seat.eliminated .nameplate{opacity:.45}.seat.eliminated .hole{opacity:.3}
.skill-entry{margin-top:12px;min-height:48px;width:100%;text-align:left;font-size:13px;border-top:1px solid var(--line)}
#modal[open]{display:flex;flex-direction:column;overflow:hidden;padding:0}
#modal .modal-head{flex-shrink:0;background:var(--surface);z-index:3;padding:16px 20px;margin:0;border-bottom:1px solid var(--line)}
#modal-content{overflow-y:auto;min-height:0;padding:20px}
#start-skill{min-height:48px}
.challenge-meta{gap:12px}
.challenge-meta>span:last-child{text-align:right}
@media(max-width:600px){
 .game-toolbar>div{gap:0}.game-toolbar button{min-height:44px}.game-toolbar>div>button{padding-inline:7px;min-width:44px}
 .hand-story{padding:12px}.hand-story .story-event strong{font-size:21px}
 .skill-board .card,.skill-holes .card{width:39px;height:55px;font-size:19px}
 .skill-board .card .suit,.skill-holes .card .suit{font-size:23px}
 .skill-track{padding:12px;gap:10px}.puzzle-prompt{font-size:24px}
 #modal .modal-buttons button{min-height:48px}
 #modal-content{padding:16px}#modal .modal-head{padding:12px 16px}
}
@media(max-width:360px){.game-toolbar #room-label{font-size:11px}.game-toolbar>div>button{font-size:11px;padding-inline:5px}.skill-best .card{width:35px;height:49px}.skill-tracks{gap:8px}}
@media(max-width:600px) and (max-height:700px){
 .puzzle-prompt{margin:10px 0;font-size:23px}.skill-board,.skill-holes{margin:10px 0}
 .skill-board small,.skill-holes small{margin-bottom:6px}.skill-options{gap:6px}
 .skill-board .hand-art,.skill-holes .hand-art{margin:0}
}
