:root{color-scheme:dark;--bg:#11151c;--panel:#1a1e26;--border:#34343a;--cream:#bdcfe5;--muted:#9f9d9d;--gold:#8cacd4;--red:#c27266;--mono:"Courier New",monospace}*{box-sizing:border-box}html,body{margin:0;overflow:hidden;height:100%;width:100%;background:var(--bg);color:var(--cream);font-family:Arial,sans-serif;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #a6c8f1;outline-offset:4px}button:disabled{opacity:.5;cursor:default}[hidden]{display:none!important}.icon-definitions{position:absolute;width:0;height:0}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.app{height:100dvh;max-width:1256px;margin:auto;padding:0 28px;display:flex;flex-direction:column}.masthead{height:88px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.brand{display:flex;gap:15px;align-items:center}.brand strong{display:block;font-family:var(--mono);font-size:16px;letter-spacing:1.5px}.brand span{display:block;font-size:11px;color:#969397;margin-top:5px}.brand-mark{width:38px;height:44px;position:relative;image-rendering:auto;background:linear-gradient(90deg,transparent 20%,#667689 20% 80%,transparent 80%);clip-path:polygon(15% 15%,30% 15%,30% 0,70% 0,70% 15%,85% 15%,85% 100%,15% 100%)}.brand-mark:before{content:"";position:absolute;inset:8px 9px 0;background:#22242d;box-shadow:inset 0 0 0 3px #7993b4}.brand-mark:after{content:"";position:absolute;top:27px;left:24px;width:3px;height:4px;background:#97bae6}.private-badge{font-family:var(--mono);font-size:10px;letter-spacing:1.2px;padding:9px 12px;border:1px solid #3a393a;border-radius:3px;color:#99a3ae;display:flex;align-items:center;gap:8px}.private-badge i,.status-dot{display:inline-block;width:5px;height:5px;background:#91a1b5;box-shadow:0 0 7px #a6bdd955}.game-frame{flex:1;min-height:0;display:flex;flex-direction:column;position:relative;border:1px solid #454047;border-radius:7px;overflow:hidden;box-shadow:0 18px 70px #080a1155}.hud{height:69px;flex-shrink:0;background:#1b1e25;display:flex;align-items:center;gap:20px;padding:0 25px;border-bottom:1px solid #414047;z-index:5}.level-info{min-width:180px;display:flex;flex-direction:column;gap:5px}.eyebrow,.stat-label{font-family:var(--mono);font-size:9px;letter-spacing:1.6px;color:#959ea9}.level-info strong{font-size:14px;font-weight:500}.hud-stats{display:flex;gap:31px;align-items:center;margin-left:auto}.lives-stat{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:19px}.lives-stat>.icon{color:#c68179;width:20px;height:20px;fill:#c6817920}.gentle-hp{font-size:10px;letter-spacing:2px;color:#b97d73}.ammo-stat,.score-stat{display:flex;flex-direction:column;gap:7px}.shells{display:flex;gap:4px;height:15px}.shell{width:7px;height:15px;background:#484448;border-radius:1px;border-bottom:4px solid #575c63;position:relative}.shell.loaded{background:#7d9cc2;border-color:#9abae2;box-shadow:inset 0 0 0 1px #9ab9e033}.shell.loaded:before{content:"";position:absolute;top:2px;left:2px;height:6px;width:1px;background:#98b9e144}.score-stat strong{font:16px/1 var(--mono);letter-spacing:1px}.key-stat{color:#5a575e;width:23px}.key-stat.found{color:#99bae2;filter:drop-shadow(0 0 5px #88abd533)}.hud-actions{display:flex;gap:5px;padding-left:15px;border-left:1px solid #39383e}.icon-button{width:33px;height:35px;display:grid;place-items:center;background:none;border:0;color:#a5b0bc;border-radius:4px}.icon-button:hover{background:#343239;color:#b4d0f3}.icon-button.muted{opacity:.42}.icon-button .icon{width:19px;height:19px}.stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#20202b}canvas{display:block;width:100%;height:100%;image-rendering:auto;touch-action:none}.screen{position:absolute;inset:0;z-index:3}.screen-title{display:flex;align-items:center;background:linear-gradient(90deg,#131821f2,#131821c9 42%,#15172010 80%);padding:24px 7%}.title-content{width:426px;max-width:100%;position:relative}.title-kicker{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;letter-spacing:1.45px;color:#9fa9b5;margin-bottom:18px}.title-kicker>span{width:6px;height:6px;background:#809dc0;box-shadow:0 0 10px #8aafdd44}h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:clamp(40px,4.9vw,67px);line-height:.99;letter-spacing:-1.6px;color:#bcd0e9;text-shadow:0 2px #4d3843}h1 em{font-style:normal;color:#87a5c9;display:block;margin-top:7px}.title-rule{display:flex;gap:13px;align-items:center;width:190px;margin:20px 0 16px;color:#718aa8}.title-rule span{height:1px;flex:1;background:linear-gradient(90deg,#718aa844,#718aa888)}.title-rule .icon{width:13px;height:13px}.title-intro{font-size:14px;line-height:1.7;color:#aab4c1;margin:0 0 23px}.primary-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:15px 20px;min-height:52px;border:1px solid #9abae0;border-radius:3px;background:#8babd1;color:#28242b;font-size:15px;font-weight:600;box-shadow:0 3px 0 #586c84;transition:background .15s}.primary-button:hover{background:#9bbae1}.primary-button .icon{width:21px}.button-arrow{margin-left:auto;font-size:23px;line-height:1}.continue-button{width:100%;background:#252831bb;border:1px solid #4e5966;color:#a9bad0;min-height:39px;border-radius:3px;margin-top:10px;font-size:12px}.difficulty{margin-top:19px;display:flex;padding:4px;gap:4px;border:1px solid #3f3b3e;border-radius:4px;width:100%;background:#171b2244}.difficulty button{width:50%;border:0;border-radius:2px;background:none;color:#8b949e;display:flex;align-items:center;justify-content:center;gap:7px;font-size:11px;padding:10px 7px}.difficulty span{font-size:9px;color:#808892}.difficulty .selected{background:#3b3434;color:#a8c1e0}.difficulty .selected span{color:#9ca9ba}.title-links{display:flex;align-items:center;justify-content:space-between;margin-top:20px;gap:12px}.title-links button{display:flex;align-items:center;gap:7px;border:0;background:none;padding:0;font-size:11px;color:#9ea9b6}.title-links .icon{width:15px;height:15px}.title-links button:hover{color:#9ebee6}.record{font-family:var(--mono);font-size:8px;letter-spacing:.5px;color:#818993;margin:24px 0 0;line-height:1.5}.title-note{position:absolute;right:8%;bottom:45px;display:flex;align-items:center;gap:13px;opacity:.7;color:#afbccc}.title-note>span{font:56px/1 Georgia,serif}.title-note>div{font:10px/1.6 var(--mono);letter-spacing:2px}.title-note small{font-family:Arial,sans-serif;font-size:10px;letter-spacing:0;color:#96a0ab}.touch-controls{height:145px;flex-shrink:0;background:#171b23;display:flex;align-items:center;justify-content:space-between;position:relative;padding:14px 30px 18px;border-top:1px solid #39343d;z-index:4;touch-action:none;user-select:none;-webkit-user-select:none}.dpad{width:116px;height:116px;position:relative;cursor:pointer;touch-action:none;flex:none}.dpad-disc{position:absolute;inset:4px;border:1px solid #4f464a;border-radius:50%;background:radial-gradient(ellipse at 35% 30%,#36323b,#252832);box-shadow:inset 0 -3px 2px #11151caa,0 3px 10px #0003}.dpad .icon{position:absolute;width:21px;height:21px;pointer-events:none;color:#a0aab6}.dpad-up{left:47px;top:15px;transform:rotate(90deg)}.dpad-left{left:14px;top:47px}.dpad-right{right:14px;top:47px;transform:rotate(180deg)}.dpad-down{left:47px;bottom:15px;transform:rotate(-90deg)}.dpad-dot{position:absolute;width:27px;height:27px;top:44px;left:44px;border:1px solid #544b4d;border-radius:50%;background:#282a34}.dpad-knob{position:absolute;left:40px;top:40px;width:35px;height:35px;border-radius:50%;border:1px solid #89a9d0;box-shadow:0 0 8px #89a9d022;background:#61728755;opacity:0;pointer-events:none;transform:translate(0,0)}.dpad.active .dpad-knob{opacity:1}.dpad.active .dpad-dot{opacity:0}.control-label{position:absolute;left:0;right:0;bottom:-13px;text-align:center;font:7px var(--mono);letter-spacing:.6px;color:#828a94;white-space:nowrap}.control-hint{max-width:360px;text-align:center;display:grid;grid-template-columns:22px auto;column-gap:9px;row-gap:10px;align-items:center;margin:0 15px;color:#a3aebd}.control-hint>.icon{width:18px;color:#86a2c5}.control-hint>span{font-size:12px}.control-hint small{grid-column:1/-1;font-size:10px;line-height:1.4;color:#8e8a8b;max-width:310px}.action-controls{display:flex;gap:16px;align-items:center}.action-button{border:1px solid #5b5051;border-radius:50%;width:78px;height:78px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;background:radial-gradient(ellipse at 30% 20%,#3d343c,#272832);color:#a4bbd6;box-shadow:inset 0 -4px 2px #15182180,0 3px 8px #0a0e1744;touch-action:none}.action-button .icon{width:24px;height:24px}.action-button span{font:8px var(--mono);letter-spacing:1px}.interact-button{width:53px;height:53px;color:#98a2ad}.interact-button .icon{width:19px;height:19px}.interact-button span{font-size:7px}.fire-button{width:92px;height:92px;border-color:#738ba9;background:radial-gradient(ellipse at 30% 20%,#684d47,#3e3339);color:#b2cced}.fire-button .icon{width:30px;height:30px}.action-button.active,.action-button:active{background:#525d6a;box-shadow:inset 0 2px 8px #171b2344;transform:translateY(2px);border-color:#96b2d5}.footer{height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#969096;gap:12px}.footer>span:first-child{display:flex;align-items:center;gap:5px}.footer i{font-style:normal;margin:0 3px;color:#73696f}kbd{font-family:var(--mono);font-size:9px;color:#a2acb8;min-width:15px;border:1px solid #3e3a42;border-radius:2px;padding:3px 4px;text-align:center}#save-status{display:flex;align-items:center;gap:8px;font:8px var(--mono);letter-spacing:1px;white-space:nowrap}.toast{position:absolute;z-index:8;top:22px;left:50%;transform:translateX(-50%) translateY(-8px);border:1px solid #506072;background:#181c24ed;border-radius:4px;padding:11px 16px;font-size:12px;color:#a7c1e2;text-align:center;opacity:0;transition:.15s;pointer-events:none;max-width:85%;width:max-content}.toast.visible{opacity:1;transform:translateX(-50%)}.room-caption{position:absolute;left:50%;top:26%;transform:translateX(-50%);text-align:center;pointer-events:none;z-index:2;color:#b6cce6;text-shadow:0 2px 6px #000}.room-caption span{display:block;font:10px var(--mono);letter-spacing:2px;color:#9cabbd;margin-bottom:10px}.room-caption strong{font:30px Georgia,serif}.modal-screen{display:flex;align-items:center;justify-content:center;background:#10151cbd;backdrop-filter:blur(4px);padding:18px;z-index:10}.modal-card{width:420px;max-width:100%;max-height:100%;overflow-y:auto;background:#1d2029;border:1px solid #505b6a;box-shadow:0 20px 70px #080d1788;padding:31px 32px;border-radius:5px}.modal-eyebrow{font:9px var(--mono);letter-spacing:1.8px;color:#7f98b5;margin:0 0 13px}.modal-card h2{font:32px/1.1 Georgia,serif;margin:0 0 15px;color:#bacee7}.modal-card p{font-size:12px;line-height:1.7;color:#a8b2bf;margin:12px 0 18px}.modal-card .primary-button{font-size:13px;min-height:45px;padding:12px 17px;margin-top:17px}.secondary-button{width:100%;background:none;border:1px solid #504449;border-radius:3px;padding:11px 17px;font-size:12px;color:#a3b4c8;margin-top:10px}.secondary-button:hover{background:#322c32}.help-grid{display:grid;grid-template-columns:32px 1fr;gap:14px 12px;margin:20px 0}.help-grid .icon{color:#8ba7ca;width:23px;height:23px}.help-grid strong{font-size:12px;font-weight:500;display:block;color:#b9c7d9}.help-grid small{font-size:10px;line-height:1.6;display:block;color:#9099a4;margin-top:3px}.result-stats{display:flex;gap:12px;margin:23px 0}.result-stats>div{flex:1;border:1px solid #4a3e44;padding:14px 9px;text-align:center;border-radius:3px}.result-stats strong{display:block;font:23px var(--mono);color:#9ab6d8}.result-stats span{display:block;font:8px var(--mono);letter-spacing:1px;margin-top:8px;color:#8f97a2}.room-list{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:19px 0}.room-list button{min-height:44px;background:#272b35;border:1px solid #514850;border-radius:3px;color:#a7bcd6;font:12px var(--mono)}.room-list button.current{background:#4d5968;border-color:#7e96b4}.room-list button:disabled{opacity:.3}.touch-controls.disabled{opacity:.35;pointer-events:none}.install-note{border-left:2px solid #67809d;padding-left:12px}.modal-close{margin-top:14px;width:100%;padding:8px;border:0;color:#94a2b4;background:none;font-size:11px}.playing .screen-title{display:none}.playing .touch-controls{opacity:1}.screen-title~.room-caption{display:none}.playing .room-caption{display:block}body:fullscreen .app{max-width:none;padding:0}.app:fullscreen{max-width:none;padding:0}body:fullscreen .masthead,body:fullscreen .footer{display:none}
@media(min-width:800px) and (min-height:900px){.app{max-height:1000px;margin:auto}.screen-title{padding-left:9%}h1{font-size:73px}.title-intro{font-size:15px}.title-kicker{font-size:10px}.title-content{width:430px}}
@media(max-width:900px){.app{padding:0 14px}.masthead{height:65px}.brand strong{font-size:13px}.brand span{font-size:10px}.private-badge{font-size:8px;padding:7px 9px}.hud{padding:0 16px;gap:13px}.level-info{min-width:130px}.hud-stats{gap:18px}.hud-actions{padding-left:10px}.footer>span:first-child{font-size:8px;gap:3px}.footer #save-status{display:none}.screen-title{padding:24px 6%}.title-content{width:360px}.title-kicker{font-size:8px;letter-spacing:1px}.title-note{right:7%;bottom:25px}.touch-controls{padding:12px 21px 18px}.control-hint{max-width:250px}.control-hint>span{font-size:10px}.control-hint small{font-size:9px}.action-controls{gap:12px}}
@media(max-width:600px){.app{padding:0;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.masthead{height:57px;padding:0 17px}.brand{gap:10px}.brand-mark{height:30px;width:27px}.brand-mark:before{inset:6px 6px 0}.brand-mark:after{left:16px;top:19px}.brand strong{font-size:11px;letter-spacing:1px}.brand span{font-size:8px}.private-badge{font-size:7px;letter-spacing:.5px;padding:6px 8px}.game-frame{border-left:0;border-right:0;border-radius:0}.hud{height:63px;padding:0 13px;gap:8px;position:relative}.level-info{min-width:0;width:118px;gap:4px}.level-info strong{font-size:11px;max-width:118px}.eyebrow{font-size:8px;letter-spacing:.8px}.hud-stats{gap:13px}.lives-stat{font-size:15px;gap:4px}.lives-stat>.icon{width:16px;height:16px}.stat-label{font-size:7px;letter-spacing:.6px}.shells{gap:2px;height:11px}.shell{width:5px;height:11px;border-bottom-width:3px}.score-stat{display:none}.key-stat{width:18px}.hud-actions{gap:0;padding-left:6px}.icon-button{width:28px;height:32px}.icon-button .icon{width:17px;height:17px}#sound-button{display:none}.ammo-stat{gap:5px}.title-content{width:100%;max-width:335px;margin:auto}.screen-title{padding:20px 27px;background:linear-gradient(90deg,#131821dc,#131821c7 60%,#13182155)}h1{font-size:47px;letter-spacing:-1px}.title-kicker{font-size:7px;letter-spacing:1px;margin-bottom:16px}.title-rule{margin-top:17px;margin-bottom:13px;width:160px}.title-intro{font-size:12px;line-height:1.6;margin-bottom:20px}.primary-button{font-size:13px;min-height:49px;padding:12px 16px}.difficulty{margin-top:15px}.difficulty button{gap:5px;font-size:10px;padding:9px 4px}.difficulty span{font-size:8px}.title-links{margin-top:16px;gap:8px}.title-links button{font-size:10px}.record{font-size:7px;margin-top:17px}.title-note{display:none}.touch-controls{height:145px;padding:10px 18px 23px;gap:8px}.dpad{width:109px;height:109px;transform:scale(.94);transform-origin:center}.dpad .dpad-up,.dpad .dpad-down{left:43px}.dpad .dpad-left,.dpad .dpad-right{top:43px}.dpad-dot{left:40px;top:40px}.dpad-knob{left:36px;top:36px}.control-hint{display:none}.action-controls{gap:10px}.action-button{width:66px;height:66px;gap:5px}.action-button .icon{width:23px;height:23px}.action-button span{font-size:7px;letter-spacing:.5px}.fire-button{width:79px;height:79px}.fire-button .icon{width:27px;height:27px}.interact-button{width:40px;height:40px;gap:3px}.interact-button .icon{width:15px;height:15px}.interact-button span{font-size:6px}.footer{height:0;display:none}.modal-card{padding:26px 22px}.modal-card h2{font-size:28px}.toast{font-size:11px;top:14px}.room-caption strong{font-size:25px}.room-caption{top:22%}.gentle-hp{display:none}}
@media(max-height:650px) and (max-width:600px){.masthead{display:none}h1{font-size:36px}.title-kicker{margin-bottom:10px;font-size:6px}.title-rule{margin:10px 0}.title-intro{font-size:11px;margin-bottom:12px}.screen-title{padding:12px 28px}.difficulty{margin-top:10px}.title-links{margin-top:12px}.record{margin-top:12px;font-size:6px}.touch-controls{height:121px}.dpad{transform:scale(.83)}.hud{height:52px}}
@media(min-width:600px) and (max-height:580px){.app{max-width:none;padding:0 env(safe-area-inset-right) 0 env(safe-area-inset-left)}.masthead,.footer{display:none}.game-frame{border:0;border-radius:0}.hud{height:47px;padding:0 21px}.level-info{min-width:160px;gap:3px}.eyebrow{font-size:7px}.level-info strong{font-size:11px}.hud-stats{gap:23px}.stat-label{font-size:7px}.shells{height:12px}.shell{height:12px}.score-stat strong{font-size:13px}.lives-stat{font-size:16px}.hud-actions{gap:6px}.touch-controls{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:14px;right:14px;height:106px;padding:0 11px;background:none;border:0;pointer-events:none}.dpad,.action-controls{pointer-events:auto}.dpad{width:116px;height:116px;transform:scale(.87);transform-origin:left center}.dpad-disc{background:#272a36ba;border-color:#6b778566}.action-controls{gap:14px}.action-button{background:#30303bd9;width:69px;height:69px;border-color:#6d819b77}.fire-button{width:83px;height:83px;background:#654b46d9;border-color:#85a1c488}.interact-button{width:42px;height:42px;gap:3px}.interact-button span{font-size:6px}.control-label,.control-hint{display:none}.screen-title{padding:17px 9%;background:linear-gradient(90deg,#131821f2,#131821d9 42%,#15172010 80%)}.title-content{width:330px}h1{font-size:36px;line-height:.96;letter-spacing:-.5px}.title-kicker{font-size:7px;margin-bottom:10px}.title-rule{display:none}.title-intro{font-size:11px;line-height:1.5;margin:14px 0}.primary-button{padding:10px 14px;min-height:43px;font-size:12px}.primary-button .icon{width:18px}.difficulty{margin-top:12px;padding:2px}.difficulty button{padding:8px;font-size:10px}.difficulty span{font-size:8px}.title-links{margin-top:13px}.title-links button{font-size:10px}.record{margin-top:15px;font-size:6px}.continue-button{min-height:31px;font-size:10px;margin-top:7px}.title-note{bottom:140px;right:16%}.title-note>span{font-size:51px}.modal-card{padding:22px 27px;width:490px;max-height:calc(100% - 5px)}.modal-card h2{font-size:26px;margin-bottom:10px}.modal-card p{margin:9px 0 12px;font-size:11px}.help-grid{grid-template-columns:26px 1fr 26px 1fr;gap:12px 10px}.help-grid strong{font-size:11px}.help-grid small{font-size:9px}.result-stats{margin:15px 0}.result-stats>div{padding:10px}.result-stats strong{font-size:19px}.modal-card .primary-button{min-height:38px;margin-top:12px}.modal-close{margin-top:7px}.toast{top:14px}.room-caption{top:18%}}
.has-save .title-intro{display:none}.has-save .title-rule{margin-bottom:20px}html:fullscreen .app{max-width:none;padding-left:0;padding-right:0}html:fullscreen .masthead,html:fullscreen .footer{display:none}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* The interface follows the current room. */
:root{--bg:#0a1322;--panel:#142239;--border:#354a65;--cream:#e0eafa;--muted:#92a7c0;--gold:#a8c7eb;--red:#d66580;--accent:#a4c7ed;--accent-hover:#bfd8f3;--accent-ink:#122238;--button-shadow:#4b6d94;--selected:#2a405d;--screen-fade:#091524e8;--screen-middle:#091524b8;--control:#243b57;--control-base:#15263d;--fire:#813d57;--fire-base:#4b293e;--red-edge:#d36c8c}
body[data-theme="crimson"]{--bg:#160e1d;--panel:#271b30;--border:#60475e;--cream:#f0e5f1;--muted:#b8a0bb;--accent:#d6b5d0;--accent-hover:#ecd3e7;--accent-ink:#301e34;--button-shadow:#75536e;--selected:#50334b;--screen-fade:#1b1020eb;--screen-middle:#1b1020b8;--control:#4a354f;--control-base:#2d1c33;--fire:#913a5d;--fire-base:#55263e;--red-edge:#e4779f}
body[data-theme="classic"]{--bg:#101b1b;--panel:#1b2b29;--border:#435f58;--cream:#e2ece5;--muted:#9fb8ae;--accent:#b2c9ba;--accent-hover:#cde1d4;--accent-ink:#1a302a;--button-shadow:#59786a;--selected:#354d43;--screen-fade:#0d1c19eb;--screen-middle:#0d1c19b8;--control:#354f46;--control-base:#21352f;--fire:#8d3c46;--fire-base:#512a30;--red-edge:#d36d77}
button:focus-visible{outline-color:var(--accent)}
.brand strong{color:var(--cream)}.brand span,.private-badge{color:var(--muted)}
.brand-mark{background:var(--control);border:1px solid var(--accent);border-radius:20px 20px 4px 4px;clip-path:none;image-rendering:auto}
.brand-mark:before{background:var(--bg);box-shadow:inset 0 0 0 2px var(--accent);border-radius:13px 13px 0 0}
.brand-mark:after{background:var(--accent);border-radius:50%}.private-badge{border-color:var(--border)}
.private-badge i,.status-dot{background:var(--accent);box-shadow:0 0 7px var(--control)}
.game-frame{border-color:var(--border)}.hud,.touch-controls{background:var(--panel);border-color:var(--border)}
.eyebrow,.stat-label,.record,.control-label{color:var(--muted)}.level-info strong,.score-stat strong{color:var(--cream)}
.lives-stat>.icon,.gentle-hp{color:var(--red);fill:none}.shell{background:var(--control);border-color:var(--border)}
.shell.loaded{background:var(--red);border-color:var(--accent);box-shadow:none}.shell.loaded:before{background:#ffffff66}
.key-stat.found{color:var(--accent);filter:drop-shadow(0 0 5px #c2e6ff44)}.hud-actions{border-color:var(--border)}
.icon-button{color:var(--muted)}.icon-button:hover{background:var(--selected);color:var(--cream)}
canvas{image-rendering:auto}.stage{background:var(--bg)}
body .screen-title{background:linear-gradient(90deg,var(--screen-fade),var(--screen-middle) 42%,#07101b05 85%)}
h1{color:var(--cream);text-shadow:0 3px 16px #0009}h1 em{color:var(--accent)}
.title-kicker{color:var(--muted)}.title-kicker>span{background:var(--red);box-shadow:0 0 9px #dd759044}
.title-rule{color:var(--accent)}.title-rule span{background:var(--border)}.title-intro{color:var(--cream)}
.primary-button{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);box-shadow:0 3px 0 var(--button-shadow);border-radius:6px}
.primary-button:hover{background:var(--accent-hover)}.continue-button{background:var(--panel);border-color:var(--border);color:var(--cream);border-radius:5px}
.difficulty{background:var(--bg);border-color:var(--border);border-radius:6px}.difficulty button{color:var(--muted);border-radius:4px}
.difficulty button.selected{background:var(--selected);color:var(--cream)}.difficulty span,.difficulty .selected span{color:var(--muted)}
.title-links button{color:var(--muted);min-height:30px}.title-links button:hover{color:var(--accent)}.title-links{gap:9px}
.title-note{color:var(--cream)}.title-note small{color:var(--muted)}
.dpad-disc{background:radial-gradient(ellipse at 35% 30%,var(--control),var(--control-base));border-color:var(--border)}
.dpad .icon{color:var(--accent)}.dpad-dot{background:var(--control-base);border-color:var(--border)}
.dpad-knob{background:var(--control);border-color:var(--accent);box-shadow:0 0 12px #bbdcff22}
.control-hint{color:var(--cream)}.control-hint>.icon{color:var(--accent)}.control-hint small{color:var(--muted)}
.action-button{background:radial-gradient(ellipse at 30% 20%,var(--control),var(--control-base));color:var(--accent);border-color:var(--border)}
.fire-button{background:radial-gradient(ellipse at 30% 20%,var(--fire),var(--fire-base));color:#ffdfeb;border-color:var(--red-edge)}
.action-button.active,.action-button:active{background:var(--selected);border-color:var(--accent)}.fire-button.active,.fire-button:active{background:var(--fire)}
.footer,kbd{color:var(--muted)}kbd{border-color:var(--border)}.toast{color:var(--cream);border-color:var(--border);background:var(--panel)}
.room-caption{color:var(--cream)}.room-caption span{color:var(--accent)}
.modal-card{background:var(--panel);border-color:var(--border);border-radius:10px}.modal-eyebrow{color:var(--accent)}.modal-card h2{color:var(--cream)}
.modal-card p,.help-grid small{color:var(--muted)}.help-grid strong{color:var(--cream)}.help-grid .icon{color:var(--accent)}
.secondary-button{border-color:var(--border);color:var(--cream);border-radius:5px}.secondary-button:hover{background:var(--selected)}
.result-stats>div{border-color:var(--border)}.result-stats strong{color:var(--accent)}.result-stats span{color:var(--muted)}
.install-note{border-color:var(--accent)}.modal-close{color:var(--muted)}

/* Eight rooms, with cool and warm materials instead of one colour filter. */
body[data-theme="pearl"]{--bg:#202c39;--panel:#2c3947;--border:#61758a;--cream:#f2f7ff;--muted:#becddd;--accent:#d9ebff;--accent-hover:#f0f7ff;--accent-ink:#263f59;--button-shadow:#7d9cb9;--selected:#566b83;--control:#687e96;--control-base:#354a60;--fire:#aa5168;--fire-base:#713a50;--red-edge:#ec93ac}
body[data-theme="cyan"]{--bg:#0b2028;--panel:#143541;--border:#366675;--cream:#e0f8ff;--muted:#9cc3cf;--accent:#abecf0;--accent-hover:#cefaff;--accent-ink:#103440;--button-shadow:#3c7d89;--selected:#285b69;--control:#2f6975;--control-base:#173a47;--fire:#924657;--fire-base:#532b3c;--red-edge:#e58a9d}
body[data-theme="lavender"]{--bg:#2b243b;--panel:#393148;--border:#7e7195;--cream:#fbf4ff;--muted:#d0c3e0;--accent:#e8d6ff;--accent-hover:#f7edff;--accent-ink:#4a345d;--button-shadow:#9c83b6;--selected:#665477;--control:#89749c;--control-base:#4e3e61;--fire:#b05474;--fire-base:#743751;--red-edge:#ee9cb9}
body[data-theme="moss"]{--bg:#19251c;--panel:#293b2d;--border:#64775b;--cream:#f0f6e7;--muted:#b6c5aa;--accent:#d1dfb4;--accent-hover:#e7f1d2;--accent-ink:#33462d;--button-shadow:#73875d;--selected:#526447;--control:#697c57;--control-base:#344c37;--fire:#95535c;--fire-base:#57343d;--red-edge:#dc8f9a}
body[data-theme="violet"]{--bg:#19122c;--panel:#2a2045;--border:#614c83;--cream:#f0e8ff;--muted:#bca8d9;--accent:#cdb1ff;--accent-hover:#e5d3ff;--accent-ink:#302048;--button-shadow:#7856a4;--selected:#4b3672;--control:#604580;--control-base:#312347;--fire:#a23e70;--fire-base:#5f2948;--red-edge:#e77aaf}

.rooms-button{width:57px;display:flex;gap:5px;justify-content:center;font-size:10px;color:var(--accent)}
.level-info strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.room-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:17px 0 4px}
.room-card{padding:0;overflow:hidden;border:1px solid var(--border);border-radius:7px;background:var(--bg);text-align:left}
.room-card:hover,.room-card:focus-visible{border-color:var(--accent);background:var(--selected)}
.room-card img{display:block;width:100%;height:auto;aspect-ratio:2;object-fit:cover}
.room-card>span{display:flex;gap:6px;align-items:flex-start;padding:9px 8px;font-size:10px;line-height:1.35;color:var(--cream)}
.room-card b{font:10px var(--mono);color:var(--accent);padding-top:1px}
.modal-card:has(.room-gallery){width:620px}

/* The outer ring aims; the recessed gap separates it from the cabinet button. */
.touch-controls{height:196px;padding:10px 30px 23px;gap:16px}
.movement-controls{display:flex;align-items:center;gap:12px;flex:none;pointer-events:none}
.movement-controls>#dpad,.movement-controls>.jump-button{pointer-events:auto}
#dpad{--wheel-size:168px;width:var(--wheel-size);height:var(--wheel-size);transform:none}
#dpad-wheel,.dpad-svg{display:block;width:100%;height:100%;pointer-events:none}
.dpad-svg{overflow:visible;filter:drop-shadow(0 5px 4px #0005)}
.wheel-light{stop-color:var(--control)}.wheel-mid{stop-color:var(--control-base)}.wheel-dark{stop-color:var(--bg)}
.wheel-rim{fill:var(--control-base);stroke:var(--border);stroke-width:2}
.wheel-track{fill:none;stroke:url(#wheel-surface);stroke-width:44}
.wheel-guide{fill:none;stroke:var(--accent);stroke-width:1;opacity:.16}
.wheel-aim{transform:rotate(var(--aim-angle,0rad));transform-origin:84px 84px;opacity:.45}
.dpad.active .wheel-aim{opacity:1}
.wheel-thumb{fill:var(--control);stroke:var(--accent);stroke-width:2}
.wheel-point{fill:var(--accent-hover)}
.wheel-inner{fill:var(--bg);stroke:var(--border);stroke-width:1.5}
#dpad .interact-button{position:absolute;left:50%;top:50%;width:50px;height:50px;gap:3px;transform:translate(-50%,-50%);border:1px solid var(--accent);background:radial-gradient(ellipse at 35% 20%,var(--control),var(--control-base));box-shadow:inset 0 2px 2px #ffffff21,inset 0 -4px 3px #0005,0 3px 5px #0007;color:var(--cream)}
#dpad .interact-button .icon{position:static;width:18px;height:18px;color:inherit}
#dpad .interact-button span{font:7px var(--mono);letter-spacing:.35px}
#dpad .interact-button.active,#dpad .interact-button:active{transform:translate(-50%,-50%) scale(.95);background:var(--selected);box-shadow:inset 0 2px 4px #0007}
.control-label{bottom:-15px;font-size:8px;letter-spacing:.1px;color:var(--accent)}
.action-controls{gap:16px}
.action-button{box-shadow:inset 0 2px 2px #ffffff1a,inset 0 -5px 3px #0005,0 5px 6px #0004}
.jump-button{width:84px;height:84px;color:var(--cream);border-color:var(--accent)}
.jump-button .icon{width:28px;height:28px}.jump-button span{font-size:9px;letter-spacing:.6px}
.fire-button{width:98px;height:98px}.fire-button span{font-size:9px;letter-spacing:.6px}

.inspection-toolbar{position:absolute;inset:0;z-index:6;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:12px}
.inspection-heading{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.inspection-heading>div{border:1px solid var(--border);border-radius:8px;background:var(--panel);padding:9px 12px;box-shadow:0 3px 12px #0004}
.inspection-heading strong{font-size:13px;color:var(--cream);font-weight:500;display:block}
.inspection-heading small{font-size:10px;line-height:1.4;color:var(--muted);display:block;margin-top:5px}
.inspection-close{pointer-events:auto;min-height:44px;padding:0 15px;border:1px solid var(--accent);border-radius:7px;background:var(--panel);color:var(--accent);font-size:12px}
.inspection-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px}
.inspection-levels,.inspection-pan{display:flex;gap:6px;padding:7px;border:1px solid var(--border);border-radius:8px;background:var(--panel);pointer-events:auto;box-shadow:0 3px 12px #0004}
.inspection-levels button,.inspection-pan button{border:1px solid var(--border);border-radius:5px;background:var(--bg);min-width:38px;min-height:42px;color:var(--cream);font:11px var(--mono)}
.inspection-levels .selected{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.inspection-pan button{font-size:19px}.inspection-pan button:hover{background:var(--selected)}
.inspecting .touch-controls,.inspecting .hud-stats,.inspecting .room-caption{display:none!important}
.inspecting .hud-actions{margin-left:auto}.inspecting canvas{cursor:grab}.inspecting canvas:active{cursor:grabbing}

@media(max-width:760px){.control-hint{display:none}.level-info{min-width:0;max-width:160px}.touch-controls{padding-left:20px;padding-right:20px}}
@media(max-width:600px){
  .hud{padding-left:11px;padding-right:8px;gap:6px}.level-info{width:102px;flex:0 1 102px}.level-info strong{max-width:102px;font-size:10px}.hud-stats{gap:10px}.hud-actions{padding-left:5px}.rooms-button{width:51px;font-size:9px;gap:4px}
  .touch-controls{height:190px;padding:10px 14px 23px;gap:8px}#dpad{--wheel-size:162px}
  .action-controls{gap:12px}.jump-button{width:76px;height:76px}.fire-button{width:90px;height:90px}
  .modal-card:has(.room-gallery){padding:20px 16px}.room-gallery{gap:8px}.room-card>span{font-size:9px;padding:8px 6px;gap:5px}
  .inspection-toolbar{padding:9px}.inspection-heading>div{padding:8px 9px}.inspection-heading strong{font-size:11px}.inspection-heading small{font-size:9px}.inspection-close{padding:0 10px;font-size:11px}
  .inspection-bottom{flex-direction:column;gap:8px;align-items:center}.inspection-levels{gap:4px;padding:6px}.inspection-levels button{min-width:34px}.inspection-pan button{min-width:42px}
}
@media(max-width:375px){
  #dpad{--wheel-size:152px}.touch-controls{height:178px;padding-left:12px;padding-right:12px}.action-controls{gap:10px}.jump-button{width:68px;height:68px}.fire-button{width:82px;height:82px}#dpad .interact-button{width:46px;height:46px}
  .hud-stats{gap:7px}.level-info{flex-basis:93px}.level-info strong{max-width:93px}.key-stat{width:15px}.inspection-levels button{min-width:30px}.control-label{font-size:7px}
}
@media(max-width:340px){
  #dpad{--wheel-size:144px}.touch-controls{padding-left:10px;padding-right:10px;gap:6px}.action-controls{gap:8px}.jump-button{width:64px;height:64px}.fire-button{width:76px;height:76px}#dpad .interact-button{width:44px;height:44px}.inspection-levels{gap:3px}.inspection-levels button{min-width:28px}.hud-stats{gap:5px}.level-info{flex-basis:84px}.level-info strong{max-width:84px}
}
@media(min-width:600px) and (max-height:580px){
  .touch-controls{position:absolute;bottom:max(13px,env(safe-area-inset-bottom));left:12px;right:12px;height:180px;padding:0 6px;background:none;border:0;pointer-events:none;align-items:flex-end}
  #dpad{--wheel-size:176px}.dpad-svg{opacity:.93}.action-controls{gap:20px;align-items:flex-end;padding-bottom:5px}.action-button{opacity:.95}.jump-button{width:84px;height:84px}.fire-button{width:100px;height:100px}.control-label{display:none}
  .modal-card:has(.room-gallery){width:740px;padding:16px 20px}.room-gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 0}.room-card>span{font-size:9px;padding:6px;min-height:34px}
  .inspection-toolbar{padding:9px 15px}.inspection-heading>div{padding:7px 10px}.inspection-heading small{margin-top:3px}.inspection-close{min-height:42px}.inspection-levels,.inspection-pan{padding:5px}.inspection-levels button,.inspection-pan button{min-height:38px}
}

/* Play fills the screen; information is available in the pause menu. */
.playing .app{max-width:none;max-height:none;padding:0;margin:0}
.playing .masthead,.playing .footer{display:none}
.playing .game-frame{border:0;border-radius:0;box-shadow:none}
body:not(.playing) .touch-controls{display:none}
.hud{position:absolute;display:block;height:0;left:12px;right:max(12px,env(safe-area-inset-right));top:max(9px,env(safe-area-inset-top));padding:0;background:none;border:0;pointer-events:none;z-index:7}
.hud .level-info,.hud .hud-stats{display:none}
.hud-actions{position:absolute;right:0;top:0;margin:0;padding:0;border:0;pointer-events:auto}
.hud-actions .icon-button{display:none}
#pause-button{display:flex;align-items:center;justify-content:center;gap:5px;width:auto;min-width:68px;height:40px;padding:0 10px;border:1px solid #b7d5ef44;border-radius:8px;background:#0c1826a8;color:#ecf4ff;box-shadow:0 2px 8px #0003;backdrop-filter:blur(3px)}
#pause-button .icon{width:15px;height:15px}#pause-label{font-size:10px}
.inspecting .hud{display:none}.control-hint{display:none}
.touch-controls.disabled .dpad,.touch-controls.disabled .movement-controls>.jump-button,.touch-controls.disabled .action-controls{pointer-events:none}
.toast{z-index:20}
.menu-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:12px 0}
.menu-stats>div{padding:9px 5px;border:1px solid var(--border);border-radius:5px;text-align:center}
.menu-stats b{display:block;font:14px var(--mono);color:var(--cream)}
.menu-stats span{display:block;font-size:9px;color:var(--muted);margin-top:5px}
.modal-card .menu-room{font-size:11px;margin:5px 0 10px}
.display-settings{margin:18px 0 14px}
.display-settings>label{display:block;font-size:10px;color:var(--muted);margin:14px 0 7px}
.difficulty button{width:auto;flex:1;min-width:0;padding-left:5px;padding-right:5px}
.difficulty-note{font-size:10px;line-height:1.45;color:var(--muted);margin:8px 0 0}
.modal-card .orientation-hint{font-size:10px;line-height:1.5;color:var(--muted);margin:8px 0 0}
.menu-room small{font-size:10px;line-height:1.6;color:var(--muted)}
.setting-options{display:flex;gap:5px}
.setting-options button{flex:1;min-width:0;min-height:42px;padding:7px 3px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--cream);font-size:10px}
.setting-options button.selected{background:var(--selected);border-color:var(--accent);color:var(--accent)}
.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.menu-actions .secondary-button{margin:0;padding:10px 6px;font-size:11px;min-height:39px}
.modal-card:has(.display-settings){width:500px}
@media(orientation:landscape) and (max-height:700px){
  .touch-controls{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));height:calc(var(--portrait-wheel,168px) + 10px);padding:0 4px;background:none;border:0;pointer-events:none;align-items:flex-end}
  #dpad{--wheel-size:var(--portrait-wheel,168px);pointer-events:auto}.dpad-svg{opacity:.80}.dpad.active .dpad-svg{opacity:1}
  #dpad .interact-button{width:44px;height:44px;gap:2px;opacity:.85}#dpad .interact-button .icon{width:16px;height:16px}#dpad .interact-button span{font-size:6px}
  .action-controls{pointer-events:auto;align-items:flex-end;gap:14px;padding:0}.action-button{gap:3px;opacity:.78}
  .jump-button{width:46px;height:46px}.fire-button{width:54px;height:54px}.jump-button .icon{width:18px;height:18px}.fire-button .icon{width:22px;height:22px}
  .action-button span{font-size:6px;letter-spacing:.2px}.action-button.active,#dpad .interact-button.active{opacity:1}.control-label{display:none}
  .modal-card:has(.display-settings){width:580px;padding:18px 24px}.menu-stats{margin:8px 0}.menu-stats>div{padding:7px 4px}.display-settings{margin:12px 0}.display-settings>label{margin-top:10px}.setting-options button{min-height:38px}.menu-actions .secondary-button{min-height:36px}
  .difficulty-note{font-size:8px;margin-top:5px}
}

/* These rules follow the game's layout, including a rotation inside a locked PWA. */
.virtual-rotation #app-shell{position:fixed;left:50%;top:50%;width:var(--shell-width);height:var(--shell-height);max-width:none;margin:0;padding:0;transform:translate(-50%,-50%) rotate(var(--shell-turn));transform-origin:center}
.zoom-controls{display:none;position:absolute;z-index:7;top:max(9px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));height:40px;align-items:center;background:#0c1826a8;border:1px solid #b7d5ef44;border-radius:8px;color:#ecf4ff;backdrop-filter:blur(3px)}
.playing:not(.inspecting):not(.modal-open) .zoom-controls{display:flex}
.zoom-controls button{width:36px;height:38px;padding:0;border:0;background:none;font-size:23px;color:inherit;border-radius:7px}.zoom-controls button:active{background:#a3d1ed33}.zoom-controls button:disabled{opacity:.32}.zoom-controls output{min-width:44px;text-align:center;font-size:10px}
.display-settings>.zoom-label{display:flex;justify-content:space-between;align-items:center}.zoom-label b{color:var(--cream);font-size:12px}
.zoom-slider{display:block;width:100%;height:32px;margin:0 0 6px;accent-color:var(--accent);touch-action:pan-x;cursor:pointer}
.version-card{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.version-card strong{display:block;font-size:11px}.version-card small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.version-card button{min-height:40px;padding:7px 10px;font-size:10px;border:1px solid var(--border);border-radius:6px;background:var(--bg)}
.modal-card .update-note{font-size:9px;line-height:1.4;margin:7px 0 0;color:var(--muted)}
.layout-portrait .touch-controls{position:relative;inset:auto;flex:none;height:190px;padding:10px var(--portrait-pad,16px) 16px;gap:12px;align-items:center;background:var(--panel);border-top:1px solid var(--border);pointer-events:auto}
.layout-portrait #dpad{--wheel-size:var(--portrait-wheel,168px);transform:none}.layout-portrait .dpad-svg{opacity:1}
.layout-portrait #dpad .interact-button{width:48px;height:48px;gap:3px;opacity:1}.layout-portrait #dpad .interact-button .icon{width:18px;height:18px}.layout-portrait #dpad .interact-button span{font-size:6px}
.layout-portrait .action-controls{gap:12px;align-items:center;padding:0}.layout-portrait .action-button{opacity:1;gap:5px}.layout-portrait .jump-button{width:var(--portrait-jump,68px);height:var(--portrait-jump,68px)}.layout-portrait .fire-button{width:var(--portrait-fire,82px);height:var(--portrait-fire,82px)}
.layout-portrait .action-button .icon{width:23px;height:23px}.layout-portrait .action-button span{font-size:7px}.layout-portrait .control-label{display:block;font-size:7px}
.layout-portrait .room-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
.layout-portrait .modal-card{width:min(500px,calc(100% - 24px));max-height:calc(100% - 24px);padding:22px;overflow:auto}.layout-portrait .modal-card h2{font-size:27px}.layout-portrait .help-grid{grid-template-columns:26px 1fr}
.layout-portrait .inspection-heading small{font-size:8px}.layout-portrait .inspection-levels{gap:3px}.layout-portrait .inspection-levels button{min-width:29px}
.layout-portrait .inspection-bottom{flex-direction:column;gap:8px;align-items:center}.layout-portrait .inspection-pan button{min-width:42px}
.layout-portrait:not(.playing) .masthead{display:flex;height:64px;padding:0 16px}.layout-portrait:not(.playing) .footer{display:none}
.layout-portrait .screen-title{padding:22px 28px;align-items:center}.layout-portrait .title-content{width:100%}.layout-portrait h1{font-size:45px}.layout-portrait .title-intro{font-size:12px}.layout-portrait .title-links{flex-wrap:wrap}
.compact-layout .touch-controls{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));height:calc(var(--portrait-wheel,168px) + 10px);padding:0 4px;background:none;border:0;pointer-events:none;align-items:flex-end}
.compact-layout #dpad{--wheel-size:var(--portrait-wheel,168px);pointer-events:auto}.compact-layout .dpad-svg{opacity:.8}.compact-layout .dpad.active .dpad-svg{opacity:1}
.compact-layout #dpad .interact-button{width:44px;height:44px;gap:2px;opacity:.85}.compact-layout #dpad .interact-button .icon{width:16px;height:16px}.compact-layout #dpad .interact-button span{font-size:6px}
.compact-layout .action-controls{pointer-events:auto;align-items:flex-end;gap:14px;padding:0}.compact-layout .action-button{gap:3px;opacity:.78}.compact-layout .jump-button{width:46px;height:46px}.compact-layout .fire-button{width:54px;height:54px}
.compact-layout .jump-button .icon{width:18px;height:18px}.compact-layout .fire-button .icon{width:22px;height:22px}.compact-layout .action-button span{font-size:6px;letter-spacing:.2px}.compact-layout .action-button.active{opacity:1}.compact-layout .control-label{display:none}
.compact-layout .modal-card{width:min(580px,calc(100% - 30px));max-height:calc(100% - 18px);padding:18px 24px;overflow:auto}
.compact-layout .screen-title{padding:16px 9%}.compact-layout .title-content{width:330px}.compact-layout h1{font-size:36px}.compact-layout .title-rule{display:none}.compact-layout .title-kicker{font-size:7px;margin-bottom:10px}.compact-layout .title-intro{font-size:11px;line-height:1.5;margin:14px 0}.compact-layout .title-note{display:none}
.compact-layout .primary-button{min-height:43px;padding:10px 14px;font-size:12px}.compact-layout .difficulty{margin-top:12px}.compact-layout .difficulty button{padding:8px 4px;font-size:10px}.compact-layout .difficulty span{font-size:8px}.compact-layout .difficulty-note{font-size:8px;margin-top:5px}.compact-layout .title-links{margin-top:10px}.compact-layout .record{margin-top:8px;font-size:6px}

/* One continuous thumb gesture moves from the wheel onto its jump extension. */
.movement-controls{--wheel-size:var(--portrait-wheel,168px);position:relative;left:-19px;display:block;width:calc(var(--wheel-size) + 60px);height:var(--wheel-size);gap:0}
.movement-controls>#dpad{--wheel-size:var(--portrait-wheel,168px);position:absolute;left:0;top:0}
.movement-controls>.run-jump-button{position:absolute;left:calc(var(--wheel-size) + 2px);top:calc(50% - 29px);width:58px;height:58px;gap:2px;pointer-events:auto;border-color:var(--accent);background:radial-gradient(ellipse at 30% 20%,var(--control),var(--control-base));color:var(--cream);z-index:1}
.movement-controls>.run-jump-button.active{background:var(--selected);border-color:var(--accent-hover);opacity:1;transform:none}
.movement-controls>.run-jump-button .icon{width:21px;height:21px}
.movement-controls>.run-jump-button span{font-size:7px;line-height:1.2;letter-spacing:0;text-align:center}
.movement-controls>.run-jump-button.backward .icon{transform:scaleX(-1)}
.touch-controls.disabled .movement-controls>.action-button{pointer-events:none}
.layout-portrait .touch-controls{height:calc(var(--portrait-wheel,168px) + 28px);padding-left:env(safe-area-inset-left,0px);padding-right:max(var(--portrait-pad,16px),env(safe-area-inset-right));gap:8px}
.layout-portrait .action-controls{flex-direction:column;gap:8px;flex:none}
.layout-landscape .touch-controls{left:env(safe-area-inset-left,0px);padding-left:0}
.layout-landscape .action-controls{flex:none}
.compact-layout .touch-controls{left:env(safe-area-inset-left,0px);padding-left:0}