@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800;900&family=Noto+Sans+Thai:wght@400;500;600&display=swap');
:root{--ink:#1e354d;--green:#117d70;--cream:#fffaf1;--muted:#73848f;--orange:#f19152;--line:#e5e9e5;--appheight:100dvh}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans JP',sans-serif}button,input{font:inherit}button{cursor:pointer}button,a{touch-action:manipulation}a{color:inherit}[hidden]{display:none!important}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #edac64;outline-offset:3px}header{height:66px;max-width:1240px;margin:auto;display:flex;align-items:center;gap:28px;padding:0 32px;border-bottom:1px solid var(--line)}.logo{font-weight:900;font-size:25px;letter-spacing:-2px;text-decoration:none}.logo span{color:var(--green)}.logo i{font-style:normal;margin-left:8px;letter-spacing:0}.header-note{font-size:9px;color:var(--muted);letter-spacing:2px}.header-actions{display:flex;align-items:center;gap:22px;margin-left:auto;font-size:11px}.header-actions button{padding:7px 13px;border:1px solid #d8e5de;background:white;border-radius:30px;color:var(--green)}.header-actions a{text-decoration:none}main{max-width:1170px;margin:auto;padding:24px 28px 0}.stage{display:grid;grid-template-columns:1fr 1.05fr;gap:35px;align-items:start}.stage-left{min-width:0}.eyebrow{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:2px;color:var(--green);font-weight:700}.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--orange)}h1{font-size:43px;line-height:1.4;letter-spacing:1px;margin:12px 0}h1 em{font-style:normal;color:var(--green)}.tagline{font-size:12px;line-height:1.8;margin:0}.tagline strong{font-weight:600}.lead{font-size:11px;color:var(--muted);line-height:1.9;margin:10px 0 18px}fieldset{border:0;margin:16px 0;padding:0}legend{font-size:11px;font-weight:700;padding:0;margin-bottom:9px}legend>span{color:#d88e51;font-size:9px;margin-right:8px}.course-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.choice{padding:0 0 10px;border:1px solid #dce4dc;border-radius:12px;background:#fff;overflow:hidden;text-align:left;color:var(--ink);position:relative;box-shadow:0 3px 0 #e7e9df}.choice img{display:block;width:100%;height:76px;object-fit:cover}.choice b{display:block;font-size:11px;padding:8px 8px 0}.choice small{display:block;font-size:8px;color:var(--muted);padding:4px 8px 0;line-height:1.5}.choice.selected{border:2px solid var(--green);background:#eaf6ed;box-shadow:0 3px 0 #afd0bc}.choice.selected:after{content:'✓';position:absolute;top:6px;right:7px;width:19px;height:19px;border-radius:50%;background:var(--green);color:white;text-align:center;font-size:12px}.difficulty-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.level{background:white;border:1px solid #dde4dc;color:var(--ink);border-radius:9px;padding:10px 5px;text-align:center}.level b{font-size:11px}.level small{display:block;font-size:8px;color:var(--muted);margin-top:3px}.level.selected{border-color:var(--green);background:#eaf6ed;box-shadow:0 0 0 1px var(--green)}.trip-info{display:flex;gap:13px;font-size:9px;color:var(--muted);margin:14px 0}.primary{border:0;width:100%;background:var(--green);color:white;display:flex;align-items:center;justify-content:space-between;padding:14px 19px;border-radius:11px;font-size:13px;font-weight:700;box-shadow:0 4px 0 #075c50}.primary:hover{background:#096b5f}.primary span{font-size:20px}.input-note{font-size:9px;color:var(--muted);line-height:1.7;text-align:center;margin:12px 0}.personal-best{border-top:1px solid var(--line);padding:12px 0;display:flex;gap:5px;flex-wrap:wrap;align-items:center}.personal-best>span{font-size:8px;color:#b58b56;letter-spacing:1px;flex-basis:100%}.personal-best b{font-size:11px}.personal-best small{font-size:9px;color:var(--muted);margin-left:auto}.photo-tastes{display:flex;align-items:center;gap:6px;margin:15px 0 10px}.photo-tastes img{width:43px;height:40px;object-fit:cover;border-radius:8px;border:2px solid white;transform:rotate(-5deg)}.photo-tastes img:nth-child(2){transform:rotate(5deg)}.photo-tastes>span{font-size:9px;line-height:1.8;margin-left:7px;color:var(--muted)}.map-panel{position:relative;overflow:hidden;border:1px solid #d2e2da;border-radius:21px;background:#e4efdf;box-shadow:0 16px 35px #214b3410}.map-top{padding:15px 19px 0;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.5px;color:#6a876b}.walk-show{height:267px;position:relative;overflow:hidden;margin:13px 13px 0;border-radius:14px;background:linear-gradient(#d3edf0 0%,#e3f0dd 68%,#88af7c 68%,#88af7c 76%,#e8c89d 76%);border:1px solid #d4e2d2}.walk-town{position:absolute;inset:0;background:url('assets/town.svg') repeat-x 0 bottom;background-size:660px 175px;transition:background-position-x .65s ease-in-out;opacity:.85}.walk-sky{position:absolute;top:16px;right:12%;width:35px;height:35px;background:#f7d787;box-shadow:0 0 0 10px #f7df9e44;border-radius:50%}.walk-start,.walk-goal{position:absolute;bottom:10px;font-size:9px;letter-spacing:1px;color:#82664b}.walk-start{left:12px}.walk-goal{right:12px}.big-traveler{position:absolute;left:10%;bottom:24px;width:144px;height:218px;transform:translateX(-50%);transition:left .65s ease-in-out;filter:drop-shadow(0 6px 3px #3a502b25)}.big-traveler img{height:100%;width:100%;object-fit:contain}.walking.big-traveler img{animation:mascot-step .17s infinite alternate;transform-origin:50% 90%}.welcome-sticker{position:absolute;left:27%;top:27px;font-family:'Noto Sans Thai',sans-serif;font-size:30px;font-weight:600;transform:rotate(-7deg);color:#29736a}.welcome-sticker small{display:block;font-family:'Noto Sans JP';font-size:9px;font-weight:400;margin-top:3px}.walk-pop{position:absolute;top:10px;left:12px;right:45px;font-size:10px;color:#4f7158;font-weight:600}.goal-hud{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 18px;border-bottom:1px solid #cadcc2}.goal-hud strong{font-size:15px}.goal-hud>span{font-size:9px;color:#b3834d}.map-wrap{height:205px;position:relative;margin:0 12px;overflow:hidden}.map-wrap>svg{width:100%;height:100%;display:block}.neighbor{fill:#d7e1c9;stroke:#c2cfba;stroke-width:.7}.thailand{fill:#80a179;stroke:#557f57;stroke-width:1;filter:url(#shadow)}.map-annotations text{font-size:8px;fill:#a3b39a;letter-spacing:1px}#routebase{fill:none;stroke:#f7f7ea;stroke-width:2;stroke-dasharray:3 4}#routetrail{fill:none;stroke:#236448;stroke-width:3;stroke-linecap:round}#citydots circle{fill:#fcfbed;stroke:#59865c;stroke-width:1.4}#citydots text{font-size:9px;fill:#356443;paint-order:stroke;stroke:#e4efdf;stroke-width:3px}#citydots .destination{fill:#eda561}.location-ring{fill:#eba75b22;stroke:#d98e4c55}.map-leg{stroke:#233f37;stroke-width:4;stroke-linecap:round;transform-origin:0 -11px}.map-arm{stroke:#ebbc95;stroke-width:4;stroke-linecap:round;transform-origin:0 -20px}.walking .left-leg{animation:stride .18s infinite alternate}.walking .right-leg,.walking .map-arm{animation:stride .18s infinite alternate-reverse}#mapwalker>g{transform:scale(1.5)}.map-postcard{position:absolute;left:3px;bottom:8px;display:flex;align-items:center;gap:9px;background:#fffff4ee;border:1px solid white;border-radius:10px;padding:10px 13px;max-width:65%}.map-postcard>span{font-size:24px}.map-postcard div{display:flex;flex-direction:column;gap:3px}.map-postcard small{font-size:8px;color:#8b9a7f}.map-postcard b{font-size:12px}.map-postcard div>span{font-size:8px;color:#819578}.map-bottom{padding:13px 19px;border-top:1px solid #cdddc5;background:#dae8d1;display:flex;justify-content:space-between;gap:15px;align-items:center}.map-bottom small{font-size:8px;color:#6d895e}.map-bottom strong{font:34px Georgia,serif;display:block;line-height:1.1}.map-bottom strong b{font-weight:400}.map-bottom strong span{font-size:18px}.map-bottom-right{flex:1;max-width:170px;text-align:right}.map-bottom-right>span{font-size:9px;letter-spacing:1px;color:#69865d}.progress-track{height:4px;background:#bdcfb2;border-radius:10px;margin:7px 0}.progress-track i{height:100%;display:block;background:#357551;transition:width .5s}.map-legend{display:flex;gap:14px;justify-content:center;font-size:7px;color:#829777;padding:9px}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:4px}.dot.green{background:#357551}.dot.orange{background:#e39e62}.play-heading{display:flex;justify-content:space-between;align-items:center}.play-heading h2{font-size:22px;margin:6px 0 13px}.clock{display:flex;gap:5px;align-items:baseline}.clock span{font-size:9px;color:var(--muted)}.clock b{font:39px Georgia,serif;color:var(--green)}.timer{height:5px;border-radius:5px;overflow:hidden;background:#e6eade}.timer i{height:100%;width:100%;display:block;background:#e99b5b;transition:width .1s}.play-stats{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;margin:12px 0}.word-card{background:white;display:flex;align-items:center;gap:16px;padding:15px;border:1px solid #dce5df;border-radius:14px;box-shadow:0 4px 0 #dce7dd;min-height:116px;position:relative}.word-photo{width:88px;height:88px;flex-shrink:0;background:#eaf0e2;border-radius:10px;overflow:hidden;display:grid;place-items:center;position:relative}.word-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.word-photo>span:first-of-type{font-size:41px}.word-photo #category{position:absolute;bottom:0;background:#185549e0;color:white;font-size:8px;padding:5px;text-align:center;width:100%}.word-content{min-width:0}.word-content h2{font-family:'Noto Sans Thai',sans-serif;font-size:29px;line-height:1.4;margin:0;overflow-wrap:anywhere}.word-content p{font-size:13px;margin:4px 0}.word-content strong{font-size:11px;color:var(--green);display:block}.word-content button{font-size:9px;border:0;background:transparent;color:#7b9687;padding:6px 0 0}.roman-wrap{margin:17px 0 10px;display:flex;align-items:center;gap:10px;min-height:45px}#roman{font:28px/1.45 monospace;letter-spacing:2px;overflow-wrap:anywhere;flex:1;color:#a7b7af}#roman .done{color:var(--green)}#roman .current{color:#173f35;border-bottom:3px solid #ed9a5e}#roman.concealed{visibility:hidden}#reveal{border:1px dashed #b5cebd;background:#eff5ed;border-radius:8px;padding:8px;font-size:9px;color:var(--green)}.input-label{font-size:9px;color:var(--muted);display:block;margin-bottom:7px}#typing{width:100%;border:2px solid #d9e4dc;background:white;border-radius:10px;padding:13px 15px;color:var(--ink);font:22px monospace;outline:none;box-shadow:inset 0 2px 4px #2d534509}#typing:focus{border-color:var(--green);box-shadow:0 0 0 4px #117d700a}#typing.bad{border-color:#db8967;background:#fff2eb}.keyboard{background:#e5ebe8;padding:10px 7px 7px;border-radius:11px;border:1px solid #cfdbd5;box-shadow:0 4px 0 #bbc9c1;margin-top:14px}.keyboard>div{display:flex;justify-content:center;gap:4px;margin-bottom:4px}.keyboard span{display:grid;place-items:center;background:#fffef9;border:1px solid #d4dfd7;border-bottom:3px solid #bdcfc5;border-radius:4px;height:25px;min-width:29px;width:8%;font:10px monospace;color:#668073;transition:background .1s}.keyboard .space-key{width:43%;font-size:7px;height:16px}.keyboard .key-next{background:#f5bf70;color:#604619;border-color:#d49a4e;box-shadow:0 0 0 2px #e6aa5344}#feedback{font-size:9px;line-height:1.6;color:var(--muted);min-height:15px;margin:11px 0 5px}.learning-tip{border-top:1px solid var(--line);padding:9px 0;font-size:10px;line-height:1.7;color:#7a8e7e;margin-top:10px}.learning-tip b{font-family:'Noto Sans Thai';font-size:14px;color:var(--green)}.text-button{background:none;border:0;padding:6px 0;font-size:9px;color:#8c9c8e}.countdown{position:fixed;inset:66px 0 0;background:#fffaf1e8;backdrop-filter:blur(5px);z-index:50;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;text-align:center}.countdown span{font-size:10px;letter-spacing:3px;color:var(--green)}.countdown strong{font-size:clamp(48px,8vw,86px);color:var(--green)}.countdown small{font-size:12px;color:var(--muted)}.result-label{margin-top:16px}.result-title{font-size:21px;margin:12px 0}.result-percent{font:76px Georgia,serif;color:var(--green);letter-spacing:-4px}.result-percent span{font-size:30px;letter-spacing:0}.result-sub{font-size:11px;line-height:1.9;color:var(--muted)}.result-stats{display:flex;gap:25px;padding:13px 0;margin:15px 0 22px;border-block:1px solid var(--line)}.result-stats>span{font-size:9px;color:var(--muted)}.result-stats b{display:block;font-size:22px;color:var(--ink)}.result-stats small{font-size:10px}.goal-ribbon,.retry-ribbon{background:#f8e6b5;color:#846731;padding:14px;border:1px solid #ebd28c;border-radius:10px;font-size:14px;font-weight:700}.retry-ribbon{background:#edf3e8;border-color:#d6e3d0;color:#618255}.result-buttons{display:flex;gap:8px;margin:13px 0}.secondary{flex:1;padding:10px;background:transparent;border:1px solid #d8e2d8;border-radius:8px;color:var(--green);font-size:10px}.round-review{font-size:10px;color:#7e907c;line-height:1.9;max-height:240px;overflow:auto}.round-review>div{padding:8px 0;border-bottom:1px solid var(--line)}.round-review small{font-size:9px}.round-review p{margin:4px 0}.manifesto{text-align:center;padding:45px 20px;border-block:1px solid var(--line);margin-top:35px}.manifesto>span{font-size:9px;letter-spacing:2px;color:#bc9865}.manifesto h2{font-size:25px;margin:12px 0}.manifesto p{font-size:11px;color:var(--muted);line-height:1.8}.manifesto>div{display:flex;justify-content:center;align-items:baseline;gap:15px}.manifesto b{font:30px Georgia,serif;color:var(--green)}.manifesto div>span{font-size:9px;color:var(--muted);margin-right:15px}.dictionary{padding:32px 0}.dict-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.dict-heading h2{font-size:23px;margin:8px 0}.dict-heading p{font-size:11px;color:var(--muted)}.dict-heading input{border:1px solid #dbe3d9;background:white;border-radius:9px;padding:12px 14px;font-size:11px;width:280px;color:var(--ink)}#dictlist{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-height:460px;overflow:auto;margin:20px 0}.dict-card{background:white;border:1px solid var(--line);border-radius:12px;padding:15px}.dict-card>span{font-size:9px;color:#8c9b8a}.dict-card h3{font:24px 'Noto Sans Thai';margin:6px 0}.dict-card b{font-size:11px}.dict-card p{font-size:10px;color:var(--muted);overflow-wrap:anywhere}.dict-card code{display:block;margin-top:3px}.dict-card button{border:0;background:#edf5ee;color:var(--green);border-radius:20px;padding:6px 10px;font-size:9px}.dict-note,.about{font-size:10px;color:#8d9a88;line-height:1.9}.about{border-top:1px solid var(--line);padding:20px 0 30px}.about a,.dict-note a{color:var(--green)}footer{display:flex;justify-content:space-between;max-width:1114px;margin:auto;border-top:1px solid var(--line);padding:20px 0;font-size:13px}footer span{font-size:9px;color:var(--muted)}.new-word .word-card{animation:word-in .2s ease-out}.in-play{height:var(--appheight);overflow:hidden}.in-play header{height:52px}.in-play main{padding:16px 28px 0}.in-play .stage{height:calc(var(--appheight) - 83px);max-height:720px;align-items:stretch;gap:28px}.in-play .stage-left{overflow:auto;scrollbar-width:thin}.in-play .map-panel{display:flex;flex-direction:column}.in-play .walk-show{height:auto;min-height:185px;flex:1;max-height:300px}.in-play .big-traveler{height:85%;max-height:240px;width:150px}.in-play .welcome-sticker{display:none}.in-play .map-wrap{height:155px;min-height:100px;flex:1}.in-play .map-legend{display:none}.in-play .manifesto,.in-play .dictionary,.in-play .about,.in-play footer,.in-play #dictlink{display:none}.in-play .countdown{inset:52px 0 0}.in-play .map-top{font-size:7px}.in-play .goal-hud{padding:12px 16px}.in-play .learning-tip{max-height:70px;overflow:auto}@keyframes mascot-step{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-5px) rotate(1deg)}}@keyframes word-in{from{transform:translateX(10px);opacity:.3}to{transform:none;opacity:1}}@keyframes stride{from{transform:rotate(-28deg)}to{transform:rotate(28deg)}}@media(min-width:900px) and (max-height:760px){.in-play .keyboard span{height:21px}.in-play .keyboard .space-key{height:12px}.in-play .word-card{min-height:100px;padding:12px}.in-play .word-photo{height:70px;width:70px}.in-play .word-content h2{font-size:25px}.in-play .roman-wrap{margin:10px 0 7px}.in-play .learning-tip{display:none}.in-play .keyboard{margin-top:10px;padding:7px}.in-play #typing{padding:10px 13px}.in-play .play-heading h2{font-size:20px}.in-play .map-wrap{height:130px}}@media(max-width:850px){header{padding:0 22px}.stage{gap:22px}main{padding:22px 22px 0}h1{font-size:36px}.course-options{gap:6px}.choice b{font-size:10px}.choice small{font-size:7px}.choice img{height:65px}.trip-info{gap:8px;font-size:8px}.keyboard span{min-width:20px}.map-postcard{max-width:85%}#dictlist{grid-template-columns:repeat(3,minmax(0,1fr))}.walk-show{height:260px}.big-traveler{height:210px;width:135px}.welcome-sticker{font-size:25px;left:33%}}@media(max-width:650px){header{height:56px;padding:0 16px}.logo{font-size:23px}.header-note{display:none}.header-actions{gap:12px;font-size:10px}.header-actions button{font-size:10px}main{padding:18px 16px 0}.stage{grid-template-columns:1fr;gap:20px}.stage-left{order:2}.map-panel{order:1}.map-top{display:none}.walk-show{height:174px;margin:9px 9px 0}.big-traveler{height:153px;width:105px;bottom:15px}.walk-town{background-size:590px 135px}.walk-pop{font-size:9px}.walk-goal,.walk-start{font-size:8px;bottom:7px}.welcome-sticker{top:25px;left:27%;font-size:25px}.map-wrap{display:none}.map-bottom,.map-legend{display:none}.goal-hud{padding:10px 13px}.goal-hud strong{font-size:13px}.goal-hud>span{font-size:8px}h1{font-size:34px;margin:9px 0}.lead{margin-bottom:12px}.course-options .choice img{height:75px}.choice b{font-size:11px}.choice small{font-size:8px}.photo-tastes{display:none}.trip-info{font-size:9px}.personal-best small{font-size:8px}.manifesto{margin-top:24px;padding:27px 0}.manifesto h2{font-size:23px}.manifesto>div{gap:9px}.manifesto div>span{font-size:8px;margin-right:0}.manifesto b{font-size:25px}.dict-heading{display:block}.dict-heading input{width:100%;margin-top:10px}#dictlist{grid-template-columns:repeat(2,minmax(0,1fr))}.dict-card{padding:12px}.dict-card h3{font-size:22px}.countdown{inset:56px 0 0}footer{margin:0 16px}.in-play header{height:44px}.in-play main{padding:8px 12px 0}.in-play .stage{display:flex;flex-direction:column;gap:9px;height:calc(var(--appheight) - 60px);max-height:none}.in-play .map-panel{order:1;flex-shrink:0;border-radius:12px}.in-play .stage-left{order:2;flex:1;min-height:0;width:100%;overflow:auto}.in-play .map-top,.in-play .map-wrap,.in-play .map-bottom{display:none}.in-play .walk-show{min-height:0;height:132px;flex:none;max-height:none;margin:0;border:0;border-radius:0}.in-play .big-traveler{height:120px;width:90px;bottom:10px}.in-play .walk-town{background-size:580px 110px}.in-play .goal-hud{padding:7px 12px}.in-play .goal-hud strong{font-size:13px}.in-play .play-heading h2{font-size:18px;margin:3px 0 8px}.in-play .play-heading .eyebrow{font-size:7px;letter-spacing:1px}.in-play .clock b{font-size:30px}.in-play .clock span{font-size:8px}.in-play .play-stats{font-size:8px;margin:8px 0}.in-play .word-card{padding:10px;min-height:90px;gap:12px}.in-play .word-photo{height:66px;width:66px}.in-play .word-photo>span:first-of-type{font-size:32px}.in-play .word-content h2{font-size:24px}.in-play .word-content p{font-size:12px;margin:1px 0}.in-play .word-content strong{font-size:10px}.in-play .word-content button{position:absolute;bottom:10px;right:12px;padding:0}.in-play .roman-wrap{margin:10px 0 7px;min-height:34px}.in-play #roman{font-size:22px;letter-spacing:1px}.in-play #typing{font-size:20px;padding:10px 12px}.in-play .input-label{font-size:8px;margin-bottom:5px}.in-play .keyboard{padding:6px;margin-top:9px}.in-play .keyboard span{height:21px;font-size:8px;min-width:0}.in-play .keyboard .space-key{height:11px;font-size:6px}.in-play .keyboard>div{gap:3px;margin-bottom:3px}.in-play #feedback{font-size:8px;margin:8px 0 3px}.in-play .learning-tip{display:none}.in-play .text-button{font-size:8px;padding:4px 0}.in-play .countdown{inset:44px 0 0}.result-percent{font-size:65px}.result-title{font-size:20px}}@media(max-width:650px) and (max-height:650px){.in-play .keyboard{display:none}.in-play .walk-show{height:102px}.in-play .big-traveler{height:95px;width:73px}.in-play .goal-hud{padding:5px 10px}.in-play .walk-pop{font-size:8px}.in-play .word-card{min-height:76px;padding:8px}.in-play .word-photo{height:56px;width:56px}.in-play .word-content h2{font-size:21px}.in-play .play-heading h2{display:none}.in-play .play-heading{height:27px}.in-play .clock b{font-size:25px}.in-play .roman-wrap{margin:6px 0 5px;min-height:29px}.in-play #roman{font-size:20px}.in-play .text-button{display:none}.in-play #typing{padding:8px 11px}.in-play .play-stats{margin:6px 0}.in-play .stage{gap:7px}}@media(max-width:650px) and (max-height:430px){.in-play .walk-show{height:72px}.in-play .big-traveler{height:72px;width:56px;bottom:5px}.in-play .walk-pop{top:5px;left:9px;font-size:7px}.in-play .walk-start,.in-play .walk-goal{font-size:6px}.in-play .word-card{min-height:64px;padding:6px;gap:9px}.in-play .word-photo{width:47px;height:47px}.in-play .word-content h2{font-size:19px}.in-play .word-content p{font-size:10px}.in-play .word-content strong{font-size:9px}.in-play .goal-hud strong{font-size:11px}.in-play .goal-hud>span{font-size:7px}.in-play #feedback{margin:4px 0 0;min-height:12px}.in-play .input-label{display:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:650px){.in-play.short-viewport .keyboard{display:none}.in-play.short-viewport .walk-show{height:102px}.in-play.short-viewport .big-traveler{height:95px;width:73px}.in-play.short-viewport .goal-hud{padding:5px 10px}.in-play.short-viewport .word-card{min-height:76px;padding:8px}.in-play.short-viewport .word-photo{height:56px;width:56px}.in-play.short-viewport .word-content h2{font-size:21px}.in-play.short-viewport .play-heading h2{display:none}.in-play.short-viewport .play-heading{height:27px}.in-play.short-viewport .clock b{font-size:25px}.in-play.short-viewport .roman-wrap{margin:6px 0 5px;min-height:29px}.in-play.short-viewport .text-button{display:none}.in-play.short-viewport #typing{padding:8px 11px}.in-play.short-viewport .play-stats{margin:6px 0}.in-play.tiny-viewport .walk-show{height:72px}.in-play.tiny-viewport .big-traveler{height:72px;width:56px;bottom:5px}.in-play.tiny-viewport .word-card{min-height:64px;padding:6px;gap:9px}.in-play.tiny-viewport .word-photo{width:47px;height:47px}.in-play.tiny-viewport .word-content h2{font-size:19px}.in-play.tiny-viewport .word-content p{font-size:10px}.in-play.tiny-viewport .word-content strong{font-size:9px}.in-play.tiny-viewport .goal-hud strong{font-size:11px}.in-play.tiny-viewport #feedback{margin:4px 0 0;min-height:12px}.in-play.tiny-viewport .input-label{display:none}}
.learning-headline{font-size:34px;line-height:1.5;margin:12px 0 9px}.learning-headline em{font-size:1.13em;line-height:1.4}.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mode{background:#fff;border:1px solid #d8e4dc;border-radius:10px;padding:10px 11px;text-align:left;color:var(--ink)}.mode b{font-size:11px}.mode small{display:block;font-size:8px;color:var(--muted);margin-top:4px}.mode.selected{border-color:var(--green);background:#e8f5ed;box-shadow:0 0 0 1px var(--green)}.mode-field{margin:12px 0 16px}.walk-show{background:#d9e7df}.walk-sky,.welcome-sticker{display:none}.walk-town{background-repeat:no-repeat;background-size:cover!important;background-position:50% 45%!important;opacity:1;transition:background-position-x .65s ease-in-out}.walk-show:after{content:'';position:absolute;inset:0;background:linear-gradient(#102f371a 0%,transparent 55%,#15312888 100%);pointer-events:none;z-index:0}.walk-start,.walk-goal,.big-traveler,.walk-pop{z-index:2}.walk-start,.walk-goal{color:#fff;text-shadow:0 1px 3px #142d35}.walk-pop{top:auto;bottom:28px;left:12px;right:12px;font-size:9px;max-width:max-content;color:#fff;background:#123b3bcc;border:1px solid #ffffff44;padding:5px 8px;border-radius:20px;font-weight:400}.landmark-caption{position:absolute;z-index:3;top:11px;left:12px;right:12px;width:max-content;max-width:calc(100% - 24px);padding:8px 11px;border:1px solid #ffffff88;border-radius:10px;background:#fffdf2e8;text-decoration:none;box-shadow:0 4px 12px #1d3f3514;display:flex;flex-direction:column;gap:2px}.landmark-caption small{font-size:7px;letter-spacing:1px;color:#79907b}.landmark-caption b{font-size:12px;color:#264e40}.landmark-caption>span{font-size:8px;color:#71836d}.big-traveler{filter:drop-shadow(1px 6px 3px #142e3666)}.in-play .landmark-caption{padding:7px 9px}.in-play .landmark-caption b{font-size:11px}.in-play .walk-pop{font-size:8px;bottom:26px}#landmarkcredits{margin-top:10px}.clock b{min-width:48px;text-align:center}@media(max-width:850px){.learning-headline{font-size:29px}.learning-headline em{font-size:1.1em}.mode b{font-size:10px}.mode{padding:9px}.mode small{font-size:7px}}@media(max-width:650px){.learning-headline{font-size:28px;margin-top:10px}.learning-headline em{font-size:1.12em}.mode-field{margin:13px 0}.mode b{font-size:11px}.mode small{font-size:8px}.landmark-caption{top:8px;left:auto;right:8px;padding:7px 9px;max-width:65%}.landmark-caption b{font-size:11px}.landmark-caption small{font-size:6px}.in-play .landmark-caption{max-width:66%;padding:6px 8px;top:7px}.in-play .landmark-caption small{display:none}.in-play .landmark-caption b{font-size:10px}.in-play .landmark-caption>span{font-size:7px}.in-play .walk-pop{bottom:6px;left:7px;font-size:7px;padding:3px 6px}.in-play .walk-start{display:none}.in-play .walk-goal{bottom:7px}.in-play.short-viewport .landmark-caption b,.in-play.tiny-viewport .landmark-caption b{font-size:9px}.in-play.tiny-viewport .landmark-caption{top:5px;right:5px;padding:4px 6px}.in-play.tiny-viewport .landmark-caption>span{font-size:6px}.in-play.tiny-viewport .walk-pop{font-size:6px;padding:2px 4px;bottom:4px}}
/* Focused arcade view. Home and dictionary retain their own layout. */
.countdown{position:fixed!important;inset:0!important;z-index:10000!important;background:radial-gradient(circle at 50% 45%,#245f50f7,#102f29fc)!important;color:#fff;gap:25px;pointer-events:auto}.countdown>span{color:#d4eaca;font-size:12px;letter-spacing:2px}.countdown strong{color:#fff6cc;font-size:clamp(60px,12vw,130px);text-shadow:0 5px 0 #102f29;animation:count-bounce .4s ease-out}.countdown small{color:#b9d4c5;font-size:12px}.countdown-dots{display:flex;gap:10px}.countdown-dots i{width:9px;height:9px;background:#e8bc72;border-radius:50%;animation:count-dot .6s infinite alternate}.countdown-dots i:nth-child(2){animation-delay:.2s}.countdown-dots i:nth-child(3){animation-delay:.4s}.is-countdown #typing{opacity:.5}.in-play main{max-width:1030px;padding-top:10px}.in-play .stage{display:flex;flex-direction:column;gap:10px;height:calc(var(--appheight) - 72px);max-height:none}.in-play .stage-left{order:2;flex:1;min-height:0;overflow:auto;width:100%;padding:0 12px}.in-play .map-panel{order:1;display:block;flex-shrink:0;height:151px;border-radius:13px}.in-play .map-top,.in-play .map-wrap,.in-play .map-bottom,.in-play .map-legend{display:none}.in-play .walk-show{height:116px;min-height:0;max-height:none;flex:none;margin:0;border:0;border-radius:0}.in-play .big-traveler{height:114px;width:86px;bottom:5px}.in-play .goal-hud{height:34px;padding:6px 15px;background:#e5efdc}.in-play .goal-hud strong{font-size:13px}.in-play .walk-pop{bottom:6px;font-size:8px}.in-play .landmark-caption{left:auto;right:11px;top:10px;padding:6px 10px}.in-play .landmark-caption b{font-size:11px}.in-play .landmark-caption small{display:none}.in-play .play-heading{height:34px}.in-play .play-heading h2{display:none}.in-play .play-heading .eyebrow{font-size:9px}.in-play .clock b{font-size:29px}.in-play .clock span{font-size:9px}.in-play .timer{height:3px}.in-play .play-stats{margin:8px 0;font-size:9px;font-weight:700}.word-window{background:#183f35;border:3px solid #dfbd7d;border-radius:14px;box-shadow:0 5px 0 #b1976c;position:relative;padding:0 17px;margin-bottom:13px;overflow:hidden}.order-header{display:flex;justify-content:space-between;color:#bad3bb;font-size:9px;padding:9px 0 6px;letter-spacing:1px}.word-window .word-card{background:transparent;border:0;box-shadow:none;border-radius:0;justify-content:center;padding:8px 10px;min-height:92px;gap:20px;text-align:center}.word-window .word-photo{width:76px;height:76px;border-radius:50%;border:4px solid #fff8df;box-shadow:0 0 0 3px #c5ab6e;background:#e2edcf}.word-window .word-photo #category{font-size:6px;padding:3px}.word-window .word-content h2{color:#fff9df;font-size:33px}.word-window .word-content p{color:#f1d99a;font-size:15px}.word-window .word-content strong{color:#c1dbbe;font-size:12px}.word-window .word-content button{color:#b0c6b3;font-size:9px}.word-time-track{height:3px;background:#3e6654;border-radius:5px;overflow:hidden;margin:5px 0 0}.word-time-track i{display:block;height:100%;width:100%;background:#edb764;transition:width .05s linear}.word-window .roman-wrap{justify-content:center;text-align:center;min-height:49px;margin:9px 0 11px}.word-window #roman{color:#709884;font-size:30px;letter-spacing:2px;flex:0 1 auto}.word-window #roman .done{color:#f3c86c}.word-window #roman .current{color:#fff9df;border-color:#eab56b}.answer-burst{position:absolute;right:15px;top:28px;color:#fff4bf;font-size:12px;pointer-events:none;opacity:0;z-index:2;background:#215e4b;padding:5px 9px;border-radius:20px}.answer-burst.pop{animation:answer-pop .8s ease-out forwards}.in-play #typing{padding:10px 14px;font-size:20px}.in-play .input-label{font-size:8px;margin-bottom:5px}.in-play .keyboard{max-width:610px;margin:9px auto 0;padding:6px}.in-play .keyboard span{height:20px;font-size:9px}.in-play .keyboard .space-key{height:10px;font-size:6px}.in-play .keyboard>div{gap:4px;margin-bottom:3px}.in-play #feedback{text-align:center;font-size:9px;margin:8px 0 2px}.in-play .learning-tip{display:none}.in-play .text-button{display:block;margin:auto;font-size:8px;padding:3px}.in-play .new-word .word-card{animation:order-in .24s ease-out}.in-play .new-word #roman{animation:order-in .24s ease-out}@keyframes count-bounce{from{transform:scale(.8);opacity:.4}to{transform:scale(1);opacity:1}}@keyframes count-dot{to{opacity:.3;transform:translateY(-5px)}}@keyframes order-in{from{transform:translateX(25px);opacity:.3}to{transform:translateX(0);opacity:1}}@keyframes answer-pop{0%{opacity:1;transform:translateY(5px)}75%{opacity:1;transform:translateY(-4px)}100%{opacity:0;transform:translateY(-12px)}}@media(max-width:650px){.countdown>span{font-size:10px;letter-spacing:0}.countdown small{font-size:10px}.in-play main{padding:7px 10px 0}.in-play .stage{height:calc(var(--appheight) - 57px);gap:8px}.in-play .stage-left{padding:0 2px}.in-play .map-panel{height:135px;border-radius:11px}.in-play .walk-show{height:106px}.in-play .goal-hud{height:28px;padding:5px 10px}.in-play .goal-hud strong{font-size:12px}.in-play .big-traveler{height:104px;width:78px}.in-play .play-heading{height:30px}.in-play .play-stats{margin:7px 0;font-size:8px}.word-window{padding:0 10px;margin-bottom:10px;border-width:2px;border-radius:11px}.order-header{font-size:8px;padding:7px 0 4px;letter-spacing:0}.word-window .word-card{min-height:89px;padding:7px 2px;gap:14px}.word-window .word-photo{width:64px;height:64px;border-width:3px}.word-window .word-content h2{font-size:28px}.word-window .word-content p{font-size:13px}.word-window .word-content strong{font-size:11px}.word-window .word-content button{position:static;font-size:8px;padding-top:4px}.word-window .roman-wrap{min-height:41px;margin:7px 0 10px}.word-window #roman{font-size:23px;letter-spacing:1px}.in-play #typing{font-size:19px;padding:10px 12px}.in-play .keyboard{margin-top:9px}.in-play .keyboard span{height:20px}.in-play .keyboard .space-key{height:10px}.answer-burst{font-size:10px;top:25px;right:8px}.in-play .text-button{display:block}}@media(max-height:650px){.in-play .keyboard{display:none}.in-play .map-panel{height:116px}.in-play .walk-show{height:87px}.in-play .big-traveler{height:86px;width:65px}.in-play .goal-hud{height:28px;padding:5px 10px}.word-window .word-card{min-height:76px}.word-window .word-photo{width:58px;height:58px}.word-window .word-content h2{font-size:26px}.word-window .roman-wrap{min-height:35px;margin:6px 0 9px}.word-window #roman{font-size:24px}}@media(max-width:650px){.in-play.short-viewport .keyboard{display:none}.in-play.short-viewport .map-panel{height:104px}.in-play.short-viewport .walk-show{height:78px}.in-play.short-viewport .big-traveler{height:77px;width:59px}.in-play.short-viewport .goal-hud{height:25px;padding:4px 9px}.in-play.short-viewport .word-card{min-height:72px;padding:5px 2px}.in-play.short-viewport .word-photo{width:54px;height:54px}.in-play.short-viewport .word-content h2{font-size:24px}.in-play.short-viewport .roman-wrap{min-height:33px;margin:6px 0 9px}.in-play.short-viewport #roman{font-size:22px}.in-play.tiny-viewport .map-panel{height:80px}.in-play.tiny-viewport .walk-show{height:57px}.in-play.tiny-viewport .big-traveler{height:57px;width:44px}.in-play.tiny-viewport .goal-hud{height:22px}.in-play.tiny-viewport .play-heading{height:24px}.in-play.tiny-viewport .clock b{font-size:22px}.in-play.tiny-viewport .word-card{min-height:62px;padding:3px 0}.in-play.tiny-viewport .word-photo{width:45px;height:45px}.in-play.tiny-viewport .word-content h2{font-size:21px}.in-play.tiny-viewport .word-content p{font-size:11px}.in-play.tiny-viewport .word-content strong{font-size:9px}.in-play.tiny-viewport .word-content button{display:none}.in-play.tiny-viewport .order-header{font-size:7px;padding:5px 0 2px}.in-play.tiny-viewport .roman-wrap{margin:4px 0 7px;min-height:28px}.in-play.tiny-viewport #roman{font-size:20px}.in-play.tiny-viewport #typing{padding:8px 10px}.in-play.tiny-viewport .input-label,.in-play.tiny-viewport .text-button{display:none}.in-play.tiny-viewport #feedback{font-size:7px;margin-top:5px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* One continuous Thai flag, from the top of the page to the bottom: 1:1:2:1:1. */
:root{--flag-red:#f9dedf;--flag-white:#fffefd;--flag-blue:#dce8f7;--ink:#24344f;--green:#395b89;--cream:#fffefd;--muted:#748097;--line:#dfdfeb;--orange:#d58286}
html{background:#f9dedf}body{min-height:100vh;background-color:var(--flag-red);background-image:linear-gradient(to bottom,var(--flag-red) 0%,var(--flag-red) 16.6667%,var(--flag-white) 16.6667%,var(--flag-white) 33.3333%,var(--flag-blue) 33.3333%,var(--flag-blue) 66.6667%,var(--flag-white) 66.6667%,var(--flag-white) 83.3333%,var(--flag-red) 83.3333%,var(--flag-red) 100%);background-size:100% 100%;background-repeat:no-repeat}
header{border-bottom:1px solid #bc748329;position:relative}header:before{content:'';position:absolute;top:0;left:32px;right:32px;height:4px;background:linear-gradient(to right,#c87982 0 16.6667%,#fff 16.6667% 33.3333%,#7893be 33.3333% 66.6667%,#fff 66.6667% 83.3333%,#c87982 83.3333%);border-radius:0 0 4px 4px}.logo{color:#30466b}.logo span{color:#bd6f7f}.header-note{color:#976f82}.header-actions button{background:#fff9;border-color:#e5c3ca;color:#6e617e}.header-actions a{color:#7e6a83}.learning-headline{color:#593e53}.learning-headline em{color:#385c8e}.eyebrow{color:#96657c}.eyebrow i{background:#d68b94}.tagline strong{color:#6c6b87}.lead{color:#7c788b}.choice,.level,.mode{background:#fffdfbf2;border-color:#dfd9e4}.choice{box-shadow:0 3px 0 #d5b9c628}.choice.selected,.level.selected,.mode.selected{background:#edf3fc;border-color:#718cb7;box-shadow:0 0 0 1px #718cb7}.choice.selected:after{background:#6884ad}.mode small,.choice small,.level small{color:#7c8195}legend>span{color:#bf7d8c}.primary{background:#41648f;box-shadow:0 4px 0 #2b4366}.primary:hover{background:#35557c}.primary:focus-visible{outline-color:#cb8993}.personal-best{border-color:#d7bdc93d}.personal-best>span{color:#ad7588}.trip-info{color:#887b92}.photo-tastes img{box-shadow:0 3px 8px #714c6810}.map-panel{border-color:#ced6e8;background:#e8eef8;box-shadow:0 16px 35px #5d658513}.goal-hud{background:#eaf0fa!important;border-color:#cfdaeb}.goal-hud strong{color:#405c83}.goal-hud>span{color:#ab7787}.map-bottom{background:#dce6f6;border-color:#c6d4e9}.map-bottom small,.map-bottom-right>span{color:#6982a4}.map-bottom strong{color:#3f5b86}.progress-track{background:#bfcee5}.progress-track i{background:#6b85b3}.map-legend{color:#7e8da7}.map-top{color:#7b89a4}.map-wrap>svg{border-radius:8px}.map-postcard{background:#fffef6ee;border-color:white}.map-postcard b{color:#526581}.manifesto{border-color:#b8c9e044;background:#ffffff80;border-radius:19px;padding:34px 20px;margin-top:30px;box-shadow:0 6px 26px #627ba308}.manifesto>span{color:#ae788e}.manifesto h2{color:#405880}.manifesto p{color:#7b86a1}.manifesto b{color:#5e79a5}.manifesto div>span{color:#7a83a0}.dict-heading .eyebrow{color:#9b748b}.dict-heading h2{color:#3c547a}.dict-heading input{background:#fffefce8;border-color:#d3def0;color:#4c5e7d}.dict-card{background:#fffefbea;border-color:#e0e6f2;box-shadow:0 3px 12px #8399bc08}.dict-card>span{color:#9693a7}.dict-card h3{color:#3f5e89}.dict-card b{color:#687895}.dict-card button{background:#eaf0fa;color:#59739a}.dict-note,.about{color:#8b8195}.about{border-color:#d2bfd03d}.about a,.dict-note a{color:#70648a}.secondary{border-color:#d4dbea;color:#596f95;background:#ffffff66}.result-title{color:#4f6285}.result-percent{color:#607ba7}.result-sub{color:#8b8297}.retry-ribbon{background:#edf1fa;border-color:#d1dbed;color:#6c7e9f}.goal-ribbon{background:#fff0d5;border-color:#e9d2ba;color:#9d7866}.result-stats{border-color:#d9d5e5}.result-stats b{color:#5d6f90}footer{border-color:#c897a929;color:#a46f84}footer span{color:#aa8595}.in-play .countdown{background:radial-gradient(circle at 50% 45%,#3e547cf7,#25324bfc)!important}.in-play .word-window{background:#253c5c;border-color:#dfc3bd;box-shadow:0 5px 0 #ad929b}.in-play .order-header{color:#b7c8e0}.in-play .word-window .word-content h2{color:#fff8ee}.in-play .word-window .word-content p{color:#efd4d3}.in-play .word-window .word-content strong{color:#bfcfe8}.in-play .word-window #roman{color:#7188a9}.in-play .word-window #roman .done{color:#efb3b9}.in-play .word-window #roman .current{color:#fff8ee;border-color:#e5b3bd}.in-play .word-time-track{background:#52698a}.in-play .word-time-track i{background:#e4b0ba}.in-play .answer-burst{background:#506987;color:#fff2ec}.in-play .keyboard{background:#e1e7f2;border-color:#c9d4e7;box-shadow:0 4px 0 #b3c2db}.in-play .keyboard span{border-color:#d1daea;border-bottom-color:#b8c8e2;color:#61799e}.in-play .keyboard .key-next{background:#f6d5d9;border-color:#d8a4af;color:#885967;box-shadow:0 0 0 2px #dd9cab22}.in-play #typing:focus{border-color:#7b96be;box-shadow:0 0 0 4px #7b96be13}.in-play .timer i{background:#d794a1}
@media(max-width:650px){header:before{left:16px;right:16px}.manifesto{padding:26px 10px;border-radius:14px}}
/* The opening red ends at the title. Dark blue belongs only to the choices. */
:root{--intro-band-end:310px;--selection-navy:#294773}html{background:#fffefd}body{background-color:#fffefd;background-image:linear-gradient(to bottom,#f9dedf 0px,#f9dedf var(--intro-band-end),#fffefd var(--intro-band-end),#fffefd 100%);background-size:100% 100%}.in-play{background:#fffefd}.selection-zone{background:var(--selection-navy);padding:17px 16px 5px;border:1px solid #203b64;border-radius:14px;margin:17px 0 0;box-shadow:0 5px 0 #1a315625,0 12px 30px #344d7410}.selection-zone fieldset{margin:0 0 15px}.selection-zone legend{color:#fff8f3;font-size:11px;margin-bottom:9px}.selection-zone legend>span{color:#f0b8c0}.selection-zone .mode,.selection-zone .level,.selection-zone .choice{background:#fffefd;border:1px solid #fff7;color:#2e4566;box-shadow:0 2px 0 #122d4b40}.selection-zone .mode small,.selection-zone .level small,.selection-zone .choice small{color:#7b8798}.selection-zone .mode.selected,.selection-zone .level.selected,.selection-zone .choice.selected{background:#e4efff;border:2px solid #b3cff8;box-shadow:0 0 0 2px #8caee84d}.selection-zone .choice.selected:after{background:#507ab2;color:white}.selection-zone button:hover{border-color:#d9e7ff;background:#f1f6ff}.selection-zone button:focus-visible{outline:3px solid #f5bac2;outline-offset:3px}.tagline,.lead{position:relative}.trip-info{margin-top:16px}.map-panel{background:#fffefd;border-color:#e6e4e7}.map-wrap{background:#f4f6ef}.map-top{background:#fffefd}.goal-hud{background:#fffaf6!important;border-color:#e8dedc}.map-bottom{background:#fff9f6;border-color:#e6dfdf}.manifesto{background:#fffefd;box-shadow:none}.dict-card{background:#fffefd;border-color:#e3e5e9}.dictionary{background:transparent}.about{background:transparent}footer{background:#f9dedf;box-shadow:0 0 0 100vmax #f9dedf;clip-path:inset(0 -100vmax);border-top:1px solid #d9a6b32b;color:#a46f84}.in-play .goal-hud{background:#fffaf6!important}.in-play .map-panel{background:#fffefd}.in-play .word-window{background:#183f35;border-color:#dfbd7d}.in-play .word-window .word-content p{color:#f1d99a}.in-play .word-window #roman .done{color:#f3c86c}.in-play .word-window #roman .current{border-color:#eab56b}.in-play .word-time-track i{background:#edb764}.in-play .keyboard{background:#e5ebe8;border-color:#cfdbd5;box-shadow:0 4px 0 #bbc9c1}.in-play .keyboard .key-next{background:#f5bf70;border-color:#d49a4e;color:#604619}.in-play .timer i{background:#e99b5b}@media(max-width:650px){.selection-zone{padding:14px 12px 3px;margin-top:14px;border-radius:12px}.selection-zone fieldset{margin-bottom:13px}.selection-zone legend{font-size:10px}.selection-zone .mode b{font-size:10px}.selection-zone .mode small{font-size:7px}}
/* A real red header section: the boundary is its bottom edge, never a measured gradient. */
html,body{background:#fffefd!important;background-image:none!important}header{background:#c65365;color:#fff9f4;box-shadow:0 0 0 100vmax #c65365;clip-path:inset(0 -100vmax);border-bottom:0}header .logo,header .logo span{color:#fff9f4}.header-note{color:#f0cbd1}.header-actions a{color:#fff4f1}.header-actions button{background:#ffffff16;color:#fff4ef;border-color:#f0c0ca88}main{padding-top:0}.brand-banner{position:relative;background:#c65365;color:#fffaf4;margin:0 0 26px;padding:24px 6px 27px;box-shadow:0 0 0 100vmax #c65365;clip-path:inset(0 -100vmax);border-bottom:5px solid #b4485a}.brand-banner p{font-size:15px;font-weight:600;letter-spacing:2px;margin:0 0 8px;color:#ffe3e4}.brand-banner h1{font-size:42px;margin:0;line-height:1.5;color:#fffdf5;letter-spacing:1px}.brand-banner h1 span{font-size:25px;letter-spacing:0;margin-left:8px;font-weight:600}.in-play .brand-banner{display:none}.in-play header{background:#c65365}.in-play .ranking{display:none}.ready-panel{background:#fffaf1;border:2px solid #d6b36f;border-radius:14px;text-align:center;padding:35px 24px;margin-top:16px;box-shadow:0 8px 0 #e2d4bb}.ready-panel>span{font-size:10px;letter-spacing:3px;color:#aa8b55}.ready-panel h2{font-size:26px;color:#365647;margin:18px 0 13px}.ready-panel p{font-size:12px;line-height:2;color:#738370;margin-bottom:25px}.ready-panel .primary{max-width:360px;justify-content:center;margin:auto;font-size:20px;padding:18px;background:#285f4b;box-shadow:0 5px 0 #173d30}.ready-panel .text-button{margin-top:18px!important;font-size:11px!important}.is-ready #play>:not(.play-heading):not(#ready){display:none!important}.ranking{background:#fffaf4;border:1px solid #e4dce5;border-radius:16px;margin:28px 0 15px;padding:23px}.ranking h2{font-size:24px;margin:7px 0}.ranking .secondary{max-width:150px;flex:0 0 auto}.ranking-scroll{width:100%;overflow-x:auto;margin-top:17px;border:1px solid #e0e4ed;border-radius:9px}.ranking table{width:100%;border-collapse:collapse;min-width:560px;background:white;font-size:12px}.ranking th,.ranking td{text-align:left;border-bottom:1px solid #e6e9ef;padding:12px}.ranking th{background:#294773;color:#fff;font-size:11px;font-weight:500;white-space:nowrap}.ranking td:first-child{font-weight:700;color:#b58b46}.ranking td:nth-child(3){color:#395e96;font-weight:600}.ranking tbody tr:nth-child(even){background:#f6f8fc}.ranking #rankstatus,.rank-note{font-size:10px;line-height:1.8;color:#8390a0}.rank-submit{padding:16px;background:#edf3fb;border:1px solid #d4deef;border-radius:12px;margin:18px 0}.rank-submit label{display:block;font-size:11px;color:#5c7599;margin-bottom:8px}.rank-submit input{border:1px solid #c7d4e8;border-radius:8px;padding:11px;width:100%;font-size:14px;color:#34577c;background:white}.rank-submit button{width:100%;margin-top:10px;background:#395e8a;color:white;border:0;font-size:12px}.rank-submit button:disabled{opacity:.45;cursor:default}.rank-submit p{font-size:10px;line-height:1.8;color:#7d899c;margin-bottom:0}.result-stats{flex-wrap:wrap;gap:19px}.result-percent{font-size:68px}.in-play .play-stats #scorehud{color:#b47e37;font-size:12px;font-weight:800}#scorehud{margin-left:auto;margin-right:20px}.in-play .ready-panel .text-button{display:block!important}@media(max-width:650px){.brand-banner{padding:18px 0 22px;margin-bottom:20px;border-bottom-width:4px}.brand-banner p{font-size:12px;letter-spacing:1px}.brand-banner h1{font-size:31px}.brand-banner h1 span{font-size:18px;display:block;margin:3px 0 0}.ranking{padding:17px 12px}.ranking h2{font-size:21px}.ranking .dict-heading{display:flex;align-items:start;gap:8px}.ranking .secondary{font-size:9px;padding:9px;max-width:95px}.ready-panel{padding:25px 16px;margin-top:12px}.ready-panel h2{font-size:22px}.ready-panel p{font-size:11px}.ready-panel .primary{font-size:18px}.result-percent{font-size:58px}}
.elephant-photo{float:right;width:220px;height:141px;margin:-10px 12px 0 20px;transform:rotate(3deg);border:5px solid #fff4e7;border-bottom-width:23px;border-radius:9px;background:#fff4e7;box-shadow:0 7px 15px #713d4f30;position:relative;overflow:visible}.elephant-photo img{width:100%;height:100%;display:block;object-fit:cover;border-radius:3px}.elephant-photo figcaption{position:absolute;bottom:-20px;left:0;right:0;font-family:'Noto Sans Thai','Noto Sans JP',sans-serif;color:#956771;font-size:9px;text-align:center;line-height:19px}.brand-banner{min-height:178px;display:flow-root}.brand-banner h1{font-size:39px}.brand-banner h1 span{font-size:23px}.travel-rule{margin:16px 0 10px;background:#fff2d7;border:1px solid #ebd8ad;border-radius:11px;padding:12px 14px;color:#8e7145}.travel-rule strong{font-size:12px}.travel-rule p{font-size:10px;line-height:1.9;margin:7px 0}.travel-rule small{font-size:9px;line-height:1.6;display:block}.travel-wallet{display:flex;justify-content:space-between;gap:10px;padding:7px 0 0;font-size:9px;color:#9b845c}.travel-wallet b{font-size:11px;color:#af7635}.travel-result{background:#fff2d5;border:1px solid #e9d3a7;border-radius:12px;padding:16px;margin:15px 0;color:#8e6a33}.travel-result>span{font-size:9px;letter-spacing:.5px}.travel-result h3{font-size:23px;margin:8px 0}.travel-result p{font-size:10px;line-height:1.9;margin:6px 0}.travel-result strong{font-size:11px;font-weight:500}.travel-result.loss{background:#f6e8e9;border-color:#e7c7cd;color:#9c6876}.walked-result{padding:13px 15px;background:#eaf3ed;color:#447960;border-radius:10px;font-size:18px;font-weight:700;line-height:1.8}.walked-result small{display:block;font-size:9px;font-weight:400;color:#8b9b8e}.result-stats{margin-bottom:12px}.in-play .travel-wallet{font-size:8px;padding-top:5px}.in-play .play-stats{margin-top:6px}.is-ready #travelwallet{display:none!important}@media(max-width:850px){.elephant-photo{width:165px;height:129px;margin-right:0}.brand-banner h1{font-size:32px}.brand-banner h1 span{font-size:20px}}@media(max-width:650px){.elephant-photo{width:112px;height:105px;border-width:3px;border-bottom-width:19px;margin:6px 0 0 10px;transform:rotate(3deg)}.elephant-photo figcaption{font-size:6px;bottom:-17px;line-height:17px}.brand-banner{min-height:150px}.brand-banner p{font-size:11px;letter-spacing:0}.brand-banner h1{font-size:27px;letter-spacing:-1px;line-height:1.5}.brand-banner h1 span{font-size:16px;margin-top:2px}.travel-rule{padding:10px 12px}.travel-rule p{font-size:9px}.travel-rule small{font-size:8px}.in-play .travel-wallet>span{display:none}.in-play .travel-wallet{justify-content:flex-end;font-size:8px;padding-top:4px}.in-play .travel-wallet b{font-size:10px}.travel-result h3{font-size:21px}.walked-result{font-size:16px}.in-play.tiny-viewport .travel-wallet{padding-top:2px}.in-play.tiny-viewport .travel-wallet b{font-size:8px}}
.elephant-illustration{float:right;width:235px;height:185px;margin:-24px -4px -12px 20px;position:relative;filter:drop-shadow(0 7px 4px #7b33482b)}.elephant-illustration img{width:100%;height:100%;display:block;object-fit:contain;transform:rotate(-3deg)}.elephant-illustration figcaption{font-size:10px;position:absolute;right:6px;bottom:0;background:#fff6e7;color:#9d5e70;border-radius:20px;padding:3px 10px;transform:rotate(5deg)}.brand-banner{min-height:191px}.travel-rule{background:#e8f2ed;border-color:#c9dfd1;color:#527d66}.distance-result{background:#e7f1ec;border-color:#c8ddce;color:#417459}.distance-result h3{font-size:24px}.travel-wallet{color:#75907e}.travel-wallet b{color:#478467}.in-play .play-stats #scorehud{color:#5f9277}.result-percent{color:#42775f}.ranking th:nth-child(3){min-width:95px}.ranking td:nth-child(3){color:#477a61}@media(max-width:850px){.elephant-illustration{width:190px;height:161px;margin-top:-16px}.brand-banner{min-height:180px}}@media(max-width:650px){.elephant-illustration{width:140px;height:141px;margin:0 -7px -10px 5px}.elephant-illustration figcaption{font-size:7px;padding:2px 7px;bottom:0}.brand-banner{min-height:167px;padding-bottom:18px}.brand-banner h1{font-size:25px}.brand-banner h1 span{font-size:15px}.brand-banner p{font-size:10px}.distance-result h3{font-size:21px}.travel-rule p{line-height:1.9}}
.is-boosting .big-traveler:after{content:'🛺';position:absolute;right:-25px;bottom:8px;font-size:35px;filter:drop-shadow(0 2px 2px #173d3033);animation:tuk-boost .2s infinite alternate}.is-boosting .walk-show:before{content:'➜ ➜ ➜';position:absolute;bottom:20px;left:20px;right:20px;letter-spacing:25px;font-size:22px;font-weight:900;color:#fff9bca6;z-index:1;animation:tuk-trail .4s infinite}.is-boosting .travel-wallet b{color:#d58a39}@keyframes tuk-boost{to{transform:translate(5px,-3px)}}@keyframes tuk-trail{from{transform:translateX(-10px);opacity:.4}to{transform:translateX(10px);opacity:1}}@media(max-width:650px){.is-boosting .big-traveler:after{font-size:24px;right:-17px;bottom:6px}.is-boosting .walk-show:before{font-size:15px;letter-spacing:14px;bottom:12px}}@media(prefers-reduced-motion:reduce){.is-boosting .big-traveler:after,.is-boosting .walk-show:before{animation:none}}

.learning-guide{max-width:1040px;margin:24px auto;padding:22px 24px;border:1px solid #e4e8e7;border-radius:18px;background:#fff}.learning-guide h2{font-size:clamp(18px,2.3vw,25px);margin:7px 0 12px}.learning-guide p:not(.eyebrow){font-size:14px;line-height:1.9;color:#526460}.in-play .learning-guide{display:none}