/* Illustrated activity tickets and compact category cards. */
.illustrated-icon{display:block;width:100%;aspect-ratio:1;background-image:url('assets/card-icons-v2.webp');background-size:300% 400%;background-position:var(--atlas-x) var(--atlas-y);background-repeat:no-repeat;filter:drop-shadow(0 .2cqw .15cqw #28547520);flex-shrink:0}
/* The engine leads on the right; only the artwork changes direction, never labels. */
.train .locomotive{order:2;transform:none;margin-left:-.6%;margin-right:0}
.home-scene .welcome{top:4%;height:27%;left:9%;width:82%}.home-scene .welcome-copy{padding:1cqw 1.6cqw}.home-scene .welcome h2{font-size:2.65cqw}.home-scene .welcome p{font-size:1.15cqw;margin-top:.55em}
.home-scene .station-menu{top:35%;bottom:auto;left:5%;width:90%;padding:1.2cqw 1.4cqw 1cqw;border-radius:1.8cqw;background:linear-gradient(120deg,#fffffff8,#f0fafff5);box-shadow:0 .5cqw 0 #7fbada44,0 1cqw 2cqw #16476e25}
.home-scene .trip-options{padding-bottom:.9cqw;gap:1cqw}.home-scene .game-grid{gap:.85cqw;margin-top:1cqw}.home-scene .menu-note{margin-top:1.15cqw;font-size:.95cqw}
.game-card{--card-wash:#e8fbcf;--card-accent:#77be32;--card-shadow:#c2df9f;--card-ink:#427719;position:relative;min-height:6.15cqw;padding:.65cqw .85cqw .7cqw .55cqw;gap:.7cqw;border:2px solid #fff;border-radius:1.1cqw;background:linear-gradient(110deg,var(--card-wash),#fff 62%);outline:1px solid #c6e1ec;box-shadow:0 .28cqw 0 var(--card-shadow),0 .4cqw .65cqw #164e7614;align-items:center;overflow:visible;transition:transform .14s,box-shadow .14s}
.game-card:hover{border-color:#fff;outline-color:var(--card-accent);transform:translateY(-.25cqw);box-shadow:0 .4cqw 0 var(--card-shadow),0 .7cqw 1cqw #164e7625}.game-card:active{transform:translateY(.1cqw);box-shadow:0 .1cqw 0 var(--card-shadow)}
.game-card.card-1{--card-wash:#dff4ff;--card-accent:#44abed;--card-shadow:#abd5ed;--card-ink:#0875af}.game-card.card-2{--card-wash:#f0e2ff;--card-accent:#b581e4;--card-shadow:#d4b3ed;--card-ink:#8150b1}.game-card.card-3{--card-wash:#fff0bb;--card-accent:#edb32d;--card-shadow:#e8cd80;--card-ink:#9b6e00}.game-card.card-4{--card-wash:#ffe7ee;--card-accent:#ed8cae;--card-shadow:#edb5c8;--card-ink:#b74c76}.game-card.card-5{--card-wash:#d8f8f2;--card-accent:#5fcbb7;--card-shadow:#9bdbd2;--card-ink:#198774}
.game-card .card-icon{position:relative;width:5cqw;height:5cqw;border:0;border-radius:0;background:none;box-shadow:none;flex-shrink:0;display:block;padding:0}.card-number{position:absolute;left:0;bottom:0;background:#fff8d8;border:1px solid #e7c263;color:#866009;min-width:1.2cqw;padding:.12cqw .3cqw;border-radius:.4cqw;font-size:.65cqw;font-weight:950;box-shadow:0 2px 3px #3c4e4d15}
.game-card .card-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:.28cqw}.game-card b{font-size:1.22cqw;line-height:1.12;letter-spacing:-.025em;color:#16316b;font-weight:950}.game-card small{font-size:.82cqw;line-height:1.25;margin:0;color:#506d88}.card-footer{display:flex;justify-content:space-between;align-items:center;gap:.5cqw;margin-top:.2cqw}.game-card .stars{font-size:.9cqw;margin:0;letter-spacing:.08em;color:#e0a600;white-space:nowrap}.card-play{font-size:.78cqw;font-weight:950;color:var(--card-ink);display:inline-flex;align-items:center;gap:.3cqw;background:#ffffffbd;border:1px solid var(--card-shadow);border-radius:2cqw;padding:.2cqw .5cqw;white-space:nowrap}.card-play .icon{width:1em;height:1em}
.learn-scene .learn-intro{top:3%;left:16%;right:16%;height:23%;gap:1cqw}.learn-scene .learn-intro .vali{width:13%;height:100%}.learn-scene .learn-intro .paper{padding:1.15cqw 1.6cqw;border-radius:1.4cqw;box-shadow:0 .3cqw 0 #bddff5,0 .6cqw 1cqw #18507718}.learn-intro h2{font-size:2.05cqw}.learn-intro p{font-size:1.2cqw;line-height:1.35;margin-top:.4cqw}
.learn-grid{position:absolute;left:11%;right:11%;top:31%;bottom:auto;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:1.2cqw}
.learn-grid .learn-card{--ink:#286218;--edge:#8bc94f;--wash:#edfacf;position:relative;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:1cqw;flex:0 0 calc(33.333% - .9cqw);width:calc(33.333% - .9cqw);min-height:10cqw;padding:1.05cqw .95cqw;border:2px solid white;border-radius:1.3cqw;outline:1px solid var(--edge);background:linear-gradient(115deg,var(--wash),#fffdf7 74%);box-shadow:0 .35cqw 0 var(--edge),0 .7cqw 1.1cqw #28496520;color:var(--ink)}
.learn-count-2 .learn-card,.learn-count-4 .learn-card{flex-basis:calc(50% - .8cqw);width:calc(50% - .8cqw)}
.learn-grid .learn-card.cat-verb{--ink:#0865ac;--edge:#72bce6;--wash:#ddf3ff}.learn-grid .learn-card.cat-adjective{--ink:#8344b1;--edge:#bf91e4;--wash:#efe1ff}.learn-grid .learn-card.cat-determiner{--ink:#976600;--edge:#e7bd56;--wash:#fff1c5}.learn-grid .learn-card.cat-pronoun{--ink:#ad4977;--edge:#e9a1c2;--wash:#ffe1ee}.learn-grid .learn-card.cat-adverb{--ink:#187d70;--edge:#75ccbd;--wash:#d7f6ef}
.learn-art{width:5.6cqw;flex-shrink:0;align-self:center}.learn-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:.55cqw}.learn-grid h2{font-size:1.6cqw;line-height:1.05;font-weight:950;letter-spacing:-.03em}.learn-grid p{font-size:1.05cqw;text-align:left;max-width:100%;line-height:1.32;color:#354f73}.example-chips{display:flex;gap:.3cqw;flex-wrap:wrap}.example-chips>span{font-size:.88cqw;font-weight:900;background:#ffffffde;border:1px solid #ffffff;border-radius:.45cqw;padding:.22cqw .45cqw;color:var(--ink);box-shadow:0 1px 2px #28496512}.learn-play{bottom:7%;font-size:1.35cqw}
.riddle-options .category-card .illustrated-icon{width:6.3cqw;max-height:68%;margin:0 auto}.riddle-options .category-card{gap:.3cqw;padding:.7cqw}.riddle-options .category-card strong{font-size:1.55cqw}
@media(max-aspect-ratio:1/1){
.home-scene .welcome{top:auto;left:auto;width:94%;height:165px}.home-scene .welcome-copy{padding:12px;border-radius:16px}.home-scene .welcome h2{font-size:23px}.home-scene .welcome p{font-size:12px}.home-scene .welcome>.vali{height:140px}.home-scene .station-menu{position:relative;inset:auto;width:94%;padding:12px;margin:0 auto 20px;border-radius:20px}.home-scene .trip-options{gap:10px;padding-bottom:12px}.home-scene .game-grid{gap:11px;margin-top:13px;grid-template-columns:1fr 1fr}.game-card{min-height:130px;padding:10px;gap:5px;border-radius:14px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:flex-start}.game-card .card-icon{width:62px;height:62px;margin-top:-2px}.card-number{font-size:9px;min-width:17px;padding:1px 4px;border-radius:5px}.game-card .card-copy{display:flex;flex:1;flex-basis:auto;gap:6px;align-items:center;width:100%}.game-card b{font-size:14px;line-height:1.12}.game-card small{display:none}.card-footer{gap:8px;margin-top:auto;justify-content:center;width:100%}.game-card .stars{font-size:12px}.card-play{font-size:10px;padding:3px 7px;border-radius:15px;gap:4px}.home-scene .menu-note{font-size:11px;line-height:1.45;margin-top:16px}.learn-scene .learn-intro{position:relative;inset:auto;width:94%;height:150px;gap:9px}.learn-scene .learn-intro .vali{width:21%;height:120px}.learn-scene .learn-intro .paper{padding:12px;border-radius:16px}.learn-intro h2{font-size:21px}.learn-intro p{font-size:12px;line-height:1.35;margin-top:6px}.learn-grid{position:relative;inset:auto;width:91%;margin:8px auto 0;gap:13px;display:flex;flex-direction:column}.learn-grid .learn-card,.learn-count-2 .learn-card,.learn-count-4 .learn-card{width:100%;flex-basis:auto;min-height:112px;flex-direction:row;gap:13px;padding:13px;border-radius:16px;border-width:2px}.learn-art{width:76px}.learn-copy{gap:7px}.learn-grid h2{font-size:20px}.learn-grid p{font-size:13px;line-height:1.3}.example-chips{gap:5px}.example-chips>span{font-size:11px;padding:3px 6px;border-radius:6px}.learn-play{position:relative;inset:auto;margin:24px auto;font-size:16px;transform:none;display:flex}.riddle-options .category-card .illustrated-icon{width:70px;max-height:none}.riddle-options .category-card{padding:10px;gap:6px}.riddle-options .category-card strong{font-size:16px}
}

.illustrated-icon{clip-path:inset(3% 0 3% 0)}.illustrated-icon.art-7{clip-path:inset(3% 0 3% 9%)}

/* Question locomotives travel across the whole station, not only their own width. */
.question-engine.arriving{animation:question-arrival 1.1s ease-out both}
.question-engine.leaving{animation:question-departure 1.4s ease-in forwards}
@keyframes question-arrival{from{transform:translateX(-105cqw)}to{transform:translateX(0)}}
@keyframes question-departure{to{transform:translateX(105cqw)}}
@media(prefers-reduced-motion:reduce){.question-engine.arriving,.question-engine.leaving{animation:none}}

/* Compact menu approved from the visual proposal. */
.exit-game{display:inline-flex;align-items:center;gap:.4cqw;padding:.45cqw .9cqw;border:2px solid #b5e2ff;border-radius:2cqw;background:#fff;color:#0753ac;text-decoration:none;font-size:1.05cqw;font-weight:900;white-space:nowrap}
.exit-game:hover{background:#e1f3ff}.exit-game:focus-visible{outline:4px solid #ffca20;outline-offset:3px}
.home-panel{position:absolute;top:15%;left:6%;width:88%;padding:1.2cqw 1.4cqw 1cqw;background:linear-gradient(120deg,#fffffff9,#f4fbfff7);border:3px solid white;border-radius:2cqw;box-shadow:0 .7cqw 1.8cqw #16476e38}
.home-scene .welcome{position:relative;inset:auto;width:100%;height:6.2cqw;justify-content:flex-start;gap:1.1cqw;padding:0 1.3cqw}
.home-scene .welcome>.vali{order:-1;align-self:center;width:6cqw;height:6.7cqw}
.home-scene .welcome-copy{width:auto;flex:1;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.home-scene .welcome .eyebrow{display:none}
.home-scene .welcome h2{font-size:2.45cqw;line-height:1.1;white-space:nowrap}
.home-scene .welcome p{font-size:1.25cqw;margin-top:.35cqw}
.home-scene .station-menu{position:relative;inset:auto;width:100%;padding:.8cqw 0 0;border:0;border-radius:0;background:none;box-shadow:none}
.home-scene .trip-options{padding:.6cqw .7cqw .9cqw;border-top:1px solid #d8ecfb;gap:1cqw}
.home-scene .trip-options label{display:flex;align-items:center;gap:.65cqw;font-size:1.05cqw}
.home-scene .trip-options select{margin:0;font-size:1.05cqw;padding:.55cqw .65cqw}
.home-scene .trip-options legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.home-scene .mode{font-size:1.05cqw;padding:.6cqw .8cqw;margin-right:0}
.home-scene .all-aboard{font-size:1.15cqw;padding:.6em 1em}
.home-scene .game-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:.8cqw;gap:1cqw}
.home-scene .game-card{min-height:7.3cqw;padding:.6cqw .65cqw;gap:.55cqw}
.home-scene .game-card .card-icon{width:5.4cqw;height:5.4cqw}
.home-scene .game-card b{font-size:1.22cqw}
.home-scene .game-card small{font-size:.85cqw;line-height:1.2}
.home-scene .game-card .stars{font-size:1.05cqw}
.home-scene .card-play{font-size:.85cqw;padding:.3cqw .55cqw}
.home-scene .menu-note{border-top:1px solid #d8ecfb;padding-top:.7cqw;margin-top:1cqw;font-size:.85cqw;line-height:1.4}
@media(max-aspect-ratio:1/1){
.exit-game{font-size:12px;padding:7px 10px;gap:5px;border-radius:20px}.exit-game .icon{width:16px;height:16px}
.home-panel{position:relative;inset:auto;width:94%;margin:18px auto;padding:13px;border-radius:23px}
.home-scene .welcome{height:auto;min-height:95px;padding:0;gap:9px;width:100%}
.home-scene .welcome>.vali{width:65px;height:85px}
.home-scene .welcome-copy{padding:0;width:auto}.home-scene .welcome h2{font-size:21px;white-space:normal}.home-scene .welcome p{font-size:12px;margin-top:5px}
.home-scene .station-menu{width:100%;margin:0;padding:8px 0 0}
.home-scene .trip-options{padding:10px 0;gap:10px}.home-scene .trip-options label{font-size:12px;gap:8px}.home-scene .trip-options select{font-size:12px;padding:8px;max-width:65vw}
.home-scene .mode{font-size:13px;padding:8px}.home-scene .all-aboard{font-size:14px}
.home-scene .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.home-scene .game-card{min-height:130px;padding:10px;gap:6px}.home-scene .game-card .card-icon{width:60px;height:60px}.home-scene .game-card b{font-size:14px}.home-scene .game-card .stars{font-size:12px}.home-scene .card-play{font-size:10px;padding:3px 6px}.home-scene .menu-note{font-size:11px;margin-top:15px;padding-top:12px}
}
