@font-face{font-family:Nunito;src:url(assets/fonts/nunito-600.woff2);font-weight:600;font-display:swap}@font-face{font-family:Nunito;src:url(assets/fonts/nunito-800.woff2);font-weight:800 1000;font-display:swap}
:root{--bg:#102d2b;--deep:#09231f;--surface:#203e35;--mint:#bce3c4;--paper:#f5edcf;--gold:#f2bf55;--coral:#ed7862;--line:#bddeb82e;--muted:#b2c6b2;--shadow:0 20px 55px #021e2855}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--bg);color:var(--paper);font-family:Nunito,sans-serif}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:0}button:focus-visible{outline:3px solid var(--mint);outline-offset:5px}button:disabled{cursor:default}button:active:not(:disabled){transform:translateY(2px)}.hidden{display:none!important}.home{position:fixed;inset:0;background:linear-gradient(90deg,#072422c2 0%,#0724225c 40%,transparent 70%),url(assets/brand/hero.webp) center/cover}.home-head{display:flex;align-items:center;justify-content:space-between;padding:28px 42px}.wordmark{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:2px;font-weight:800}.wordmark img{width:38px;height:38px;border-radius:13px;border:1px solid var(--line)}.circle{min-width:44px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#173b32cc;font-size:22px}.hero-copy{position:absolute;top:24%;left:8%;width:450px}.eyebrow{display:block;color:var(--mint);font-size:10px;font-weight:800;letter-spacing:2px}.eyebrow i{display:inline-block;width:7px;height:7px;margin-right:9px;background:var(--gold);border-radius:50%;box-shadow:0 0 15px var(--gold)}h1{font-size:clamp(62px,7vw,112px);font-weight:1000;line-height:.82;letter-spacing:-5px;margin:32px 0 25px;filter:drop-shadow(0 5px 1px #10352a);transform:rotate(-3deg);width:max-content}h1 span{display:block;color:var(--gold);letter-spacing:-6px;font-size:.87em;margin-top:10px}.hero-copy p{font-size:25px;line-height:1.2;margin:0 0 15px;font-weight:800}.hero-description{color:var(--muted);font-size:14px;line-height:1.6;display:block}.primary{display:flex;align-items:center;justify-content:center;gap:25px;min-height:58px;padding:14px 24px;border-radius:20px;background:linear-gradient(#f9d88c,#efbc53);color:#243e31;font-size:17px;font-weight:800;box-shadow:inset 0 2px #ffefb9,0 5px #9b7636,0 13px 24px #041a2366}.primary span{font-size:26px}.hero-play{margin:26px 0 14px;min-width:320px;justify-content:space-between}.hero-copy>small{font-size:8px;letter-spacing:1.3px;color:var(--muted)}.home-actions{display:flex;gap:12px;margin-top:20px;width:320px}.home-actions button{display:flex;justify-content:space-between;align-items:center;flex:1;min-height:47px;padding:10px 15px;background:#1a3c328c;border:1px solid var(--line);border-radius:16px;font-size:12px}.home-actions span{color:var(--gold)}.hero-caption{position:absolute;right:6%;bottom:17%;text-align:right;text-shadow:0 2px 10px #10251c}.hero-caption>span{font-size:8px;letter-spacing:2px}.hero-caption b{display:block;font-size:23px;line-height:1.2;margin-top:10px}.home footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:25px 42px;font-size:9px;letter-spacing:1.5px;background:linear-gradient(transparent,#092523d9)}.home footer button{min-height:44px;background:transparent;font-size:12px}.home footer button span{display:inline-grid;place-items:center;width:23px;height:23px;border:1px solid var(--line);border-radius:50%;margin-left:8px}.home footer i{font-style:normal;padding:0 15px}
.play{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at 50% 42%,#426b514f,transparent 67%),var(--deep)}.hud{display:flex;align-items:center;gap:18px;width:min(1100px,94%);padding:18px 0 10px;flex-shrink:0}.location small{color:var(--mint);font-size:9px;letter-spacing:1.8px}.location h2{font-size:21px;line-height:1.2;margin:3px 0}.hearts{margin-left:auto;display:flex;gap:6px;font-size:24px;color:var(--gold)}.hearts .empty{opacity:.22}.timer{font-variant-numeric:tabular-nums;font-size:18px;font-weight:800;min-width:67px;text-align:center;padding:11px 12px;background:var(--surface);border:1px solid var(--line);border-radius:16px}.game-status{width:min(790px,92%);display:flex;justify-content:space-between;font-size:11px;color:var(--muted);padding:5px 18px 0;flex-shrink:0}.game-status span:last-child{color:var(--gold);font-weight:800}#arena{width:min(100%,900px);flex:1;min-height:0;position:relative;overflow:hidden}#arena canvas{display:block;touch-action:none}.controls{height:148px;flex-shrink:0;width:min(980px,92%);display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:max(15px,env(safe-area-inset-bottom))}.movement{display:flex;align-items:center;gap:18px}.movement>small{font-size:8px;letter-spacing:1px;color:var(--muted);max-width:70px;line-height:1.7}#dpad{display:grid;grid-template:repeat(3,40px)/repeat(3,44px);gap:2px}#dpad button{background:linear-gradient(#355c49,#254835);box-shadow:inset 0 1px #789b664c,0 3px #062621;border:1px solid var(--line);border-radius:13px;font-size:23px;min-height:40px;user-select:none;touch-action:none}.up{grid-area:1/2}.left{grid-area:2/1}.right{grid-area:2/3}.down{grid-area:3/2}.pad-centre{grid-area:2/2;display:grid;place-items:center;color:#a8be9277;font-size:25px}.loadout{text-align:center;color:var(--muted);font-size:8px;letter-spacing:1px}.loadout>span{display:inline-block}.loadout b{color:var(--paper);font-size:20px;padding-right:7px}.loadout i{display:inline-block;height:20px;border-left:1px solid var(--line);margin:0 18px;vertical-align:middle}.loadout p{letter-spacing:0;font-size:11px;margin:7px 0 0}.action-controls{display:flex;gap:14px;align-items:center}.shield{background:#315346;border:1px solid var(--line);border-radius:22px;width:71px;height:82px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 4px #05291d}.shield span{font-size:27px;color:var(--mint);line-height:1}.shield b{font-size:11px}.shield small,.bomb small{font-size:8px;letter-spacing:1px;opacity:.65}.shield:disabled{opacity:.5}.bomb{width:137px;height:109px;border-radius:30px;background:linear-gradient(#f9d483,#e9b34d);border:2px solid #f9de9a;box-shadow:0 6px #99713c,0 15px 28px #041a20a8;color:#253b30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;touch-action:none;user-select:none}.bomb b{font-size:14px}.bomb-icon{display:block;width:28px;height:27px;background:#33463b;border-radius:50%;position:relative;margin:8px 0 0}.bomb-icon:before{content:'';position:absolute;top:-9px;left:16px;width:10px;height:10px;border-top:3px solid #344639;border-left:3px solid #344639;border-radius:8px 0 0}.bomb-icon:after{content:'';position:absolute;width:7px;height:7px;left:6px;top:5px;background:#f8dc9180;border-radius:50%}#toast{position:absolute;top:113px;left:50%;transform:translateX(-50%);max-width:80%;padding:10px 19px;border-radius:18px;background:#102c27f2;border:1px solid var(--line);font-size:12px;color:var(--paper);opacity:0;pointer-events:none;z-index:5;transition:opacity .2s}#toast.show{opacity:1}
dialog{width:min(690px,94vw);max-height:90dvh;padding:38px;border:1px solid #bccd9077;border-radius:30px;background:radial-gradient(ellipse at 0 0,#53694544,transparent 60%),var(--surface);color:var(--paper);box-shadow:0 30px 100px #001c20b3;overflow:auto}dialog::backdrop{background:#041c26b8;backdrop-filter:blur(8px)}.close{position:sticky;float:right;top:0;margin:-18px -18px 0 6px;z-index:4;background:#15392f}.panel-heading{font-size:36px;line-height:1.05;letter-spacing:-1px;margin:15px 0}.panel-copy{font-size:14px;line-height:1.65;color:var(--muted)}.panel-buttons{display:flex;gap:12px;margin-top:24px}.panel-buttons>*{flex:1}.secondary{min-height:50px;background:#2b4d3c;border:1px solid var(--line);border-radius:17px;padding:12px 19px;font-weight:800;font-size:13px}.wide{width:100%;margin-top:20px}.pill-row{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.pill-row span{border:1px solid var(--line);background:#142f2a80;padding:9px 14px;border-radius:20px;font-size:12px;color:var(--mint)}.steps{display:grid;gap:13px;grid-template-columns:repeat(3,1fr);margin:28px 0}.steps>div{padding:19px 15px;background:#16392d;border:1px solid var(--line);border-radius:22px}.steps b{display:block;font-size:14px;color:var(--gold);margin:9px 0}.steps em{font-size:28px;font-style:normal}.steps p{font-size:12px;color:var(--muted);line-height:1.6;margin:0}.world-section{margin:25px 0 10px;border-top:1px solid var(--line);padding-top:20px}.world-section h3{font-size:21px;margin:0 0 4px}.world-section small{font-size:11px;color:var(--muted)}.levels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:17px}.level{display:grid;grid-template-columns:35px 1fr;align-items:center;gap:10px;text-align:left;min-height:82px;background:#2d5340;border:1px solid #9cbe7855;border-radius:19px;padding:12px}.level .number{font-size:21px;color:var(--gold)}.level b{display:block;font-size:13px}.level small{color:var(--gold);letter-spacing:2px;font-size:12px}.level:disabled{opacity:.4;background:#203d35}.level:disabled small{font-size:9px;letter-spacing:0}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#17362d;border-radius:18px;padding:16px 19px;margin:12px 0}.settings-row b{font-size:14px;display:block}.settings-row small{font-size:11px;display:block;color:var(--muted);margin-top:4px}.toggle{width:56px;min-width:56px;height:34px;padding:4px;border-radius:30px;background:#476153}.toggle:after{content:'';display:block;background:var(--paper);width:26px;height:26px;border-radius:50%}.toggle[aria-checked=true]{background:#b1ca90}.toggle[aria-checked=true]:after{transform:translateX(22px);background:#173b32}.result-stars{font-size:55px;text-align:center;letter-spacing:7px;color:var(--gold);margin:15px 0}.result-stars .off{color:#75907644}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center}.result-stats>div{padding:16px 8px;background:#14362c;border-radius:18px}.result-stats b{font-size:25px;display:block;color:var(--mint)}.result-stats small{font-size:9px;color:var(--muted)}.footnote{font-size:10px;color:var(--muted);text-align:center;margin:20px 0 0}.save-note{color:var(--coral);font-size:12px}#loading{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;background:var(--bg);font-size:14px;color:var(--mint)}#loading img{width:64px;border-radius:24px}
@media(min-width:1500px){.hero-copy{top:26%}}
@media(max-height:780px) and (min-width:701px){.hero-copy{top:18%}h1{font-size:76px;margin:23px 0}.hero-copy p{font-size:21px}.hero-description{font-size:12px}.hero-play{margin-top:20px}.home-actions{margin-top:13px}.home-head{padding:18px 32px}.home footer{padding:10px 32px}.controls{height:125px}#dpad{grid-template:repeat(3,34px)/repeat(3,44px)}#dpad button{min-height:34px}.movement>small{display:none}.bomb{height:97px}.hud{padding-top:12px}}
@media(max-width:700px){.home{background-image:linear-gradient(180deg,#082923b3,transparent 42%,#08292366 65%,#082923f2),url(assets/brand/hero.webp);background-position:65% center}.home-head{padding:18px 20px}.wordmark{font-size:8px;letter-spacing:1px;gap:8px}.wordmark img{width:31px;height:31px}.hero-copy{left:7%;right:7%;width:auto;top:15%;bottom:96px}.hero-copy>.eyebrow{font-size:8px;letter-spacing:1.2px}h1{font-size:65px;margin:25px 0 16px;letter-spacing:-3px}h1 span{letter-spacing:-3px}.hero-copy p{font-size:19px;text-shadow:0 2px 10px #052921}.hero-description{display:none}.hero-play{position:absolute;bottom:76px;left:0;right:0;min-width:0;width:100%;margin:0;min-height:62px}.hero-copy>small{display:none}.home-actions{position:absolute;bottom:0;left:0;right:0;width:100%;margin:0}.home-actions button{min-height:51px;background:#1c392dd9}.hero-caption{display:none}.home footer{padding:12px 20px;font-size:8px}.home footer>span:nth-child(2){display:none}.hud{gap:10px;padding:16px 0 8px;width:92%}.location{min-width:0}.location h2{font-size:14px}.location small{font-size:7px;letter-spacing:1px}.hearts{font-size:17px;gap:2px}.timer{font-size:13px;min-width:48px;padding:8px;border-radius:12px}.game-status{font-size:10px;padding:8px 2px 0}.controls{height:183px;width:92%;gap:10px;flex-wrap:wrap;padding-bottom:23px;position:relative;align-items:flex-end}.movement>small{display:none}#dpad{grid-template:repeat(3,44px)/repeat(3,44px)}#dpad button{min-height:44px}.loadout{position:absolute;left:0;right:0;top:0;font-size:8px;pointer-events:none}.loadout p{display:none}.loadout b{font-size:14px}.loadout i{height:12px;margin:0 10px}.action-controls{gap:9px;padding-bottom:13px}.bomb{width:99px;height:100px;border-radius:27px}.bomb b{font-size:11px}.bomb small,.shield small{display:none}.shield{width:57px;height:73px;border-radius:19px}.shield b{font-size:9px}#toast{top:116px;font-size:11px;text-align:center;padding:10px 14px}.panel-heading{font-size:29px}.panel-copy{font-size:13px}dialog{padding:29px 23px}.steps{grid-template-columns:1fr;gap:9px;margin:20px 0}.steps>div{display:grid;grid-template-columns:35px 1fr;gap:5px 12px;padding:13px}.steps em{grid-row:span 2}.steps b{margin:0}.steps p{font-size:11px}.levels{grid-template-columns:1fr}.panel-buttons{flex-wrap:wrap}.panel-buttons>*{min-width:100px}.close{margin:-12px -12px 0 6px}}
@media(max-height:550px) and (orientation:landscape){.hero-copy{top:90px;left:8%;bottom:48px;width:290px}.hero-copy>.eyebrow{display:none}h1{font-size:54px;margin:0 0 13px}.hero-copy p,.hero-description,.hero-copy>small{display:none}.hero-play{position:static;margin-top:17px;min-height:47px;width:275px;min-width:0}.home-actions{position:static;width:275px;margin-top:14px}.home-actions button{min-height:43px}.hero-caption{display:none}.home footer>span:nth-child(2){display:none}.home footer{padding:1px 24px}.play{align-items:flex-start}.hud{width:100%;padding:8px 18px;gap:10px}.location h2{font-size:13px}.location small{font-size:7px}.hearts{font-size:18px}.timer{font-size:13px;padding:6px 10px}.game-status{position:absolute;left:20px;top:67px;width:130px;display:block;font-size:9px}.game-status span{display:block;margin-bottom:5px}#arena{position:absolute;left:145px;right:150px;top:60px;bottom:4px;width:auto;height:auto}.controls{position:absolute;inset:0;width:100%;height:100%;padding:0;pointer-events:none}.movement{position:absolute;bottom:15px;left:12px}.movement small{display:none}#dpad{grid-template:repeat(3,40px)/repeat(3,40px)}#dpad button{min-height:40px;pointer-events:auto}.action-controls{position:absolute;right:22px;bottom:22px;flex-direction:column-reverse;gap:12px;pointer-events:auto;padding:0}.bomb{width:94px;height:91px}.shield{height:49px;width:94px;flex-direction:row;gap:8px}.shield small{display:none}.loadout{position:absolute;right:16px;left:auto;top:77px;text-align:center;width:108px}.loadout p{display:none}.loadout b{font-size:14px}.loadout i{margin:0 6px}#toast{top:70px;max-width:50%;font-size:10px}.hud .circle{height:40px;min-width:40px;width:40px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* 0.2: a clearer lesson and thumb-friendly controls. */
.lesson{width:min(790px,92%);flex-shrink:0;display:flex;align-items:center;gap:12px;justify-content:space-between;padding:10px 15px;margin-top:10px;border:1px solid #b3d59a55;border-radius:18px;background:linear-gradient(110deg,#385743,#1c3c32);box-shadow:0 6px 20px #051e2444}.lesson b{display:block;font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--gold)}.lesson span{display:block;font-size:12px;line-height:1.4;margin-top:3px}.lesson button{background:#122d2788;min-height:42px;min-width:80px;border:1px solid var(--line);border-radius:13px;font-size:10px;padding:8px}.training-note{background:#bfd6a01a;border-left:3px solid var(--gold);border-radius:5px 13px 13px 5px;padding:13px;font-size:12px;line-height:1.6;color:var(--mint)}#joystick{display:none;width:136px;height:136px;position:relative;border:2px solid #86a58d55;border-radius:50%;background:radial-gradient(circle,#577b5b55,#1d4438 58%,#16372d);box-shadow:inset 0 4px 18px #051e2477,0 4px #061f1b;touch-action:none;user-select:none;flex-shrink:0}#joystick i{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;letter-spacing:18px;padding-left:18px;color:#93b69355;font-size:18px}#joystick span{position:absolute;left:calc(50% - 27px);top:calc(50% - 27px);width:54px;height:54px;border-radius:50%;background:linear-gradient(145deg,#c0d7a2,#6f9b7a);box-shadow:inset 0 2px #e6efcc,0 5px 12px #092e2999;pointer-events:none}#joystick:active{transform:none}body[data-joystick=true] #joystick{display:block}body[data-joystick=true] #dpad{display:none}body[data-large-controls=true] .movement{transform:scale(1.1);transform-origin:left bottom}body[data-large-controls=true] .action-controls{transform:scale(1.1);transform-origin:right bottom}#dpad button:active{background:linear-gradient(#789a6a,#3d6950);border-color:var(--mint)}#play:has(.lesson:not(.hidden)) #toast{top:auto;bottom:175px}
@media(max-height:550px) and (orientation:landscape){#joystick{width:122px;height:122px}.lesson{position:absolute;left:157px;right:158px;top:53px;width:auto;margin:0;padding:7px 10px;z-index:2}.lesson span{font-size:10px}.lesson b{font-size:8px}.lesson button{min-width:50px;min-height:35px;font-size:9px}#play:has(.lesson:not(.hidden)) #arena{top:122px}#play:has(.lesson:not(.hidden)) #toast{bottom:7px}}
@media(max-width:360px) and (orientation:portrait){#dpad{grid-template:repeat(3,40px)/repeat(3,39px)}#dpad button{min-height:40px}#joystick{width:120px;height:120px}.bomb{width:88px}.shield{width:49px}.action-controls{gap:8px}body[data-large-controls=true] .movement,body[data-large-controls=true] .action-controls{transform:scale(1.03)}.lesson{padding:8px 10px}.lesson span{font-size:11px}}
/* Illustrated arena, version 0.3. */
.play::before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#061d20c9,#0a2825e8 30%,#0a2825e8 70%,#061d20c9),url(assets/brand/hero.webp) center/cover;opacity:.5}.play>*{z-index:1}.hud{position:relative;border-bottom:1px solid #c3d3aa1c}.location h2{text-shadow:0 2px 10px #0008}.timer{background:linear-gradient(145deg,#35594a,#183c33);box-shadow:inset 0 1px #d9e5bc25,0 5px 15px #061b2433}.game-status{letter-spacing:.15px}.lesson{box-shadow:inset 0 1px #dcdfb527,0 6px 20px #051e2444}.bomb{background:radial-gradient(ellipse at 30% 0%,#fff1b4,transparent 65%),linear-gradient(#f9d483,#dfab44);box-shadow:inset 0 2px #fff1bc,0 6px #99713c,0 15px 28px #041a20a8}.shield{background:linear-gradient(140deg,#436d57,#25463c);box-shadow:inset 0 1px #d9efc633,0 4px #05291d}.loadout{background:#09272082;border:1px solid #b3d2b420;border-radius:18px;padding:10px 18px;box-shadow:inset 0 1px #d2dfb50a}.loadout p{color:#a8c6b2}dialog{background:radial-gradient(ellipse at 10% 0,#bdc98819,transparent 60%),linear-gradient(145deg,#2f5142,#163930);border-color:#bbcd9866;box-shadow:inset 0 1px #deedbf33,0 30px 100px #001c20b3}.level{background:linear-gradient(135deg,#42654e,#274735);box-shadow:inset 0 1px #d2e6ab16}.level .number{display:grid;place-items:center;height:40px;background:#d8bd7720;border-radius:12px}.level:disabled{background:#203d35}.world-section h3{color:#edf1ca}
@media(max-width:700px){.loadout{padding:6px 12px;left:50%;right:auto;transform:translateX(-50%);width:max-content}.controls{padding-top:29px}}
@media(max-height:550px) and (orientation:landscape){.loadout{left:auto;right:13px;transform:none;padding:7px 8px;width:118px}}
.play[data-world="1"]{background:#102335}.play[data-world="1"]::before{background:radial-gradient(ellipse at 8% 80%,#54aabc55,transparent 40%),radial-gradient(ellipse at 90% 15%,#65539388,transparent 45%),linear-gradient(130deg,#152631,#172b40);opacity:1}.play[data-world="2"]{background:#29271f}.play[data-world="2"]::before{background:radial-gradient(ellipse at 8% 75%,#e9953644,transparent 45%),radial-gradient(ellipse at 90% 20%,#a77a3b44,transparent 45%),linear-gradient(130deg,#152726,#322c24);opacity:1}

/* Landscape command rails: the complete board owns the screen height. */
.play{--rail:clamp(132px,14vw,180px);--edge-left:max(8px,env(safe-area-inset-left));--edge-right:max(8px,env(safe-area-inset-right));--edge-top:max(8px,env(safe-area-inset-top));--edge-bottom:max(12px,env(safe-area-inset-bottom))}
#play #arena,#play:has(.lesson:not(.hidden)) #arena{position:absolute;left:calc(var(--rail) + var(--edge-left));right:calc(var(--rail) + var(--edge-right));top:max(2px,env(safe-area-inset-top));bottom:max(2px,env(safe-area-inset-bottom));width:auto;height:auto;flex:none}
#play .hud{position:absolute;left:var(--edge-left);top:var(--edge-top);width:var(--rail);padding:10px;display:flex;flex-direction:column;align-items:stretch;gap:22px;border:0}
.utility-buttons{display:flex;align-items:center;gap:10px}
#play .location small{display:block;font-size:9px;line-height:1.7;letter-spacing:1.4px}
#play .location h2{font-size:21px;line-height:1.2;margin-top:7px;overflow-wrap:break-word}
.status-rail{position:absolute;right:var(--edge-right);top:var(--edge-top);width:var(--rail);display:flex;flex-direction:column;align-items:center;gap:14px;padding:10px}
#play .hearts{margin:0;font-size:25px;letter-spacing:3px;white-space:nowrap}
#play .timer{min-width:92px;font-size:23px;padding:10px 16px}
#play .game-status{position:absolute;left:calc(var(--edge-left) + 10px);top:195px;width:calc(var(--rail) - 20px);padding:0;display:flex;flex-direction:column;gap:10px;font-size:12px;line-height:1.55}
#play:has(.lesson:not(.hidden)) .game-status{display:none}
#play .lesson{position:absolute;left:var(--edge-left);right:auto;top:195px;width:var(--rail);max-height:calc(100dvh - 380px);overflow:auto;margin:0;padding:14px 12px;display:flex;flex-direction:column;align-items:stretch;gap:12px;border-radius:20px;z-index:3}
#play .lesson b{font-size:10px;line-height:1.5;letter-spacing:.6px}
#play .lesson span{font-size:12px;line-height:1.5;margin-top:7px}
#play .lesson button{min-height:38px;min-width:0;padding:5px;font-size:11px;flex-shrink:0}
#play .controls{position:absolute;inset:0;width:100%;height:100%;padding:0;pointer-events:none;display:block}
#play .movement{position:absolute;left:calc(var(--edge-left) + 8px);bottom:var(--edge-bottom);display:flex;flex-direction:column;gap:12px;pointer-events:auto}
#play .movement>small{display:block;max-width:none;font-size:8px;text-align:center}
#play #dpad{grid-template:repeat(3,44px)/repeat(3,44px);gap:2px}
#play #dpad button{min-height:44px}
#play #joystick{width:136px;height:136px}
#play .loadout{position:absolute;left:auto;right:var(--edge-right);top:160px;width:var(--rail);padding:12px 8px;transform:none;font-size:8px;line-height:1.6}
#play .loadout b{font-size:18px;padding-right:4px}
#play .loadout i{height:14px;margin:0 8px}
#play .loadout p{display:block;font-size:10px;line-height:1.4;margin-top:8px}
#play .action-controls{position:absolute;right:calc(var(--edge-right) + 12px);bottom:calc(var(--edge-bottom) + 6px);display:flex;flex-direction:column;gap:18px;padding:0;pointer-events:auto}
#play .bomb{width:132px;height:110px;border-radius:29px}
#play .bomb b{font-size:14px}
#play .shield{width:132px;height:60px;flex-direction:row;gap:8px;border-radius:20px}
#play .shield b{font-size:12px}
#play .shield small,#play .bomb small{display:block}
#play #toast,#play:has(.lesson:not(.hidden)) #toast{top:auto;bottom:max(16px,env(safe-area-inset-bottom));max-width:calc(100% - 2 * var(--rail) - 30px);font-size:11px;text-align:center}
body[data-large-controls=true] #play .movement,body[data-large-controls=true] #play .action-controls{transform:scale(1.06)}
#rotate-screen{width:min(390px,90vw);text-align:center;padding:38px 24px;border-radius:32px;overflow:auto;max-height:94dvh}
#rotate-screen::backdrop{background:#092823f5;backdrop-filter:blur(14px)}
#rotate-screen h2{font-size:29px;line-height:1.15;margin:20px 0 16px}
#rotate-screen p{font-size:14px;line-height:1.7;color:var(--muted)}
#rotate-screen>small{font-size:11px;color:var(--gold)}
#rotate-screen .eyebrow{font-size:8px;line-height:1.6;letter-spacing:1.4px}
.rotate-illustration{position:relative;width:104px;height:64px;border:3px solid var(--gold);border-radius:17px;margin:15px auto 48px;box-shadow:0 0 45px #f2bf5515,inset 0 0 28px #bce3c417;transform:rotate(-12deg)}
.rotate-illustration i{display:grid;place-items:center;height:100%;font-size:30px;color:var(--mint);font-style:normal}
.rotate-illustration span{position:absolute;right:-24px;bottom:-32px;font-size:45px;color:var(--gold)}
@media(max-height:550px) and (orientation:landscape){
 #play .hud{padding:0 6px;gap:10px}#play .utility-buttons{gap:9px}#play .hud .circle{width:36px;height:36px;min-width:36px;font-size:20px}
 #play .location small{display:none}#play .location h2{font-size:13px;margin:0;line-height:1.2}
 #play .status-rail{gap:5px;padding:0 6px}#play .hearts{font-size:19px;letter-spacing:1px}#play .timer{min-width:74px;font-size:17px;padding:5px 12px;border-radius:13px}
 #play .game-status{top:90px;font-size:10px;gap:6px}
 #play .lesson{top:84px;max-height:calc(100dvh - 226px);padding:9px;gap:7px;border-radius:15px}#play .lesson b{font-size:9px;line-height:1.25}#play .lesson span{font-size:11px;line-height:1.3;margin-top:4px}#play .lesson button{min-height:32px;font-size:10px}
 #play .loadout{top:88px;padding:7px 5px;font-size:7px}#play .loadout b{font-size:14px}#play .loadout i{margin:0 5px}#play .loadout p{display:none}
 #play .movement{left:calc(var(--edge-left) + 3px)}#play .movement>small{display:none}#play #dpad{grid-template:repeat(3,38px)/repeat(3,38px)}#play #dpad button{min-height:38px;font-size:22px}#play #joystick{width:118px;height:118px}
 #play .action-controls{right:calc(var(--edge-right) + 10px);gap:13px}#play .bomb{width:108px;height:89px;border-radius:25px}#play .bomb b{font-size:12px}#play .shield{width:108px;height:45px;border-radius:16px}#play .shield b{font-size:11px}#play .shield small,#play .bomb small{display:none}
 #play #toast,#play:has(.lesson:not(.hidden)) #toast{font-size:10px;padding:7px 10px}
}