
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Arial,Helvetica,sans-serif;background:#d4e4e5;color:#132e39;touch-action:none;user-select:none}#game{display:block;width:100%;height:100%}header{position:absolute;inset:22px 26px auto;display:flex;align-items:center;gap:12px;pointer-events:none}.brand{font-size:28px;font-weight:900;letter-spacing:-2px;line-height:1;background:#f7fbfaed;padding:14px 18px;border-radius:5px}.brand span{color:#087e88}.brand small{display:block;font-size:10px;letter-spacing:1.6px;margin-top:8px}.mission{background:#f7fbfaed;padding:13px 20px;border-left:3px solid #0d8590;border-radius:3px;margin-right:auto}.mission span{display:block;font-size:11px;letter-spacing:1.5px;color:#477078;margin-bottom:6px}.mission strong{font-size:17px}button{cursor:pointer;font:inherit;border:0;touch-action:none}header button{pointer-events:auto;border:1px solid #bed3d3;background:#f7fbfaed;padding:12px;border-radius:4px;color:#153b44;font-size:12px;font-weight:bold}#hud{position:absolute;top:130px;left:28px}.time label,.condition label{display:block;font-size:11px;letter-spacing:1.5px;font-weight:bold}.time strong{font-size:48px;letter-spacing:-2px;font-variant-numeric:tabular-nums;text-shadow:0 2px 12px white}.condition{margin-top:16px;background:#f7fbfaed;padding:14px;width:240px;border-radius:4px}.condition label{font-size:10px;letter-spacing:.5px}.condition label span{float:right;color:#008377}.track{height:5px;background:#d3dede;margin-top:10px}#stability{height:100%;background:#07948a;transition:width .08s}#mapPanel{position:absolute;right:26px;bottom:84px;width:240px;background:#f5faf9eb;border:1px solid #bdcecf;border-radius:6px;padding:14px}#mapPanel>div{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.5px}#mapPanel>div span{color:#527479}#map{width:100%;height:165px;margin:8px 0}#mapPanel small{font-size:10px;letter-spacing:.8px}#speed{position:absolute;left:28px;bottom:90px}#speed strong{font-size:64px;font-variant-numeric:tabular-nums;letter-spacing:-4px;text-shadow:0 1px 10px white}#speed>span{font-size:16px;margin-left:7px}#speed small{display:block;font-size:11px;letter-spacing:1px;font-weight:bold}footer{position:absolute;bottom:24px;left:28px;display:flex;gap:24px;font-size:10px;font-weight:bold;letter-spacing:.5px;background:#f7fbfaeb;border-radius:5px;padding:13px 16px}kbd{display:inline-block;background:white;border:1px solid #b8cace;border-bottom-width:2px;padding:4px 5px;margin-right:4px;border-radius:3px;font-size:11px}#speech{position:absolute;left:50%;top:25%;transform:translateX(-50%);background:#fff;padding:13px 22px;border-radius:12px;font-weight:bold;font-size:19px;box-shadow:0 3px 20px #1233;display:none;max-width:70%;text-align:center}#speech:after{content:'';position:absolute;bottom:-8px;left:50%;border:8px solid transparent;border-top-color:white;border-bottom:0}#prompt{position:absolute;bottom:110px;left:50%;transform:translateX(-50%);padding:12px 18px;background:#123944ee;color:white;border-radius:5px;text-align:center;display:none;font-size:15px}#overlay{position:absolute;inset:0;background:linear-gradient(90deg,#ecf4f2 0%,#edf5f3f5 34%,#e8f3f080 57%,transparent 82%);display:flex;align-items:center;padding:40px 7vw}.intro{max-width:480px}.eyebrow{font-size:10px;letter-spacing:2px;color:#487375;font-weight:bold}h1{font-size:90px;letter-spacing:-7px;margin:16px 0 26px;line-height:.9;font-weight:900}h1>span{color:#078592}h1 em{display:block;font-size:23px;letter-spacing:-.8px;font-weight:normal;margin-top:14px}p{font-size:17px;line-height:1.6;color:#49626a}.brief{margin:27px 0}.brief>div{display:flex;gap:17px;margin:16px 0;align-items:center}.brief b{color:#13868b;font:13px monospace;border:1px solid #aacdcd;border-radius:50%;width:30px;height:30px;display:grid;place-items:center}.brief span{font-size:15px;font-weight:bold}.brief small{display:block;color:#557077;font-size:13px;font-weight:normal;margin-top:4px}#start,.again{padding:19px 24px;background:#087f8c;color:white;width:100%;text-align:left;font-size:15px;font-weight:bold;letter-spacing:1px;border-radius:4px;box-shadow:0 8px 22px #0a727123}#start span{float:right}.rules{display:block;font-size:11px;line-height:1.7;color:#668084;margin-top:14px}#shade{position:absolute;inset:0;background:#10202b;opacity:0;pointer-events:none;transition:opacity .7s}#touch{display:none}.result h1{font-size:60px;letter-spacing:-3px;line-height:1.02}.result .stat{font:32px monospace;margin:18px 0}.result p{max-width:410px}.result .again{margin-top:18px}@media(max-width:700px){header{inset:12px;gap:6px}.brand{font-size:20px;padding:11px;letter-spacing:-1px}.brand small{font-size:7px}.mission{padding:9px 10px}.mission span{font-size:8px}.mission strong{font-size:12px}header button{font-size:9px;padding:10px}#hud{top:90px;left:14px}.time strong{font-size:34px}.condition{width:172px;padding:10px}.condition label{font-size:8px}#mapPanel{right:12px;bottom:150px;width:145px;padding:9px}#mapPanel>div{font-size:7px}#map{height:104px}#mapPanel small{font-size:7px}#speed{bottom:165px;left:15px}#speed strong{font-size:42px}footer{display:none}#touch{display:flex;position:absolute;bottom:24px;left:14px;right:14px;justify-content:space-between;align-items:flex-end;gap:10px}#touch>div{display:flex;gap:7px;flex-wrap:wrap;max-width:230px}#touch button{height:55px;min-width:54px;padding:8px;background:#f0f8f4de;border:1px solid #a8c4c7;border-radius:9px;font-size:12px;color:#153b44;font-weight:bold}#touch button[data-key=w]{background:#087f8c;color:white}#touchE{font-size:9px!important;height:32px!important}#overlay{padding:24px;background:#ecf4f2ed}h1{font-size:64px;letter-spacing:-4px;margin:12px 0 20px}.intro{max-width:420px}.brief{margin:18px 0}.brief>div{margin:12px 0}p{font-size:15px}.eyebrow{font-size:9px}#speech{font-size:15px;top:30%}#prompt{bottom:95px;width:75%;font-size:12px}.result h1{font-size:48px}}@media(max-height:650px){#overlay{padding-top:18px;padding-bottom:18px}h1{font-size:56px;margin:10px 0 16px}h1 em{font-size:19px}p{font-size:14px}.brief{margin:14px 0}.brief>div{margin:10px 0}#start{padding:15px}.rules{font-size:10px}.eyebrow{font-size:9px}}
#game:focus{outline:none}.menu-open header,.menu-open #hud,.menu-open #mapPanel,.menu-open #speed,.menu-open footer,.menu-open #touch,.menu-open #speech,.menu-open #prompt{visibility:hidden}#overlay.arcade-title{background:linear-gradient(90deg,#d9ede8f5,#d9ede8dc 36%,#d9ede830 68%,transparent);padding:35px 8vw}.title-screen{width:min(530px,52vw);animation:titleIn .6s ease-out}.title-screen .eyebrow{font-size:13px;letter-spacing:4px}.title-screen h1{font-size:clamp(64px,8.2vw,124px);line-height:.82;letter-spacing:-7px;transform:rotate(-5deg) skew(-7deg);margin:40px 0 36px;color:#fff;text-shadow:3px 3px 0 #193f49,6px 6px 0 #193f49,9px 10px 0 #153f4930}.title-screen h1 span{display:inline-block;color:#ffcb48;text-shadow:3px 3px 0 #193f49,6px 6px 0 #193f49,9px 10px 0 #153f4930}.title-screen p{font-size:22px;line-height:1.4;font-weight:700;color:#244e58;margin:22px 0}.arcade-start,#start.arcade-start{display:block;border:3px solid #173c46;border-bottom:7px solid #173c46;background:#ffca48;color:#153c46;border-radius:12px;padding:19px 26px;font-size:22px;font-weight:900;letter-spacing:1px;text-align:left;width:100%;box-shadow:0 8px 0 #173c461a;transition:transform .12s,background .12s}.arcade-start span{float:right}.arcade-start:hover,#start.arcade-start:hover{background:#ffdb7b;transform:translateY(-3px)}.arcade-start:active,#start.arcade-start:active{transform:translateY(3px)}.title-note{display:block;margin-top:19px;font-size:13px;color:#3c6670}.instructions{justify-content:center;background:#dceee7eb!important;backdrop-filter:blur(5px)}.how-screen{max-width:820px;width:100%;padding:28px 34px;background:#f6faf3;border:3px solid #254d55;border-radius:18px;box-shadow:9px 10px 0 #254d5520;animation:titleIn .3s ease-out}.how-screen h2{font-size:32px;line-height:1.08;letter-spacing:-1px;margin:15px 0 24px}.how-screen h2 span{color:#087f8c}.lesson-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-bottom:25px}.lesson h3{font-size:13px;letter-spacing:1px;color:#477178;margin:0 0 14px}.key-row{display:flex;gap:7px;align-items:center;margin:9px 0;font-size:15px}.key-row kbd{min-width:32px;text-align:center;background:#e7f0eb;font-size:14px;padding:7px;border-color:#8aa9ab}.lesson p{font-size:15px;line-height:1.65;margin:0 0 15px}.lesson small{font-size:12px;line-height:1.5;color:#5b7477;display:block}.lesson .danger{border-left:3px solid #d99131;padding-left:12px;color:#754522}#backTitle{display:block;margin:16px auto 0;padding:8px 20px;background:transparent;color:#45686e;font-size:13px;font-weight:bold}#countdown{display:none;position:absolute;inset:0;place-items:center;pointer-events:none;color:#ffcd48;font-size:150px;font-weight:900;font-style:italic;text-shadow:5px 5px 0 #183d48,9px 10px 0 #183d4840;z-index:5}@keyframes titleIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){#overlay.arcade-title{padding:30px;background:linear-gradient(90deg,#d9ede8ed,#d9ede89c)}.title-screen{width:100%;max-width:420px}.title-screen h1{font-size:78px;letter-spacing:-5px;margin:32px 0}.title-screen p{font-size:20px}.how-screen{padding:19px}.how-screen h2{font-size:25px}.lesson-grid{gap:15px}.lesson p,.key-row{font-size:13px}.key-row kbd{padding:5px;min-width:25px}.arcade-start,#start.arcade-start{font-size:18px;padding:15px 20px}.instructions{padding:14px!important}.lesson-grid{margin-bottom:18px}}@media(max-height:650px){.how-screen{padding:16px 24px}.how-screen h2{font-size:24px;margin:9px 0 14px}.key-row{margin:5px 0}.lesson-grid{margin-bottom:14px}.lesson h3{margin-bottom:9px}#backTitle{margin-top:5px}.title-screen h1{font-size:78px;margin:24px 0}.title-screen p{font-size:18px}}@media(prefers-reduced-motion:reduce){.title-screen,.how-screen{animation:none}.arcade-start{transition:none}}
#game{transition:filter 1.1s ease}.death-scene #game{filter:grayscale(1) brightness(.48) contrast(1.25)}#overlay.death-result{padding:0;justify-content:center;align-items:center;background:linear-gradient(transparent 12%,#05050598 30%,#050505c4 62%,transparent 89%);text-align:center}.death-result .intro.result{max-width:none;width:100%;padding:30px 20px;animation:deathStamp .45s ease-out}.death-result .eyebrow{color:#bbb;font-size:13px;letter-spacing:5px}.death-result .result h1{font-family:Impact,'Arial Black',Arial,sans-serif;font-size:clamp(52px,9vw,132px);line-height:1.05;letter-spacing:1px;color:#ce3c38;text-shadow:3px 5px 0 #0009;margin:16px 0 18px}.death-result .result p{color:#e0e0e0;margin:0 auto 22px;max-width:650px;font-size:17px;line-height:1.55}.death-result .result .stat{color:#aaa;font-size:22px;margin:22px auto}.death-result .again{display:block;width:auto;min-width:220px;margin:25px auto 14px;background:#191919cc;color:#efefef;border:1px solid #6a6a6a;text-align:center;box-shadow:none}.death-result .again:hover{background:#ad3734}.death-result .rules{color:#a6a6a6}@keyframes deathStamp{from{opacity:0;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}@media(max-width:700px){.death-result .result h1{font-size:52px}.death-result .result p{font-size:14px;max-width:90%}.death-result .result .stat{font-size:18px}.death-result .stat small{display:block;margin-top:7px}}@media(prefers-reduced-motion:reduce){#game{transition:none}.death-result .intro.result{animation:none}}
#touch button.pressed{transform:translateY(2px);background:#c5e7df;box-shadow:inset 0 2px 5px #1234}#touch button[data-key=brake]{background:#b54238;color:white;border-color:#813128}#touch button[data-key=brake].pressed{background:#e16651}footer{gap:13px}#overlay{overflow-y:auto;overscroll-behavior:contain}.how-screen{flex-shrink:0}button{-webkit-tap-highlight-color:transparent}@media(pointer:coarse),(any-pointer:coarse){#touch{display:flex;position:absolute;bottom:max(15px,env(safe-area-inset-bottom));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));justify-content:space-between;align-items:flex-end;gap:12px}#touch>div{display:flex;gap:8px;flex-wrap:wrap;max-width:260px}#touch button{height:60px;min-width:60px;padding:9px;background:#f0f8f4e8;border:1px solid #8eafb2;border-radius:10px;font-size:12px;color:#153b44;font-weight:bold}#touch button[data-key=w]{background:#087f8c;color:white}#touch button[data-key=brake]{background:#b54238;color:white}#touchE{font-size:10px!important;height:36px!important}footer{display:none}#speed{bottom:170px}#mapPanel{bottom:170px}#prompt{bottom:155px}#touch button[data-key=a],#touch button[data-key=d]{font-size:28px;width:68px}}@media(max-width:600px){.instructions{align-items:flex-start!important}.lesson-grid{grid-template-columns:1fr;gap:15px}.how-screen h2{font-size:23px}.how-screen{padding:18px}.lesson p{margin-bottom:9px}.key-row{margin:6px 0}#touch>div:last-child{max-width:200px;justify-content:flex-end}#touch button{min-width:52px!important;padding:7px!important;font-size:10px!important}#touch button[data-key=a],#touch button[data-key=d]{width:54px;font-size:25px!important}#touch>div:first-child{max-width:125px;flex-wrap:nowrap}#mapPanel{bottom:180px;width:125px}#map{height:86px}.mission strong{font-size:11px}.brand{font-size:17px}#speed{bottom:180px}}@media(max-height:500px){#overlay{align-items:flex-start}.title-screen h1{font-size:58px;margin:18px 0}.title-screen p{font-size:15px;margin:12px 0}.instructions{padding:12px!important}.how-screen h2{font-size:21px}.lesson-grid{grid-template-columns:1fr 1fr}.key-row{font-size:12px;margin:4px 0}.key-row kbd{font-size:11px;padding:4px}.lesson p{font-size:12px}.how-screen .eyebrow{font-size:9px}.how-screen .arcade-start{font-size:16px;padding:10px 18px}#mapPanel{width:130px;bottom:145px;padding:8px}#map{height:70px}#hud{top:82px}.time strong{font-size:28px}.condition{margin-top:7px;padding:8px}.time label{font-size:9px}#speed{bottom:142px}#speed strong{font-size:33px}header{inset:10px}#touch button{height:46px}#speech{top:30%;font-size:14px}}
/* Let the joke carry the result screen. */
.death-result .result h1{font-size:clamp(48px,7.6vw,110px);margin-bottom:24px}.result p.result-copy{font-size:24px;line-height:1.5}.death-result .result p.result-copy{font-size:clamp(26px,2.4vw,38px);line-height:1.45;color:#f5f5f5;max-width:1040px;margin:0 auto 24px;text-shadow:0 2px 5px #000;font-weight:500}.result-copy span{display:block}.result-copy .punchline{font-weight:800;color:#fff}.result:not(.death-result .result) .result-copy .punchline{color:inherit}.death-result .result .stat{font-size:20px;margin:16px auto}.death-result .again{font-size:18px}.death-result .rules{font-size:14px}#speech{font-size:clamp(23px,2vw,31px);line-height:1.35;padding:17px 25px;max-width:min(78%,780px);font-weight:750;box-shadow:0 4px 24px #102d3b40}#prompt{font-size:19px;line-height:1.4}@media(max-width:700px){.death-result .result p.result-copy{font-size:23px;max-width:96%;line-height:1.45}.death-result .result h1{font-size:48px;margin-bottom:20px}.death-result .rules{font-size:12px}#speech{font-size:22px;max-width:88%;padding:13px 18px}#prompt{font-size:16px}.result p.result-copy{font-size:21px}}@media(max-height:550px){#overlay.death-result{align-items:flex-start}.death-result .intro.result{padding:22px 16px}.death-result .result h1{font-size:clamp(40px,7vw,74px);margin:12px 0 15px}.death-result .result p.result-copy{font-size:24px;line-height:1.35;margin-bottom:15px}.death-result .result .stat{margin:12px auto}.death-result .again{margin:15px auto 10px;padding:12px 20px}#speech{font-size:22px;padding:12px 18px}}
/* Keep the headline dominant; emphasize only authored punchlines. */
.death-result .result h1{font-size:clamp(58px,9vw,132px);margin:16px 0 26px}.death-result .result p.result-copy{font-size:clamp(22px,1.65vw,27px);line-height:1.45;max-width:980px;font-weight:400;margin-bottom:20px}.death-result .result-copy span.result-context{font-weight:400;color:#e1e1e1}.death-result .result-copy span.punchline{font-size:clamp(26px,2.1vw,34px);font-weight:750;color:#fff;margin-top:4px}.death-result .result-copy span.result-tip{font-size:17px;font-weight:400;color:#b0b0b0;margin:18px auto 0;max-width:720px;line-height:1.5;text-shadow:none}.death-result .result .stat{font-size:18px;color:#999}.death-result .rules{font-size:12px}#touch{display:none!important}.mobile-unsupported #start{background:#cad8d3;color:#4b666c;border-color:#7d9497;cursor:default;transform:none;box-shadow:none}.mobile-unsupported .title-note{font-size:18px;font-weight:600;line-height:1.55;max-width:430px;background:#f4faf1ef;padding:16px;border-radius:8px;color:#294f59}@media(max-height:550px){.death-result .result h1{font-size:clamp(52px,8vw,100px);margin:10px 0 18px}.death-result .result p.result-copy{font-size:22px}.death-result .result-copy span.punchline{font-size:28px}.death-result .result-copy span.result-tip{font-size:15px;margin-top:12px}}@media(max-width:700px){.death-result .result h1{font-size:52px}.death-result .result p.result-copy{font-size:21px}.death-result .result-copy span.punchline{font-size:26px}.death-result .result-copy span.result-tip{font-size:15px}}

#prompt.elevator-prompt{bottom:22%;width:max-content;max-width:calc(100% - 48px);padding:20px 30px;border:3px solid #fff2b5;background:#ffce4a;color:#173b43;border-radius:12px;font-size:clamp(24px,2.5vw,36px);font-weight:900;line-height:1.3;box-shadow:0 7px 28px #102c4566;z-index:4}

#speech{z-index:20}#shade{z-index:10}#overlay{z-index:30}#countdown{z-index:31}

#timer.ed-active{font-size:24px;letter-spacing:0}

/* Landscape touch cockpit. */
#rotateNotice{position:fixed;inset:0;z-index:100;background:#102c36;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;gap:12px}#rotateNotice[hidden]{display:none}#rotateNotice strong{font-size:30px;color:#ffce4a}#rotateNotice p{color:#fff;margin:0;font-size:18px}#rotateNotice small{color:#bacfd1;font-size:14px;line-height:1.6}
.mobile-play #touch.active{display:flex!important;position:absolute;z-index:22;bottom:max(12px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));justify-content:space-between;align-items:flex-end;pointer-events:none}
.mobile-play #touch>div{max-width:none!important;flex-wrap:nowrap;gap:12px;display:flex;align-items:flex-end}.mobile-play #touch .steer-controls{flex-direction:column;align-items:flex-start;gap:8px}.mobile-play #touch button,.mobile-play #steerPad,.mobile-play #drivePad{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;border:2px solid #ffffffa0;box-shadow:0 3px 12px #0004;border-radius:18px;color:white;font-weight:800;text-shadow:0 1px 3px #0005}
.mobile-play #steerPad{width:180px;height:76px;background:#163c4bd9;position:relative;display:grid;place-items:center;overflow:hidden}.steer-arrows{position:absolute;top:8px;font-size:11px;letter-spacing:2px;color:#d0e3e7}#steerKnob{width:48px;height:38px;border-radius:12px;background:#e7f5efb8;position:absolute;bottom:7px;pointer-events:none}
.mobile-play #touch #reverseTouch{height:38px;min-width:88px;font-size:10px!important;padding:8px!important;background:#183a49b8;border-radius:10px}.mobile-play #touch #brakeTouch{height:65px;min-width:80px;font-size:13px!important;background:#a83432de;padding:10px!important}.mobile-play #drivePad{height:122px;width:100px;background:#087d86e8;display:flex;flex-direction:column;text-align:center;overflow:hidden}.drift-zone{height:45%;display:grid;place-items:center;font-size:12px;background:#123e5280;border-bottom:1px dashed #ffffff75}.push-zone{flex:1;display:grid;place-items:center;font-size:19px}.mobile-play #drivePad.pressed{background:#0f9b9e}.mobile-play #drivePad.drifting .drift-zone{background:#ffce4a;color:#193e46}.mobile-play #touch button.pressed{filter:brightness(1.35);transform:translateY(2px)}
.mobile-play header{inset:8px max(12px,env(safe-area-inset-right)) auto max(12px,env(safe-area-inset-left));gap:7px}.mobile-play .brand{font-size:18px;padding:10px;letter-spacing:-1px}.mobile-play .brand small{display:none}.mobile-play .mission{padding:6px 10px}.mobile-play .mission span{font-size:8px;margin-bottom:3px}.mobile-play .mission strong{font-size:12px}.mobile-play header button{min-height:42px;padding:10px;font-size:10px}.mobile-play #hud{top:61px;left:max(18px,env(safe-area-inset-left));display:flex;gap:14px;align-items:center;pointer-events:none}.mobile-play .time label{font-size:8px;letter-spacing:.6px}.mobile-play .time strong{font-size:29px}.mobile-play #timer.ed-active{font-size:20px}.mobile-play .condition{width:140px;padding:8px;margin:0}.mobile-play .condition label{font-size:7px;letter-spacing:0}.mobile-play .track{margin-top:6px}.mobile-play #mapPanel{top:60px;bottom:auto;right:max(12px,env(safe-area-inset-right));width:110px;padding:6px;pointer-events:none}.mobile-play #map{height:66px;margin:3px 0}.mobile-play #mapPanel>div{font-size:7px}.mobile-play #mapPanel small{display:none}.mobile-play #speed{left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);text-align:center;pointer-events:none}.mobile-play #speed strong{font-size:30px;letter-spacing:-1px}.mobile-play #speed>span{font-size:10px}.mobile-play #speed small{font-size:8px;letter-spacing:0}.mobile-play footer{display:none}.mobile-play #speech{top:30%;font-size:clamp(16px,2.6vw,21px);max-width:57%;padding:9px 14px;pointer-events:none}.mobile-play #prompt{bottom:85px;font-size:14px;padding:10px;width:auto;max-width:45%}.mobile-play #prompt.elevator-prompt{bottom:82px;font-size:19px;padding:12px 20px;max-width:45%}.mobile-play #prompt.touch-action{z-index:23;pointer-events:auto;min-height:50px}
.mobile-play #overlay{padding:14px max(24px,env(safe-area-inset-left));touch-action:pan-y;align-items:flex-start}.mobile-play #overlay *{touch-action:pan-y}.mobile-play #overlay button{touch-action:manipulation}.mobile-play #overlay.arcade-title{padding:20px max(30px,env(safe-area-inset-left))}.mobile-play .title-screen{width:55%;max-width:460px}.mobile-play .title-screen .eyebrow{font-size:9px;letter-spacing:2px}.mobile-play .title-screen h1{font-size:clamp(48px,10vw,78px);margin:16px 0 20px;letter-spacing:-4px}.mobile-play .title-screen p{font-size:15px;margin:10px 0;line-height:1.3}.mobile-play #start.arcade-start{font-size:17px;padding:10px 18px;min-height:46px}.mobile-play .title-note{font-size:10px;margin-top:10px}.mobile-play .how-screen{padding:14px 20px;max-width:760px}.mobile-play .how-screen h2{font-size:21px;margin:8px 0 12px}.mobile-play .lesson-grid{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:12px}.mobile-play .lesson p{font-size:12px;line-height:1.45;margin-bottom:8px}.mobile-play .lesson h3{font-size:11px;margin-bottom:8px}.mobile-play .lesson small{font-size:10px}.mobile-play .arcade-start{padding:10px 18px;font-size:16px;min-height:44px}.mobile-play #backTitle{margin:4px auto 0;min-height:38px}.mobile-play #countdown{font-size:100px}.mobile-play .death-result .intro.result{padding:10px 12px}.mobile-play .death-result .eyebrow{font-size:10px}.mobile-play .death-result .result h1{font-size:clamp(42px,8.5vw,90px);margin:10px 0 14px}.mobile-play .death-result .result p.result-copy{font-size:17px;margin-bottom:10px}.mobile-play .death-result .result-copy span.punchline{font-size:21px}.mobile-play .death-result .result-copy span.result-tip{font-size:12px;margin-top:8px}.mobile-play .death-result .result .stat{font-size:13px;margin:8px auto}.mobile-play .death-result .again{margin:10px auto 6px;font-size:15px;min-height:44px}.mobile-play .death-result .rules{font-size:10px}

/* Browser-first mobile: reserve the top centre for dialogue, keep the road clear. */
.mobile-play #speech{top:8px;left:50%;bottom:auto;width:calc(100% - 290px);max-width:620px;padding:7px 12px;border-radius:8px;background:#102c36e8;color:#fff;font-size:16px;line-height:1.25;font-weight:600;box-shadow:none;pointer-events:none}
.mobile-play #speech:after{display:none}.mobile-play.speaking .mission{visibility:hidden}.mobile-play header .mission{max-width:calc(100% - 235px)}
@media(max-height:350px) and (orientation:landscape){
.mobile-play .brand{font-size:15px;padding:8px}.mobile-play header{top:5px}.mobile-play header button{min-height:36px;padding:8px}.mobile-play #speech{top:5px;width:calc(100% - 250px);font-size:15px;padding:6px 10px}.mobile-play #hud{top:51px;gap:9px}.mobile-play .condition{width:125px}.mobile-play #mapPanel{top:51px;width:88px}.mobile-play #map{height:48px}.mobile-play #touch.active{bottom:max(8px,env(safe-area-inset-bottom))}.mobile-play #steerPad{height:62px;width:155px}.mobile-play #steerKnob{height:28px}.mobile-play #drivePad{height:94px;width:87px}.mobile-play #touch #brakeTouch{height:55px;min-width:70px}.mobile-play #touch #reverseTouch{height:32px}.mobile-play #prompt.elevator-prompt{bottom:63px;font-size:17px;padding:9px 14px}.mobile-play #speed{bottom:8px}.mobile-play #overlay.arcade-title{padding-top:12px}.mobile-play .title-screen h1{font-size:48px;margin:12px 0}.mobile-play .title-screen p{font-size:14px;margin:8px 0}.mobile-play .title-note{margin-top:6px}
}

/* Anchor every game layer to the visible viewport, including Safari toolbar changes. */
#appViewport{position:fixed;top:0;left:0;width:100%;height:100dvh;overflow:hidden;isolation:isolate;transform:translate(0,0)}
.mobile-play #overlay{overflow-y:auto;overflow-x:hidden;align-items:flex-start;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));scroll-padding-top:12px;overflow-anchor:none}
.mobile-play #overlay.death-result{align-items:flex-start;justify-content:center}.mobile-play .death-result .intro.result{flex:0 0 100%;min-width:0;margin:0;animation:none;padding:0 12px}.mobile-play .death-result .result h1{font-size:clamp(38px,7vw,76px);line-height:1.06;margin:8px 0 12px}
.mobile-play.short-viewport .death-result .result h1{font-size:clamp(34px,6vw,55px);margin:6px 0 8px}.mobile-play.short-viewport .death-result .result p.result-copy{font-size:15px;line-height:1.25;margin-bottom:6px}.mobile-play.short-viewport .death-result .result-copy span.punchline{font-size:19px}.mobile-play.short-viewport .death-result .result-copy span.result-tip{font-size:12px;margin-top:6px}.mobile-play.short-viewport .death-result .result .stat{margin:6px auto}.mobile-play.short-viewport .death-result .again{margin:8px auto 4px;padding:8px 18px;min-height:44px}.mobile-play.short-viewport .death-result .rules{margin-top:5px}

/* Responsive typography uses the visible viewport, not phone model or screen pixels. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.mobile-play #overlay.instructions{padding:8px max(16px,env(safe-area-inset-left)) max(8px,env(safe-area-inset-bottom))!important;overflow:hidden;align-items:stretch!important}
.mobile-play .mobile-how{height:100%;min-height:0;padding:12px 18px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;border-radius:12px;box-shadow:none}
.mobile-play .mobile-how .how-heading h2{font-size:clamp(18px,3vw,26px);margin:3px 0 0;line-height:1.1}.mobile-play .mobile-how .eyebrow{font-size:12px;letter-spacing:1px}
.mobile-play .mobile-how .how-body{min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding-right:4px}.mobile-play .mobile-how .lesson-grid{margin:0;gap:24px}.mobile-play .mobile-how .lesson h3{font-size:13px;margin:0 0 7px}.mobile-play .mobile-how .lesson p{font-size:14px;line-height:1.4;margin:0 0 9px}.mobile-play .mobile-how .how-actions{display:flex;gap:14px;align-items:center;border-top:1px solid #cadbd4;padding-top:8px;background:#f6faf3}.mobile-play .mobile-how #backTitle{margin:0;min-height:44px;padding:8px 12px;font-size:14px;white-space:nowrap}.mobile-play .mobile-how #roll{font-size:16px;min-height:44px;padding:8px 16px;border-bottom-width:4px;box-shadow:none}
.mobile-play #overlay.death-result{padding-top:10px;padding-bottom:max(10px,env(safe-area-inset-bottom))}.mobile-play #overlay.death-result .result h1{font-size:var(--ui-title,44px);line-height:1.03;margin:7px 0 9px}.mobile-play #overlay.death-result .result p.result-copy{font-size:var(--ui-copy,16px);line-height:1.25;margin-bottom:8px}.mobile-play #overlay.death-result .result-copy span.punchline{font-size:var(--ui-punch,20px);line-height:1.25;margin-top:3px}.mobile-play #overlay.death-result .result-copy span.result-tip{font-size:12px;line-height:1.3;margin-top:7px}.mobile-play #overlay.death-result .result .stat{font-size:12px;margin:7px auto}.mobile-play #overlay.death-result .result .stat small{font-size:12px!important}.mobile-play #overlay.death-result .again{min-height:44px;font-size:15px;padding:8px 20px;margin:8px auto 4px}.mobile-play #overlay.death-result .rules{display:none}.mobile-play #overlay.death-result .eyebrow{font-size:12px;letter-spacing:3px}
@media(max-width:580px){.mobile-play .mobile-how .lesson-grid{grid-template-columns:1fr}.mobile-play .mobile-how .how-heading h2{font-size:18px}}
