/* Typewriter: Special Elite by Astigmatic, Apache 2.0. Title: Anton by Vernon Adams, OFL. */
@font-face { font-family: "Special Elite"; src: url("/extraction/special-elite.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Anton"; src: url("/extraction/anton.woff2") format("woff2"); font-display: swap; }

html, body { margin: 0; height: 100%; }
body {
  overflow: hidden;
  color: #efe2c4;
  font-family: "Special Elite", "Courier New", monospace;
  background: #0a1410;
}

/* The stand-in ship, greyed out, parked on a hangar deck under one lamp. */
.scene {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  pointer-events: none;
  user-select: none;
  /* Preserve the approved poster's crop during the transition to 3D. */
  transform: scale(1.08);
}

.scene-live { opacity: 0; transition: opacity .6s ease; }
.scene-live.is-ready { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .scene-live { transition: none; } }

main { position: relative; padding: 7vh 0 0 6.6vw; }
h1 {
  margin: 0 0 23vh;
  font: 400 clamp(48px, 10.4vw, 175px)/1 "Anton", Impact, sans-serif;
  /* Taller, narrower letters, like the mockup. */
  transform: scaleY(1.2);
  transform-origin: top left;
  width: fit-content;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  color: #b3261b;
  /* Worn paint: sparse specks, plus a few thin scratches across the letters. */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.32' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -18 14.2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill-rule='evenodd' d='M0 0H100V100H0Z M0 37.5H44V38.6H0Z M52 41H63V41.9H52Z M86 61H100V62.2H86Z M30 83H38V83.8H30Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.32' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -18 14.2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill-rule='evenodd' d='M0 0H100V100H0Z M0 37.5H44V38.6H0Z M52 41H63V41.9H52Z M86 61H100V62.2H86Z M30 83H38V83.8H30Z'/%3E%3C/svg%3E");
  -webkit-mask-size: 240px 240px, 100% 100%;
  mask-size: 240px 240px, 100% 100%;
  -webkit-mask-repeat: repeat, no-repeat;
  mask-repeat: repeat, no-repeat;
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
nav { display: flex; flex-direction: column; align-items: flex-start; gap: 3vh; }
nav button {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: clamp(18px, 2.55vw, 42px);
  -webkit-text-stroke: 0.02em currentColor;
  color: inherit;
  cursor: pointer;
}
nav button:hover:not(:disabled), nav button:focus-visible { color: #e2574a; outline: none; }
nav button:disabled { opacity: 0.5; cursor: not-allowed; }

.who { position: fixed; top: 4vh; right: 3vw; text-align: right; }
.who .name { font-size: clamp(20px, 2vw, 32px); -webkit-text-stroke: 0.03em currentColor; }
.who .purse { margin-top: 0.4em; font-size: clamp(14px, 1.4vw, 22px); word-spacing: 0.15em; }
.who .purse span + span { margin-left: 1em; }

.wip {
  position: fixed;
  left: 6.6vw;
  bottom: 3vh;
  margin: 0;
  font-size: clamp(12px, 1.2vw, 18px);
  opacity: 0.5;
}

/* Phones and tablets (menu.js sets .phone): no menu, just the note. */
.no-mobile { display: none; }
.phone .who, .phone nav, .phone .wip, .phone .scene { display: none; }
.phone .no-mobile { display: block; margin: 0; font-size: 24px; -webkit-text-stroke: 0.03em currentColor; }