/* Progressive enhancement: without JS all game panels remain readable. */
.game-card-toggle { display:flex; align-items:center; gap:12px; width:100%; padding:10px; border:0; color:var(--ink); background:transparent; text-align:left; font:900 1.2rem/1.1 "Outfit",sans-serif; cursor:pointer; }
.game-toggle-name small { display:block; margin-top:5px; font:800 .65rem/1.3 "Outfit",sans-serif; opacity:.65; }
.game-toggle-symbol { margin-left:auto; }
.game-card-panel { min-width:0; }
.game-accordion.game-grid { display:flex; gap:12px; align-items:stretch; }
.game-accordion > .game-card { display:block; flex:0 0 110px; min-width:0; height:500px; min-height:0; margin:0; padding:0; border-radius:26px; cursor:default; transform:none; transition:flex-grow 650ms cubic-bezier(.2,.75,.2,1),flex-basis 650ms cubic-bezier(.2,.75,.2,1),box-shadow 200ms; }
.game-accordion > .game-card.is-expanded { flex:1 1 0; }
.game-accordion > .game-card:hover { transform:none; box-shadow:0 14px 36px #02082244; }
.game-accordion > .game-card::after { display:none; }
.game-accordion .game-card-toggle { position:absolute; z-index:5; inset:0; display:flex; flex-direction:column; justify-content:flex-start; width:100%; height:100%; padding:26px 12px; border-radius:24px; }
.game-accordion .game-toggle-number { color:var(--accent-two); font:900 .8rem "Outfit",sans-serif; }
.game-accordion .game-toggle-name { writing-mode:vertical-rl; text-orientation:mixed; margin:auto; font-size:1.6rem; }
.game-accordion .game-toggle-name small { font-size:.7rem; margin:8px 0 0; }
.game-accordion .game-toggle-symbol { margin:0; font:400 28px/1 "Outfit",sans-serif; }
.game-accordion .is-expanded .game-card-toggle { height:90px; inset:0 0 auto; flex-direction:row; align-items:center; padding:20px 26px; }
.game-accordion .is-expanded .game-toggle-name { writing-mode:horizontal-tb; margin:0; font-size:1.8rem; }
.game-accordion .is-expanded .game-toggle-name small { margin:4px 0 0; font-size:.65rem; }
.game-accordion .is-expanded .game-toggle-number { display:none; }
.game-accordion .is-expanded .game-toggle-symbol { margin-left:auto; transform:rotate(45deg); }
.game-accordion .game-card-toggle:focus-visible { outline:3px solid var(--ink); outline-offset:-6px; }
.game-accordion .game-card-panel { position:absolute; inset:90px 0 0; display:flex; flex-direction:column; align-items:stretch; gap:12px; padding:0 26px 24px; opacity:0; visibility:hidden; transform:translateY(12px); transition:opacity 200ms,transform 350ms,visibility 200ms; }
.game-accordion .is-expanded .game-card-panel { opacity:1; visibility:visible; transform:none; transition:opacity 300ms 200ms,transform 400ms 150ms,visibility 0ms; }
.game-accordion .card-topline { display:none; }
.game-accordion .card-visual { position:absolute; top:0; right:24px; width:160px; height:135px; margin:0; }
.game-accordion .card-content { display:flex; flex-direction:column; flex:1; padding:130px 0 0; width:100%; min-width:0; }
.game-accordion .card-content > .kicker, .game-accordion .card-content > h2 { display:none; }
.game-accordion .description { max-width:34rem; font-size:1rem; margin:0; }
.game-accordion .tags { margin-top:12px; }
.game-accordion .play-button { margin-top:auto; align-self:flex-start; text-decoration:none; }
.game-accordion .personal-progress { margin:12px 0; }
@media (min-width:1100px) { .game-accordion > .game-card { flex-basis:160px; } .game-accordion .card-visual { width:210px; height:170px; } .game-accordion .card-content { padding-top:155px; } }
@media (max-width:767px) {
 .game-accordion.game-grid { flex-direction:column; }
 .game-accordion > .game-card { flex:0 0 auto; width:100%; height:82px; border-radius:20px; transition:height 550ms cubic-bezier(.2,.75,.2,1); }
 .game-accordion > .game-card.is-expanded { flex:0 0 auto; height:490px; }
 .game-accordion .game-card-toggle, .game-accordion .is-expanded .game-card-toggle { inset:0 0 auto; flex-direction:row; align-items:center; height:82px; padding:16px 20px; }
 .game-accordion .game-toggle-name, .game-accordion .is-expanded .game-toggle-name { writing-mode:horizontal-tb; margin:0; font-size:1.4rem; }
 .game-accordion .game-toggle-name small { margin:4px 0 0; font-size:.6rem; }
 .game-accordion .game-toggle-number { display:none; }
 .game-accordion .game-toggle-symbol, .game-accordion .is-expanded .game-toggle-symbol { margin-left:auto; }
 .game-accordion .game-card-panel { inset:82px 0 0; padding:0 20px 20px; }
 .game-accordion .card-visual { top:0; right:20px; width:145px; height:120px; }
 .game-accordion .card-content { padding-top:125px; }
 .game-accordion .description { font-size:.92rem; }
}
@media (prefers-reduced-motion:reduce) { .game-accordion > .game-card, .game-accordion .game-card-panel, .game-accordion .is-expanded .game-card-panel { transition:none; } }
.game-accordion .is-expanded .game-toggle-symbol { visibility:hidden; }

.game-accordion > .game-card.is-expanded:not(.game-card--coming-soon) { cursor: pointer; }
/* Lower cards, preserving the original illustration and content sizing. */
@media(min-width:768px){
 .game-home .game-accordion>.game-card{height:400px}
}

/* Compact mobile tiles grow with their content, including player progress. */
@media(max-width:767px){
 .game-home .game-accordion{gap:10px}
 .game-home .game-accordion>.game-card{height:68px;border-radius:18px}
 .game-home .game-accordion>.game-card.is-expanded{height:auto}
 .game-home .game-accordion .game-card-toggle{height:68px;padding:12px 16px}
 .game-home .game-accordion .game-toggle-name{font-size:1.2rem}
 .game-home .game-accordion .game-toggle-name small{font-size:.6rem}
 .game-home .game-accordion .game-card-panel{inset:auto;padding:0 16px 16px}
 .game-home .game-accordion .is-expanded .game-card-panel{position:relative;margin-top:68px}
 .game-home .game-accordion .card-visual{top:0;right:16px;width:80px;height:68px}
 .game-home .game-accordion .card-content{padding-top:0}
 .game-home .game-accordion .description{min-height:68px;padding-right:92px;font-size:.85rem;line-height:1.45}
 .game-home .game-accordion .tags{gap:5px;margin-top:8px}
 .game-home .game-accordion .tags span{padding:5px 8px;font-size:.65rem}
 .game-home .game-accordion .personal-progress{margin:10px 0}
 .game-home .game-accordion .play-button{min-height:44px;margin-top:14px;padding:10px 16px;font-size:.85rem}
 .game-home .game-accordion .card-number{font-size:5rem}
}