/* A simple analog circle, with clear combat information above the play field. */
.joystick{width:112px;height:112px;border-radius:50%;clip-path:none;background:radial-gradient(circle,#163b53a8 0 45%,#32677980 46% 66%,#163b53b8 67%);border:2px solid #d1ecd1b3;box-shadow:inset 0 0 0 5px #193d5266,0 3px 0 #112a4b55}
.stick{width:44px;height:44px;left:50%;top:50%;margin:-22px 0 0 -22px;border-radius:50%;border:2px solid #e1f3d7;background:radial-gradient(circle at 36% 30%,#e5f1d9,#a7ccbe 62%,#6a9e9e);box-shadow:0 3px 0 #18455888;pointer-events:none}
.joystick-zone{position:absolute;left:-20px;bottom:-32px;width:calc(50% + 20px);height:210px;z-index:1;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}
.playing .joystick-zone{pointer-events:auto}.joystick{pointer-events:none}.action-buttons{position:relative;z-index:2}
.route-note{margin-top:5px;color:#fff0c9;font-size:9px;text-shadow:1px 2px #15344c;min-height:15px}
.power-hud{display:flex;align-items:center;gap:10px;margin-top:5px;background:#15334deb;padding:7px 9px;border-left:3px solid var(--power-color);color:var(--power-color);font-size:10px}
.power-hud>b{font-weight:400;white-space:nowrap}.power-hud>span{flex:1;min-width:25px;height:4px;background:#486273}.power-hud i{display:block;height:100%;background:var(--power-color)}
.toast{top:31%;font-size:10px;min-width:200px;padding:8px 11px}.boss-hud{margin-top:6px}.control-hint{left:15px;bottom:-17px}.tail:active{filter:brightness(1.15)}
.developer-x{display:block;padding:12px 10px;border:2px solid #294c62;background:#dce7d4;color:#17364c;font-size:11px;text-decoration:none;line-height:1.7}.developer-x:hover{background:#c9dece}
.menu-title .species-name{display:block;margin-top:7px;font-size:10px;line-height:1.5;letter-spacing:1.5px;color:#fff0c9;text-shadow:1px 2px #17324c;font-weight:400}
@media(max-height:730px){.menu-title .species-name{font-size:8px;margin-top:4px}}
@media(max-width:380px){.touch-controls{left:15px;right:15px}.joystick{width:104px;height:104px}.action-buttons{gap:6px}.action.tail{width:64px;height:64px}.action.dash{width:72px;height:72px}}

/* Arcade weapon status and release stamp. */
.version-label{display:block;margin-top:6px;font-size:8px;letter-spacing:1px;color:#b9efda;text-shadow:1px 2px #17324c}.power-hud{gap:6px}.power-hud button{pointer-events:auto;background:#20475b;border:1px solid currentColor;color:inherit;font:inherit;padding:6px 7px;cursor:pointer;white-space:nowrap}.power-hud button:disabled{opacity:.4;cursor:default}.power-hud>span{min-width:14px}.power-hud b{font-size:9px}.action.tail span{font-size:9px}

/* v11: two light rows; the canal stays visible. */
.hud{inset:8px 10px auto;z-index:2}.status-bar{height:36px;display:flex;align-items:center;gap:8px;padding:0 7px;background:#102f48dc;border-bottom:1px solid #c3dac04d;color:#ffefd1}
.status-bar .lives{font-size:15px;letter-spacing:0;white-space:nowrap;text-shadow:1px 1px #12263c;line-height:1}
#run-score{margin-left:auto;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}#clock{font-size:10px;color:#d2e4d1;font-variant-numeric:tabular-nums}
.hud-actions{gap:3px}.hud-actions .icon-button{width:27px;height:28px;font-size:13px;border:1px solid #c6d3aa66;background:#16394a}
.weapon-row{display:flex;margin-top:4px;pointer-events:none}.weapon-row button{display:flex;align-items:center;gap:6px;pointer-events:auto;min-height:30px;padding:4px 9px;border:1px solid #bbd3be66;background:#10374ac9;color:var(--weapon-color,#bde4da);font-family:inherit;cursor:pointer}
.weapon-row button:disabled{cursor:default;opacity:1}.weapon-row button:disabled small{visibility:hidden}
#power-name{font-size:9px}#weapon-icon{font-size:16px;line-height:1}#weapon-level{font-family:monospace;font-size:14px;letter-spacing:1px;color:#fff0c9}.weapon-row small{font-size:12px;margin-left:2px}
.scene-banner{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:4;pointer-events:none;width:max-content;max-width:86%;text-align:center;padding:13px 20px;border-top:2px solid #f5d286;border-bottom:2px solid #f5d286;background:#102b46e8;color:#fff0cb;box-shadow:0 4px 0 #12334b66}
.scene-banner strong{display:block;font-size:17px;letter-spacing:1px;line-height:1.5}.scene-banner span{display:block;margin-top:5px;font-size:9px;line-height:1.7;color:#cadbd0}
.version-label{display:inline-block;background:#122d49d9;border:1px solid #e4cd93;padding:3px 7px;color:#ffe6ad;font-size:9px}
@media(max-width:360px){.hud{left:6px;right:6px}.status-bar{gap:5px;padding:0 5px}.status-bar .lives{font-size:13px}#run-score{font-size:10px}#clock{font-size:9px}.hud-actions .icon-button{width:25px}.scene-banner strong{font-size:14px}}

/* v13: menu links stay outside gameplay. */
.menu-extras{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0}
.menu-extras button,.menu-extras a{font:inherit;font-size:9px;line-height:1.6;color:#ffebba;background:#143850cc;border:1px solid #b3d1bd66;padding:7px 8px;text-decoration:none;cursor:pointer}
.result-achievements{font-size:10px!important;line-height:1.8!important;color:#47695e!important;margin:10px 0!important}
@media(max-height:730px){.menu-extras{margin:4px 0}.menu-extras button,.menu-extras a{font-size:8px;padding:4px 6px}}

/* Compact magnetic pickup status beside the weapon; no extra overlay. */
#magnet-status{display:flex;align-items:center;gap:7px;margin-left:5px;padding:3px 7px;background:#10374ac9;border:1px solid #e9b1c177;color:#ffe6bb;font:11px monospace;min-width:48px}#magnet-status[hidden]{display:none}.magnet-icon{display:inline-block;box-sizing:border-box;width:16px;height:18px;border:5px solid #f29ab1;border-top:0;border-right-color:#90dfe0;position:relative}.magnet-icon:before,.magnet-icon:after{content:'';position:absolute;top:0;width:5px;height:4px;background:#fff1d7}.magnet-icon:before{left:-5px}.magnet-icon:after{right:-5px}

/* v15: common center line and equal action targets at every mobile width. */
.touch-controls{height:112px;align-items:center;gap:12px}
.action-buttons{align-items:center;gap:10px;flex-shrink:0}
.action.tail,.action.dash{width:72px;height:72px;margin:0;flex-shrink:0;padding:4px}
.joystick{flex-shrink:0}
.joystick-zone{height:210px;bottom:-32px}
@media(max-width:380px){.touch-controls{height:104px;left:15px;right:15px;gap:8px}.action-buttons{gap:8px}.action.tail,.action.dash{width:64px;height:64px}}

/* Direct touch controls: never animate input feedback or trigger browser gestures. */
.playing .touch-controls,.playing .touch-controls *{touch-action:none;-webkit-touch-callout:none}.stick{transition:none!important;will-change:transform}

/* v17.4: portfolio wordmark, with intrinsic ratio and room for all menu controls. */
.header-game-logo{display:block;width:136px;height:auto;image-rendering:pixelated}
.menu-title.has-game-logo{display:block;width:88%;max-width:410px;margin:8px auto 0;filter:none}
.menu-title.has-game-logo .game-logo-title{margin:0;font-size:inherit;line-height:0;letter-spacing:0;text-shadow:none;-webkit-text-stroke:0}
.game-title-logo{display:block;width:100%;height:auto;image-rendering:pixelated}
.menu-title.has-game-logo .species-name{margin-top:0;font-size:8px}
.menu-title.has-game-logo .version-label{margin-top:4px}
.menu-title.has-game-logo + .menu-subtitle{margin-top:6px}
@media(max-height:730px){.menu-title.has-game-logo{width:78%;max-width:340px;margin-top:3px}.menu-title.has-game-logo .species-name{font-size:7px}.menu-title.has-game-logo .version-label{font-size:8px;padding:2px 6px;margin-top:2px}}
@media(max-height:570px){.menu-title.has-game-logo{width:78%;max-width:270px}.menu-title.has-game-logo .species-name{display:none}.menu-title.has-game-logo + .menu-subtitle{font-size:7px;padding:2px 6px;margin-top:3px}}

@media(max-height:480px){.menu-title.has-game-logo{width:50%;max-width:210px}}