:root{--game-background:#183f30}
*{box-sizing:border-box}body{margin:0;background:#f1f3ec;color:#243f31;font-family:Inter,Segoe UI,Arial,sans-serif}main{max-width:1140px;margin:30px auto;padding:0 32px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;gap:24px}h1{font-size:27px;letter-spacing:-1px;display:flex;align-items:center;gap:12px;margin:0}.mark{display:inline-grid;place-items:center;background:#294733;color:#d9f6a0;width:42px;height:42px;border-radius:13px;font-size:28px;font-style:italic}.version{font-size:10px;letter-spacing:1.4px;font-weight:600;align-self:flex-end;margin:0 0 5px 4px;color:#72816d}.stats{display:flex;gap:42px}.stats>div{min-width:94px}.stats span,.eyebrow{font-size:11px;letter-spacing:1.7px;font-weight:700;color:#6f7f68}.stats strong{display:block;font-size:29px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.7px;margin-top:5px}small{font-size:19px;color:#7a8a6b}.field{position:relative;border-radius:22px;overflow:hidden;background:#d9decc;box-shadow:0 18px 45px #29452b15;border:7px solid #fff}canvas{display:block;width:100%;max-height:calc(100vh - 185px);object-fit:contain;outline:none}#hint{position:absolute;bottom:7%;left:50%;transform:translateX(-50%);white-space:nowrap;background:#fcfff0ee;border-radius:40px;padding:14px 22px;font-size:14px;box-shadow:0 4px 15px #263d2420;pointer-events:none}kbd{display:inline-block;background:#fff;border:1px solid #d8dfce;border-bottom:3px solid #c8d0bd;padding:3px 7px;border-radius:5px;font:12px Segoe UI,sans-serif;color:#385238;margin-right:3px}footer{display:flex;align-items:center;justify-content:space-between;padding:17px 3px;font-size:13px;color:#6a7965}footer>div{display:flex;align-items:center;gap:3px}i{width:17px}.alt{margin:0 10px}.reset{background:none;border:0;color:#385238;font:inherit;cursor:pointer;padding:8px}button:focus-visible{outline:3px solid #618c3d;outline-offset:4px}.veil{position:absolute;inset:0;display:grid;place-items:center;background:#153c2b44;backdrop-filter:blur(4px)}[hidden]{display:none!important}.card{width:min(390px,90%);padding:37px;text-align:center;background:#fafdf1;border-radius:24px;box-shadow:0 20px 80px #173a3240}h2{font-size:32px;letter-spacing:-1px;margin:15px 0}.complete{font-size:23px;color:#578435}.results{margin:25px 0}.results p{display:flex;justify-content:space-between;font-size:16px}.card button{width:100%;border:0;border-radius:12px;background:#2c5238;color:white;padding:16px 22px;font-size:16px;font-weight:600;cursor:pointer}.card button span{float:right}#best{font-size:13px;line-height:1.9;color:#75816a;margin-bottom:0}@media(max-width:800px){main{padding:0 12px;margin:16px auto}.version{display:none}.stats{gap:14px}.stats>div{min-width:65px}.stats strong{font-size:23px}h1{font-size:21px}.alt{display:none}header{gap:12px}footer{flex-wrap:wrap;gap:8px}#hint{font-size:12px;padding:10px}.mark{display:none}}@media(max-width:480px){header{flex-wrap:wrap}.stats{width:100%;justify-content:space-between}canvas{max-height:none}footer{font-size:12px}}
/* Prototype 02 extends the existing play surface. */
main{margin-top:20px}header{margin-bottom:16px}.tools{display:flex;align-items:center;gap:24px;margin:0 3px 14px;flex-wrap:wrap;font-size:14px}.mode-label{display:flex;align-items:center;gap:9px}select{font:inherit;color:#294733;background:#fff;border:1px solid #c4d0ba;border-radius:9px;padding:9px 11px}.boost{min-width:190px;flex:1;max-width:280px}.boost label{display:flex;align-items:center;gap:4px;font-size:13px}.boost label span{margin-left:auto;font-variant-numeric:tabular-nums}.boost meter{width:100%;height:11px;display:block;margin-top:5px;accent-color:#4a93ad}.boost meter::-webkit-meter-bar{background:#dbe2d3;border:0;border-radius:8px}.boost meter::-webkit-meter-optimum-value{background:#418faa;border-radius:8px}.turn meter::-webkit-meter-optimum-value{background:#a16abc}.boost.active{filter:brightness(1.15)}.boost.empty label{color:#8a8c82}.boost.empty meter{opacity:.45}canvas{max-height:calc(100vh - 270px)}#notice{position:absolute;left:50%;top:5%;transform:translateX(-50%);max-width:90%;padding:11px 20px;border-radius:30px;background:#fffff1ef;color:#28482f;box-shadow:0 4px 18px #25433120;text-align:center;font-size:15px;pointer-events:none}.card{width:min(430px,94%);padding:24px 32px;max-height:96%;overflow:auto}.card h2{font-size:28px;margin:10px 0}.score{display:flex;justify-content:center;align-items:center;gap:16px;margin:14px 0}.score strong{font-size:40px;letter-spacing:-1px}.score span{background:#e2eccf;padding:7px 10px;border-radius:8px;font-size:14px}.complete{font-size:20px;margin:10px}.results{margin:15px 0}.results p{font-size:14px;margin:8px 0}.records{font-size:14px;border-top:1px solid #d8dfce;padding-top:6px}.records details{padding:10px 3px}.records summary{cursor:pointer;color:#3a583a;padding:3px}.records p{line-height:1.6;color:#63715d}.records summary span{float:right;font-variant-numeric:tabular-nums}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;text-align:left}th,td{padding:10px 8px;border-bottom:1px solid #dce4d3}th{font-size:12px;color:#72816d;font-weight:600}#storageNote{color:#8c5e2a}#sound{white-space:nowrap}#time.urgent{color:#b35b33}@media(max-width:800px){.tools{gap:10px}.boost{min-width:155px}.mode-label{width:100%}canvas{max-height:none}.records summary span{float:none;display:block;margin-top:4px}.card{padding:18px}.card .eyebrow{display:none}.card h2{font-size:22px}.score strong{font-size:28px}.score{margin:5px}.results{margin:8px 0}.card button{padding:11px}.veil{position:fixed;z-index:5;padding:15px}.card{max-height:90vh}#hint{bottom:3%}footer{font-size:12px}}
/* Prototype 03: menus and result feedback extend the existing game. */
.menu-screen{min-height:100vh;display:grid;grid-template-columns:minmax(320px,.85fr) minmax(440px,1.2fr);gap:5vw;align-items:center;padding:48px max(32px,6vw);background:var(--game-background);color:#f4f5dd}.menu-copy{max-width:460px}.menu-kicker{font-size:12px;letter-spacing:2.4px;color:#b0c68b}.menu-copy h1{display:block;font-size:clamp(60px,6.5vw,100px);line-height:.86;letter-spacing:-5px;margin:25px 0}.menu-copy h1 em{font-style:normal;color:#d8ed89}.menu-copy h1 span{display:block;font-size:11px;letter-spacing:2px;color:#91b09b;line-height:1;margin-top:20px}.menu-intro{font-size:17px;line-height:1.6;color:#c4d2bc}.menu-actions{display:grid;gap:10px;margin:25px 0 18px}.menu-actions button,.primary{border:1px solid #ffffff30;background:#2a513e;color:#f8f9e6;border-radius:12px;padding:17px 20px;font:600 18px Segoe UI,sans-serif;cursor:pointer;text-align:left}.menu-actions button span{float:right;font-size:13px;font-weight:400;margin-top:4px;color:#cadac1}.menu-actions .primary,.primary{background:#d9ed92;color:#25442f;border-color:#d9ed92}.menu-actions .primary span{color:#527043}.menu-actions button:hover{filter:brightness(1.08)}.menu-secondary{display:flex;gap:20px}.menu-secondary button{background:none;border:0;border-bottom:1px solid #8daa7e;padding:8px 0;color:#dfebd6;font:14px Segoe UI;cursor:pointer}.menu-note{font-size:12px;color:#a1b69c;margin:20px 0}.brand-links{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:26px}.brand-links a{color:#b3c6ac;font-size:12px;text-decoration:none}.brand-links a:hover{text-decoration:underline}.menu-preview{background:#e4e9d7;border:8px solid #527054;border-radius:22px;box-shadow:20px 28px 0 #11322666;overflow:hidden;transform:rotate(-2deg)}.menu-preview canvas{width:100%;height:auto;max-height:none;object-fit:contain}.preview-caption{padding:22px 25px;color:#294733;transform:rotate(0)}.preview-caption>span{font-size:11px;letter-spacing:2px;font-weight:700}.preview-caption label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14px;margin-top:14px}.preview-caption p{font-size:13px;color:#6c7e61;margin-bottom:0}dialog{border:0;border-radius:22px;padding:28px 32px;background:#f7faed;color:#28452f;max-width:600px;width:calc(100% - 32px);max-height:90vh;box-shadow:0 25px 80px #092a2950}dialog::backdrop{background:#14372ddb;backdrop-filter:blur(3px)}.dialog-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-title h2{font-size:27px;margin:0 0 18px}.close-dialog{border:0;background:#e4ead8;border-radius:50%;height:34px;width:34px;font-size:25px;color:#355336;cursor:pointer}.tutorial{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 24px}.tutorial>div{background:#e7eddc;padding:14px;border-radius:10px;font-size:14px}.tutorial span{display:block;margin-top:8px}.tutorial kbd{font-size:14px}.tutorial .speed-tip{background:#dfedf1}.tutorial .turn-tip{background:#eae3f0}dialog p{font-size:14px;line-height:1.65}dialog .pad-help{font-size:13px;color:#75806b}.dialog-action{display:block;text-align:center;width:100%;margin-top:18px}.setting{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 0;border-bottom:1px solid #dde4d1}.setting input[type=checkbox]{width:20px;height:20px;accent-color:#497447}.setting input[type=range]{width:180px;accent-color:#497447}.boost{position:relative;padding:7px 9px 16px;border-radius:10px;border:1px solid transparent;transition:background .12s}.boost.active{background:#d5eef4;border-color:#62abc0;filter:none;box-shadow:0 0 0 2px #74bed222}.boost.turn.active{background:#eee0f5;border-color:#b788c8}.boost-state{position:absolute;right:9px;bottom:1px;font-size:9px;letter-spacing:1.5px;color:#7f9174}.active .boost-state{color:#286f87;font-weight:800}.turn.active .boost-state{color:#86589b}.boost.active meter::-webkit-meter-optimum-value{background:#20a6d1}.boost.turn.active meter::-webkit-meter-optimum-value{background:#a34bcb}.mode-label{flex-wrap:wrap;max-width:210px;font-size:12px}.mode-label>span{display:block;width:100%;color:#778569}.mode-label select{padding:6px;font-size:13px}.tools{gap:16px}.card button.secondary,.secondary{background:#e5ecd7!important;color:#385536!important;margin-top:8px;border:1px solid #cbd8b9!important}.result-card{width:min(800px,96%);display:grid;grid-template-columns:1.15fr .85fr;gap:28px;text-align:left;padding:25px 30px;animation:result-in .25s ease-out}.result-main{text-align:center}.result-records{border-left:1px solid #d4dec6;padding-left:24px}.result-records h3{margin-top:10px;font-size:20px}.result-records table{font-size:13px}.result-records td,.result-records th{padding:11px 5px}.record-note{font-size:12px;color:#75846b;line-height:1.5}.personal-bests{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;margin:10px 0}.personal-bests span{font-size:10px;letter-spacing:.7px;font-weight:700;background:#e3efba;color:#476427;padding:6px 8px;border-radius:5px}.result-actions{display:grid;grid-template-columns:1.2fr .8fr;gap:9px;margin-top:14px}.result-actions .secondary{margin-top:0}.score-explain{font-size:12px;color:#6a795d;text-align:left;margin:12px 0}.score-explain p{line-height:1.5}.result-card .score{margin:8px 0}.result-card .complete{font-size:17px}.result-card .results p{font-size:13px;margin:7px 0}.result-card h2{font-size:26px}.result-card .score strong{font-size:40px}.result-card .card button{padding:13px}.result-records #best{margin:0 0 10px;line-height:1.5}.field .veil{z-index:2}#result{overflow:auto}#notice{z-index:1;max-width:80%}#play canvas{max-height:calc(100vh - 280px)}@keyframes result-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:900px){.menu-screen{grid-template-columns:1fr;gap:30px;padding:32px 25px}.menu-copy{max-width:none}.menu-copy h1{font-size:72px}.menu-preview{max-width:620px;transform:none}.menu-actions{max-width:520px}.menu-intro br{display:none}.menu-note{margin:12px 0}.brand-links{margin-top:20px}.menu-preview{box-shadow:none}.result-card{gap:16px;padding:22px;max-height:90vh}.result-records{padding-left:16px}}@media(max-width:650px){.menu-preview{display:none}.menu-screen{align-items:start}.menu-copy h1{font-size:76px;margin:28px 0}.menu-actions button{font-size:17px}.menu-actions button span{font-size:12px}.menu-secondary{gap:24px}.tutorial{grid-template-columns:1fr 1fr}.tutorial>div{padding:10px}dialog{padding:22px}.setting input[type=range]{width:140px}.result-card{display:block;width:min(460px,96%)}.result-records{border-left:0;border-top:1px solid #d4dec6;padding:18px 0 0;margin-top:20px}#play canvas{max-height:none}.boost{max-width:none;flex:1}.tools{gap:8px}.mode-label{max-width:none;width:100%;display:flex}.mode-label>span{width:auto}.mode-label select{margin-left:auto}footer>div{flex-wrap:wrap}}
/* Prototype 04: readable feedback and one shared play surface on touch devices. */
.timed-goal{font-size:14px;color:#d5e2bb;line-height:1.5}.mode-goal{font-size:13px;color:#627253;margin:0 4px 10px}
#notice{top:7%;font-size:clamp(19px,2.8vw,30px);font-weight:750;line-height:1.2;border-radius:16px;padding:13px 22px;max-width:85%;text-shadow:0 1px #fff;transition:opacity .08s linear}
.personal-bests span{font-size:12px}.result-card .complete{font-size:20px;line-height:1.35}.results strong{margin-left:12px;text-align:right}
.touch-controls{position:fixed;inset:0;pointer-events:none;z-index:3;user-select:none;-webkit-user-select:none}
.joystick,.touch-buttons{position:absolute;bottom:max(62px,10dvh);pointer-events:auto;touch-action:none}
.joystick{left:max(10px,env(safe-area-inset-left));width:108px;height:108px;border:2px solid #7d967da8;border-radius:50%;background:#e5eddd88;display:grid;place-items:center;box-shadow:inset 0 0 22px #26433014}
.joystick span{display:block;width:48px;height:48px;border-radius:50%;background:#597655bb;border:2px solid #f1f6e4a8;pointer-events:none}
.joystick small{position:absolute;bottom:9px;font-size:9px;letter-spacing:1.2px;color:#385238;pointer-events:none}
.touch-buttons{right:max(8px,env(safe-area-inset-right));display:grid;grid-template-columns:58px 58px;gap:6px}
.touch-buttons button{min-height:48px;border:1px solid #718a6e99;border-radius:14px;background:#e8edddbd;color:#314f34;font:600 10px Segoe UI,sans-serif;touch-action:none;padding:3px;user-select:none;-webkit-user-select:none}
.touch-buttons .throttle{min-height:66px;background:#5b7d50c9;color:#fff;font-size:16px}.touch-buttons [data-touch=reverse]{font-size:13px}
.touch-buttons [data-touch=speedBoost]{background:#bedce6bc}.touch-buttons [data-touch=turnBoost]{background:#dcc9e9bc}
.touch-buttons button.held{background:#294e37;color:#fff;box-shadow:0 0 0 3px #d5e8a7}.joystick.held{border-color:#375f35}
.rotate-prompt{position:fixed;inset:0;background:var(--game-background);z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#f1f2dc;padding:30px;text-align:center}.rotate-prompt>span{font-size:78px;color:#d9ed92}.rotate-prompt h2{margin:12px}.rotate-prompt p{line-height:1.6}
.touch-device #game,.touch-device .field{touch-action:none}.touch-device #pause,.touch-device #result,.touch-device dialog{touch-action:pan-y}
.touch-device button{min-height:44px}.touch-device footer>div:first-child{display:none}
@media(orientation:landscape){
 .touch-device:has(#play:not([hidden])){overflow:hidden;overscroll-behavior:none}
 .touch-device #play:not([hidden]){height:100vh;height:100dvh;max-width:1400px;margin:0 auto;padding:6px max(8px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:3px}
 .touch-device #play header{flex:none;margin:0;gap:10px;min-height:32px;flex-wrap:nowrap}.touch-device #play h1{font-size:17px}.touch-device .mark,.touch-device .version{display:none}
 .touch-device .stats{width:auto;gap:20px}.touch-device .stats>div{min-width:58px}.touch-device .stats strong{font-size:22px;margin:0}.touch-device .stats span{font-size:8px;letter-spacing:1px}.touch-device .stats small{font-size:13px}
 .touch-device .tools{flex:none;flex-wrap:nowrap;margin:0;gap:10px}.touch-device .mode-label{width:auto;max-width:none;flex-wrap:nowrap;flex:none;gap:5px}.touch-device .mode-label>span{display:none}.touch-device .mode-label select{font-size:11px;min-height:32px;margin:0}
 .touch-device .boost{min-width:70px;max-width:none;padding:0 4px 10px}.touch-device .boost label{font-size:10px}.touch-device .boost kbd{display:none}.touch-device .boost meter{height:8px;margin:0}.touch-device .boost-state{font-size:7px;bottom:0}.touch-device #sound{font-size:11px;min-height:32px;padding:4px}
 .touch-device .mode-goal{flex:none;font-size:11px;text-align:center;margin:0;line-height:16px}
 .touch-device .field{flex:1;min-height:0;margin:0 124px 0 116px;border:3px solid #fff;border-radius:14px}
 .touch-device #play #game{height:100%;width:100%;max-height:none;object-fit:contain}
 .touch-device #hint{font-size:11px;white-space:normal;width:max-content;max-width:90%;padding:6px 10px;text-align:center;bottom:5%}
 .touch-device footer{flex:none;justify-content:center;padding:0;gap:2px}.touch-device footer .reset{min-height:36px;font-size:12px;padding:6px 10px}.touch-device footer .alt{display:none}.touch-device #play>.records{display:none}
 .touch-device #notice{font-size:clamp(17px,2.7vw,26px);padding:8px 12px;top:5%;max-width:94%}
 .touch-device .field .veil{position:fixed;inset:0;z-index:10;padding:12px;overflow:auto}.touch-device .card{max-height:calc(100dvh - 24px);touch-action:pan-y}.touch-device .result-card{width:min(800px,96%)}
}
@media(orientation:landscape) and (max-height:550px){
 .touch-device .menu-screen{grid-template-columns:1fr 1fr;gap:24px;padding:18px 28px;align-items:start;min-height:100dvh}.touch-device .menu-copy h1{font-size:45px;margin:14px 0;letter-spacing:-2px}.touch-device .menu-copy h1 br{display:none}.touch-device .menu-copy h1 span{margin-top:10px;font-size:9px}.touch-device .menu-kicker{font-size:9px}.touch-device .menu-intro{font-size:13px;margin:10px 0}
 .touch-device .menu-actions{gap:6px;margin:12px 0}.touch-device .menu-actions button{font-size:14px;padding:10px 12px}.touch-device .menu-actions button span{font-size:10px}.touch-device .menu-preview{display:block;transform:none;border-width:4px;margin-top:22px}.touch-device .preview-caption{padding:12px}.touch-device .preview-caption label{font-size:11px;flex-wrap:wrap}.touch-device .preview-caption select{font-size:12px}.touch-device .timed-goal{font-size:12px}.touch-device .brand-links{margin-top:12px;gap:8px}
 .touch-device .result-card{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.touch-device .result-records{border-top:0;border-left:1px solid #d4dec6;margin:0;padding:0 0 0 16px}
}

.brand-subtitle{font-size:20px;letter-spacing:.6px;color:#d8ed89;margin:-8px 0 14px}.game-over-card{border-top:5px solid #b86c43}.game-over-card p{font-size:15px;line-height:1.5}.game-over-card .eyebrow{color:#99552f}@media(max-height:550px){.brand-subtitle{font-size:16px;margin:0 0 10px}}

/* QA: keep the completion heading visible and contain portrait scrolling. */
.field #result{position:fixed;inset:0;z-index:12;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}.field #result .card{max-height:calc(100dvh - 32px);overscroll-behavior:contain}.portrait-prompt{overflow:hidden;overscroll-behavior:none}.rotate-prompt{touch-action:none}.touch-device #gameOver{touch-action:pan-y}.touch-device .veil{overscroll-behavior:contain}

/* P04.1: reserve the PNG logo space before it loads. */
.menu-copy h1.brand-logo{margin:14px 0 20px;line-height:1;letter-spacing:normal}.brand-logo img{display:block;width:min(280px,100%);height:auto;aspect-ratio:1448/1086}.menu-copy h1.brand-logo span{margin-top:8px}@media(orientation:landscape) and (max-height:550px){.touch-device .menu-copy h1.brand-logo{margin:8px 0 14px}.touch-device .brand-logo img{width:160px}}
@media(min-width:901px) and (max-height:800px){.brand-logo img{width:220px}}

/* P04.2: let the desktop play surface use the space left by a compact HUD. */
@media(min-width:901px){
 body:not(.touch-device) #play:not([hidden]){height:100dvh;min-height:540px;max-width:none;margin:0;padding:8px 16px;display:flex;flex-direction:column;gap:4px;color:#e5eddc}
 body:not(.touch-device) #play header{flex:none;margin:0;gap:16px;min-height:32px}
 body:not(.touch-device) #play h1{font-size:20px;gap:8px;letter-spacing:-.5px}
 body:not(.touch-device) #play .mark{width:28px;height:28px;border-radius:7px;font-size:22px}
 body:not(.touch-device) #play .version{font-size:9px;color:#aec4a5;margin-bottom:3px}
 body:not(.touch-device) #play .stats{display:flex;gap:24px}
 body:not(.touch-device) #play .stats>div{display:flex;align-items:baseline;gap:8px;min-width:0}
 body:not(.touch-device) #play .stats span{font-size:10px;letter-spacing:1px;color:#aec4a5}
 body:not(.touch-device) #play .stats strong{font-size:22px;margin:0;color:#f4f5dd}
 body:not(.touch-device) #play .stats #time.urgent{color:#ffb18c}
 body:not(.touch-device) #play .stats small{font-size:13px;color:#aec4a5}
 body:not(.touch-device) #play .tools{flex:none;margin:0;gap:16px;flex-wrap:nowrap}
 body:not(.touch-device) #play .mode-label{max-width:none;flex-wrap:nowrap;gap:8px}
 body:not(.touch-device) #play .mode-label>span{width:auto;white-space:nowrap;color:#c4d2bc}
 body:not(.touch-device) #play .mode-label select{padding:4px 8px}
 body:not(.touch-device) #play .boost{padding:0 4px 10px;max-width:260px;min-width:160px}
 body:not(.touch-device) #play .boost label{font-size:12px}
 body:not(.touch-device) #play .boost meter{margin:0;height:8px}
 body:not(.touch-device) #play .boost-state{color:#aec4a5;font-size:8px}
 body:not(.touch-device) #play .boost.active{color:#243f31}
 body:not(.touch-device) #play .boost.active .boost-state{color:#385238}
 body:not(.touch-device) #play .mode-goal{flex:none;margin:0;font-size:12px;line-height:16px;color:#c4d2bc}
 body:not(.touch-device) #play .field{flex:1;min-height:0;border:2px solid #527054;border-radius:8px;background:var(--game-background);color:#243f31;box-shadow:none}
 body:not(.touch-device) #play #game{width:100%;height:100%;max-height:none;object-fit:contain}
 body:not(.touch-device) #play footer{flex:none;padding:0;min-height:28px;color:#c4d2bc;font-size:12px}
 body:not(.touch-device) #play .reset{color:#e5eddc;padding:5px 8px}
 body:not(.touch-device) #play .records{flex:none;max-height:35dvh;overflow:auto;border-color:#527054;padding:0;font-size:12px}
 body:not(.touch-device) #play .records details{padding:2px 0}
 body:not(.touch-device) #play .records summary,body:not(.touch-device) #play .records p,body:not(.touch-device) #play .records th{color:#c4d2bc}
}
/* Prototype 05: compact warnings, initials and career selection. */
#play .field #notice{top:8px;left:50%;max-width:calc(100% - 20px);font-size:14px;font-weight:650;line-height:1.3;padding:6px 10px;border-radius:6px;box-shadow:0 2px 8px #153c2b22;text-shadow:none}
#play .field{border:0!important;border-radius:0;box-shadow:none}
#play header h1{gap:6px}#play .game-icon{display:block;width:28px;height:28px;object-fit:contain;border-radius:6px}
.career-select{display:flex;align-items:center;gap:12px;color:#c4d2bc;font-size:13px;margin-top:16px}.career-select select{min-width:0;max-width:100%;font-size:13px}
.initials-form{margin:14px 0}.initials-form label{display:block;font-size:12px;letter-spacing:1.5px;font-weight:700;margin-bottom:8px}.initials-form>div{display:flex;justify-content:center;gap:8px}.initials-form input{width:100px;min-width:0;text-align:center;letter-spacing:5px;font:700 24px monospace;border:2px solid #527054;border-radius:8px;text-transform:uppercase;background:#fff;color:#243f31}.initials-form button{width:auto;padding:10px 16px}.initials-form small{display:block;font-size:12px;margin-top:6px}.card button:disabled{opacity:.45;cursor:default}#scoreSaved{font-size:13px;color:#385238}#nextLevel{margin-top:10px}.result-records td,.result-records th{padding:9px 4px}.result-records table{font-size:12px}
@media(min-width:901px){.menu-copy h1.brand-logo{margin:10px 0 14px}.brand-logo img{width:240px}.menu-screen{padding-top:28px;padding-bottom:28px}.menu-intro{margin:10px 0}.menu-actions{margin:14px 0 12px;gap:8px}.menu-actions button{padding:13px 16px}.menu-note{margin:12px 0}.brand-links{margin-top:16px}.timed-goal{margin:10px 0}.career-select{margin-top:12px}}
@media(min-width:901px) and (max-height:800px){.brand-logo img{width:190px}}
@media(min-width:901px){body:not(.touch-device) #play header{min-height:28px}body:not(.touch-device) #play .stats strong{font-size:20px}}

#play #currentLevel{font-size:13px;font-weight:600;letter-spacing:0}.menu-actions #careerLabel{font-size:12px}

.field #result{top:var(--result-top,0px);height:var(--result-height,100dvh);bottom:auto}.field #result .card{max-height:calc(var(--result-height,100dvh) - 32px)}

/* One play palette, independent of width and input capability. */
body:has(#play:not([hidden])){background:var(--game-background)}
#play{color:#e5eddc}#play .field{background:var(--game-background);color:#243f31}
#play header .stats span,#play header .stats small,#play .version,#play .mode-label>span,#play .mode-goal,#play footer,#play .records summary,#play .records p,#play .records th{color:#c4d2bc}
#play .stats strong{color:#f4f5dd}#play .stats #time.urgent{color:#ffb18c}
#play .reset,#play .boost-state{color:#e5eddc}#play .boost.active{color:#243f31}#play .boost.active .boost-state{color:#385238}
#play .card{color:#243f31}
#play .field #notice.hazard-notice{background:transparent;color:#fff;border:0;border-radius:0;box-shadow:none;padding:3px 8px;font-weight:750;text-shadow:0 1px 3px #000,0 0 2px #183f30;letter-spacing:.5px}

/* Support shares the existing dialogs; compact screens retain a scrollable text view. */
.menu-secondary{flex-wrap:wrap;row-gap:10px}
#aboutDialog{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
#aboutDialog a{color:#285536;text-underline-offset:3px}#aboutDialog a:focus-visible{outline:3px solid #618c3d;outline-offset:3px}
.support-section{border-top:1px solid #d4dec6;margin-top:20px;padding-top:16px;display:flex;align-items:center;gap:20px}.support-section h3{margin:0;font-size:20px}.support-section p{margin:10px 0}.support-section .vipps-number{font-size:13px}
#aboutDialog .support-link{display:inline-block;background:#2d5139;color:#fff;border-radius:9px;padding:11px 16px;text-decoration:none;font-weight:650;font-size:14px}
.support-qr{display:none;width:124px;height:auto;flex:0 0 124px;border-radius:8px;background:#fff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:768px) and (min-height:600px){.support-qr{display:block}}
@media(max-height:500px){#aboutDialog{padding:18px 22px}.support-section{margin-top:12px;padding-top:12px}#pause .card{padding:18px 26px;overflow:auto}#pause .card h2{margin:8px 0}#pause .card button{padding:10px}}

/* P05.1: every event uses the same readable, unobtrusive field text. */
#play .field #notice,#play .field #notice.hazard-notice{top:8px;background:transparent;color:#fff;border:0;border-radius:0;box-shadow:none;font-size:28px;font-weight:800;line-height:1.12;padding:2px 8px;text-shadow:0 2px 4px #000,0 0 3px #000,1px 0 1px #173b2b;max-width:calc(100% - 16px);letter-spacing:.4px}
.round-status{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:26px}.round-status .mode-goal{margin:2px 0}.finish-early{flex-shrink:0;border:1px solid #a5bc83;border-radius:6px;padding:5px 10px;background:#e1ecb5;color:#203d2a;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}.finish-early:disabled{opacity:.5}
#play .stats{gap:20px}#play .stats>div{min-width:0}.live-score strong{font-variant-numeric:tabular-nums;min-width:4.5ch}
@media(max-width:900px),(max-height:500px){#play .field #notice,#play .field #notice.hazard-notice{font-size:20px;top:5px}#play .stats{gap:14px}.round-status{min-height:25px}.round-status .mode-goal{font-size:10px}.finish-early{font-size:12px;padding:4px 8px}}
@media(max-height:500px){#play header .stats strong{font-size:20px}#play header .stats span{font-size:9px}#play header{gap:10px}}