* {box-sizing:border-box}
body {margin:0;padding:24px;background:#eef7f4;color:#173d32;font-family:Arial,sans-serif;line-height:1.5}
.game-nav {max-width:900px;margin:0 auto 28px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;text-align:center}
.game-nav a {display:flex;align-items:center;justify-content:center;min-height:44px;padding:9px 16px;border-radius:12px;text-decoration:none;color:#18563f;background:#fff;font-weight:700}
.game-nav a[aria-current] {background:#126b4c;color:#fff}
.game-nav a:first-child {padding:10px}
.game-nav a:focus-visible, button:focus-visible {outline:3px solid #d89b21;outline-offset:3px}
.rules-shell {max-width:800px;margin:auto}
.rules-heading {text-align:center;margin-bottom:28px}
.rules-heading img {width:170px;max-width:60%;height:auto}
.rules-heading h1 {font-size:clamp(28px,6vw,42px);margin:8px 0}
.rules-heading p {margin:8px 0;color:#526c62}
.rules-stats {display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px;font-weight:700}
progress {width:100%;height:10px;accent-color:#16834b;margin:12px 0 22px}
.rule-play-card {padding:clamp(18px,4vw,32px);background:#fff;border:1px solid #dbe8e1;border-radius:22px;box-shadow:0 12px 32px #173d320b}
.rule-play-card h2 {font-size:clamp(20px,4vw,27px);margin:8px 0 20px}
#questionNumber {font-size:13px;color:#60746d;margin:0}
#ruleImage {display:block;max-width:100%;max-height:280px;object-fit:contain;margin:0 auto 20px}
#studyAnswer {background:#eaf8ee;border-radius:14px;padding:18px;line-height:1.7}
#studyAnswer p:empty {display:none}
#ruleChoices {display:grid;gap:12px}
.rule-choice {font:inherit;text-align:left;min-height:52px;padding:14px 18px;border:1px solid #cdded4;border-radius:13px;background:#f9fcfa;color:#173d32;cursor:pointer}
.rule-choice:hover:not(:disabled) {border-color:#16834b;background:#edf8f0}
.rule-choice.correct {border-color:#16834b;background:#ddf4e4;color:#115a31}
.rule-choice.incorrect {border-color:#d45454;background:#fff0ef;color:#912727}
.game-button {border:0;border-radius:12px;padding:14px 22px;background:#126b4c;color:#fff;min-height:48px;font:700 16px Arial;cursor:pointer}
#ruleFeedback {line-height:1.7}
[hidden], #ruleImage[hidden] {display:none!important}
/* Keep the existing memory game playable at a normal mobile viewport scale. */
.main {max-width:1250px;width:100%;margin:auto;grid-template-columns:minmax(0,1fr) minmax(0,680px) minmax(0,1fr)}
.main .div3 {grid-column:2;grid-row:1}
.main .div4 {grid-column:2;grid-row:2;width:100%;margin:auto}
.main .div1 {grid-column:1;grid-row:1/3}
.main .div2 {grid-column:3;grid-row:1/3}
.main .div1 img,.main .div2 img {max-width:100%;height:auto}
.main .grid {width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.main .card {width:100%;height:auto;aspect-ratio:1;border-radius:10px;box-shadow:0 3px 8px #173d3215}
.main #tailbar {font-size:18px;overflow-wrap:anywhere}
@media(max-width:1100px){.main{display:block;max-width:680px}.main .div1,.main .div2{display:none}}
@media(max-width:600px){body{padding:14px}.game-nav{gap:6px;margin-bottom:20px}.game-nav a{font-size:14px;padding:9px 12px}.main .grid{gap:7px}.game-button{width:100%}.rules-stats{gap:6px;font-size:12px}}
/* Sign Journey: animated road, readable sign gates and touch controls. */
.sign-journey {background:#eaf3ef;color:#173e36;padding:22px 16px 32px;}
.journey-shell {max-width:850px;margin:auto;}
.sign-journey .game-nav {max-width:850px;margin-bottom:22px;}
.journey-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;}
.journey-heading h1 {font-size:clamp(28px,5vw,42px);letter-spacing:-1px;line-height:1.15;margin:7px 0 9px;}
.journey-heading p {font-size:14px;margin:0;color:#57756a;}
.journey-heading .journey-eyebrow {font-size:11px;font-weight:800;letter-spacing:2px;color:#248568;}
.journey-badge {display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 78px;width:78px;height:78px;background:#f6cd65;border:5px solid #fff;border-radius:50%;font-weight:900;font-size:27px;line-height:1;box-shadow:0 3px 14px #24463915;}
.journey-badge br {display:none;}.journey-badge small{font-size:9px;letter-spacing:1px;margin-top:5px;}
.journey-hud {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:#d8e6de;border:1px solid #d8e6de;border-radius:16px;overflow:hidden;margin-bottom:18px;}
.journey-hud>div {background:#fff;padding:12px 17px;min-width:0;}
.journey-hud small {display:block;font-size:10px;letter-spacing:.6px;color:#70897e;font-weight:700;}
.journey-hud strong {display:block;font-size:23px;line-height:1.5;font-variant-numeric:tabular-nums;}
#journeyLives {color:#e66e60;white-space:nowrap;}
.journey-challenge {display:flex;align-items:center;justify-content:space-between;gap:16px;background:#154d40;color:white;border-radius:17px 17px 0 0;padding:17px 24px;}
.journey-challenge>div:first-child{min-width:0;}.journey-challenge small{font-size:10px;letter-spacing:1px;color:#badace;}
.journey-challenge h2 {margin:4px 0 0;font-size:clamp(19px,3.5vw,27px);line-height:1.3;overflow-wrap:anywhere;}
.journey-clock {border:1px solid #7ebca18c;border-radius:50%;width:57px;height:57px;flex:0 0 57px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;}
.journey-clock strong {font-size:24px;font-variant-numeric:tabular-nums;}.journey-clock small{font-size:10px;margin-top:4px;}
.journey-time-track {background:#154d40;height:5px;}.journey-time-track>div{height:100%;width:100%;background:#f7ca5b;}.journey-time-track .urgent{background:#fb7765;}
.journey-scene {position:relative;height:390px;overflow:hidden;background:#80b298;border-radius:0 0 20px 20px;isolation:isolate;}
.journey-road {position:absolute;inset:0 9%;background:linear-gradient(90deg,#354d48,#2b413e 30%,#2b413e 70%,#354d48);border-left:5px solid #e5d994;border-right:5px solid #e5d994;box-shadow:0 0 0 9px #1c43361a;}
.road-line {position:absolute;top:0;bottom:0;width:4px;background:repeating-linear-gradient(to bottom,#cfddd8 0 30px,transparent 30px 63px);background-position:0 0;opacity:.5;}
.line-one{left:33.333%;}.line-two{left:66.666%;}
.running .road-line{animation:road-travel .65s linear infinite;}
@keyframes road-travel{to{background-position:0 63px;}}
.journey-verge {position:absolute;top:0;bottom:0;width:9%;background:repeating-linear-gradient(0deg,#7baa90 0 50px,#87b69a 50px 100px);}
.verge-left{left:0;}.verge-right{right:0;}
.journey-verge i{display:block;width:28px;height:36px;border-radius:50%;background:#327853;box-shadow:5px 5px 0 #276440;margin:40px auto 70px;transform:rotate(-16deg);}
.journey-lanes {position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:34px 14px 0;z-index:2;}
.journey-lane {position:relative;display:flex;flex-direction:column;align-items:center;padding:12px 9px 7px;min-width:0;width:100%;background:#fff;border:3px solid white;border-radius:16px;cursor:pointer;box-shadow:0 9px 0 #142f2a55,0 18px 25px #10241f44;transition:transform .15s,border-color .15s;}
.journey-lane img{display:block;width:100%;height:108px;object-fit:contain;pointer-events:none;}.journey-lane span{background:#edf2ef;color:#537566;font-size:12px;font-weight:800;border-radius:6px;min-width:25px;margin-top:10px;}
.journey-lane:hover:not(:disabled){transform:translateY(-5px);border-color:#f5ce60;}.journey-lane:disabled{cursor:default;opacity:1;}
.journey-lane.lane-correct{border-color:#69e99c;background:#ebfff0;}.journey-lane.lane-wrong{border-color:#fa8d80;background:#fff1ed;}
.journey-car {position:absolute;width:52px;height:89px;bottom:24px;left:50%;transform:translateX(-50%);border-radius:17px 17px 12px 12px;background:linear-gradient(90deg,#d49a2a,#ffdb6b 18%,#ffdf83 50%,#ffcb4e 85%,#c18c24);border:2px solid #d4a034;box-shadow:0 8px 2px #122c2588;transition:left .38s ease;z-index:3;}
.journey-car:before,.journey-car:after{content:'';position:absolute;top:20px;width:7px;height:51px;background:#192e29;border-radius:4px;z-index:-1;}.journey-car:before{left:-7px;}.journey-car:after{right:-7px;}
.car-window{position:absolute;top:17px;left:6px;right:6px;height:20px;background:linear-gradient(145deg,#a4ddd3,#204a44 70%);border:2px solid #937b40;border-radius:8px 8px 3px 3px;}.car-roof{position:absolute;top:39px;left:8px;right:8px;height:24px;background:#f8ce61;border-radius:4px;}.car-rear{position:absolute;bottom:9px;left:8px;right:8px;height:11px;background:#355950;border-radius:3px 3px 6px 6px;}
.journey-cover{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:#173e36ba;backdrop-filter:blur(4px);padding:18px;}
.journey-cover-card{max-width:460px;text-align:center;color:#fff;}.journey-cover-card h2{font-size:clamp(20px,4vw,28px);line-height:1.2;margin:8px 0;}.journey-cover-card p{font-size:14px;line-height:1.65;color:#d0e5db;margin:10px 0 20px;}.cover-symbol{display:inline-grid;place-items:center;width:45px;height:45px;border:2px solid #b3d7c8;border-radius:50%;font-size:30px;font-weight:bold;}
.sign-journey .game-button {background:#f6ce65;color:#203e32;font-size:14px;min-height:46px;box-shadow:0 3px 0 #caa449;}.sign-journey .game-button:hover{background:#ffdb7d;}.sign-journey .game-button:disabled{opacity:.65;cursor:wait;}
.journey-controls {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 18px;color:#60796f;font-size:12px;}.journey-controls button{min-height:40px;border:1px solid #c8dacf;border-radius:10px;background:#fff;padding:8px 12px;font:inherit;white-space:nowrap;color:#245e49;cursor:pointer;}.journey-controls button:disabled{opacity:.45;cursor:default;}
.journey-feedback {display:flex;align-items:flex-start;gap:18px;padding:20px;background:#fff;border:1px solid #b9deca;border-left:5px solid #2d9c67;border-radius:16px;margin:16px 0;}.journey-feedback.is-wrong{border-left-color:#e07a5c;}.journey-feedback img{width:70px;height:78px;object-fit:contain;}.journey-feedback>div{flex:1;min-width:0;}.journey-feedback h3{font-size:18px;margin:0 0 9px;}.journey-feedback strong{font-size:15px;}.journey-feedback p{font-size:14px;color:#5c776c;line-height:1.6;margin:8px 0 16px;}.journey-feedback p:empty{display:none;}.journey-feedback .game-button{margin-top:10px;}
.journey-result {text-align:center;background:white;padding:32px 24px;border-radius:20px;box-shadow:0 10px 35px #154d4010;margin-top:18px;}.journey-result h2{font-size:30px;margin:10px 0;}.journey-result p{color:#5c776c;}.result-symbol{font-size:52px;color:#dfae32;}.journey-result-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:25px;}
.journey-footnote{font-size:11px;line-height:1.6;color:#758d80;text-align:center;margin-top:24px;}
@media(max-width:600px){.sign-journey{padding:14px 12px 25px;}.journey-heading{gap:10px;margin-bottom:16px;}.journey-heading p{font-size:12px;}.journey-badge{flex-basis:60px;width:60px;height:60px;font-size:23px;}.journey-badge small{font-size:8px;}.journey-hud>div{padding:9px 8px;}.journey-hud small{font-size:8px;letter-spacing:0;}.journey-hud strong{font-size:18px;}.journey-challenge{padding:14px;gap:10px;}.journey-clock{width:48px;height:48px;flex-basis:48px;}.journey-scene{height:310px;}.journey-road{inset:0 6%;border-width:3px;}.journey-verge{width:6%;}.journey-verge i{width:17px;height:26px;}.journey-lanes{gap:9px;padding:26px 7px 0;}.journey-lane{padding:7px 5px;border-radius:12px;}.journey-lane img{height:75px;}.journey-lane span{margin-top:7px;font-size:11px;}.journey-car{width:42px;height:76px;bottom:23px;}.car-window{left:4px;right:4px;top:14px;height:17px;}.car-roof{top:33px;height:20px;}.journey-controls{font-size:10px;gap:8px;}.journey-controls button{font-size:12px;}.journey-feedback{padding:16px 12px;gap:12px;}.journey-feedback img{width:48px;height:58px;}.journey-feedback h3{font-size:16px;}.journey-cover-card p{font-size:12px;}.journey-cover-card .game-button{width:auto;max-width:100%;}}
@media(prefers-reduced-motion:reduce){.running .road-line{animation:none;}.journey-car,.journey-lane{transition:none;}}

/* Compact sign boards and a calmer, consistent game surface. */
.memory-game {margin:0;background:linear-gradient(160deg,#f6faf8,#e8f2ed);min-height:100vh;}
.memory-game .main{max-width:1080px;grid-template-columns:minmax(0,1fr) minmax(0,480px) minmax(0,1fr);gap:24px;}
.memory-game .div3{background:#fff;border:1px solid #dce8e1;border-radius:24px;padding:24px;box-shadow:0 12px 40px #173d3208;}
.memory-game h2{font-size:clamp(20px,4vw,27px);letter-spacing:-.5px;margin:0 0 8px;}
.memory-intro{font-size:14px;color:#688074;margin:0 auto 18px;max-width:340px;}
.memory-game #timer{display:inline-block;background:#edf5f0;border:1px solid #dce9e0;padding:8px 16px;border-radius:30px;font-size:14px;}
.memory-game #time{font-weight:800;font-size:20px;font-variant-numeric:tabular-nums;}
.memory-game .grid{max-width:400px;margin:16px auto 0;gap:10px;}
.memory-game .card{background:#f0f6f2;border:0;border-radius:12px;box-shadow:none;}
.memory-game .card-front,.memory-game .card-back{border:1px solid #d3e3d9;border-radius:12px;background-color:#fff;}
.memory-game .card-front{background-size:54% auto;background-color:#f2f7f4;}
.memory-game .card-back{background-size:62% 62%;}
.memory-game .card:hover{box-shadow:0 0 0 2px #8db9a1;}
.memory-game #restartBtn{border:0;border-radius:12px;background:#126b4c;color:white;font-weight:700;padding:12px 22px;}
.memory-game .div4{padding:0 16px;}.memory-game #tailbar{font-size:15px;color:#526e60;line-height:1.7;}
.journey-shell,.sign-journey .game-nav{max-width:740px;}
.journey-lane img{width:76px;height:76px;max-width:100%;}
.journey-lane{border-radius:12px;padding:12px 8px 8px;box-shadow:0 5px 0 #142f2a44,0 9px 16px #10241f22;}
@media(max-width:1100px){.memory-game .main{max-width:480px;}}
@media(max-width:600px){.memory-game .div3{padding:18px 14px;border-radius:20px;}.memory-game .grid{gap:8px;}.journey-lane img{width:56px;height:56px;}}