/* Knesset Knock-Out! text pages: same palette and type as the game, set for long reading. */
:root{
  padding-top:env(safe-area-inset-top, 0px);
  padding-bottom:env(safe-area-inset-bottom, 0px);
  color-scheme:light;
  --ground:#E8ECF2; --surface:#FBFCFE; --ink:#11151F; --muted:#556074; --line:#CAD2DE;
  --gold:#8F6608; --gold-hi:#D29D22;
  --display:"Karantina","Impact","Haettenschweiler","Arial Narrow Bold",sans-serif;
  --body:"Rubik",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{ --ground:#0D1118; --surface:#161B25; --ink:#ECEFF4; --muted:#98A2B5; --line:#2A3242; --gold:#E9BB4C; --gold-hi:#E9BB4C; color-scheme:dark }
}
*,*::before,*::after{ box-sizing:border-box }
html{ -webkit-text-size-adjust:100% }
body{ margin:0; background:var(--ground); color:var(--ink); font:400 17px/1.65 var(--body); -webkit-font-smoothing:antialiased }
a{ color:inherit; text-decoration-color:var(--gold-hi); text-underline-offset:3px }
:focus-visible{ outline:2px solid var(--gold-hi); outline-offset:2px }

.wrap{ max-width:760px; margin:0 auto; padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)) }

.topbar{ border-bottom:2px solid var(--ink) }
.topbar .wrap{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 20px; padding-block:14px }
.brand{ font-family:var(--display); font-weight:700; font-size:34px; line-height:.9; text-transform:uppercase; text-decoration:none; letter-spacing:.01em }
.brand em{ font-style:normal; color:var(--gold-hi) }
.topnav{ display:flex; flex-wrap:wrap; gap:2px 18px; font-size:14px; font-weight:600 }
.topnav a{ text-decoration:none; padding:6px 0; border-bottom:2px solid transparent }
.topnav a:hover{ border-bottom-color:var(--line) }
.topnav a[aria-current="page"]{ border-bottom-color:var(--gold-hi) }

.prose{ padding-block:32px 48px }
.prose h1{ margin:0 0 14px; font-family:var(--display); font-weight:700; font-size:clamp(54px, 13vw, 92px); line-height:.84; text-transform:uppercase; text-wrap:balance }
.lede{ margin:0 0 8px; max-width:60ch; font-size:19px; line-height:1.55; color:var(--muted) }
.updated{ margin:0 0 28px; font-size:13px; color:var(--muted) }
.prose h2{ margin:38px 0 8px; font-size:21px; line-height:1.3; font-weight:600; text-wrap:balance }
.prose p, .prose li{ max-width:65ch }
.prose p{ margin:0 0 14px }
.prose ul{ margin:0 0 14px; padding-left:1.2em }
.prose li{ margin-bottom:6px }
.prose strong{ font-weight:600 }

.numbers{ display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:10px; margin:24px 0 8px }
.numbers div{ padding:14px; border:1px solid var(--line); border-radius:8px; background:var(--surface) }
.numbers b{ display:block; font-family:var(--display); font-weight:700; font-size:44px; line-height:.9; font-variant-numeric:tabular-nums }
.numbers span{ display:block; margin-top:6px; font-size:13.5px; line-height:1.4; color:var(--muted) }

.example{ margin:18px 0 22px; padding:16px 18px; border:1px solid var(--line); border-radius:8px; background:var(--surface) }
.example h3{ margin:0 0 10px; font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--muted) }
.example dl{ margin:0; display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:6px 16px }
.example dt{ color:var(--muted); font-size:15px }
.example dd{ margin:0; text-align:right; font-weight:600; font-variant-numeric:tabular-nums }
.example dd.total{ font-family:var(--display); font-weight:700; font-size:30px; line-height:1; color:var(--gold) }
.example p{ margin:12px 0 0; font-size:13.5px; color:var(--muted) }

.cta{ display:inline-flex; align-items:center; gap:8px; margin-top:12px; padding:12px 20px; border-radius:999px; background:var(--ink); color:var(--surface); font-weight:600; font-size:15px; text-decoration:none }
.cta:hover{ opacity:.9 }

.sources{ margin-top:40px; padding-top:16px; border-top:1px solid var(--line); font-size:14px; color:var(--muted) }
.sources h2{ margin:0 0 8px; font-size:14px; letter-spacing:.12em; text-transform:uppercase }
.sources ul{ padding-left:1.1em }

.pagefoot{ border-top:1px solid var(--line) }
.pagefoot .wrap{ display:flex; flex-wrap:wrap; gap:6px 20px; padding-block:20px 40px; font-size:14px; color:var(--muted) }
