:root {
  --ar-bg: #090b0d;
  --ar-panel: #101316;
  --ar-panel-muted: #17191b;
  --ar-border: #554a39;
  --ar-border-highlight: #9b7a42;
  --ar-text: #ede7da;
  --ar-text-muted: #aaa397;
  --ar-gold: #c9a45f;
  --ar-blue: #5ca9d8;
  --ar-success: #78b96e;
  --ar-warning: #d69445;
  --ar-danger: #c74b42;
  --ar-space-1: 0.25rem;
  --ar-space-2: 0.5rem;
  --ar-space-3: 0.75rem;
  --ar-space-4: 1rem;
  --ar-space-5: 1.5rem;
  --ar-space-6: 2rem;
  --ar-radius-sm: 0.15rem;
  --ar-radius-md: 0.35rem;
  --ar-shadow-raised: 0 0.45rem 1.4rem rgb(0 0 0 / 0.5);
  --ar-motion-fast: 140ms ease;
  --ar-motion-base: 220ms ease;
  --ar-font-sm: 0.8125rem;
}

* {
  box-sizing: border-box;
}

html {
  min-block-size: 100%;
  color-scheme: dark;
  background: var(--ar-bg);
}

body {
  min-block-size: 100dvh;
  margin: 0;
  color: var(--ar-text);
  background: var(--ar-bg);
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    sans-serif;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible {
  outline: 2px solid var(--ar-blue);
  outline-offset: -2px;
}

img {
  max-inline-size: 100%;
}

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