.games-unit-select{display:block;width:100%;max-width:100%;min-height:48px;margin-top:8px;padding:12px;border:1px solid var(--border,#dce0e8);border-radius:12px;background:var(--surface,#fff);color:var(--ink);font:inherit}
.learning-game{--lg-teal:#08796e;--lg-navy:#103f59;max-width:880px;margin:auto;overflow-wrap:anywhere;color:var(--ink);font-size:16px}
.learning-game *{box-sizing:border-box}.learning-game h3{font-size:clamp(24px,4vw,34px);line-height:1.2;margin:20px 0}.learning-game p{line-height:1.6}
.learning-game button{min-height:48px;padding:12px 18px;border-radius:14px;border:2px solid #b8cbd0;background:var(--surface,#fff);color:var(--ink);font:inherit;font-weight:700;cursor:pointer;white-space:normal;overflow-wrap:anywhere;max-width:100%}
.learning-game button:hover:not(:disabled){border-color:var(--lg-teal);background:#e5f6f1;color:#103f59}.learning-game button:disabled{opacity:.5;cursor:default}
.learning-game button:focus-visible,.learning-game input:focus-visible,.learning-game summary:focus-visible{outline:3px solid #bd790a;outline-offset:3px}
.learning-game h3:focus,.lg-feedback:focus{outline:2px solid var(--lg-teal);outline-offset:5px}
.lg-kicker{font-size:12px;letter-spacing:.12em;font-weight:800;color:var(--lg-teal)}.lg-welcome,.lg-finish{padding:clamp(16px,4vw,32px);border-radius:22px;background:linear-gradient(125deg,#e5f6f1,#fff5db);color:#103f59;border:1px solid #b8cbd0}
.lg-facts,.lg-top,.lg-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.lg-facts span{padding:7px 12px;background:#fff;border-radius:20px;font-size:14px;color:#103f59}.lg-top{justify-content:space-between;font-weight:700}
.learning-game progress{width:100%;height:13px;accent-color:var(--lg-teal);margin-top:12px}.lg-prompt{padding:22px;border-radius:18px;background:var(--surface-2,#f2f6f8);border-left:5px solid var(--lg-teal);line-height:1.7;font-size:19px;margin:20px 0}
.lg-track{display:flex;flex-wrap:wrap;gap:8px;min-height:86px;padding:16px;border:2px dashed #a5bdc5;border-radius:16px;margin:18px 0}.lg-car{display:inline-flex;gap:8px;align-items:center;border-radius:12px;padding:10px 13px;background:#103f59;color:#fff}.lg-car b{font-size:12px;color:#ffe4a1}
.lg-tiles,.lg-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.lg-tiles button{text-align:left}.lg-choices button{min-height:88px;font-size:18px}.lg-categorysort .lg-choices button{border-top:7px solid #08796e}.lg-categorysort .lg-choices button:nth-child(2){border-top-color:#a76c09}
.lg-actions{margin:18px 0}.learning-game [data-action=start],.learning-game [data-action=next],.learning-game [data-action=check],.learning-game button[type=submit]{background:#103f59;color:#fff;border-color:#103f59}
.lg-clue,.lg-wordhint{padding:12px;border-radius:12px;background:#fff5db;color:#103f59}.learning-game form{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}.learning-game label{width:100%;font-weight:700}.learning-game input{min-width:0;flex:1 1 180px;width:100%;padding:14px;border:2px solid #b8cbd0;border-radius:12px;font:inherit;background:var(--surface,#fff);color:var(--ink)}
.lg-feedback{margin:22px 0;padding:18px;border:2px solid #137663;border-radius:16px;background:#effbf5;color:#124534}.lg-feedback.is-wrong{border-color:#b77816;background:#fff7e7;color:#65400e}.lg-score{font-size:46px;font-weight:800;margin:12px 0}.lg-review{margin-top:24px}.lg-review summary{cursor:pointer;font-weight:700;padding:14px}.lg-review li{padding:12px;border-bottom:1px solid #b8cbd0}.lg-review ol{padding-left:24px}
@media(max-width:540px){.lg-choices,.lg-tiles{grid-template-columns:minmax(0,1fr)}.lg-prompt{padding:16px;font-size:17px}.lg-actions button{flex:1 1 130px}.lg-storyorder .lg-car{width:100%}.learning-game{font-size:15px}.lg-facts{gap:6px}.lg-facts span{font-size:12px}}

.lg-prompt{white-space:pre-line}.study-hub .learning-game{margin:24px auto;--ink:#123447;--surface:#fff;--surface-2:#f2f6f8;min-width:0}

/* Three-slice wagon artwork keeps the wheels round while the centre stretches. */
.lg-train-scroll{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:auto;border:2px dashed #9bbac3;border-radius:18px;padding:18px 12px 10px;background:linear-gradient(#edf9fa,#fff);max-width:100%}
.lg-train-row{display:flex;align-items:flex-end;gap:0;width:max-content;min-width:100%;padding:4px 4px 8px;border-bottom:5px double #758a91}
.lg-locomotive{width:190px;height:auto;flex:0 0 190px;display:block;align-self:flex-end;margin-bottom:-1px}
.learning-game .lg-wagon{position:relative;isolation:isolate;display:inline-grid;place-items:center;flex:none;width:max-content;min-width:170px;max-width:350px;height:118px;padding:27px 35px 53px;border:0;border-radius:0;background:transparent;color:#092e41;font-size:17px;font-weight:800;text-align:center;line-height:1.2;white-space:normal;overflow-wrap:anywhere;vertical-align:bottom;box-shadow:none}
.learning-game .lg-wagon::before{content:'';position:absolute;inset:0;z-index:-1;border:solid transparent;border-width:0 70px;border-image:url('../assets/games/sentence-wagon.png') 0 500 fill / 0 70px / 0 stretch;pointer-events:none}
.learning-game .lg-wagon>span{max-width:280px;position:relative;z-index:1}
.learning-game button.lg-wagon:hover:not(:disabled){background:transparent;color:#092e41;filter:brightness(1.07);transform:translateY(-3px)}
.learning-game button.lg-wagon:focus-visible{outline:3px solid #bd790a;outline-offset:1px;border-radius:10px}
.lg-wagon-number{position:absolute;top:-1px;left:50%;transform:translateX(-50%);background:#103f59;color:white;border-radius:12px;font-size:12px;padding:3px 9px}
.lg-wagon-yard{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:center;gap:16px 10px;padding:12px 0}
.lg-platform-hint{max-width:240px;align-self:center;font-size:15px;margin:0 20px;color:#355a69}.lg-rail-help{font-size:13px;color:#4e6d7b;margin:8px 0}
@media(max-width:540px){.lg-locomotive{width:155px;flex-basis:155px}.learning-game .lg-wagon{max-width:280px;min-width:160px;height:108px;padding:25px 30px 48px;font-size:16px}.lg-wagon-yard{gap:10px}.lg-platform-hint{max-width:130px;font-size:13px;margin:0 10px}}
@media(prefers-reduced-motion:reduce){.learning-game button.lg-wagon{transition:none;transform:none!important}}

/* The original sign is blank; readable, selectable labels stay in the DOM. */
.lg-stations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:20px 0;align-items:stretch}
.learning-game .lg-station{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;padding:12px 12px 18px;border:2px solid #a9c9cb;border-radius:22px;background:linear-gradient(#effafb,#fff);color:#103f59;box-shadow:0 5px 14px #103f5910;transition:transform .18s,border-color .18s}
.learning-game .lg-station:hover:not(:disabled){transform:translateY(-3px);border-color:#08796e;background:#effafb;color:#103f59}
.lg-station-art{display:block;position:relative;width:100%;max-width:420px;container-type:inline-size}
.lg-station-art img{display:block;width:100%;height:auto}
.lg-station-sign{position:absolute;left:26%;top:27.5%;width:48%;height:10%;display:flex;align-items:center;justify-content:center;font-size:clamp(12px,4.4cqi,19px);line-height:1.05;font-weight:800;color:#103f59;text-align:center;overflow-wrap:normal}
.lg-station-sign-long{left:23%;top:25%;width:54%;height:auto;min-height:15%;padding:3px 6px;border-radius:9px;background:#faf9f5;box-shadow:0 0 0 2px #528493;font-size:clamp(12px,3.6cqi,15px);line-height:1.15;overflow-wrap:anywhere}
.lg-station-hint{display:block;margin-top:auto;padding:5px 14px;border-radius:20px;background:#e0f3ee;color:#185b51;font-size:13px}
.learning-game .lg-station:disabled{opacity:1;cursor:default}
.learning-game .lg-station.is-correct{border:3px solid #08796e;background:#ecfaf3}
.learning-game .lg-station.is-wrong{border:3px solid #b77816;background:#fff7e7}
.lg-station.is-wrong .lg-station-hint{background:#ffebc5;color:#65400e}
@media(max-width:700px){.lg-stations{grid-template-columns:minmax(0,1fr);gap:16px}.learning-game .lg-station{max-width:440px;justify-self:center}.lg-station-art{max-width:340px}}
@media(prefers-reduced-motion:reduce){.learning-game .lg-station{transition:none;transform:none!important}}
