/* Shared styling for the legal + attribution pages.
   Same tokens as the landing page; reading-optimized measure. */
:root{
  --surface:#f7f5ef;
  --surface-dim:#edeae0;
  --ink:#25261f;
  --ink-soft:#6d6a5c;
  --line:#dcd8c9;
  --brand:#22251c;
  --on-brand:#ffffff;
  --on-brand-soft:#d9d6c6;
  --accent:#d9a441;
}
@media (prefers-color-scheme: dark){
  :root{
    --surface:#15160f;
    --surface-dim:#1e1f16;
    --ink:#e7e4d8;
    --ink-soft:#a3a08d;
    --line:#313226;
    --brand:#1b1c13;
  }
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:'Source Sans 3','Source Sans Pro',system-ui,sans-serif;
  background:var(--surface);
  color:var(--ink);
  line-height:1.6;
  font-size:16px;
}
.page{max-width:760px;margin:0 auto;padding:0 24px 64px}

header{background:var(--brand);color:var(--on-brand);margin:0 -24px 40px;padding:26px 24px 30px}
header .inner{max-width:760px;margin:0 auto}
.masthead{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  font-size:13px;color:var(--on-brand-soft);
  border-bottom:1px solid rgba(255,255,255,.18);
  padding-bottom:12px;margin-bottom:20px;
}
.masthead a{color:var(--on-brand-soft);text-decoration:none}
.masthead a:hover,.masthead a:focus-visible{color:var(--accent)}
.masthead .kw{color:var(--accent);font-weight:700;font-size:16px}
h1{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:700;font-size:40px;line-height:1;
  text-transform:uppercase;letter-spacing:.01em;
}
.updated{margin-top:10px;font-size:14px;color:var(--on-brand-soft)}

h2{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:700;font-size:21px;letter-spacing:.05em;text-transform:uppercase;
  margin:34px 0 10px;padding-bottom:6px;border-bottom:2px solid var(--ink);
}
h3{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:600;font-size:17px;letter-spacing:.04em;text-transform:uppercase;
  margin:22px 0 4px;
}
p{margin:12px 0}
ul{margin:12px 0 12px 20px}
li{margin:6px 0}
a{color:inherit}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
strong{font-weight:700}
.lede{font-size:17px;color:var(--ink-soft)}
.note{
  margin:16px 0;padding:12px 16px;
  background:var(--surface-dim);border-left:3px solid var(--accent);
  font-size:15px;
}

table{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px}
th,td{text-align:left;padding:8px 10px 8px 0;border-bottom:1px solid var(--line);vertical-align:top}
th{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  text-transform:uppercase;letter-spacing:.06em;font-size:14px;
}

footer{
  margin-top:48px;padding-top:18px;border-top:1px solid var(--line);
  font-size:14px;color:var(--ink-soft);
  display:flex;gap:10px;flex-wrap:wrap;justify-content:space-between;
}
footer .kw{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase;
}

@media(max-width:600px){
  h1{font-size:32px}
  .page{padding:0 18px 48px}
  header{margin:0 -18px 32px;padding:22px 18px 26px}
}
@media print{
  body{background:#fff;color:#000}
  header{background:#fff;color:#000;border-bottom:3px solid #000}
  .masthead,.masthead a,.updated{color:#444}
  .masthead .kw{color:#000}
  h1{color:#000}
}