/* One mode card contains its own difficulty controls and play action. */
.home-mode-grid .home-computer-option{display:flex;flex-direction:column;align-items:flex-start;gap:0;cursor:default;text-align:left}.home-mode-grid .home-computer-option:hover{transform:none}.home-computer-option .mode-title{margin:13px 0 5px;font-family:Outfit,sans-serif;font-weight:900}.home-computer-option .mode-caption{margin:0}.home-computer-option .speed-difficulty{width:100%;padding:0;background:none;border:0;border-radius:0;margin:18px 0 14px}.home-computer-option .speed-difficulty-label{font-size:8px;margin-bottom:8px}.home-computer-option .speed-difficulty-choices button{min-height:38px}.home-computer-option #soloMode.speed-play-button{display:flex;justify-content:space-between;align-items:center;gap:12px;flex:0 0 auto;width:100%;min-height:44px;margin-top:auto;border:1px solid #82bde9;border-radius:8px;background:#1a67a7;color:#f0faff;padding:11px 13px;font:800 10px 'DM Sans',sans-serif;letter-spacing:1px;cursor:pointer}.home-computer-option #soloMode.speed-play-button:hover{background:#247abd}.home-computer-option #soloMode:focus-visible{outline:3px solid #c1ebff;outline-offset:3px}
/* Empty, shuffling, dealt and redealt slots share the exact same geometry. */
html[data-game=speed] #tableTop{--speed-card-height:clamp(96px,13vw,145px)}
html[data-game=speed] #tableTop .card-row{grid-auto-rows:var(--speed-card-height);height:var(--speed-card-height);min-height:var(--speed-card-height);align-items:stretch}
html[data-game=speed] #tableTop :is(.playing-card,.card-placeholder){height:var(--speed-card-height);min-height:var(--speed-card-height);max-height:var(--speed-card-height);aspect-ratio:auto;box-sizing:border-box}
html[data-game=speed] #tableTop .centerline #gameMessage{height:42px;min-height:42px;max-height:42px;overflow:hidden}
html[data-game=speed] #tableTop .table-meta{min-height:52px}
html[data-game=speed] #tableTop .deck-status strong{min-width:2ch;font-variant-numeric:tabular-nums}

/* Keep the lobby top-aligned after removing its old hero and duplicate daily card. */
html[data-game=speed] #modeScreen{align-items:flex-start}
html[data-game=speed] #modeScreen .home-inner{margin:0 auto}
html[data-embedded=true][data-game=speed] #modeScreen{padding-top:18px}
html[data-embedded=true][data-game=speed] #modeScreen .home-section-heading{margin-top:0}
html[data-game=speed] .home-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:650px){html[data-game=speed] .home-mode-grid{grid-template-columns:1fr}}
/* Restore the deck's original portrait proportions, with stable slot heights. */
html[data-game=speed] #tableTop :is(.playing-card,.card-placeholder){width:calc(var(--speed-card-height)*.73);max-width:100%;justify-self:center;aspect-ratio:.73}
html[data-game=speed] #tableTop .card-row{max-width:calc(var(--speed-card-height)*2.92 + 60px);width:100%;gap:clamp(7px,2vw,20px);justify-items:center}
/* A shared exit is always available, independent of a mode's own header. */
.game-home-link{position:fixed;bottom:max(14px,env(safe-area-inset-bottom));right:16px;z-index:400;display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:10px 15px;border:1px solid #91c6ed;border-radius:10px;background:#10385f;color:#ecf8ff;font:800 13px 'DM Sans',sans-serif;text-decoration:none;box-shadow:0 5px 20px #03142760}
.game-home-link:hover{background:#1c5484}.game-home-link:focus-visible{outline:3px solid #c4efff;outline-offset:3px}html[data-game=hub] .game-home-link{display:none}

/* The menu uses its compact content height; exits remain above it and on play screens. */
/* Keep invisible animation targets without rendering persistent card backs. */
html[data-game=speed] .deck-stack{visibility:hidden}
.speed-board-nav{display:flex;justify-content:flex-start;margin:0 0 10px}
.speed-board-nav button{border:1px solid #81b7df;border-radius:8px;background:#123859;color:#e5f6ff;padding:9px 15px;min-height:40px;font:700 12px 'DM Sans',sans-serif;cursor:pointer}
#openingDeal.good-luck{display:flex;align-items:center;justify-content:center}
#openingDeal.good-luck>:not(.opening-deal-heading){display:none!important}
#openingDeal.good-luck .opening-deal-heading{font:900 clamp(32px,6vw,58px)/1.1 Outfit,sans-serif;letter-spacing:-1px;animation:speed-good-luck 1.5s ease both}
@keyframes speed-good-luck{0%{opacity:0;transform:translateY(6px)}17%,83%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){#openingDeal.good-luck .opening-deal-heading{animation:none}}html[data-motion=reduced] #openingDeal.good-luck .opening-deal-heading{animation:none}
