/* Shared spacing and controls, without changing game board coordinates or hit targets. */
:root{--pr-ink:#263044;--pr-paper:#fff5df;--pr-coral:#ff9b83;--pr-gap:clamp(16px,2.3vw,36px);--pr-content:1440px}
body.pr-modal-open{overflow:hidden}
dialog[data-game-ui]{color-scheme:light;overscroll-behavior:contain}
dialog[data-game-ui]::backdrop{background:#142028ce;backdrop-filter:blur(6px)}
dialog[data-game-ui] [data-game-close]{display:grid!important;place-items:center;flex:0 0 44px;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;padding:0!important;font:900 28px/1 Arial,sans-serif!important;color:var(--pr-ink)!important;background:var(--pr-coral)!important;border:3px solid var(--pr-ink)!important;border-radius:11px!important;box-shadow:0 3px 0 var(--pr-ink)!important;cursor:pointer;pointer-events:auto;position:relative;z-index:2;transition:background .15s ease,box-shadow .15s ease}
dialog[data-game-ui] [data-game-close]:hover{background:#ffbaa5!important}
dialog[data-game-ui] [data-game-close]:active{box-shadow:0 1px 0 var(--pr-ink)!important}
dialog[data-game-ui] :is(button,input,select):focus-visible{outline:3px solid #df9657;outline-offset:3px}
dialog[data-game-ui] :is(h2,h3){text-wrap:balance}
dialog[data-game-ui] :is(input,select){max-width:100%;min-height:42px}
dialog[data-game-ui] :is(button,input,select){touch-action:manipulation}
dialog[data-game-ui] :is(.uno-header,.bj-header,.rps-header,.ac-header,.ar-header,.md-header,.hr-head,.flc-top,.bs-header){height:auto;min-height:78px;gap:16px;padding:12px var(--pr-gap)}
dialog[data-game-ui] :is(.uno-header,.bj-header,.rps-header,.ac-header,.ar-header,.md-header,.hr-head,.flc-top,.bs-header){position:sticky;top:0;z-index:24}
#flc-dialog,#pp-dialog,#bs-dialog,#tf-dialog{inset:0;margin:0;border-radius:0;position:fixed}
:is(.uno-content,.bj-content,.rps-content,.md-content,.ac-content,.ar-content){width:100%;max-width:var(--pr-content);padding:var(--pr-gap);margin-inline:auto}
:is(.uno-menu,.bj-menu){max-width:1040px;margin:12px auto 28px;padding:clamp(20px,3vw,36px)}
:is(.uno-option,.bj-option,.md-modes article,.flc-modes article,.hr-option){border-radius:18px;box-shadow:5px 6px 0 #14263290}
:is(.uno-option,.bj-option){display:flex;flex-direction:column}
:is(.uno-option,.bj-option)>button:last-child{margin-top:auto}
:is(.uno-players,.bj-players){grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))}
.uno-table-center{min-height:clamp(175px,24vh,290px)}
.bj-bank{max-width:960px;padding:24px}
#rps-home,#rps-lobby{max-width:1040px;padding:clamp(20px,3vw,38px)}
.rps-hand{min-height:100px;display:grid;place-items:center}
.rps-choices{max-width:1040px;margin-inline:auto}
.md-board{max-width:min(1080px,calc((100dvh - 300px)*1.29));min-width:min(100%,600px)}
.md-card .md-back,.md-card svg{backface-visibility:hidden}
.md-card.md-open:not(.md-matched) svg{animation:pr-card-reveal .24s ease-out}
/* Horse Rush uses the same cartoon framing as the rest of the catalogue. */
#hr-dialog{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;background:#e7edd9;color:var(--pr-ink);overflow:auto}
.hr-wrap{padding:0 0 28px;max-width:none}.hr-head{background:#d9b985;border-bottom:4px solid var(--pr-ink)}.hr-head small{color:#4a493c}.hr-head h2{font-size:30px;letter-spacing:-1px}
.hr-wrap>:not(.hr-head){width:calc(100% - var(--pr-gap)*2);max-width:var(--pr-content);margin-inline:auto}.hr-menu{padding-top:30px}.hr-menu>p{max-width:700px;line-height:1.6}
.hr-option{background:var(--pr-paper);border:3px solid var(--pr-ink);padding:26px}.hr-option button:not(.hr-tap),.hr-footer button{background:#ffcf62;color:var(--pr-ink);border:2px solid var(--pr-ink);border-radius:10px;padding:10px 15px;font-weight:800;box-shadow:0 3px 0 var(--pr-ink)}
#hr-dialog :is(select,input){background:#fffcf3;color:var(--pr-ink);border:2px solid var(--pr-ink)}.hr-seat{background:#fff6df;border:2px solid var(--pr-ink)}.hr-code{color:#53694c}.hr-race-head strong{color:#466347}.hr-controls small{color:#50634b}.hr-track{border:3px solid var(--pr-ink);box-shadow:0 5px 0 #263044}.hr-lane{height:clamp(100px,14vh,150px)}.hr-lane span{color:#fffde6;text-shadow:1px 1px #263044}.hr-tap{background:#ffd16b;border:3px solid var(--pr-ink);border-bottom-width:6px}.hr-footer button{background:#fff5df}#hr-error{background:#ffe0d3;border:2px solid #a85d4d;color:#722e2a}#hr-result{color:#435e3d}
/* Fleet: use wide screens without letting individual squares grow excessively. */
.flc-home{max-width:var(--pr-content);padding:30px var(--pr-gap)}.flc-match{max-width:1540px;padding:20px var(--pr-gap)}.flc-boards{gap:clamp(18px,2vw,30px)}.flc-board-wrap{max-width:620px}.flc-setup{align-items:stretch}.flc-fleet-picker svg{height:40px}.flc-fleet-picker b{font-size:12px}.flc-fleet-picker small{font-size:10px}.flc-board-head h3{font-size:15px}.flc-board-note{font-size:12px}.flc-axis{font-size:14px}.flc-confirm{z-index:26}.flc-confirm,.flc-dice{inset:78px 0 0}.flc-dice-card,.flc-confirm>div{max-height:calc(100dvh - 110px);overflow:auto}
/* Keep the play surface and its controls in view on normal desktop heights. */
.bs-layout{max-width:1600px;grid-template-columns:280px minmax(0,1fr)}.bs-sidebar{display:block;border-right:2px solid var(--pr-ink)}.bs-main{margin:0;width:100%;padding:20px var(--pr-gap);max-width:none}#bs-board-wrap{max-width:min(720px,max(300px,calc(100dvh - 365px)))}.bs-level-heading h3{margin-bottom:8px}.bs-tools{margin-top:10px}#bs-tip{margin:13px auto 4px;min-height:0}.bs-help{margin:8px 0}
.pp-menu{padding-inline:var(--pr-gap)}.pp-levels,.pp-heading{max-width:1600px;margin-inline:auto}.pp-levels{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
/* The result screen always has its own working exit, including while waiting. */
.pr-result{padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}
.pr-result-card{padding-top:34px}.pr-result h2{display:block;text-align:center}.pr-result .pr-result-close{position:absolute;right:12px;top:12px;width:42px;height:42px;padding:0;display:grid;place-items:center;font-size:26px;line-height:1;background:#ffb59b;border:2px solid #263044;border-radius:11px;box-shadow:0 2px #263044}.pr-result-card>.pr-game{display:block;padding-inline:35px}.pr-result .pr-menu{box-shadow:none}.pr-confetti i{animation-iteration-count:3;animation-fill-mode:forwards}
/* Hub: matching preview sizes, aligned actions, and more useful wide-screen columns. */
.layout>main{max-width:1900px}.cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr))}.card.fast-click-card{display:flex;flex-direction:column;transition:box-shadow .18s,border-color .18s}.card.fast-click-card:hover{border-color:#879778;box-shadow:0 7px 22px #0003}.fast-click-card .card-body{display:flex;flex:1;flex-direction:column;gap:12px;padding:18px}.fast-click-card .card-body p{margin:0 0 4px;min-height:39px}.fast-click-card .play-fast-click{margin-top:auto;min-height:43px}.fast-click-card .fast-click-art{height:200px}.fast-click-card .card-name-art{max-width:53%;font-size:clamp(26px,2.25vw,40px);position:relative;z-index:1}.fast-click-card .game-preview{width:45%;height:135px;right:6px;bottom:10px;box-shadow:none;pointer-events:none;transition:transform .25s ease}.fast-click-card:hover .game-preview{transform:translateY(-4px) rotate(2deg)}.fast-click-card .bookmark{z-index:3;width:36px;height:36px}.blackjack-card .card-number{color:#fff5df}.card-top{flex-wrap:wrap;row-gap:8px}.play-badge{white-space:nowrap}.cards{align-items:stretch}
@keyframes pr-card-reveal{from{opacity:.3;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
@media(min-width:1400px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.flc-match{display:grid;grid-template-columns:240px minmax(0,1fr);gap:16px 22px}.flc-match-bar,.flc-players,.flc-log{grid-column:1/-1}.flc-setup{display:flex;flex-direction:column;margin-bottom:0;padding:14px}.flc-fleet-picker{grid-template-columns:1fr}.flc-fleet-picker button{display:grid;grid-template-columns:80px 1fr;align-items:center;text-align:left;gap:3px 8px}.flc-fleet-picker svg{grid-row:span 2}.flc-setup-actions{width:100%;grid-template-columns:1fr 1fr}.flc-boards{grid-column:2}.flc-setup[hidden]+.flc-boards{grid-column:1/-1}.flc-board-wrap{max-width:min(620px,calc(100dvh - 350px))}.bs-cover{width:160px}}
@media(max-width:850px){:is(.uno-content,.bj-content,.rps-content,.md-content,.ac-content,.ar-content){padding:18px 14px}.bs-layout{grid-template-columns:1fr}.bs-sidebar{border-right:0}.bs-main{padding:18px 14px}#bs-board-wrap{max-width:590px}.flc-fleet-picker b{font-size:10px}.flc-fleet-picker small{font-size:8px}.md-board{max-width:850px;min-width:0}.hr-lane{height:100px}.pp-levels{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.fast-click-card .card-name-art{font-size:31px}}
@media(max-width:600px){dialog[data-game-ui] :is(.uno-header,.bj-header,.rps-header,.ac-header,.ar-header,.md-header,.hr-head,.flc-top,.bs-header){padding:10px 12px;min-height:70px;gap:10px}.ar-header{flex-wrap:wrap}.hr-head h2{font-size:24px}.flc-boards{grid-template-columns:1fr}.flc-board-wrap{max-width:480px}.flc-match{padding:14px 12px}.flc-dice,.flc-confirm{inset:70px 0 0}.flc-dice-card,.flc-confirm>div{max-height:calc(100dvh - 94px)}.flc-board-card{padding:12px}.flc-fleet-picker svg{height:30px}.uno-players{grid-template-columns:repeat(2,minmax(0,1fr))}.hr-options{grid-template-columns:1fr}.hr-option{padding:20px}.pr-result-card{padding-inline:18px}.cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,265px),1fr))}.game-order{flex-wrap:wrap;justify-content:flex-start}.game-order select{max-width:100%}.fast-click-card .fast-click-art{height:190px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}dialog[data-game-ui] *,dialog[data-game-ui] *:before,dialog[data-game-ui] *:after,.fast-click-card,.fast-click-card .game-preview{animation:none!important;transition:none!important}}
@media(min-width:801px){#fast-click-dialog.game-shell{width:min(1280px,calc(100vw - 32px))}.game-shell .fc-arena{height:max(460px,calc(100dvh - 270px))}}
:is(.uno-menu,.bj-menu,#rps-home,#rps-lobby,.md-modes,.flc-modes,.hr-options){animation:pr-panel-enter .25s ease-out}
@keyframes pr-panel-enter{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:600px){dialog[data-game-ui] :is(.uno-header,.bj-header,.rps-header,.ac-header,.ar-header,.md-header,.hr-head,.flc-top,.bs-header){padding-top:max(10px,env(safe-area-inset-top))}.cp-hud,.rr-hud{top:max(16px,env(safe-area-inset-top))}}
@media(prefers-reduced-motion:reduce){:is(.uno-menu,.bj-menu,#rps-home,#rps-lobby,.md-modes,.flc-modes,.hr-options){animation:none}}

/* Fast Click gets a dedicated full-screen arcade stage. */
#fast-click-dialog.game-shell{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;overflow:hidden;background:#0b252b}
#fast-click-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto}
#fast-click-dialog .fc-header{padding:14px 28px;min-height:76px;box-sizing:border-box}
#fast-click-dialog .fc-header h2{margin:0;font-size:30px}
#fast-click-dialog .fc-arena{height:auto;min-height:0;border:0;background:radial-gradient(ellipse at 50% 40%,#205047 0%,#0b252b 75%);isolation:isolate}
#fast-click-dialog .fc-arena::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#95f5d819 1px,transparent 1px);background-size:28px 28px;z-index:-1}
#fast-click-dialog .fc-hud{top:18px;left:28px;right:28px;z-index:4;pointer-events:none}
#fast-click-dialog #fc-progress{font-size:24px;padding:12px 20px}
#fast-click-dialog #fc-timer{font-size:36px}
#fast-click-dialog #fc-targets{inset:110px 24px 20px}
#fast-click-dialog .fc-overlay{inset:104px 20px 12px;max-width:1180px;border:0;border-radius:0;box-shadow:none;padding:12px 32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;background:transparent;text-align:left;overflow-y:auto;align-items:center}
#fast-click-dialog .fc-overlay[hidden]{display:none}
#fast-click-dialog #fc-intro{max-width:550px;padding:12px 0 24px}
#fast-click-dialog .fc-hero-art{min-width:0;text-align:center;color:#95f5d8;font-size:11px;font-weight:800;letter-spacing:4px}
#fast-click-dialog .fc-hero-art svg{display:block;width:100%;max-height:44dvh;margin-bottom:16px}
#fast-click-dialog .fc-overlay .fc-kicker{color:#95f5d8;font-size:11px;line-height:1.6;letter-spacing:2px}
#fast-click-dialog .fc-overlay h3{color:#fff5d9;font-size:clamp(38px,5.5vw,76px);letter-spacing:-3px;line-height:1.02;margin:18px 0}
#fast-click-dialog .fc-overlay h3 span{color:#95f5d8}
#fast-click-dialog #fc-description{color:#c1d9d2;font-size:17px;line-height:1.6;max-width:440px;margin-bottom:26px}
#fast-click-dialog .fc-start{min-height:58px;min-width:240px;font-size:18px}
#fast-click-dialog .fc-result{color:#95f5d8;font-size:clamp(48px,7vw,90px);margin:18px 0}
#fast-click-dialog .fc-result span,#fast-click-dialog #fc-save-status{color:#c1d9d2}
#fast-click-dialog .fc-overlay:has(.fc-result:not([hidden])) h3{font-size:clamp(28px,3vw,44px)}
#fast-click-dialog .fc-bottom{padding:12px 28px;border-top:3px solid #102329;gap:16px}
#fast-click-dialog .fc-hint{margin:0;padding:0 28px 10px;background:#95f5d8}
@media(max-width:700px){#fast-click-dialog .fc-header{min-height:64px;padding:10px 16px}#fast-click-dialog .fc-header h2{font-size:24px}#fast-click-dialog .fc-hud{left:14px;right:14px;top:12px}#fast-click-dialog #fc-progress{font-size:20px;padding:10px 14px}#fast-click-dialog #fc-timer{font-size:28px}#fast-click-dialog #fc-targets{inset:96px 12px 12px}#fast-click-dialog .fc-overlay{inset:92px 14px 8px;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:12px;text-align:center}#fast-click-dialog .fc-hero-art{display:none}#fast-click-dialog #fc-intro{padding:4px 0 14px}#fast-click-dialog .fc-overlay h3{font-size:42px;letter-spacing:-1.5px;margin:12px 0}#fast-click-dialog #fc-description{font-size:14px;margin-bottom:18px}#fast-click-dialog .fc-bottom{padding:10px 14px}#fast-click-dialog #fc-account-note{display:none}#fast-click-dialog .fc-hint{padding:0 14px 8px;font-size:10px}}
@media(max-height:530px){#fast-click-dialog .fc-header{min-height:50px;padding:6px 16px}#fast-click-dialog .fc-header h2{font-size:22px}#fast-click-dialog .fc-hint{display:none}#fast-click-dialog .fc-bottom{padding:6px 16px}#fast-click-dialog .fc-overlay{inset:80px 16px 6px;align-items:start;justify-content:start}#fast-click-dialog #fc-intro{padding:0 0 12px}#fast-click-dialog .fc-overlay h3{font-size:32px;margin:8px 0}#fast-click-dialog #fc-description{font-size:13px;margin-bottom:10px}#fast-click-dialog .fc-start{min-height:44px;padding:8px 24px}#fast-click-dialog #fc-targets{top:88px}}
