*,
*::before,
*::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  color-scheme: dark;
  --bg: #05060a;
  --ink: rgba(226, 231, 255, 0.84);
}

html,
body { height: 100%; overflow: hidden; background: var(--bg); }

body {
  color: var(--ink);
  font-family: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
}

canvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
}

.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.fallback {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 0;
}
.fallback svg { width: min(78vw, 920px); height: auto; overflow: visible; }

.nojs {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: clamp(48px, 14vw, 160px);
  letter-spacing: 0.04em;
  color: var(--ink);
}