:root {
  color-scheme: light;
  --black: #fffaf0;
  --deep: #edf0e8;
  --deep-raised: #dce2d8;
  --raised: #dce2d8;
  --paper: #fffaf0;
  --white: #20251f;
  --muted: #596057;
  --line: #20251f;
  --line-strong: #20251f;
  --acid: #f4cf45;
  --acid-dark: #2447d5;
  --header: 64px;
  --gutter: clamp(16px, 4vw, 62px);
  --page-gutter: clamp(16px, 4vw, 62px);
  --max-width: 1440px;
  --play-blue: #2447d5;
  --play-charcoal: #20251f;
  --play-paper: #fffaf0;
  --play-yellow: #f4cf45;
  --play-sage: #aebdaf;
  --play-shadow: 8px 8px 0 var(--play-charcoal);
  --play-shadow-small: 5px 5px 0 var(--play-charcoal);
  background: var(--play-paper);
  font-family: "Avenir Next", Avenir, "Century Gothic", Futura, system-ui, sans-serif;
}

html {
  background: var(--play-paper);
}

.prism-relay-body,
.signal-hunt-body {
  background: var(--play-paper);
  color: var(--play-charcoal);
  font-family: "Avenir Next", Avenir, system-ui, sans-serif;
  text-rendering: optimizeLegibility;
}

.prism-relay-body :focus-visible,
.signal-hunt-body :focus-visible {
  outline: 4px solid var(--play-blue);
  outline-offset: 4px;
}

.prism-relay-body .skip-link,
.signal-hunt-body .skip-link {
  border: 2px solid var(--play-charcoal);
  background: var(--play-blue);
  box-shadow: var(--play-shadow-small);
  color: var(--play-paper);
}

.prism-relay-body .site-header,
.signal-hunt-body .site-header {
  border-bottom: 2px solid var(--play-charcoal);
  background: var(--play-yellow);
  color: var(--play-charcoal);
}

.prism-relay-body .wordmark,
.signal-hunt-body .wordmark {
  color: var(--play-charcoal);
}

.prism-relay-body .wordmark strong,
.signal-hunt-body .wordmark strong {
  font-family: "Avenir Next", Avenir, system-ui, sans-serif;
  font-weight: 900;
}

.prism-relay-body .wordmark span,
.signal-hunt-body .wordmark span {
  border-color: var(--play-charcoal);
  color: #4b5048;
  font-family: "SFMono-Regular", Consolas, monospace;
}

.prism-relay-body .site-nav a,
.signal-hunt-body .site-nav a {
  color: var(--play-charcoal);
  font-weight: 800;
}

.prism-relay-body .site-nav a:hover,
.prism-relay-body .site-nav a:focus-visible,
.signal-hunt-body .site-nav a:hover,
.signal-hunt-body .site-nav a:focus-visible {
  color: var(--play-blue);
}

.prism-relay-body .site-nav a[aria-current="page"],
.signal-hunt-body .site-nav a[aria-current="page"] {
  box-shadow: inset 0 -4px 0 var(--play-blue);
  color: var(--play-charcoal);
}

.prism-relay-body .page-intro,
.signal-hunt-body .page-intro {
  min-height: clamp(310px, 42svh, 500px);
  border-bottom: 2px solid var(--play-charcoal);
  background: var(--play-paper);
}

.prism-relay-body .page-intro h1,
.signal-hunt-body .page-intro h1 {
  max-width: none;
  color: var(--play-charcoal);
  font-family: "Avenir Next", Avenir, "Century Gothic", Futura, system-ui, sans-serif;
  font-size: clamp(48px, 6vw, 76px);
  font-weight: 900;
  letter-spacing: -0.06em;
  line-height: 0.92;
}

.prism-relay-body .page-intro-copy,
.signal-hunt-body .intro-copy {
  padding: clamp(22px, 3vw, 34px);
  border: 2px solid var(--play-charcoal);
  background: var(--play-sage);
  box-shadow: var(--play-shadow-small);
  transform: rotate(0.4deg);
}

.prism-relay-body .page-intro-copy p,
.signal-hunt-body .intro-copy p {
  color: var(--play-charcoal);
}

.prism-relay-body .page-intro-copy a,
.signal-hunt-body .intro-copy a {
  color: var(--play-charcoal);
  font-family: "SFMono-Regular", Consolas, monospace;
}

.prism-relay-body .page-intro-copy a span,
.signal-hunt-body .intro-copy a span {
  color: var(--play-blue);
}

.script-note {
  margin: 0;
  padding: 18px var(--page-gutter);
  border-bottom: 2px solid var(--play-charcoal);
  background: var(--play-yellow);
  color: var(--play-charcoal);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

.has-js .script-note {
  display: none;
}

.no-js .board-column,
.no-js .field-column,
.no-js .game-actions,
.no-js .hunt-actions,
.no-js .metrics,
.no-js .feedback,
.no-js .probe-log,
.no-js .result-line {
  display: none;
}

.prism-relay-body .game-section,
.signal-hunt-body .hunt-section {
  border-top: 0;
  border-bottom: 2px solid var(--play-charcoal);
  background: var(--play-sage);
}

.prism-relay-body .game-heading,
.signal-hunt-body .hunt-heading {
  width: min(calc(100% - (2 * var(--page-gutter))), var(--max-width));
  margin-top: clamp(42px, 6vw, 82px);
  padding: 22px clamp(20px, 3vw, 34px);
  border: 2px solid var(--play-charcoal);
  background: var(--play-yellow);
  box-shadow: var(--play-shadow);
}

.prism-relay-body .game-heading h2,
.signal-hunt-body .hunt-heading h2 {
  color: var(--play-charcoal);
  font-family: "Avenir Next", Avenir, system-ui, sans-serif;
  font-size: clamp(34px, 4vw, 54px);
  font-weight: 900;
  letter-spacing: -0.05em;
}

.prism-relay-body .game-heading p,
.signal-hunt-body .hunt-heading p {
  color: #41463f;
}

.prism-relay-body .game-layout,
.signal-hunt-body .hunt-layout {
  padding-top: clamp(46px, 6vw, 82px);
}

.prism-relay-body .game-rules,
.signal-hunt-body .hunt-rules,
.signal-hunt-body .probe-log {
  padding: clamp(22px, 3vw, 34px);
  border: 2px solid var(--play-charcoal);
  background: var(--play-paper);
  box-shadow: var(--play-shadow-small);
}

.signal-hunt-body .probe-log {
  border-top: 2px solid var(--play-charcoal);
}

.prism-relay-body .game-kicker,
.signal-hunt-body .kicker,
.signal-hunt-body .metric dd.is-active,
.prism-relay-body .metric-row dd.status-clean,
.signal-hunt-body .log-direction {
  color: var(--play-blue);
}

.prism-relay-body .game-instruction,
.signal-hunt-body .instruction,
.prism-relay-body .result-line,
.signal-hunt-body .feedback-copy strong {
  color: var(--play-charcoal);
}

.prism-relay-body .game-detail,
.prism-relay-body .keyboard-help,
.prism-relay-body .metric-row dt,
.prism-relay-body .verification,
.signal-hunt-body .detail,
.signal-hunt-body .keyboard-help,
.signal-hunt-body .metric dt,
.signal-hunt-body .feedback-copy span,
.signal-hunt-body .verification,
.signal-hunt-body .empty-log,
.signal-hunt-body .log-index,
.signal-hunt-body .log-strength {
  color: var(--muted);
}

.prism-relay-body .result-line,
.signal-hunt-body .feedback {
  border-left-color: var(--play-blue);
}

.signal-hunt-body .feedback-code {
  color: var(--play-blue);
}

.prism-relay-body .metrics,
.prism-relay-body .metric-row,
.signal-hunt-body .metrics,
.signal-hunt-body .metric,
.signal-hunt-body .legend,
.signal-hunt-body .legend li,
.signal-hunt-body .probe-log,
.signal-hunt-body .probe-log ol,
.signal-hunt-body .probe-log li,
.signal-hunt-body .empty-log {
  border-color: var(--play-charcoal);
}

.prism-relay-body .board-frame,
.signal-hunt-body .field-frame {
  border: 2px solid var(--play-charcoal);
  background: var(--play-charcoal);
  box-shadow: var(--play-shadow);
}

.prism-relay-body .board-meta,
.signal-hunt-body .field-meta {
  border-color: #586057;
  background: var(--play-charcoal);
  color: var(--play-sage);
}

.prism-relay-body .board-meta strong,
.signal-hunt-body .field-meta strong {
  color: var(--play-paper);
}

.prism-relay-body .board,
.signal-hunt-body .field-board {
  background: #596158;
}

.prism-relay-body .cell,
.signal-hunt-body .field-cell {
  background: var(--play-charcoal);
  color: var(--play-paper);
}

.prism-relay-body .cell::after,
.signal-hunt-body .field-cell,
.signal-hunt-body .cell-coordinate {
  color: var(--play-sage);
}

.prism-relay-body .cell[data-rotatable="true"]:hover,
.signal-hunt-body .field-cell[data-probeable="true"]:hover {
  background: #30382f;
  box-shadow: inset 0 0 0 2px var(--play-yellow);
  color: var(--play-paper);
}

.prism-relay-body .cell:focus-visible,
.signal-hunt-body .field-cell:focus-visible {
  outline: 0;
  box-shadow:
    inset 0 0 0 2px var(--play-paper),
    inset 0 0 0 6px var(--play-blue);
}

.prism-relay-body .mirror-mark,
.prism-relay-body .beam-part {
  background: var(--play-yellow);
}

.prism-relay-body .source-mark,
.prism-relay-body .receiver-mark {
  background: var(--play-charcoal);
}

.prism-relay-body .source-mark {
  color: var(--play-yellow);
}

.prism-relay-body .receiver-mark {
  color: var(--play-paper);
}

.prism-relay-body .cell.is-solved .receiver-mark {
  border-color: var(--play-blue);
  background: var(--play-blue);
  color: var(--play-paper);
}

.prism-relay-body .idle-cover {
  background: rgb(32 37 31 / 0.94);
}

.prism-relay-body .idle-panel {
  border-top-color: var(--play-yellow);
  border-bottom-color: var(--play-sage);
}

.prism-relay-body .idle-panel p {
  color: var(--play-sage);
}

.signal-hunt-body .field-cell.is-eliminated {
  background: #171b17;
  color: #747b72;
}

.signal-hunt-body .field-cell.is-probed {
  background: #343b33;
  color: var(--play-paper);
}

.signal-hunt-body .field-cell.is-target,
.signal-hunt-body .signal-mark {
  border-color: var(--play-blue);
  background: var(--play-blue);
  color: var(--play-paper);
}

.signal-hunt-body .probe-number {
  color: var(--play-yellow);
}

.signal-hunt-body .field-cell.is-new-probe::after {
  border-color: var(--play-yellow);
}

.prism-relay-body .control-button,
.signal-hunt-body .action-button {
  min-height: 48px;
  border: 2px solid var(--play-charcoal);
  background: var(--play-paper);
  box-shadow: var(--play-shadow-small);
  color: var(--play-charcoal);
}

.prism-relay-body .control-button:hover,
.signal-hunt-body .action-button:hover {
  border-color: var(--play-charcoal);
  background: var(--play-yellow);
  color: var(--play-charcoal);
}

.prism-relay-body .control-button.primary,
.signal-hunt-body .action-button.primary {
  border-color: var(--play-charcoal);
  background: var(--play-blue);
  color: var(--play-paper);
}

.prism-relay-body .control-button.primary:hover,
.signal-hunt-body .action-button.primary:hover {
  border-color: var(--play-charcoal);
  background: var(--play-yellow);
  color: var(--play-charcoal);
}

.prism-relay-body .control-button:active,
.signal-hunt-body .action-button:active {
  box-shadow: 2px 2px 0 var(--play-charcoal);
  transform: translate(3px, 3px);
}

.prism-relay-body .site-footer,
.signal-hunt-body .site-footer {
  border-top: 2px solid var(--play-charcoal);
  background: var(--play-yellow);
  color: var(--play-charcoal);
}

.prism-relay-body .footer-title,
.signal-hunt-body .footer-title {
  font-family: "Avenir Next", Avenir, system-ui, sans-serif;
  font-size: clamp(32px, 4.8vw, 62px);
  font-weight: 900;
}

.prism-relay-body .footer-title a,
.signal-hunt-body .footer-title a,
.prism-relay-body .footer-link,
.signal-hunt-body .footer-link {
  color: var(--play-charcoal);
}

.prism-relay-body .footer-title a,
.signal-hunt-body .footer-title a {
  text-decoration: none;
}

@media (max-width: 900px) {
  .prism-relay-body .page-intro-copy,
  .signal-hunt-body .intro-copy {
    max-width: 560px;
  }

  .prism-relay-body .game-rules,
  .signal-hunt-body .hunt-rules,
  .signal-hunt-body .probe-log {
    box-shadow: 5px 5px 0 var(--play-charcoal);
  }
}

@media (max-width: 560px) {
  :root {
    --play-shadow: 4px 4px 0 var(--play-charcoal);
    --play-shadow-small: 4px 4px 0 var(--play-charcoal);
  }

  .prism-relay-body .page-intro,
  .signal-hunt-body .page-intro {
    min-height: 0;
  }

  .prism-relay-body .page-intro h1,
  .signal-hunt-body .page-intro h1 {
    font-size: clamp(42px, 13vw, 54px);
  }

  .prism-relay-body .page-intro-copy,
  .signal-hunt-body .intro-copy {
    padding: 20px;
    transform: none;
  }

  .prism-relay-body .game-heading,
  .signal-hunt-body .hunt-heading {
    margin-top: 28px;
    box-shadow: 4px 4px 0 var(--play-charcoal);
  }

  .prism-relay-body .game-heading h2,
  .signal-hunt-body .hunt-heading h2 {
    font-size: clamp(32px, 10vw, 42px);
  }

  .prism-relay-body .game-rules,
  .signal-hunt-body .hunt-rules,
  .signal-hunt-body .probe-log {
    padding: 20px;
    box-shadow: 4px 4px 0 var(--play-charcoal);
  }

  .prism-relay-body .board-frame,
  .signal-hunt-body .field-frame {
    box-shadow: 4px 4px 0 var(--play-charcoal);
  }
}

@media (prefers-reduced-motion: reduce) {
  .prism-relay-body .page-intro-copy,
  .signal-hunt-body .intro-copy {
    transform: none;
  }
}
