@charset "UTF-8";
:root{color-scheme:dark;--bg:#06120e;--line:#8cc7a02f;--lime:#d3fa8a;--muted:#93ae9e;--safe-bottom:env(safe-area-inset-bottom,0px)}
#mobile-update{align-self:center;padding:7px 9px;border-radius:8px;font-size:11px;font-weight:800;background:var(--lime);color:#09200d}
.mobile-bar:has(#mobile-update:not([hidden])) .mobile-brand{display:none}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--bg);color:#eff9ef;font:14px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}body{height:100dvh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) var(--safe-bottom) env(safe-area-inset-left,0px)}button,a{touch-action:manipulation}button{font:inherit;font-weight:650;border:1px solid var(--line);background:#10251b;color:#d9efdc;border-radius:9px;min-height:40px;padding:8px 11px}button:active{background:#284b33}button:disabled{opacity:.5}button:focus-visible,a:focus-visible{outline:3px solid #91e9dd;outline-offset:2px}button[hidden],[hidden]{display:none!important}a{color:inherit;text-decoration:none}.mobile-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 10px;border-bottom:1px solid var(--line)}.mobile-brand{font-size:15px;font-weight:800;letter-spacing:.07em;color:var(--lime)}.mobile-brand small{display:block;font-size:8px;letter-spacing:.16em;color:var(--muted)}.toolbar{display:flex;gap:5px}.toolbar button{font-size:11px;padding:7px 9px;min-height:36px}#mobile-fullscreen{font-size:22px;padding:0 10px}.mobile-hud{display:flex;justify-content:space-around;gap:9px;padding:9px 8px;background:#0c1c14;color:var(--muted);font:10px/1.3 ui-monospace,Consolas,monospace}.mobile-hud b{color:#f3ffd8;font-size:14px;margin-left:4px;font-variant-numeric:tabular-nums}.mobile-stage{position:relative;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;background:#000}#game-container{width:100%;height:100%;overflow:hidden;touch-action:none}#game-container canvas{display:block;touch-action:none}.mobile-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:18px;background:linear-gradient(#021108c4,#06120ee8);z-index:10}.mobile-dialog{width:min(390px,100%);text-align:center}.kicker{font:10px ui-monospace,monospace;color:var(--lime);letter-spacing:.2em;margin:0 0 9px}h1{font-size:clamp(26px,6vw,38px);letter-spacing:-.045em;line-height:1.1;margin:0 0 14px}.mobile-dialog p:not(.kicker){color:#bdd2c2;max-width:310px;margin:10px auto;font-size:14px}.mobile-dialog small{display:block;color:var(--muted);font-size:11px;margin-top:12px}.primary{background:var(--lime);color:#09200d;border-color:var(--lime);padding:13px 28px;min-height:48px}#mobile-start{min-width:180px;margin-top:7px}#mobile-load:empty{display:none}.touch-deck{display:flex;gap:9px;padding:12px 12px 6px;min-height:138px;border-top:1px solid var(--line);background:#0a1b12}.fire-controls{display:flex;flex-direction:column;gap:8px;width:92px}.fire-controls button{font-size:10px}#mobile-auto[aria-pressed=true]{color:var(--lime)}#mobile-fire{flex:1;font-size:15px;letter-spacing:.1em;border-radius:20px;background:#152c1d}.mobile-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px 12px 7px;min-height:30px;font-size:10px;color:var(--muted)}.mobile-footer button{min-height:30px;padding:4px 0;font-size:10px;border:0;background:transparent;text-decoration:underline;text-underline-offset:3px}#mobile-perf{position:fixed;left:5px;bottom:3px;background:#000e;color:#d3fa8a;z-index:40;padding:4px;font:10px monospace;pointer-events:none}dialog{max-width:min(420px,calc(100vw - 36px));border:1px solid #779861;border-radius:16px;padding:25px;background:#0e2416;color:#e8f2df;touch-action:auto;user-select:text}dialog::backdrop{background:#000c}dialog h2{margin-top:0;font-size:23px}dialog p{line-height:1.6}.mobile-footer+dialog form{text-align:right}
/* Robin's existing voice keeps playing; its desktop controls/caption never cover the arena. */
#robin-voice-controls,#robin-voice-caption{display:none!important}
/* Leave room for the host's badge on first online load, outside the touch controls. */
body:has(#nl-badge-frame) .mobile-footer{padding-bottom:52px}
@media(orientation:landscape){body{grid-template-rows:40px 26px minmax(0,1fr);grid-template-columns:95px minmax(0,1fr) 105px}.mobile-bar{grid-column:1/-1;padding:3px 10px}.mobile-brand small{display:inline;margin-left:10px}.toolbar button{min-height:32px;padding:5px 9px}.mobile-hud{grid-column:1/-1;padding:4px 10px}.mobile-stage{grid-column:2;grid-row:3}.touch-deck{display:contents}.fire-controls{grid-column:3;grid-row:3;width:auto;margin:5px 7px 10px}.mobile-footer{display:none}.mobile-dialog small{display:none}.mobile-dialog p:not(.kicker){font-size:12px}.mobile-dialog h1{font-size:28px}.mobile-dialog .kicker{display:none}.mobile-overlay{padding:10px}.primary{padding:10px 22px;min-height:42px}}
@media(orientation:portrait) and (min-width:900px) and (min-height:650px){body{max-width:1000px;margin:0 auto}.touch-deck{min-height:100px}.mobile-stage{min-height:300px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(orientation:landscape){body:has(#nl-badge-frame) .fire-controls{margin-bottom:58px}}

/* Fixed-center analog control. Pointer movement changes only the thumb transform. */
.touch-deck{align-items:center;justify-content:space-between;gap:12px;padding:9px 18px 6px;min-height:166px}
.joystick-area{flex:0 1 176px;min-width:128px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.joystick{position:relative;width:128px;height:128px;flex:none;border:1px solid #618269;border-radius:50%;background:radial-gradient(circle,#183024 0 40%,#0c2117 41% 66%,#243d2c 67% 68%,#091b12 69%);touch-action:none;cursor:grab;contain:layout style}
.joystick:focus-visible{outline:3px solid #91e9dd;outline-offset:2px}
.joystick::before{content:"";position:absolute;inset:10px;border:1px solid #89b18d29;border-radius:50%;pointer-events:none}
.joystick-rail{position:absolute;left:9px;right:9px;top:calc(50% - 1px);height:2px;background:linear-gradient(90deg,#89c57822,#cafa98,#89c57822);pointer-events:none}
.joystick-neutral{position:absolute;left:calc(50% - 1px);top:calc(50% - 11px);height:22px;width:2px;background:#d9ffd294;pointer-events:none}
.joystick-thumb{position:absolute;left:calc(50% - 24px);top:calc(50% - 24px);width:48px;height:48px;border:1px solid #bbdba3;border-radius:50%;background:radial-gradient(circle at 38% 28%,#546d48,#263d29 70%);box-shadow:0 3px 8px #0008,0 0 0 4px #a0c88212;pointer-events:none;transform:translate3d(0,0,0)}
.joystick-thumb::after{content:"";position:absolute;left:calc(50% - 7px);top:calc(50% - 1px);width:14px;height:2px;border-radius:2px;background:#d9f7b3}
.joystick.is-active{border-color:var(--lime);cursor:grabbing}
.joystick.is-active .joystick-thumb{border-color:#e6ffc4;box-shadow:0 3px 8px #0008,0 0 0 4px #bcf59626;will-change:transform}
.joystick-hint{color:#9fbb99;font:9px ui-monospace,monospace;letter-spacing:.16em;pointer-events:none}
.fire-controls{margin-left:auto;flex:none}
#mobile-fire{flex:none;height:92px;border-radius:50%;background:radial-gradient(circle at 40% 30%,#29452d,#142c1c 75%);border-color:#88b17380}
dialog form{text-align:right}
@media(orientation:landscape){
  body{grid-template-columns:152px minmax(0,1fr) 112px}
  .joystick-area{grid-column:1;grid-row:3;align-self:end;min-width:0;margin:0 8px 12px}
  .fire-controls{align-self:end;width:92px;margin:0 auto 12px}
  body:has(#nl-badge-frame) .fire-controls{margin-bottom:58px}
}
@media(max-width:359px){.mobile-bar{padding-inline:7px}.toolbar{gap:3px}.toolbar button{padding-inline:6px}.mobile-brand{font-size:13px}#mobile-fullscreen{padding-inline:7px}}
@media(orientation:landscape) and (max-height:330px){
  body{grid-template-columns:124px minmax(0,1fr) 98px}.joystick{width:100px;height:100px}
  .fire-controls{width:78px;gap:5px}#mobile-fire{height:78px}.fire-controls button{padding:5px}
}
/* Landscape keeps only the score strip above the arena; tools share the left rail. */
@media(orientation:landscape){
  body{grid-template-rows:26px minmax(0,1fr)}
  .mobile-hud{grid-column:1/-1;grid-row:1}
  .mobile-bar{grid-column:1;grid-row:2;align-self:start;justify-content:center;padding:7px 6px;border:0;min-width:0}
  .mobile-brand{display:none}
  .toolbar{flex-wrap:wrap;justify-content:center;gap:5px}
  .toolbar button{min-height:34px}
  .mobile-stage{grid-row:2}
  .joystick-area,.fire-controls{grid-row:2}
}

/* A recessed arcade switch: visual feedback never moves the touch target. */
#mobile-fire{
  position:relative;isolation:isolate;overflow:hidden;
  border:5px solid #300b0e;color:#fff5ed;background:#65121a;
  box-shadow:0 0 0 2px #9b3a38,0 5px 0 #180609,0 8px 12px #0008;
  font-size:15px;font-weight:900;text-shadow:0 1px 2px #660910;
  letter-spacing:.12em;padding:0;touch-action:none;
}
#mobile-fire::before{
  content:"";position:absolute;inset:2px 3px 8px;z-index:-1;border-radius:50%;
  background:radial-gradient(ellipse at 36% 20%,#ffaca0 0,#ff5149 16%,#ec252d 43%,#bd1023 72%,#780e1a 100%);
  border:1px solid #ff8073;
  box-shadow:inset 0 3px 3px #ffcfab80,inset 0 -6px 5px #760b1baa,0 5px 0 #690b19;
}
#mobile-fire:active::before,#mobile-fire.is-held::before{
  transform:translateY(4px);
  background:radial-gradient(ellipse at 36% 20%,#ff8070,#e7232c 40%,#a80b1c 85%);
  box-shadow:inset 0 2px 5px #5a071b88,0 1px 0 #690b19;
}
#mobile-fire:active,#mobile-fire.is-held{background:#65121a;color:#fff}
/* Keep Auto fire on its rail; place FIRE just inside the arena's right edge. */
@media(orientation:landscape){
  body{grid-template-columns:152px minmax(0,1fr) 112px}
  .fire-controls{justify-self:center;margin:0 auto 12px;gap:8px}
  #mobile-fire{z-index:20;transform:translate(-84px,-28px)}
  body:has(#nl-badge-frame) .fire-controls{margin-bottom:12px}
}
@media(orientation:landscape) and (max-height:330px){
  body{grid-template-columns:124px minmax(0,1fr) 98px}
  .fire-controls{margin:0 auto 12px;gap:5px}
  #mobile-fire{transform:translate(-66px,-24px)}
}
/* Expanded view stays inside the browser, so it needs no system exit banner. */
body.mobile-expanded .mobile-brand,
body.mobile-expanded .mobile-mode-switch,
body.mobile-expanded #mobile-install,
body.mobile-expanded .mobile-footer{display:none!important}
body.mobile-expanded #mobile-fullscreen[aria-pressed=true]{border-color:#b3da8d;background:#25432c}
@media(orientation:portrait){
  body.mobile-expanded{grid-template-rows:38px 30px minmax(0,1fr) 164px}
  body.mobile-expanded .mobile-bar{justify-content:flex-end;padding:2px 8px}
  body.mobile-expanded .mobile-hud{padding:6px 8px}
  body.mobile-expanded .touch-deck{min-height:0;padding:6px 18px 16px}
  body.mobile-expanded:has(#nl-badge-frame){padding-bottom:calc(var(--safe-bottom) + 42px)}
}
@media(orientation:landscape){
  body.mobile-expanded{grid-template-rows:minmax(0,1fr)}
  body.mobile-expanded .mobile-stage,
  body.mobile-expanded .mobile-bar,
  body.mobile-expanded .joystick-area,
  body.mobile-expanded .fire-controls{grid-row:1}
  body.mobile-expanded .mobile-hud{
    position:fixed;z-index:4;top:env(safe-area-inset-top,0px);
    left:calc(152px + env(safe-area-inset-left,0px));right:calc(112px + env(safe-area-inset-right,0px));
    padding:3px 6px;background:#06120edd;pointer-events:none;
  }
}
@media(orientation:landscape) and (max-height:330px){
  body.mobile-expanded .mobile-hud{left:calc(124px + env(safe-area-inset-left,0px));right:calc(98px + env(safe-area-inset-right,0px))}
}