/* Full-game page. PRESSURE NOIR palette only; fonts come from the site (same origin). */
@font-face { font-family: "Saira Stencil One"; src: url("/static/fonts/SairaStencilOne-Regular.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("/static/fonts/BarlowCondensed-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Share Tech Mono"; src: url("/static/fonts/ShareTechMono-Regular.ttf") format("truetype"); font-display: swap; }

html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: #0E0F11; color: #EDE8DC; overscroll-behavior: none; }
canvas { display: block; width: 100%; height: 100%; outline: none; touch-action: none; }

.gate { position: fixed; inset: 0; display: grid; place-items: center; padding: 16px; background: #0E0F11; font-family: "Barlow Condensed", "Arial Narrow", sans-serif; font-weight: 700; }
.gate[hidden] { display: none; }
.gate__panel { width: min(520px, 100%); text-align: center; }
.gate__kicker { margin: 0 0 12px; font-family: "Share Tech Mono", ui-monospace, monospace; font-weight: 400; font-size: 0.8rem; letter-spacing: 0.12em; color: #A9A69E; }
.gate__title { margin: 0; line-height: 0; }
.gate__title img { display: block; width: min(400px, 86%); height: auto; margin: 0 auto; }
.gate__tagline { margin: 14px 0 22px; font-size: clamp(1.4rem, 5vw, 2rem); color: #FFB000; letter-spacing: 0.05em; }
.gate__progress { width: 100%; height: 8px; appearance: none; border: 0; background: #24262A; }
.gate__progress::-webkit-progress-bar { background: #24262A; }
.gate__progress::-webkit-progress-value { background: #FFB000; }
.gate__progress::-moz-progress-bar { background: #FFB000; }
.gate__progress[hidden] { display: none; }
.gate--deploying .gate__progress { animation: gate-pulse 0.9s ease-in-out infinite alternate; }
@keyframes gate-pulse { from { opacity: 1; } to { opacity: 0.25; } }
@media (prefers-reduced-motion: reduce) { .gate--deploying .gate__progress { animation: none; } }
.gate__status { min-height: 1.4em; margin: 10px 0 18px; font-family: "Share Tech Mono", ui-monospace, monospace; font-weight: 400; font-size: 0.9rem; letter-spacing: 0.08em; text-transform: uppercase; color: #A9A69E; }
.gate__deploy { width: 100%; min-height: 64px; border: 2px solid #FFB000; background: #FFB000; color: #0E0F11; font: inherit; font-size: 1.6rem; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; }
.gate__deploy:disabled { background: #24262A; border-color: #4A4C4E; color: #A9A69E; cursor: progress; }
.gate__deploy[hidden] { display: none; }
.gate__deploy:focus-visible, .gate__back:focus-visible { outline: 3px solid #FFB000; outline-offset: 3px; }
.gate__controls { margin: 16px 0 0; font-size: 1rem; color: #A9A69E; }
.gate__error { margin: 18px 0 0; padding-left: 12px; border-left: 4px solid #D7141E; text-align: left; font-size: 1.1rem; }
.gate__back { display: inline-block; margin-top: 22px; min-height: 44px; line-height: 44px; color: #FFB000; }