/* ============================================================
   KRAWL legal / policy documents — shared style
   ============================================================ */
:root {
  --bg: #0B0C10; --panel: #15171F; --line: #2A2D38; --line-2:#3A3E4C;
  --gold: #C9A24B; --gold-2: #E9C877; --ember: #E4622E;
  --ink: #ECE6D8; --body: #C2BEB2; --dim: #8A8578;
  --serif: "Cinzel", Georgia, serif;
  --sans: "Inter", system-ui, -apple-system, sans-serif;
  --mono: "Space Mono", ui-monospace, Menlo, monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--bg); color: var(--body);
  font-family: var(--sans); font-size: 16.5px; line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--gold-2); text-underline-offset: 3px; }
a:hover { color: var(--gold); }
::selection { background: rgba(228,98,46,.32); color:#fff; }
a:focus-visible { outline: 2px solid var(--gold-2); outline-offset: 3px; }

.topbar {
  border-bottom: 1px solid var(--line);
  background: rgba(8,9,12,.85); backdrop-filter: blur(6px);
  position: sticky; top: 0; z-index: 10;
}
.topbar__in {
  width: min(100% - 44px, 820px); margin-inline: auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0;
}
.topbar a.home { display: flex; align-items: center; gap: 11px; color: var(--ink); font-family: var(--serif); letter-spacing: .2em; font-size: 17px; text-decoration: none; }
.topbar a.home img { width: 30px; height: 30px; border-radius: 7px; }
.topbar nav { display: flex; gap: 20px; }
.topbar nav a { font-size: 13.5px; color: var(--body); text-decoration: none; }
.topbar nav a:hover { color: var(--gold-2); }
@media (max-width: 620px){ .topbar nav { display: none; } }

.doc { width: min(100% - 44px, 820px); margin: 0 auto; padding: 56px 0 90px; }

.doc__eyebrow { font-family: var(--mono); font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold); margin: 0 0 14px; }
.doc h1 { font-family: var(--serif); font-weight: 700; color: var(--ink); font-size: clamp(30px, 6vw, 46px); line-height: 1.1; margin: 0 0 12px; }
.doc__meta { font-family: var(--mono); font-size: 12.5px; color: var(--dim); margin: 0 0 10px; }
.doc__intro { font-size: 18px; color: var(--body); border-left: 2px solid var(--ember); padding-left: 18px; margin: 26px 0 40px; }

.doc h2 { font-family: var(--serif); color: var(--gold-2); font-size: clamp(21px, 3.6vw, 27px); margin: 46px 0 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.doc h3 { font-family: var(--sans); color: var(--ink); font-size: 17px; font-weight: 600; margin: 26px 0 8px; }
.doc p { margin: 0 0 16px; }
.doc ul, .doc ol { margin: 0 0 18px; padding-left: 22px; }
.doc li { margin: 0 0 9px; }
.doc strong { color: var(--ink); }
.doc a { text-decoration: underline; }

.callout {
  background: linear-gradient(180deg, #191b16, #14150f);
  border: 1px solid var(--line-2); border-left: 3px solid var(--gold);
  border-radius: 10px; padding: 20px 22px; margin: 26px 0;
}
.callout p:last-child { margin-bottom: 0; }

/* number/data callout for odds */
.big-odds {
  display: flex; align-items: center; gap: 22px; flex-wrap: wrap;
  background: radial-gradient(600px 200px at 20% 0%, #1a1712, transparent), var(--panel);
  border: 1px solid var(--line-2); border-radius: 14px; padding: 26px 28px; margin: 30px 0;
}
.big-odds b { font-family: var(--mono); font-size: clamp(40px, 9vw, 64px); color: var(--gold-2); line-height: 1; }
.big-odds span { font-size: 16px; color: var(--body); max-width: 42ch; }

table { width: 100%; border-collapse: collapse; margin: 22px 0 26px; font-size: 15px; }
caption { text-align: left; font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); padding-bottom: 10px; }
th, td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); }
thead th { font-family: var(--mono); font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); border-bottom-color: var(--line-2); }
td.num { font-family: var(--mono); color: var(--ink); text-align: right; white-space: nowrap; }
tbody tr:hover { background: rgba(201,162,75,.05); }
.table-scroll { overflow-x: auto; }

.footnote { margin-top: 60px; padding-top: 24px; border-top: 1px solid var(--line); font-size: 13.5px; color: var(--dim); }
.footnote a { color: var(--dim); }

.docfoot { border-top: 1px solid var(--line); background:#08090c; padding: 30px 0; }
.docfoot__in { width: min(100% - 44px, 820px); margin-inline: auto; display:flex; gap: 22px; flex-wrap: wrap; justify-content: space-between; font-size: 13px; color: var(--dim); }
.docfoot a { color: var(--dim); text-decoration: none; }
.docfoot a:hover { color: var(--gold-2); }
