@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Noto+Sans+JP:wght@400;600;700;900&display=swap');
:root{font-family:'Noto Sans JP',sans-serif;color:#e9efee;background:#152932;font-synthesis:none;--mint:#b6e7cc;--amber:#f4c475}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;overflow:hidden}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #9db2ae66;background:#233b43;border-radius:9px;padding:10px 16px;user-select:none}button:active{transform:translateY(1px)}button:focus-visible,a:focus-visible{outline:3px solid var(--amber);outline-offset:3px}[hidden]{display:none!important}#game{position:fixed;inset:0;width:100dvw;height:100dvh;overflow:hidden;touch-action:none}#scene{width:100%;height:100%;display:block}#shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#0c253238,transparent 22%,transparent 65%,#0c25328c)}#hud{position:absolute;left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));display:flex;align-items:center;gap:30px;text-shadow:0 2px 8px #152934}.stage{display:grid;gap:2px}.stage small,.eyebrow,.stage-caption{font-size:10px;letter-spacing:.18em;color:#d4ded9}.stage b{font-size:17px}.metrics{display:flex;gap:25px}.metrics div{display:grid}.metrics small{font-size:9px;letter-spacing:.16em}.metrics b{font:600 27px 'Barlow Condensed',sans-serif}.toolbar{margin-left:auto;display:flex;gap:7px}.toolbar button{font-size:10px;padding:8px;background:#1c3239c9;backdrop-filter:blur(10px)}#goal-status{position:absolute;top:78px;left:50%;transform:translateX(-50%);padding:8px 16px;background:#193b33e6;box-shadow:0 4px 20px #102b2522;border:1px solid #b6e7cc6b;border-radius:30px;text-align:center;min-width:250px;font-size:11px;pointer-events:none}#goal-status i{display:block;height:3px;margin-top:5px;overflow:hidden;background:#fffff018;border-radius:3px}#hold{height:100%;display:block;background:#c0f4ce;width:0}#toast{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);font-size:16px;font-weight:700;text-shadow:0 2px 10px #16272d;pointer-events:none}#controls{position:absolute;left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));display:flex;align-items:end;justify-content:space-between;pointer-events:none}#controls button,#steering{pointer-events:auto;touch-action:none}.steering-zone{text-align:center;display:grid;gap:5px}#steering{width:156px;height:156px;border-radius:50%;background:radial-gradient(circle,#152b34dd,#152b3477 70%,#d4e3d31f);border:1px solid #d0e3df40;display:grid;place-content:center;position:relative;box-shadow:0 5px 25px #0e202c30}#steering small{position:absolute;bottom:15px;width:100%;font:600 10px 'Barlow Condensed';letter-spacing:.17em;color:#d9e6e1}#wheel{width:100px;height:100px;border:9px solid #d6ded8;border-radius:50%;position:relative;box-shadow:inset 0 0 0 2px #526970,0 0 0 2px #293e44}#wheel:before,#wheel:after{content:'';position:absolute;left:0;top:38px;width:83px;height:9px;background:#9fada8}#wheel:after{width:9px;height:45px;left:36px;top:39px}#wheel span{position:absolute;left:28px;top:28px;width:28px;height:28px;border-radius:50%;background:#263f47;z-index:1;border:2px solid #a9c4b8}#wheel i{position:absolute;left:35px;top:-9px;width:12px;height:10px;background:var(--amber)}#steer-readout{font:600 10px 'Barlow Condensed';letter-spacing:.2em;color:#dae5dc}.drive-zone{display:flex;align-items:end;gap:15px}.drive-info{display:grid;gap:10px;text-align:center}#speed{font:600 25px 'Barlow Condensed';text-shadow:0 2px 10px #20373d}#speed small{font-size:11px}#gear{display:grid;gap:4px;min-width:94px;padding:12px;background:#253f47de}#gear b{font:700 30px 'Barlow Condensed';color:var(--mint)}#gear span{font-size:8px}.pedals{display:flex;gap:13px;align-items:end}.pedals button{width:78px;height:101px;background:linear-gradient(140deg,#2c4651ed,#1e333bd9);border:1px solid #a6b9ae70;box-shadow:0 4px 20px #11282d30;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:13px;font:700 11px 'Barlow Condensed';letter-spacing:.15em}.pedals #gas{height:139px;width:75px;background:linear-gradient(140deg,#cbead8f0,#a5cbb8f0);color:#234239;border-color:#edf7e4}.pedals i{display:block;height:43px;width:40px;background:repeating-linear-gradient(0deg,transparent 0 6px,#ffffff50 6px 9px);border-radius:5px}.pedals #gas i{height:68px;background:repeating-linear-gradient(0deg,transparent 0 7px,#42685450 7px 10px)}.pedals button.pressed{filter:brightness(1.25);transform:translateY(3px);box-shadow:inset 0 0 20px #f3f8e440}.panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(860px,94vw);max-height:94dvh;overflow-y:auto;background:linear-gradient(130deg,#14303af5,#213f46f5);backdrop-filter:blur(16px);padding:26px 30px;border:1px solid #d1e1d23d;border-radius:16px;box-shadow:0 25px 80px #0b1f3255;touch-action:pan-y}.panel:before{content:'';display:block;position:absolute;left:30px;top:0;width:42px;height:4px;background:var(--amber)}h1{font-size:42px;line-height:1.05;margin:10px 0 0;font-weight:900;letter-spacing:.02em}h1>span{color:var(--amber)}h1>small{display:block;font:600 12px 'Barlow Condensed';letter-spacing:.32em;margin-top:11px;color:#c7dcd4}.lead{font-size:12px;line-height:1.8;margin:12px 0;color:#d2e3dc}.menu-bottom{display:grid;grid-template-columns:1.1fr 1fr;gap:28px}.stage-caption{font-size:9px;display:flex;justify-content:space-between;margin:0 0 8px}.stage-caption span{color:var(--amber);letter-spacing:.06em}#levels{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}#levels button{padding:7px 4px;display:grid;gap:3px;font:700 18px 'Barlow Condensed';background:#35505a65}#levels button small{font-size:8px;letter-spacing:1px;color:var(--amber);min-height:9px}#levels button.selected{border-color:var(--amber);background:#bce2ce;color:#1c393c}#levels button.selected small{color:#617949}#selected-info{font-size:10px;color:#c7dcd3;margin:7px 0 0}.instructions{display:grid;grid-template-columns:24px 1fr;gap:9px;align-items:start;font-size:10px;line-height:1.7}.instructions>span{font:700 14px 'Barlow Condensed';color:var(--amber);padding-top:2px}.instructions p{margin:0 0 8px}.primary{background:var(--mint);color:#1b3c35;border:0;font-weight:900;padding:13px 20px}.primary span{float:right}.menu-bottom .primary{width:100%;margin-top:5px}.micro{font-size:8px;color:#b8ccc4;margin:7px 0 0}.panel nav{display:flex;gap:16px;justify-content:space-between;align-items:center;margin-top:17px;border-top:1px solid #afc2b52d;padding-top:10px}.panel nav a,.panel nav button{font-size:10px;color:#bfd7cc;background:none;border:0;padding:0;text-decoration:none}.compact{width:min(550px,90vw);text-align:center}.compact h2{font-size:34px;margin:10px 0 6px}.compact>p{font-size:12px;line-height:1.8;color:#c7dbd2}#stars{font-size:28px;letter-spacing:8px;color:var(--amber)}#result-score{font:700 52px 'Barlow Condensed';display:block}.result-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.result-actions button{font-size:11px}.result-actions .primary{width:100%}.help-copy{text-align:left;font-size:11px;line-height:1.9;color:#c9dbd2}.help-copy p{margin:10px 0}#rotate{position:fixed;inset:0;background:#16313bf5;z-index:20;display:none;align-content:center;text-align:center;padding:24px}#rotate>div{font-size:65px;color:var(--amber)}#rotate h2{font-size:22px}#rotate p{font-size:12px;color:#cfdfd6;line-height:1.9}#paused{position:absolute;inset:0;background:#142e39d9;backdrop-filter:blur(8px);z-index:15;text-align:center;align-content:center}#paused p{font-size:12px;color:#c4dcd1}#error{position:absolute;inset:0;z-index:30;padding:15%;background:#18343d;text-align:center}#error a{color:var(--mint)}@media(orientation:portrait){#rotate{display:block}}@media(max-height:450px){.panel{padding:17px 22px}h1{font-size:30px}h1>small{font-size:9px;margin-top:7px}.lead{position:absolute;right:24px;top:27px;font-size:10px;text-align:right;margin:0}.menu-bottom{margin-top:15px;gap:24px}.panel nav{margin-top:11px;padding-top:8px}.eyebrow{font-size:8px}#levels button{padding:5px 3px;font-size:16px}#steering{width:132px;height:132px}#wheel{width:91px;height:91px;border-width:8px}#wheel:before{width:76px;top:34px}#wheel:after{left:33px;top:34px;height:39px}#wheel span{left:25px;top:25px;width:25px;height:25px}#wheel i{left:31px;top:-8px}#steering small{bottom:9px;font-size:9px}.pedals #gas{height:113px}.pedals button{height:84px;width:68px}.pedals i{height:34px}.pedals #gas i{height:50px}#controls{bottom:max(8px,env(safe-area-inset-bottom))}.stage b{font-size:13px}.stage small{font-size:8px}.metrics b{font-size:23px}#hud{gap:20px;top:max(7px,env(safe-area-inset-top))}#goal-status{top:57px;padding:6px 12px;font-size:10px;min-width:225px}.compact h2{font-size:27px}#result-score{font-size:38px}#stars{font-size:22px}.compact>p{margin:6px 0;font-size:11px}}@media(max-width:700px){#hud{gap:13px}.metrics{gap:12px}.toolbar button{padding:7px;font-size:9px}.drive-zone{gap:8px}.pedals{gap:7px}#gear{min-width:74px}.menu-bottom{gap:15px}}