:root {
  color-scheme: dark;
  --or-ink: #f7f2e8;
  --or-muted: #ada79d;
  --or-faint: #77736c;
  --or-bg: #0c0d0d;
  --or-bg-raised: #121414;
  --or-panel: #181a1a;
  --or-panel-2: #202222;
  --or-line: rgba(255, 255, 255, .105);
  --or-line-strong: rgba(255, 125, 25, .45);
  --or-orange: #ff7217;
  --or-orange-2: #ff9a3d;
  --or-sand: #d8c39a;
  --or-green: #8ea06b;
  --or-danger: #e55a4f;
  --or-success: #56b77b;
  --or-radius-sm: 10px;
  --or-radius: 16px;
  --or-radius-lg: 24px;
  --or-shadow: 0 18px 52px rgba(0, 0, 0, .28);
  --or-max: 1680px;
  --or-header: 72px;
  --or-bottom-nav: 74px;
  --or-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --or-display: "Arial Narrow", "Roboto Condensed", Impact, var(--or-font);
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--or-bg); scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--or-ink);
  background:
    radial-gradient(circle at 78% -10%, rgba(255, 114, 23, .12), transparent 34rem),
    linear-gradient(180deg, #101212 0, var(--or-bg) 40rem);
  font-family: var(--or-font);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: 280px;
  pointer-events: none;
  opacity: .18;
  background: url("../assets/terrain-cover.svg") center top / cover no-repeat;
  mask-image: linear-gradient(#000, transparent);
  z-index: -1;
}

a { color: inherit; }
img, video { max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid rgba(255, 114, 23, .72); outline-offset: 3px; }
::selection { background: var(--or-orange); color: #111; }

h1, h2, h3, .or-display {
  color: var(--or-ink);
  font-family: var(--or-display);
  letter-spacing: .025em;
}

.muted { color: var(--or-muted) !important; }
.tiny { font-size: .8rem; }
.or-accent { color: var(--or-orange); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
