@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Gowun+Batang:wght@400;700&display=swap');
:root{color-scheme:dark;--ink:#101929;--panel:#192538;--paper:#eee7d6;--muted:#a6b4be;--gold:#f4bc83;--mint:#9bdbbe;--line:#b6c4ce26}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper);font-family:system-ui,-apple-system,sans-serif;font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);background:#ffffff07;border-radius:7px;padding:10px 15px;transition:background .15s,border-color .15s}button:hover{background:#ffffff13;border-color:#eddcc36b}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--mint);outline-offset:4px}a{color:inherit;text-decoration:none}header{height:74px;display:flex;align-items:center;justify-content:space-between;max-width:1440px;margin:auto;padding:0 40px;border-bottom:1px solid var(--line);gap:16px}.back{font:500 12px 'DM Mono',monospace;letter-spacing:2px}.back span{color:var(--muted);letter-spacing:0}.brand{font:700 19px 'Gowun Batang',serif;letter-spacing:4px}.brand span{font:11px system-ui;letter-spacing:1px;color:var(--muted);margin-left:10px}.settings{display:flex;gap:6px}.settings button{font-size:11px;padding:8px 10px}main{max-width:1280px;padding:0 40px;margin:auto}.hud{display:flex;align-items:center;justify-content:space-between;gap:16px;height:104px}.eyebrow{font:10px 'DM Mono',monospace;letter-spacing:2.3px;color:var(--gold)}h1{font:700 23px 'Gowun Batang',serif;margin:7px 0 0}.journey{display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:1px;color:#73818e}.journey i{width:46px;height:1px;background:var(--line)}.stop.active{color:var(--gold)}.stop.done{color:var(--mint)}.score{text-align:right}.score small{font:9px 'DM Mono',monospace;letter-spacing:1.5px;color:var(--muted)}.score b{display:block;font:26px 'DM Mono',monospace;margin-top:6px}.scene{height:clamp(270px,42vh,480px);position:relative;border:1px solid #8397ae40;border-radius:12px 12px 0 0;overflow:hidden;background:#1d3042}canvas{width:100%;height:100%;display:block}.scene-grain{position:absolute;inset:0;pointer-events:none;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E")}.scene-caption{position:absolute;left:25px;right:25px;top:20px;display:flex;justify-content:space-between;font:9px 'DM Mono',monospace;letter-spacing:1.4px;color:#b8c9cd}.gap{position:absolute;top:55px;left:25px;width:150px}.gap>span{font-size:10px;color:#d5dbd6}.gap b{display:block;font:32px 'DM Mono',monospace;margin:4px 0 8px;color:var(--mint)}.gap b small{font-size:12px}.gap-track{background:#0812227a;height:4px;border-radius:3px;overflow:hidden}.gap-track i{display:block;width:54%;height:100%;background:var(--mint);transition:width .12s}.danger .gap b{color:#ffaaa4}.danger .gap-track i{background:#ffaaa4}#cue-marker{position:absolute;right:8%;bottom:26%;padding:8px 12px;border:1px solid #efd6a750;border-radius:4px;background:#142335dd;color:#ffe0ae;font-size:10px}#toast{position:absolute;left:10px;right:10px;text-align:center;bottom:18px;color:#f9dfb6;text-shadow:0 2px 6px #000;font-size:12px}#surge{position:absolute;top:60px;right:25px;background:#6e3f4bab;color:#ffe0d5;padding:8px 12px;border:1px solid #dc93914a;border-radius:5px;font-size:11px}.typing{background:linear-gradient(120deg,#213143,#1b283b);border:1px solid #8397ae40;border-top:0;border-radius:0 0 12px 12px;padding:24px 32px 18px;position:relative}.action-meta,.typing-bottom{display:flex;justify-content:space-between;gap:12px}.action-meta .eyebrow{font-size:10px;letter-spacing:1px}#word-count{color:var(--muted);font:11px 'DM Mono',monospace}#cue{font-size:13px;margin:12px 0;color:#c6cfd1}.word-line{display:flex;align-items:center;gap:24px;min-height:65px;flex-wrap:wrap}#word{font:500 clamp(27px,3.9vw,47px) 'DM Mono',ui-monospace,monospace;letter-spacing:2px;white-space:nowrap}.typed{color:var(--mint)}.remaining{color:#e9e6d9}.current{border-bottom:3px solid var(--gold);padding-bottom:3px;color:var(--gold)}.wrong .current{color:#ff9d9d;border-color:#ff9d9d}#meaning{color:var(--muted);font-size:13px;border-left:1px solid var(--line);padding-left:24px}.typing-bottom{color:#93a5b2;font-size:10px;margin-top:15px}#combo{color:var(--gold)}.controls{display:flex;gap:14px;align-items:center;margin-top:18px;border-top:1px solid var(--line);padding-top:14px;font-size:10px}.controls button{padding:8px 12px;font-size:10px}#boost{color:var(--gold);border-color:#f4bc8340}kbd{font:9px 'DM Mono',monospace;background:#ffffff0a;padding:2px 5px;border:1px solid var(--line);border-radius:3px;margin-right:5px}#charges{margin-left:15px}#keyboard{margin-left:auto}#mobile-input{position:absolute;opacity:.01;pointer-events:none;bottom:6px;right:6px;width:1px;height:1px;font-size:16px}footer{display:flex;justify-content:space-between;gap:12px;padding:20px 0;color:#8195a5;font-size:10px}footer a{color:#bac5c6}.overlay{position:fixed;inset:0;background:#081220b8;backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;z-index:20;padding:24px;overflow-y:auto}.overlay[hidden],[hidden]{display:none!important}.card{background:#192638;border:1px solid #b0b8b840;border-radius:16px;box-shadow:0 35px 110px #0008}.welcome{display:grid;grid-template-columns:1.1fr 1fr;width:min(920px,100%);overflow:hidden}.welcome-story{position:relative;background:linear-gradient(160deg,#2b4052,#203344 60%,#1b2b3d);padding:48px 42px}.welcome-story h2{font:700 clamp(28px,3vw,39px)/1.5 'Gowun Batang',serif;letter-spacing:-1px;margin:43px 0 20px}.welcome-story h2 em{font-style:normal;color:var(--gold)}.welcome-story p{font-size:12px;line-height:2.1;color:#bdcbd0}.stamp{position:absolute;right:26px;top:23px;text-align:center;font:10px/1.5 'DM Mono',monospace;letter-spacing:2px;color:#9ab7b1;transform:rotate(12deg);border:2px double #9ab7b166;padding:9px;border-radius:50%;width:76px;height:76px}.stamp small{font-size:7px;letter-spacing:1px}blockquote{margin:25px 0;color:#e0c39f;font:15px/1.8 'Gowun Batang',serif}.story-meta{font:9px 'DM Mono',monospace;color:#91aaa9;margin-top:36px}.story-meta i{font-style:normal;margin:0 10px}.welcome-controls{padding:40px 36px}.welcome-controls h3{font-size:17px;font-weight:500;margin:10px 0 20px}#paces{display:grid;gap:7px}.pace{display:flex;align-items:center;justify-content:space-between;text-align:left;padding:12px 14px}.pace b{font-size:12px;font-weight:500}.pace span{font-size:9px;color:var(--muted)}.pace[aria-pressed=true]{background:#deb78a13;border-color:#e4bc83;color:var(--gold)}.how{margin:22px 0;font-size:10px;color:#a5b6c0}.how p{display:flex;gap:14px;line-height:1.5}.how b{width:48px;font:9px 'DM Mono',monospace;letter-spacing:1px;color:#dfc39e}.primary{display:block;width:100%;background:var(--gold);color:#202a38;font-weight:650;padding:15px;border:0}.primary:hover{background:#fbd3a5}.note{color:#94a6b4;font-size:10px;line-height:1.8;text-align:center}.welcome-controls .note{margin:15px 0 0}#personal-best{font-size:10px;color:var(--mint);text-align:center;min-height:12px}.small-card{width:min(580px,100%);padding:36px;text-align:center}.small-card h2,.result-card h2{font:700 29px 'Gowun Batang',serif;margin:16px 0}.small-card>p{color:var(--muted);font-size:12px}.route-options,.rest-options{display:flex;gap:12px;margin:25px 0}.route-options button,.rest-options button{flex:1;text-align:left;padding:20px 16px}.route-options b{display:block;font-size:14px;margin:10px 0}.route-options small{font-size:10px;color:var(--mint)}.route-options span{display:block;font-size:10px;color:var(--muted);line-height:1.7}.route-options .selected{border-color:var(--gold);background:#f4bc8310}.rest-options button{font-size:13px;text-align:center}.rest-options small{display:block;font-size:10px;color:var(--muted);margin-top:8px}.rest-options [aria-pressed=true]{border-color:var(--mint);background:#9bdbbe12}.departure{border-top:1px solid var(--line);padding-top:18px}.departure b{font-size:13px;color:var(--gold)}.departure>div{height:3px;background:#ffffff10;margin:14px 0}.departure i{display:block;background:var(--gold);height:100%}.departure span{font-size:11px;color:var(--muted)}.secondary{display:block;width:100%;margin:10px 0 20px}.small-card>a{font-size:11px;color:var(--muted)}.result-card{width:min(660px,100%);padding:38px}.result-card>p{color:var(--muted);font-size:12px;line-height:1.8}.results{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line);padding:20px 0;margin:25px 0;gap:12px}.results b{font:24px 'DM Mono',monospace;display:block;color:var(--gold)}.results span{font-size:10px;color:var(--muted)}#word-review{max-height:160px;overflow:auto}#word-review h3{font-size:12px;font-weight:500}#word-review p{display:flex;justify-content:space-between;gap:12px;font-size:11px;border-top:1px solid var(--line);padding-top:9px;color:var(--muted)}#word-review b{color:var(--paper);font:12px 'DM Mono',monospace}#word-review em{font-style:normal;color:var(--mint);font-size:10px}.result-actions{display:flex;gap:20px;align-items:center;margin-top:25px}.result-actions .primary{width:auto;flex:1}.result-actions a{font-size:12px}.fatal{position:fixed;inset:20%;background:var(--panel);padding:40px;z-index:99}.reduced *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
@media(max-width:900px){header{padding:0 20px}.brand span{display:none}main{padding:0 20px}.journey{gap:8px}.journey i{width:20px}footer>span:nth-child(2){display:none}.welcome-story{padding:36px 28px}.welcome-controls{padding:30px 24px}.welcome-story h2{font-size:30px}.pace{display:block}.pace span{display:block;margin-top:6px}}
@media(max-width:620px){header{height:58px;padding:0 14px}.brand{font-size:13px;letter-spacing:2px}.back{font-size:10px}.back span{display:none}.settings button{font-size:9px;padding:7px}.settings #motion{display:none}main{padding:0 12px}.hud{height:92px;flex-wrap:wrap;gap:4px;padding:12px 0}.hud h1{font-size:17px}.hud .eyebrow{font-size:7px}.journey{order:3;width:100%;font-size:8px;justify-content:center}.journey i{width:34px}.score b{font-size:21px}.score small{font-size:7px}.scene{height:30vh;min-height:210px}.scene-caption{left:14px;right:14px;top:12px;font-size:6px;letter-spacing:.6px}.gap{top:34px;left:14px;width:95px}.gap b{font-size:24px}.gap>span{font-size:8px}#cue-marker{font-size:8px;padding:6px;right:3%;bottom:22%}#surge{font-size:8px;right:12px;top:34px;padding:6px}#toast{font-size:9px;bottom:12px}.typing{padding:18px 16px 12px}#cue{font-size:11px}.word-line{gap:12px;min-height:55px}#word{font-size:clamp(22px,6vw,32px);letter-spacing:.6px}#meaning{font-size:10px;padding-left:12px}.typing-bottom{font-size:8px;gap:10px}.typing-bottom span{max-width:55%}.controls{gap:8px;margin-top:12px;padding-top:10px}.controls button{font-size:9px;padding:8px}#accuracy{font-size:8px}#charges{margin-left:4px}footer{font-size:8px;padding:14px 0;line-height:1.6}.overlay{padding:12px}.welcome{grid-template-columns:1fr;max-width:430px;margin:auto}.welcome-story{padding:24px}.welcome-story h2{font-size:26px;margin:18px 0 10px}.welcome-story p{font-size:11px;line-height:1.8}.welcome-story blockquote,.story-meta{display:none}.welcome-controls{padding:20px 24px}.welcome-controls>.eyebrow{display:none}.welcome-controls h3{font-size:13px;margin:0 0 12px}#paces{display:flex;gap:5px}.pace{flex:1;padding:10px 7px}.pace b{font-size:10px}.pace span{font-size:8px;line-height:1.6}.how{margin:14px 0;font-size:9px}.how p{margin:7px 0}.welcome-controls .note{font-size:9px;margin-top:10px}.primary{padding:13px;font-size:12px}#personal-best{margin:6px 0 0;font-size:9px}.small-card{padding:25px 20px}.small-card h2{font-size:23px}.route-options{gap:7px}.route-options button{padding:14px 10px}.route-options b{font-size:12px}.route-options span{font-size:9px}.rest-options button{padding:15px 10px}.result-card{padding:26px 22px}.result-card h2{font-size:25px}.results b{font-size:20px}.results span{font-size:9px}#word-review p{font-size:10px;flex-wrap:wrap}}
@media(max-height:660px) and (min-width:621px){.overlay{align-items:flex-start}.welcome{margin:auto}.welcome-story{padding:25px 30px}.welcome-controls{padding:24px 30px}.welcome-story h2{margin-top:25px}.how{margin:15px 0}.scene{height:270px}.hud{height:82px}}

#welcome-home{display:block;text-align:center;font-size:11px;color:var(--muted);padding:9px;margin-top:8px}
@media(max-height:850px) and (min-width:621px){header{height:60px}.hud{height:82px}.scene{height:clamp(220px,36vh,310px)}.typing{padding:20px 28px 14px}footer{padding:12px 0}}
/* Routes and short, readable parkour breaks. The word panel returns after the course. */
#decision .small-card{width:min(900px,100%)}.route-options{gap:12px}.route-options button{min-width:0;padding:14px;text-align:left}.route-options b{font-size:15px;line-height:1.5}.route-options em{display:block;font-style:normal;font-size:11px;color:var(--mint);margin:12px 0 5px}.route-words{font:9px/1.7 'DM Mono',monospace!important}.route-map{position:relative;height:68px;border-radius:6px;background:linear-gradient(145deg,#45626c,#213749);margin-bottom:15px;overflow:hidden}.route-map span{position:absolute;right:20px;top:12px;font-size:28px;color:var(--gold)}.route-map i{position:absolute;width:70%;height:3px;background:#b6ccad70;top:42px;left:-10px;transform:rotate(-14deg)}.route-map i:nth-of-type(2){top:58px;left:50px;transform:rotate(12deg)}.route-map i:nth-of-type(3){height:40px;width:3px;top:25px;left:36px;transform:none}.route-map.risk{background:linear-gradient(145deg,#5a566a,#293647)}.route-map.risk i{transform:rotate(-30deg);top:42px}.route-map.delivery{background:linear-gradient(145deg,#6b6558,#2c3b46)}
#route-badge{position:absolute;bottom:47px;left:23px;font-size:9px;color:#e2d7b6;background:#132434bb;border:1px solid #c4d1b433;border-radius:5px;padding:6px 9px}.dodge-top{display:flex;justify-content:space-between;font-size:10px}.dodge-top .eyebrow{color:var(--mint);letter-spacing:1.4px}#dodge-count{font-family:'DM Mono',monospace;color:var(--muted)}#hazard-preview{display:flex;gap:6px;flex-wrap:wrap;margin:13px 0}#hazard-preview span{font-size:10px;background:#ffffff05;border:1px solid #ffffff16;border-radius:4px;padding:5px 10px;color:#849ca7}#hazard-preview .now{color:var(--gold);border-color:#f4bc8370}#hazard-preview .done{color:var(--mint)}#dodge-title{font:700 23px 'Gowun Batang',serif;margin:10px 0 5px}#dodge-hint{font-size:12px;color:#cad5d0;margin:8px 0}.dodge-timer{height:4px;background:#ffffff15;margin:13px 0}.dodge-timer i{display:block;height:100%;background:var(--gold);width:100%}.dodge-buttons{display:flex;gap:10px}.dodge-buttons button{flex:1;padding:10px}.dodge-buttons .suggested:not(:disabled){border-color:var(--mint);background:#9bdbbe12;color:#c5ead4}.dodging>.action-meta{display:none}#stamps{color:var(--gold);white-space:nowrap}.dodging #boost,.dodging #keyboard{display:none}.dodging .controls{justify-content:space-between}.typing.dodging{border-color:#9bdbbe66}.scene-caption{pointer-events:none}#cue-marker{right:5%;bottom:24%;font-size:11px}
@media(max-width:620px){#decision .small-card{padding:20px 16px}.route-options{display:grid;gap:8px;margin:16px 0}.route-options button{padding:10px 12px 10px 78px;position:relative;min-height:97px}.route-map{position:absolute;left:10px;top:12px;width:55px;height:72px;margin:0}.route-map span{right:15px;top:17px;font-size:25px}.route-options b{font-size:13px;margin:4px 0}.route-options small{font-size:9px}.route-options em{margin:5px 0 0;font-size:9px}.route-options .route-words{font-size:8px!important}.small-card .note{font-size:9px}#dodge-title{font-size:20px}#dodge-hint{font-size:11px}#hazard-preview span{font-size:8px;padding:5px 7px}.dodge-buttons button{padding:10px;font-size:11px}#route-badge{font-size:7px;left:12px;bottom:38px;padding:4px 6px}#cue-marker{font-size:8px;bottom:20%}#stamps{font-size:8px}.controls{gap:6px}.welcome-story{padding:20px 24px}.welcome-controls{padding:17px 24px}.how p{margin:5px 0}}
