:root {
  color-scheme: dark;
  --background: #142b26;
  --ink: #e9eee5;
  --accent: #ccdc9b;
  --line: #4c6557;
  --subtle-line: #324b40;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--background); }
body { margin: 0; color: var(--ink); font-family: "Avenir Next", Avenir, "Segoe UI", sans-serif; }
.page {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  padding: 0 6vw 14vh;
  padding-bottom: clamp(6rem, 14svh, 12rem);
}
.digital-field {
  position: absolute;
  z-index: -1;
  width: min(64vw, 980px);
  height: auto;
  top: 2vh;
  right: -3vw;
  pointer-events: none;
}
.pixel { fill: var(--subtle-line); }
.pixel-bright { fill: var(--line); }
.pixel-accent { fill: var(--accent); }
.wordmark {
  margin: 0 0 0 -.065em;
  font-size: clamp(2.2rem, 8.1vw, 8.5rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -.055em;
  white-space: nowrap;
}
.dot { color: var(--accent); }
.suffix { font-weight: 400; }
.baseline {
  position: absolute;
  left: 6vw;
  right: 6vw;
  bottom: clamp(2rem, 6svh, 4rem);
  height: 1px;
  background: var(--line);
}
.baseline span { display: block; width: 36px; height: 1px; background: var(--accent); }

@media (max-width: 720px) {
  .page { padding: 0 7vw 17svh; }
  .wordmark { font-size: 8.7vw; letter-spacing: -.055em; }
  .digital-field { width: 128vw; top: 8svh; right: -32vw; }
  .baseline { left: 7vw; right: 7vw; bottom: max(2rem, env(safe-area-inset-bottom)); }
}
@media (max-height: 480px) and (min-width: 721px) {
  .page { padding-bottom: 4rem; }
  .wordmark { font-size: min(8.1vw, 27vh); }
  .baseline { bottom: 1.5rem; }
}
@media (prefers-contrast: more) {
  :root { --ink: #ffffff; --line: #839d8d; --subtle-line: #627d6d; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  :root { --background: Canvas; --ink: CanvasText; --accent: CanvasText; }
  .digital-field, .baseline { display: none; }
}
