/* [SoDs] Shadows of Deaths — dark desert-ops theme tokens */

:root {
  --sand-100: #f4e9d4;
  --sand-300: #d9c39b;
  --amber-300: #f4c274;
  --amber-400: #e9a13c;
  --amber-500: #c9801f;
  --blood-500: #a83a30;

  --bg-900: #0a0d12;
  --bg-800: #10151d;
  --bg-700: #161d27;
  --bg-600: #1c2430;
  --bg-500: #26303e;

  --ok-500: #4f9e63;
  --warn-500: #cf9a2a;
  --err-500: #c9584a;

  --text: #d8dee7;
  --text-dim: #97a2b0;
  --line: #232d3a;
  --line-soft: #1b232e;

  --radius-lg: 14px;
  --radius: 10px;
  --radius-sm: 7px;
  --gap: 10px;
  --tap: 42px;
  --shadow: 0 4px 16px rgb(0 0 0 / 40%);
  --shadow-pop: 0 12px 32px rgb(0 0 0 / 55%);

  --font: "Chakra Petch", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  /* Safety net only — real overflow is fixed at the source in layout.css. */
  overflow-x: hidden;
}

body {
  background:
    radial-gradient(140% 55% at 50% -5%, #1b2431 0%, transparent 60%),
    linear-gradient(180deg, var(--bg-900), #080a0e);
  background-attachment: fixed;
  color: var(--text);
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  min-height: 100dvh;
}

h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--sand-100);
}

h2 {
  font-size: 1rem;
}

h3 {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--sand-300);
}

h4 {
  font-size: 0.92rem;
}

p {
  margin: 0 0 0.4rem;
}

strong {
  font-weight: 600;
}

.muted {
  color: var(--text-dim);
}

.small {
  font-size: 0.8rem;
}

.bidi {
  unicode-bidi: isolate;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.boot {
  padding: 2rem;
  text-align: center;
  color: var(--text-dim);
}

::selection {
  background: rgb(233 161 60 / 30%);
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}