/* PickleBoard legal pages — Terms, Acceptable Use, Cookies, Privacy.
   One shared layout so the four documents read as a set. Platform tokens,
   dark-first with a light override (the pb_theme bootstrap stamps data-theme). */
:root {
  --bg:#0a0d12; --panel:#12161e; --card:rgba(255,255,255,0.04); --fg:#f0f3f8;
  --muted:#9aa4b2; --line:rgba(255,255,255,0.12); --accent:#c8ff3a; --danger:#ff6b5a;
}
:root[data-theme="light"] {
  --bg:#f4f6fa; --panel:#ffffff; --card:rgba(0,0,0,0.03); --fg:#12161e;
  --muted:#5a6472; --line:rgba(0,0,0,0.12); --accent:#2c7a0f; --danger:#c0392b;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }
body {
  margin:0; background:var(--bg); color:var(--fg);
  font-family:var(--font-body, 'Space Grotesk', system-ui, sans-serif);
  -webkit-font-smoothing:antialiased; line-height:1.65;
}
a { color:var(--accent); text-underline-offset:2px; }
a:focus-visible, button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }

.lg-wrap { max-width:1120px; margin:0 auto; padding:28px 20px 80px; }
.lg-eyebrow {
  font-family:var(--font-mono, ui-monospace, monospace); font-size:11px; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--muted); margin:0;
}
.lg-head h1 {
  font-family:var(--font-display, 'Space Grotesk', system-ui, sans-serif); font-size:clamp(28px, 4vw, 38px); line-height:1.15;
  margin:6px 0 6px; text-wrap:balance;
}
.lg-meta { color:var(--muted); font-size:13px; margin:0; display:flex; flex-wrap:wrap; gap:6px 16px; }
.lg-meta span { font-variant-numeric:tabular-nums; }

/* The four documents as a segmented switcher. */
.lg-docs {
  display:flex; flex-wrap:wrap; gap:6px; margin:22px 0 28px; padding:4px;
  border:1px solid var(--line); border-radius:12px; width:fit-content; max-width:100%;
}
.lg-docs a {
  text-decoration:none; color:var(--muted); font-size:14px; font-weight:600;
  padding:7px 14px; border-radius:8px; white-space:nowrap;
}
.lg-docs a:hover { color:var(--fg); background:var(--card); }
.lg-docs a[aria-current="page"] {
  color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent);
}

.lg-body { display:grid; grid-template-columns:minmax(0, 1fr); gap:40px; }
@media (min-width: 960px) {
  .lg-body { grid-template-columns:230px minmax(0, 1fr); }
}
.lg-toc { display:none; }
@media (min-width: 960px) {
  .lg-toc { display:block; position:sticky; top:84px; align-self:start; max-height:calc(100vh - 110px); overflow:auto; }
}
.lg-toc p { margin:0 0 10px; }
.lg-toc ol { list-style:none; margin:0; padding:0; counter-reset:toc; }
.lg-toc li { margin:0; }
.lg-toc a {
  display:block; padding:5px 10px; font-size:13px; line-height:1.4; color:var(--muted);
  text-decoration:none; border-left:2px solid var(--line);
}
.lg-toc a { display:flex; gap:8px; }
.lg-toc a .n { flex:0 0 1.6em; font-variant-numeric:tabular-nums; opacity:0.7; }
.lg-toc a:hover { color:var(--fg); }
.lg-toc a.on { color:var(--accent); border-left-color:var(--accent); }

article.lg-doc { max-width:72ch; }
article.lg-doc h2 {
  font-family:var(--font-display, 'Space Grotesk', system-ui, sans-serif); font-size:21px; font-weight:700; line-height:1.3;
  margin:42px 0 10px; scroll-margin-top:84px; text-wrap:balance;
}
article.lg-doc h2 .n { color:var(--muted); font-variant-numeric:tabular-nums; margin-right:8px; font-weight:500; }
article.lg-doc h3 { font-size:16px; margin:24px 0 6px; scroll-margin-top:84px; }
article.lg-doc p, article.lg-doc li { font-size:15px; }
article.lg-doc ul, article.lg-doc ol { padding-left:22px; }
article.lg-doc li { margin-bottom:7px; }
article.lg-doc .muted { color:var(--muted); }
.lg-term { font-weight:700; }

/* "In short" — a plain-English summary that sits above the clauses. */
.lg-summary {
  border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin:0 0 8px;
  background:var(--card);
}
.lg-summary h2 { margin-top:0 !important; font-size:15px !important; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); font-family:var(--font-mono, ui-monospace, monospace) !important; }
.lg-summary ul { margin:0; }
.lg-summary p.note { margin:12px 0 0; font-size:13px; color:var(--muted); }

.lg-callout {
  border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:8px;
  padding:12px 16px; margin:16px 0; font-size:14px; color:var(--muted); background:var(--card);
}
.lg-callout strong { color:var(--fg); }
.lg-caps { text-transform:uppercase; font-size:13.5px !important; letter-spacing:0.01em; }

/* Data tables (cookie inventory, sub-processors). Scroll on their own at phone width. */
.lg-table-wrap { overflow-x:auto; margin:14px 0 20px; border:1px solid var(--line); border-radius:10px; }
table.lg-table { width:100%; border-collapse:collapse; font-size:13.5px; min-width:620px; }
table.lg-table th, table.lg-table td { text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line); }
table.lg-table tr:last-child td { border-bottom:none; }
table.lg-table th {
  font-family:var(--font-mono, ui-monospace, monospace); font-weight:500; font-size:11px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--muted); background:var(--card);
}
table.lg-table code {
  font-family:var(--font-mono, ui-monospace, monospace); font-size:12.5px;
  background:var(--card); border:1px solid var(--line); border-radius:4px; padding:1px 5px; white-space:nowrap;
}
.lg-pill {
  display:inline-block; font-size:11px; font-weight:700; letter-spacing:0.04em; padding:2px 8px; border-radius:999px;
  border:1px solid currentColor; white-space:nowrap;
}
.lg-pill.ess { color:var(--muted); }
.lg-pill.opt { color:var(--accent); }

/* Company details awaiting completion by the operator. */
.lg-todo {
  background:color-mix(in srgb, var(--accent) 14%, transparent);
  border:1px dashed color-mix(in srgb, var(--accent) 55%, transparent); border-radius:4px; padding:0 5px; font-weight:600;
}

/* Ghost buttons (platform design language). */
.lg-btn {
  appearance:none; font:inherit; font-size:14px; font-weight:600; cursor:pointer;
  padding:9px 16px; border-radius:9px; border:1px solid var(--line); background:transparent; color:var(--fg);
}
.lg-btn:hover { border-color:var(--accent); color:var(--accent); }
.lg-btn.primary { border-color:var(--accent); color:var(--accent); }
.lg-btn.primary:hover { background:color-mix(in srgb, var(--accent) 10%, transparent); }

.lg-foot {
  margin-top:56px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:13px;
  display:flex; flex-wrap:wrap; gap:8px 18px;
}
.lg-foot a { color:var(--muted); text-decoration:none; }
.lg-foot a:hover { color:var(--accent); }

@media print {
  .lg-toc, .lg-docs, #pb-relaynav, #pb-bottomnav, .pbc-banner { display:none !important; }
  body { background:#fff; color:#000; }
  .lg-body { display:block; }
}