/* legal.css — 8.1: shared style for /terms.html, /privacy.html,
   /cookies.html. Site palette, readable measure. The pages also render in
   EMBED mode (?embed=1) inside the signup modal's slide-out: the body class
   is set by a tiny inline script and the chrome disappears. */
* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --bg: #0a0e17; --panel: rgba(255,255,255,0.04); --line: rgba(118,255,3,0.22);
  --green: #76ff03; --green-soft: #b9f6ca; --gold: #ffd75e; --text: #cfd8dc; --dim: #78909c;
}
body {
  background:
    radial-gradient(1200px 500px at 70% -10%, rgba(118,255,3,0.06), transparent 60%),
    var(--bg);
  color: var(--text); font-family: 'Courier New', monospace; min-height: 100vh;
}
html { background: var(--bg); color-scheme: dark; scrollbar-width: thin; scrollbar-color: #1d2a3d var(--bg); }
/* Chrome/Edge AUTOFILL painted these boxes WHITE for a beat (the
   intermittent white flick on sign-in/sign-up — Ryan). color-scheme:dark
   tells the browser this is a dark page so its own widgets (autofill,
   pickers) render dark; the inset-shadow override is the belt-and-braces
   fix that forces our colours even when autofill styling applies. */
input:-webkit-autofill, input:-webkit-autofill:hover,
input:-webkit-autofill:focus, textarea:-webkit-autofill, select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #0a0e17 inset !important;
  -webkit-text-fill-color: #eee !important;
  caret-color: #eee;
  transition: background-color 600000s 0s, color 600000s 0s;
}

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #1d2a3d; border-radius: 5px; border: 2px solid var(--bg); }
.wrap { max-width: 820px; margin: 0 auto; padding: 0 20px; }
header {
  border-bottom: 1px solid rgba(255,255,255,0.07); background: rgba(10,14,23,0.8);
  position: sticky; top: 0; z-index: 10; backdrop-filter: blur(6px);
}
.header-inner { display: flex; align-items: center; gap: 18px; padding: 14px 0; max-width: 820px; margin: 0 auto; padding-left: 20px; padding-right: 20px; }
.logo { font-size: 20px; font-weight: bold; letter-spacing: 5px; color: var(--green);
  text-shadow: 0 0 18px rgba(118,255,3,0.45); text-decoration: none; white-space: nowrap; }
.logo .dot { color: var(--dim); } .logo .tm { font-size: 9px; color: var(--dim); }
nav { margin-left: auto; display: flex; gap: 16px; }
nav a { color: var(--dim); text-decoration: none; font-size: 11px; letter-spacing: 2px; }
nav a:hover { color: var(--green-soft); }
nav a.here { color: var(--gold); }

/* the DRAFT banner — comes off when the solicitor-approved v1.0 ships */
.draft-banner {
  margin: 22px 0 0; border: 1px dashed rgba(255,215,94,0.6); background: rgba(255,215,94,0.06);
  color: var(--gold); font-size: 11px; letter-spacing: 2px; padding: 10px 14px; text-align: center;
}
h1 { color: #fff; font-size: 22px; letter-spacing: 3px; margin: 26px 0 4px; }
.effective { color: var(--dim); font-size: 11px; letter-spacing: 1px; margin-bottom: 18px; }
h2 { color: var(--green-soft); font-size: 14px; letter-spacing: 2px; margin: 26px 0 8px; }
p, li { font-size: 13px; line-height: 1.75; margin-bottom: 10px; }
ul { margin: 0 0 10px 22px; }
b, strong { color: #e8f5e9; }
a { color: var(--green-soft); }
.placeholder { color: var(--gold); } /* bracketed values awaiting the real thing */
/* 8.2 (Ryan): the privacy email renders as an IMAGE so it can't be scraped
   by spam harvesters — never write the address as text in these pages */
.mailimg { height: 17px; vertical-align: text-bottom; }
table { width: 100%; border-collapse: collapse; font-size: 12px; margin: 10px 0 16px; }
th { text-align: left; color: var(--dim); font-size: 11px; letter-spacing: 1px; font-weight: normal;
  padding: 8px 10px; border-bottom: 1px solid rgba(255,255,255,0.12); }
td { padding: 8px 10px; border-bottom: 1px solid rgba(255,255,255,0.05); vertical-align: top; }
footer { margin: 44px 0 30px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.07);
  color: var(--dim); font-size: 11px; line-height: 1.8; }
footer a { color: var(--dim); } footer a:hover { color: var(--green-soft); }

/* EMBED mode: rendered inside the signup modal's slide-out box */
body.embed header, body.embed .draft-banner, body.embed footer { display: none; }
body.embed h1 { font-size: 15px; margin-top: 10px; }
body.embed .wrap { padding: 0 12px; }
body.embed p, body.embed li { font-size: 11px; }
body.embed h2 { font-size: 12px; }