/* map.css — connected Pokemon-world mount (see map.js). Covers #console-screen.
   z-index 55 = above #bios (54); #screen-glass shares z 55 but is a later
   sibling, so the CRT glass still paints on top. */

/* Letterbox matte: dark GBA-border tone (not raw black) so any snap gap
   around the fitted canvas reads as console bezel, per POKE-SPEC. */
#hackathon-overworld {
  position: absolute;
  inset: 0;
  z-index: 55;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #101820;
}

/* The world is 16px-tile pixel art drawn at 2x inside a 480x320 canvas and
   fitted at 0.5-step scales — keep every upscale crisp. */
#hackathon-overworld canvas {
  display: block;
  image-rendering: pixelated;
  outline: 1px solid #123;
  touch-action: none; /* taps feed the game (A), not browser gestures */
}

/* Touch D-pad: lives in the letterbox matte, bottom-left. map.js shows it
   only while touch is the active input (hidden after recent physical
   keyboard use, or on wide viewports where a keyboard is assumed). */
#hackathon-overworld .ow-dpad {
  position: absolute;
  left: 14px;
  bottom: 14px;
  display: grid;
  grid-template-columns: repeat(3, 48px);
  grid-template-rows: repeat(3, 48px);
  gap: 2px;
  z-index: 1;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

#hackathon-overworld .ow-dpad button {
  appearance: none;
  padding: 0;
  border: 2px solid #182830;
  border-radius: 8px;
  background: rgba(74, 74, 106, 0.85); /* the Gen-3 sign-plate tone */
  color: #f8f8f8;
  font: 20px 'PokeText', monospace;
  line-height: 1;
  cursor: pointer;
  touch-action: none;
}

#hackathon-overworld .ow-dpad button:active {
  background: rgba(139, 139, 205, 0.9);
}

/* MAP toggle: letterbox matte, bottom-right — the touch stand-in for the M
   key. Shown/hidden by map.js on the same rules as the D-pad. */
#hackathon-overworld .ow-mapbtn {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 64px;
  height: 48px;
  padding: 0;
  appearance: none;
  border: 2px solid #182830;
  border-radius: 8px;
  background: rgba(74, 74, 106, 0.85); /* the Gen-3 sign-plate tone */
  color: #f8f8f8;
  font: 14px 'PokeText', monospace;
  line-height: 1;
  cursor: pointer;
  z-index: 1;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

#hackathon-overworld .ow-mapbtn:active {
  background: rgba(139, 139, 205, 0.9);
}

/* Desktop MAP chip: the button stays visible with a keyboard too (Marshall
   7/24 — "add an always-visible MAP button on desktop"), just smaller so
   the matte reads clean next to the M-key affordance. */
#hackathon-overworld .ow-mapbtn.ow-mapbtn-desktop {
  width: 56px;
  height: 32px;
  font-size: 12px;
  opacity: 0.92;
}

/* Profile-card / judges-portal link buttons: REAL anchors overlaid on the
   canvas (window.open from the rAF loop would be popup-blocked). Gen-3
   plate styling; row centered under the canvas card. */
#hackathon-overworld .ow-cardlinks {
  position: absolute;
  left: 50%;
  bottom: 18%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
  z-index: 2;
}

#hackathon-overworld .ow-cardbtn {
  display: block;
  padding: 10px 14px;
  border: 2px solid #182830;
  border-radius: 8px;
  background: rgba(74, 74, 106, 0.92);
  color: #f8f8f8;
  font: 13px 'PokeText', monospace;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
}

#hackathon-overworld .ow-cardbtn:hover,
#hackathon-overworld .ow-cardbtn:focus-visible {
  background: rgba(139, 139, 205, 0.95);
}

/* RUN toggle: above MAP — the touch stand-in for holding B (X/Shift).
   Latched (.on) reads pressed. Shown/hidden by map.js with the D-pad. */
#hackathon-overworld .ow-runbtn {
  position: absolute;
  right: 14px;
  bottom: 72px; /* MAP's 48px height + 10px gap above its 14px inset */
  width: 64px;
  height: 48px;
  padding: 0;
  appearance: none;
  border: 2px solid #182830;
  border-radius: 8px;
  background: rgba(74, 74, 106, 0.85); /* the Gen-3 sign-plate tone */
  color: #f8f8f8;
  font: 14px 'PokeText', monospace;
  line-height: 1;
  cursor: pointer;
  z-index: 1;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

#hackathon-overworld .ow-runbtn:active,
#hackathon-overworld .ow-runbtn.on {
  background: rgba(139, 139, 205, 0.9);
  box-shadow: inset 0 3px 0 rgba(24, 40, 48, 0.6);
}

/* RETRY on the asset-failure panel (map.js showLoadError): centered under
   the in-canvas message, same Gen-3 plate styling as MAP/RUN. */
#hackathon-overworld .ow-retrybtn {
  position: absolute;
  left: 50%;
  top: 66%;
  transform: translateX(-50%);
  width: 96px;
  height: 48px;
  padding: 0;
  appearance: none;
  border: 2px solid #182830;
  border-radius: 8px;
  background: rgba(74, 74, 106, 0.85);
  color: #f8f8f8;
  font: 14px 'PokeText', monospace;
  line-height: 1;
  cursor: pointer;
  z-index: 1;
  user-select: none;
  -webkit-user-select: none;
}

#hackathon-overworld .ow-retrybtn:active {
  background: rgba(139, 139, 205, 0.9);
}

/* Hidden real input behind the ticket form's SUBJECT/MESSAGE steps: focused
   so the mobile IME opens; the canvas draws its mirrored value. Must stay
   renderable (not display:none) to be focusable. 16px font stops iOS's
   focus-zoom. */
#hackathon-overworld .ow-typebox {
  position: absolute;
  left: 4px;
  bottom: 4px;
  width: 2px;
  height: 2px;
  padding: 0;
  border: 0;
  opacity: 0.01;
  background: transparent;
  color: transparent;
  caret-color: transparent;
  font-size: 16px;
  pointer-events: none;
}

#hackathon-overworld .ow-dpad .ow-dpad-up    { grid-area: 1 / 2; }
#hackathon-overworld .ow-dpad .ow-dpad-left  { grid-area: 2 / 1; }
#hackathon-overworld .ow-dpad .ow-dpad-right { grid-area: 2 / 3; }
#hackathon-overworld .ow-dpad .ow-dpad-down  { grid-area: 3 / 2; }
