/* Raise Real Men — design tokens. Earthy, rugged, worn. */
:root {
  /* base */
  --bg:        #17140f;   /* charred wood */
  --bg-2:      #1f1a14;   /* panel */
  --bg-3:      #2a231b;   /* raised */
  --line:      #3d3428;
  --line-2:    #54483a;
  --ink:       #e9dfcb;   /* bone */
  --ink-2:     #b8ab92;   /* khaki */
  --ink-3:     #7f7360;
  --card:      #221c15;

  /* accents (track colors) */
  --ember:     #d9651c;
  --rust:      #a84a1f;
  --clay:      #b8743a;
  --brass:     #c9a24a;
  --moss:      #6e7f3d;
  --pine:      #3f5a3c;
  --steel:     #7d8a93;
  --gunmetal:  #59626b;
  --slate:     #6f7b86;
  --oak:       #8b6538;
  --leather:   #6b4a2b;
  --blood:     #8f2f2a;

  --accent:    var(--ember);
  --accent-ink:#1a120a;
  --ok:        #7f9a45;
  --warn:      #c9a24a;
  --bad:       #b5443a;

  --font-head: 'Oswald', 'Arial Narrow', Impact, sans-serif;
  --font-body: 'Barlow', 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'Courier New', monospace;

  --r: 6px;
  --shadow: 0 2px 0 #0b0906, 0 12px 30px -12px rgba(0,0,0,.8);
  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .12 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Optional light "paper" theme for printing and daylight use */
:root[data-theme="paper"] {
  --bg: #e7dcc6; --bg-2: #efe6d3; --bg-3: #f6efe0; --line: #c9b99a; --line-2: #b09d7b;
  --ink: #1f1a13; --ink-2: #4b4133; --ink-3: #7a6c58; --card: #f3ebd9;
  --shadow: 0 2px 0 #b9a887, 0 10px 24px -14px rgba(0,0,0,.4);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--font-body); font-size: 16px; line-height: 1.45;
  background-image: var(--grain), radial-gradient(1200px 600px at 20% -10%, rgba(217,101,28,.10), transparent 60%), radial-gradient(900px 500px at 100% 100%, rgba(63,90,60,.18), transparent 60%);
  background-attachment: fixed;
}
h1, h2, h3, h4 { font-family: var(--font-head); font-weight: 600; letter-spacing: .02em; text-transform: uppercase; margin: 0 0 .4em; line-height: 1.1; }
h1 { font-size: 2.2rem; } h2 { font-size: 1.5rem; } h3 { font-size: 1.15rem; } h4 { font-size: 1rem; color: var(--ink-2); }
p { margin: 0 0 .8em; }
a { color: var(--brass); }
small, .muted { color: var(--ink-2); }
.dim { color: var(--ink-3); }
code, .mono { font-family: var(--font-mono); font-size: .9em; }
hr { border: 0; border-top: 1px dashed var(--line-2); margin: 1.2rem 0; }
::selection { background: var(--ember); color: var(--accent-ink); }