/* The entry gate: the scene's own material, a DOS/VGA palette and a terminal face (theme.css), kept to one column and
   two keys; the rest of the site wears the same palette.
   Hidden unless the server requires it (data-required) or gate.js found no stamp for today (html.fh-gate-due). */
.fh-gate {
  --vga-black: var(--k); --vga-gray: var(--g); --vga-white: var(--w); --vga-cyan: var(--c); --vga-cyan-dim: var(--cd); --vga-blue: var(--b);
  position: fixed; inset: 0; z-index: 20; overflow-y: auto; display: none;
  background: var(--vga-black); color: var(--vga-gray);
  font: 22px/1.25 "VT323", ui-monospace, monospace;
}
.fh-gate[data-required], .fh-gate-due .fh-gate { display: block; }
/* static scanlines: the only texture */
.fh-gate::before { content: ""; position: fixed; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(to bottom, transparent 0 2px, rgb(0 0 0 / .28) 2px 3px); }
.fh-gate-col { width: min(64ch, 100% - 2rem); margin: 0 auto; padding: 6vh 0 0; }
.fh-gate-logo { display: block; width: 100%; height: auto; margin-bottom: 1.5rem; }
.fh-gate-logo .f { fill: var(--vga-cyan); }
.fh-gate-logo .s { fill: var(--vga-cyan-dim); }
.fh-gate-logo .r { animation: fh-gate-row 1ms steps(1) both; animation-delay: calc(var(--r) * 70ms + 120ms); }
@keyframes fh-gate-row { from { opacity: 0; } to { opacity: 1; } }
.fh-gate-nfo { border-top: 3px double var(--vga-cyan-dim); padding: 1.25rem 0; }
.fh-gate-nfo h2 { color: var(--vga-white); font: inherit; margin: 1.25rem 0 .25rem; }
.fh-gate-nfo h2:first-child { margin-top: 0; }
.fh-gate-nfo p, .fh-gate-nfo ol { margin: 0 0 .5rem; }
.fh-gate-nfo ol { padding-left: 0; list-style-position: inside; }  /* numbers inline, NFO-style: nothing hangs outside the bar */
.fh-gate-nfo strong { color: var(--vga-white); font-weight: normal; }
.fh-gate-nfo a { color: var(--vga-cyan); }
.fh-gate-welcome { color: var(--vga-white); }
/* the two keys stay on screen while the text scrolls, like a keygen's button row */
.fh-gate-bar { position: sticky; bottom: 0; background: var(--vga-black); padding: 1rem 0 1.25rem; border-top: 3px double var(--vga-cyan-dim); }
.fh-gate-keys { display: flex; gap: 3ch; align-items: baseline; flex-wrap: wrap; }
.fh-key { font: inherit; font-size: 28px; background: none; border: 0; padding: .1em .5ch; cursor: pointer; color: var(--vga-gray); }
.fh-key[data-enter] { color: var(--vga-cyan); }
.fh-key:hover, .fh-key:focus-visible { background: var(--vga-cyan); color: var(--vga-black); outline: none; }
.fh-key[data-exit]:hover, .fh-key[data-exit]:focus-visible { background: var(--vga-blue); color: var(--vga-white); }
.fh-gate-small { font-size: 18px; color: var(--vga-cyan-dim); margin: 0; }
@media (prefers-reduced-motion: reduce) { .fh-gate-logo .r { animation: none; } }