/* Retro Menu: one 80x25 text-mode screen (720x400 logical px), scaled to fit, centered on a black bezel. */
:root {
  --bezel: #000000;
  --scan: rgba(0, 0, 0, 0.22);
  --vignette: rgba(0, 0, 0, 0.45);
  --font-screen: "VT323", "Lucida Console", "Courier New", monospace;
  color-scheme: dark;
}
html, body { height: 100%; }
body.retro-menu {
  margin: 0;
  background: var(--bezel);
  display: flex;
  align-items: center;
  justify-content: center;
  padding-inline: 16px;
  padding-block: 16px;
  box-sizing: border-box;
  overflow: hidden;
  font-family: var(--font-screen);
}
.rm-screen { position: relative; line-height: 0; }
.rm-screen canvas { display: block; outline: none; touch-action: manipulation; }
.rm-screen.crt::before,
.rm-screen.crt::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.rm-screen.crt::after {
  background: repeating-linear-gradient(to bottom, transparent 0, transparent 2px, var(--scan) 3px);
}
.rm-screen.crt::before {
  background: radial-gradient(ellipse at center, transparent 62%, var(--vignette) 100%);
}
.rm-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.rm-sr a:focus-visible, .rm-sr button:focus-visible { outline: 2px solid #FFFF55; }
/* Hidden inputs behind the DOS contact form. Kept focusable (so phone keyboards open)
   and pinned to the corner so focusing them never scrolls the page. 16px stops iOS zoom. */
.rm-form-inputs {
  position: fixed; left: 0; top: 0; width: 1px; height: 1px; overflow: hidden;
  opacity: 0; pointer-events: none;
}
.rm-form-inputs input, .rm-form-inputs textarea { font-size: 16px; }