html,body{overflow-x:clip}
.sol-card-size{display:none}
@media(max-width:550px){.sol-card-size{display:inline-block}}

/* Wider Solitaire cards scroll inside their own table, never the page. */
.sol-mobile-tip{margin:10px 0 12px;color:#c6d9ce;font-size:12px;line-height:1.6}.sol-card-size{min-height:44px}.sol-table:focus-visible{outline:3px solid #c5ff76;outline-offset:2px}
@media(max-width:550px){.sol-toolbar{flex-wrap:wrap;gap:7px}.sol-toolbar button{padding:9px 11px;min-height:44px;font-size:12px}.sol-moves{font-size:12px}.sol-table.sol-large{--cardh:80px!important;--offset:27px!important;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-color:#a8d6a0 #1d4035;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.sol-table.sol-large .sol-top,.sol-table.sol-large .sol-columns{min-width:400px;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.sol-table.sol-large .sol-rank{font-size:18px;left:4px;top:4px;gap:2px}.sol-table.sol-large .sol-rank span{font-size:15px}.sol-table.sol-large .sol-suit{font-size:32px;inset:22px 0 0}.sol-table.sol-large .sol-caption{font-size:8px}.sol-table.sol-large .sol-back{font-size:22px}.sol-table.sol-large .sol-card{border-radius:6px}.sol-mobile-tip[hidden]{display:none}}
/* Landscape racing keeps the complete road and controls together. */
@media(orientation:landscape) and (max-height:550px) and (min-width:550px){
dialog.race-dialog,dialog.race-dialog.game-expanded{position:fixed;inset:0;margin:0;width:100vw!important;max-width:none!important;height:100dvh;max-height:100dvh;padding:8px 16px;border:0;border-radius:0;overflow:auto}
.race-dialog .modalhead,.race-dialog.game-expanded .modalhead{position:static;top:auto;min-height:38px;height:38px;padding:0;margin:0;gap:12px}.race-dialog .modalhead h2{font-size:20px;margin:0}.race-dialog .instructions,.race-dialog .extra-note{display:none}.race-dialog .game-audio{position:absolute;top:54px;right:16px;width:230px;max-width:42vw;justify-content:flex-end;margin:0;gap:8px;height:36px}.race-dialog .game-audio button{min-height:34px;padding:6px 9px;font-size:11px}.race-dialog .game-audio input{width:65px}.race-dialog .game-audio label{font-size:10px}
.race-dialog #game,.race-dialog.game-expanded #game{width:100%;max-width:none;height:calc(100dvh - 62px);display:grid;grid-template-columns:minmax(0,1fr) 230px;grid-template-rows:105px 58px minmax(28px,1fr) 44px;column-gap:18px;row-gap:4px;align-items:center;margin:8px 0 0}
.race-dialog .race-canvas,.race-dialog.game-expanded .race-canvas{grid-column:1;grid-row:1/5;width:auto;height:min(440px,calc(100dvh - 62px));min-width:0;max-width:100%;max-height:100%;margin:auto;justify-self:center;object-fit:contain;aspect-ratio:4/5}
.race-dialog .race-dashboard{grid-column:2;grid-row:1;align-self:end;width:100%;padding:8px 4px;gap:4px;margin:0}.race-dialog .race-dashboard small{font-size:8px;letter-spacing:0}.race-dialog .race-dashboard strong{font-size:11px}.race-dialog .race-controls{grid-column:2;grid-row:2;display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:5px;width:100%;margin:0}.race-dialog .race-controls button{padding:9px 3px;min-height:44px;font-size:11px}.race-dialog .status{grid-column:2;grid-row:3;font-size:11px;margin:0;line-height:1.4}.race-dialog .restart{grid-column:2;grid-row:4;min-height:40px;padding:10px 16px;margin:0;width:100%;font-size:12px}
}
@media(orientation:landscape) and (max-height:350px) and (min-width:550px){.race-dialog #game,.race-dialog.game-expanded #game{grid-template-rows:91px 45px minmax(20px,1fr) 38px;row-gap:2px}.race-dialog .game-audio{top:48px}.race-dialog .race-dashboard strong{font-size:10px}.race-dialog .restart{min-height:35px;padding:7px}.race-dialog .race-controls button{min-height:40px}}