*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body.maze-page{font-family:Arial,Helvetica,sans-serif;background:#f8f6f7;color:#f8fafc}
button{font:inherit}
.is-hidden{display:none !important}
.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}
.maze-shell{width:100%;min-height:0;padding:0}
.maze-stage.site-game-stage{position:relative;display:block;padding:10px;overflow:hidden;background:#080d24;border-color:#d8b2d1}
.maze-game{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:100%;height:100%;min-height:0;overflow:hidden;border:1px solid rgba(133,105,255,.4);border-radius:18px;background:radial-gradient(circle at 50% 8%,#18224b 0%,#090d25 56%,#050718 100%);box-shadow:inset 0 0 40px rgba(68,51,170,.2)}

.maze-hud{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:54px;padding:8px 10px;border-bottom:1px solid rgba(145,128,255,.2);background:rgba(5,7,24,.82)}
.maze-score-group,.maze-hud-actions{display:flex;align-items:center;gap:7px;min-width:0}
.maze-score-group{overflow:auto;padding-bottom:1px;scrollbar-width:thin}
.maze-pill{flex:0 0 auto;display:inline-flex;align-items:center;min-height:37px;padding:7px 11px;border:1px solid rgba(182,191,255,.2);border-radius:999px;background:#111936;color:#e9edff;font-size:13px;font-weight:800;white-space:nowrap}
.maze-pill.is-player-one{border-color:rgba(255,216,77,.55);color:#fff3a8}
.maze-pill.is-player-two{border-color:rgba(78,214,255,.55);color:#b8efff}
.maze-action-button,.maze-icon-button{min-height:44px;border:1px solid rgba(182,191,255,.25);border-radius:13px;background:#171f42;color:#f8fafc;font-weight:800;cursor:pointer}
.maze-action-button{padding:0 13px}
.maze-icon-button{width:44px;padding:0;font-size:21px}
.maze-action-button:hover,.maze-icon-button:hover,.maze-start-button:hover,.maze-secondary-button:hover,.maze-choice:hover,.maze-difficulty-row button:hover,.maze-map-choice:hover{filter:brightness(1.12)}
.maze-action-button:focus-visible,.maze-icon-button:focus-visible,.maze-start-button:focus-visible,.maze-secondary-button:focus-visible,.maze-choice:focus-visible,.maze-difficulty-row button:focus-visible,.maze-map-choice:focus-visible,.maze-touch-pad button:focus-visible{outline:3px solid rgba(255,255,255,.82);outline-offset:2px}

.maze-canvas-wrap{position:relative;min-height:0;overflow:hidden}
#mazeCanvas{display:block;width:100%;height:100%;min-height:0;object-fit:contain;object-position:center;background:#050719;touch-action:none}
.maze-status-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:39px;padding:7px 13px;border-top:1px solid rgba(145,128,255,.2);background:rgba(5,7,24,.9);font-size:12px;color:#cbd4ff}
.maze-status-row strong{color:#fff;font-size:13px}

.maze-overlay{position:absolute;inset:10px;z-index:10;display:none;align-items:center;justify-content:center;padding:16px;overflow:auto;border-radius:18px;background:rgba(4,6,21,.76);backdrop-filter:blur(8px)}
.maze-overlay.show{display:flex}
.maze-card{width:min(920px,100%);max-height:100%;padding:22px;border:1px solid rgba(139,121,255,.38);border-radius:22px;overflow:auto;background:linear-gradient(160deg,rgba(20,28,63,.98),rgba(11,12,38,.98));box-shadow:0 28px 80px rgba(0,0,0,.48)}
.maze-menu-card h1,.maze-card h2{margin:0;color:#fff}
.maze-menu-card h1{font-size:clamp(27px,3.2vw,42px);line-height:1.05}
.maze-card h2{font-size:22px}
.maze-card p{color:#d9dfff;line-height:1.5}
.maze-lead{max-width:780px;margin:8px 0 15px !important;font-size:14px}
.maze-eyebrow{margin-bottom:6px;color:#aaa0ff;font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.maze-small-card{max-width:520px}
.maze-result-card{text-align:center}

.maze-setup-section{margin-top:13px;padding:12px;border:1px solid rgba(182,191,255,.14);border-radius:17px;background:rgba(4,8,29,.46)}
.maze-section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.maze-section-title h2{margin:0;font-size:15px}
.maze-section-title>span{color:#aeb8e4;font-size:11px;font-weight:800}
.maze-mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.maze-choice{display:grid;gap:4px;min-height:68px;padding:11px 13px;border:1px solid rgba(182,191,255,.2);border-radius:14px;background:#141b3c;color:#f8fafc;text-align:left;cursor:pointer}
.maze-choice strong{font-size:15px;color:#fff}
.maze-choice span{color:#bcc6f0;font-size:12px;line-height:1.35}
.maze-choice.is-selected{border-color:#8f7aff;background:linear-gradient(135deg,#322775,#172250);box-shadow:0 0 0 2px rgba(143,122,255,.22) inset}
.maze-difficulty-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.maze-difficulty-row button{min-height:44px;border:1px solid rgba(182,191,255,.2);border-radius:12px;background:#141b3c;color:#dfe5ff;font-weight:800;cursor:pointer}
.maze-difficulty-row button.is-selected{border-color:#ffd84d;background:#564517;color:#fff3a8;box-shadow:0 0 0 2px rgba(255,216,77,.18) inset}
.maze-map-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.maze-map-choice{position:relative;display:grid;grid-template-rows:54px auto;gap:6px;min-width:0;min-height:88px;padding:7px;border:1px solid rgba(182,191,255,.2);border-radius:13px;background:#111734;color:#eaf0ff;font-weight:800;cursor:pointer}
.maze-map-choice canvas{display:block;width:100%;height:54px;border-radius:7px;background:#070a1c}
.maze-map-choice span{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.maze-map-choice.is-selected{border-color:var(--map-accent,#8f7aff);box-shadow:0 0 0 2px color-mix(in srgb,var(--map-accent,#8f7aff) 32%,transparent) inset;background:#20254c}
.maze-map-choice.is-selected::after{content:"✓";position:absolute;right:5px;top:5px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--map-accent,#8f7aff);color:#071020;font-size:12px;font-weight:1000}
.maze-menu-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:13px}
.maze-key-help{display:flex;flex-wrap:wrap;gap:7px;color:#b9c2eb;font-size:11px}
.maze-key-help span{white-space:nowrap}
kbd{display:inline-block;min-width:30px;padding:4px 6px;border:1px solid #53608f;border-bottom-width:3px;border-radius:6px;background:#0b1029;color:#fff;text-align:center;font:800 10px/1 Arial,sans-serif}
.maze-start-button,.maze-secondary-button{min-height:50px;padding:0 20px;border-radius:15px;font-weight:900;cursor:pointer}
.maze-start-button{border:0;background:linear-gradient(135deg,#ffd84d,#ff9b36);color:#291900;box-shadow:0 10px 24px rgba(255,171,54,.22)}
.maze-start-button.is-compact{min-height:46px}
.maze-secondary-button{border:1px solid rgba(182,191,255,.3);background:#171f42;color:#fff}
.maze-overlay-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px;flex-wrap:wrap}
.maze-overlay-actions.is-centered{justify-content:center}
.maze-result-score{display:inline-flex;align-items:center;justify-content:center;min-height:52px;margin:12px auto 0;padding:0 20px;border:1px solid rgba(255,216,77,.4);border-radius:999px;background:#282042;color:#ffe36f;font-size:22px;font-weight:900}

.maze-touch-controls{position:absolute;inset:auto 11px 11px;z-index:4;display:flex;justify-content:space-between;pointer-events:none}
.maze-touch-controls[hidden]{display:none !important}
.maze-touch-pad{display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:20px repeat(2,46px);grid-template-areas:"label label label" "fire up ." "left down right";gap:4px;pointer-events:auto;filter:drop-shadow(0 5px 9px rgba(0,0,0,.45))}
.maze-touch-pad>span{grid-area:label;align-self:center;color:#fff;font-size:10px;font-weight:900;text-align:center;text-shadow:0 2px 4px #000}
.maze-touch-pad button{width:46px;height:46px;padding:0;border:1px solid rgba(255,255,255,.5);border-radius:13px;background:rgba(14,20,50,.82);color:#fff;font-size:18px;font-weight:900;touch-action:none;cursor:pointer}
.maze-touch-pad button[data-direction="up"]{grid-area:up}
.maze-touch-pad button[data-direction="left"]{grid-area:left}
.maze-touch-pad button[data-direction="down"]{grid-area:down}
.maze-touch-pad button[data-direction="right"]{grid-area:right}
.maze-touch-pad button[data-fire]{grid-area:fire;border-width:2px;background:rgba(136,24,68,.9);font-size:22px}
.maze-touch-pad.is-player-one button{border-color:rgba(255,216,77,.75);color:#ffe882}
.maze-touch-pad.is-player-two button{border-color:rgba(78,214,255,.75);color:#8ce8ff}
.maze-touch-controls[data-mode="solo"] .maze-touch-pad.is-player-two{visibility:hidden}
.maze-touch-controls:not([data-mode="shootout"]) button[data-fire]{visibility:hidden}

@media (pointer:coarse){
  .maze-touch-controls:not([hidden]){display:flex}
}

@media (max-width:900px){
  .maze-stage.site-game-stage{height:auto;min-height:720px;aspect-ratio:auto}
  .maze-game{min-height:698px}
  .maze-map-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .maze-mode-grid{grid-template-columns:1fr}
  .maze-menu-card{max-height:none}
}

@media (max-width:640px){
  .maze-stage.site-game-stage{min-height:800px;padding:6px}
  .maze-game{min-height:786px;border-radius:14px}
  .maze-hud{align-items:flex-start;padding:7px;flex-wrap:wrap}
  .maze-score-group{order:2;width:100%}
  .maze-hud-actions{order:1;margin-left:auto}
  .maze-pill{min-height:34px;padding:5px 9px;font-size:11px}
  .maze-action-button{min-height:44px;padding:0 10px;font-size:12px}
  .maze-status-row{align-items:flex-start;flex-direction:column;gap:2px}
  .maze-overlay{inset:6px;padding:7px;align-items:flex-start}
  .maze-card{padding:15px;border-radius:17px}
  .maze-mode-grid{grid-template-columns:1fr}
  .maze-map-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .maze-menu-footer{align-items:stretch;flex-direction:column}
  .maze-start-button{width:100%}
  .maze-key-help{justify-content:center}
}

@media (pointer:coarse) and (orientation:landscape) and (max-height:720px){
  .maze-stage.site-game-stage{min-height:0;height:calc(100vh - 72px);aspect-ratio:auto}
  .maze-game{min-height:0}
  .maze-hud{min-height:48px;padding:5px 7px}
  .maze-pill{min-height:34px;padding:5px 8px;font-size:11px}
  .maze-status-row{min-height:32px;padding:5px 9px}
  .maze-touch-pad{transform:scale(.86);transform-origin:bottom left}
  .maze-touch-pad.is-player-two{transform-origin:bottom right}
}

.site-game-frame__viewport:fullscreen .maze-stage.site-game-stage{height:auto;min-height:0;aspect-ratio:16/9}
.site-game-frame__viewport:fullscreen .maze-game{min-height:0}

@media (prefers-reduced-motion:reduce){
  .maze-overlay{backdrop-filter:none}
}
