/* Self-hosted fonts (Google Fonts mirror, latin + latin-ext, OFL). */
/* latin-ext */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-500-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-500-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-600-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-600-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 450;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 450;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/newsreader-italic-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/newsreader-italic-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* Mew World Order — strategy report site.
   One stylesheet for every page. Tokens first, then shared furniture. */
:root{
  color-scheme:light dark;
  --paper:#f4f6f7; --surface:#fff; --surface-2:#eceff1;
  --ink:#151b21; --ink-2:#4e5a66; --ink-3:#7b8894;
  --line:#d8dee3; --line-2:#e8ecef;
  --accent:#1d4e6f; --accent-2:#2a6d97; --accent-wash:#e6eef4;
  --ok:#2f6b46; --ok-wash:#e2efe7;
  --warn:#8a6520; --warn-wash:#f5ecd9;
  --bad:#9c3d3d; --bad-wash:#f4e3e3;
  --neutral:#5c6873; --neutral-wash:#e9edf0;
  --f-display:"Newsreader",Georgia,"Times New Roman",serif;
  --f-body:"IBM Plex Sans",ui-sans-serif,system-ui,-apple-system,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --warm:#8a6520; --warm-wash:#f5ecd9;
  --edit-hint:#b9c6cf; --edit-focus:#f0f6fa;
  --rail:264px;
  --measure:34rem;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#10151a; --surface:#171d24; --surface-2:#1e262e;
    --ink:#e4eaef; --ink-2:#a3b0bb; --ink-3:#79868f;
    --line:#2b343d; --line-2:#222b33;
    --accent:#7fb3d5; --accent-2:#a3cbe4; --accent-wash:#1a2a36;
    --ok:#6fba8c; --ok-wash:#17281f;
    --warn:#d3a85e; --warn-wash:#2b2416;
    --bad:#e08585; --bad-wash:#2e1c1c;
    --neutral:#93a0ab; --neutral-wash:#212a32;
    --warm:#d3a85e; --warm-wash:#2b2416;
    --edit-hint:#3a4650; --edit-focus:#1b242c;
  }
}
:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark}
:root[data-theme="dark"]{
  --paper:#10151a; --surface:#171d24; --surface-2:#1e262e;
  --ink:#e4eaef; --ink-2:#a3b0bb; --ink-3:#79868f;
  --line:#2b343d; --line-2:#222b33;
  --accent:#7fb3d5; --accent-2:#a3cbe4; --accent-wash:#1a2a36;
  --ok:#6fba8c; --ok-wash:#17281f;
  --warn:#d3a85e; --warn-wash:#2b2416;
  --bad:#e08585; --bad-wash:#2e1c1c;
  --neutral:#93a0ab; --neutral-wash:#212a32;
  --warm:#d3a85e; --warm-wash:#2b2416;
  --edit-hint:#3a4650; --edit-focus:#1b242c;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
     font-family:var(--f-body);font-size:16.5px;line-height:1.65;
     -webkit-font-smoothing:antialiased}

/* ---- site navigation, shared by every page ---- */
.sitenav{position:sticky;top:0;z-index:20;background:var(--surface);
         border-bottom:1px solid var(--line);padding:0 20px}
.sitenav-in{max-width:78rem;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;
            align-items:baseline;column-gap:22px;min-height:46px}
/* Brand at the far left, the tabs centred on the page, the tagline at the
   far right. The two 1fr columns are what keeps the tabs centred whether or
   not the tagline is showing. */
.sitenav .brand{grid-column:1;grid-row:1;justify-self:start}
.sitenav .tabs{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;justify-content:center;gap:0 22px}
/* The tagline precedes the tabs in the markup; pinning every row keeps
   auto-placement from dropping the tabs to a second line. */
.sitenav .tagline{grid-column:3;grid-row:1;justify-self:end;text-align:right}
.sitenav .brand{font-family:var(--f-display);font-weight:600;font-size:17px;
                margin-right:8px;white-space:nowrap;color:var(--ink);
                text-transform:none;letter-spacing:0;text-decoration:none}
.sitenav a.brand:hover{color:var(--ink)}
.sitenav .tagline{font-family:var(--f-body);font-size:10.5px;letter-spacing:0;
                  text-transform:none;color:var(--ink-3);white-space:nowrap;
                  margin-left:-14px;padding-left:14px;border-left:1px solid var(--line)}
/* The nav links come first: below this width the tagline would push them onto
   a second row, so it steps aside instead. */
@media (max-width:1060px){.sitenav .tagline{display:none}}
.sitenav a{font-family:var(--f-body);font-size:13px;letter-spacing:0;
           text-transform:none;color:var(--ink-2);text-decoration:none;
           padding:13px 0;border-bottom:2px solid transparent}
.sitenav a:hover{color:var(--ink)}
.sitenav a[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent)}
.sitenav a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* A tab that is ours to use and not part of the entry: it links the local
   table, which the published site does not carry, and `stage_site.py` strips
   every link marked this way when it copies the site for upload. */
.sitenav a[data-local] .beta{margin-left:5px;padding:1px 4px;border-radius:3px;
                             background:var(--accent);color:var(--paper);
                             font-size:8.5px;letter-spacing:.08em;vertical-align:1px}

/* ---- shared furniture ---- */
.wrap{max-width:78rem;margin:0 auto;padding:34px 20px 96px}
.mono{font-family:var(--f-mono);font-size:.88em;font-variant-numeric:tabular-nums}
/* Figures sit directly in the page; the artwork supplies its own framing. */
figure{margin:26px 0;background:transparent;border:0;
       border-radius:0;padding:0;overflow-x:auto}
figure svg{max-width:100%;height:auto;display:block}
figcaption{font-size:.87rem;line-height:1.55;color:var(--ink-2);margin-top:14px;
           padding-top:11px;border-top:1px solid var(--line-2)}
figcaption b{color:var(--ink);font-weight:600}
table{border-collapse:collapse;width:100%;font-size:.88rem}
th,td{text-align:left;padding:8px 11px;border-bottom:1px solid var(--line-2);vertical-align:top}
th{font-family:var(--f-body);font-size:.68rem;letter-spacing:0;text-transform:none;
   color:var(--ink-3);background:var(--surface-2)}
td.num,th.num{text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums}

/* A table narrower than its content pushes the whole document sideways, and
   a page that scrolls horizontally is broken in a way that is obvious on a
   phone and invisible on the desk it was written at. Below the width where
   the columns still fit, the table scrolls inside itself instead: `display:
   block` is what lets a table have its own overflow at all. Desktop layout
   is untouched, which is why this is inside a query rather than applied
   unconditionally. */
@media (max-width:820px){
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  table td,table th{white-space:nowrap}
}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:5px;margin:16px 0}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- navigation between pages ---- */
/* These are separate documents, so moving between them is a real page load and
   the browser paints white in the gap. A cross-document view transition covers
   that gap with a short crossfade; where it is unsupported the navigation is
   simply what it was before, so nothing here needs a fallback. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.18s}
/* The nav does not change between pages, so hold it still while the rest
   crossfades -- otherwise the one fixed thing on screen flickers too. */
.sitenav{view-transition-name:sitenav}
@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){
    animation:none!important}
}

/* ---- base typography, shared by every page ---- */
h1,h2,h3,h4{font-family:var(--f-display);font-weight:600;letter-spacing:-.012em;
            text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(1.9rem,4vw,2.6rem);line-height:1.14;margin:20px 0 12px}
h2{font-size:1.42rem;line-height:1.25;margin:38px 0 10px}
h3{font-size:1.08rem;line-height:1.3;margin:26px 0 8px}
code,kbd,samp,pre,.mono{font-family:var(--f-mono)}
/* Lists sit inside running prose, so they take the paragraph's measure and
   rhythm rather than the browser's defaults. The marker hangs outside the text
   column (`list-style-position` stays outside, and the padding is what the
   marker occupies) so the wrapped second line of an item aligns under the
   first, not under the bullet. */
ul{margin:14px 0;padding-left:1.15rem}
li{margin:7px 0;padding-left:.15rem}
li::marker{color:var(--ink-3)}
/* A displayed formula inside running prose: set in the mono face, centred,
   with the paragraph's own vertical rhythm. */
p.formula{text-align:center;margin:12px 0 16px;color:var(--ink)}
p.formula math{font-size:1.1em}
/* Browsers without MathML layout (none current, but the fallback is free) show
   the plain form the writeup uses. */
p.formula math:not(:defined)::before{content:attr(data-plain)}
a{color:var(--accent)}
a:focus-visible,button:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* The decision-graph page is a vendored Vite build whose <body> carries
   min-width:900px, so on anything narrower the entire document scrolls
   sideways -- nav, prose and all -- rather than the graph doing it. The graph
   genuinely needs the width; the page around it does not. Release the body
   and let the wide parts scroll inside their own panels.
   The `html` prefix is not decoration. The vendored rule is written
   `body,body.seat-one-view{min-width:900px}` -- already at the specificity a
   plain `body.seat-one-view` override would reach -- and its stylesheet is
   inlined *after* this file, so an equal-specificity rule loses on source
   order. `html body.seat-one-view` is one step higher and wins without
   reaching for !important. */
@media (max-width:900px){
  html body.seat-one-view{min-width:0}
  html body.seat-one-view .page{max-width:100%}
  html body.seat-one-view .panel,
  html body.seat-one-view .board,
  html body.seat-one-view .controls{overflow-x:auto}
}

/* The nav is sticky, so anything scrolled to the very top of the viewport
   sits under it -- an in-page anchor lands with its heading hidden, and a
   figure scrolled into view loses its top row of labels. scroll-padding
   reserves the nav's height for every scroll the browser performs itself.
   Only on the scrollport: a scroll-margin on the headings as well would add
   to it, and a heading clicked in the contents rail landed a paragraph's
   worth below the nav, with the previous section's last line showing. */
html{scroll-padding-top:58px;overscroll-behavior-y:none}

/* ---- showcase pages: the tabs beside the essay ----
   The essay carries the argument; every other tab is a wall of figures and
   large numbers with as few words as will label them. These rules are shared
   so the tabs read as one surface: a short masthead, stat tiles, and a
   gallery of figures that fill the width in one or two columns. */
.show{max-width:78rem;margin:0 auto;padding:40px 24px 96px}
.show h1{font-family:var(--f-display);font-weight:500;letter-spacing:-.014em;
         font-size:clamp(2.2rem,5vw,3.4rem);line-height:1.08;margin:0 0 10px;
         text-wrap:balance}
.show .stand{font-family:var(--f-display);font-size:1.22rem;line-height:1.45;
             color:var(--ink-2);max-width:60ch;margin:0 0 26px;text-wrap:pretty}
.show h2{font-family:var(--f-body);font-weight:600;font-size:1.05rem;letter-spacing:0;
         text-transform:none;color:var(--ink-3);margin:56px 0 14px;
         padding-top:16px;border-top:1px solid var(--line);text-wrap:balance}
.show h2:first-of-type{margin-top:34px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:22px 0}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px 22px 17px}
.stat .n{font-family:var(--f-display);font-size:clamp(2.1rem,3.6vw,2.9rem);line-height:1;
         font-variant-numeric:tabular-nums;margin:0 0 9px;color:var(--ink);letter-spacing:-.01em}
.stat .n.ok{color:var(--ok)} .stat .n.accent{color:var(--accent)} .stat .n.warm{color:var(--warm)}
.stat .l{font-family:var(--f-body);font-size:.68rem;letter-spacing:0;text-transform:none;
         color:var(--ink-3);line-height:1.45}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,31rem),1fr));
         gap:18px;margin:16px 0;align-items:start}
.show .gallery>figure,.show .gallery>.figwrap>figure{margin:0;max-width:none;height:100%}
.show .gallery>.figwrap{display:contents}
.show figure>svg,.show figure svg:first-child{width:100%;max-width:100%;height:auto;display:block}
/* A wrapper is display:contents so the figure itself is the grid item; the
   wide modifier therefore has to reach the figure, not the wrapper. */
.show .wide,.show .figwrap.wide>figure{grid-column:1/-1}
.show .figwrap.wide>figure>svg,.show figure.wide>svg{max-width:62rem;margin:0 auto}
.show figcaption{font-size:.86rem;line-height:1.5;color:var(--ink-2);margin-top:14px;
                 padding-top:11px;border-top:1px solid var(--line-2)}
.show .fine{font-family:var(--f-mono);font-size:.74rem;line-height:1.6;color:var(--ink-3);
            margin:18px 0 0;max-width:none}
.show .fine code{font-size:1em}
.show .fine a,.show figcaption a{color:inherit}
/* Buttons that open a game or a table in the Analyzer's frame. */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin:14px 0}
.tile{text-align:left;font:inherit;background:var(--surface);color:var(--ink);
      border:1px solid var(--line);border-radius:10px;padding:14px 16px 13px;cursor:pointer;
      display:flex;flex-direction:column;gap:5px;text-decoration:none;
      transition:border-color .15s ease}
.tile:hover,.tile:focus-visible{border-color:var(--accent-2)}
.tile.on{border-color:var(--accent);background:var(--accent-wash)}
.tile .t{font-family:var(--f-display);font-size:1.12rem;line-height:1.25}
.tile .s{color:var(--ink-2);font-size:.84rem;line-height:1.4}
.tile .m{font-family:var(--f-body);font-size:.68rem;letter-spacing:0;text-transform:none;
         color:var(--ink-3);margin-top:3px}
.tile.live .t{color:var(--accent)}
/* The numbered report exports carry their shared typography and caption in SVG. */
.report-figure{margin:28px 0;max-width:none}
.report-figure a{display:block}
.report-figure img{display:block;width:100%;height:auto;background:#fff}
[data-legacy-figure][hidden]{display:none!important}
/* Keep supporting experiments available without interrupting the report. */
.supporting-evidence{margin:32px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0}
.supporting-evidence>summary{cursor:pointer;font-size:1rem;font-weight:600;color:var(--ink-2);line-height:1.5}
.supporting-evidence>summary:hover{color:var(--accent)}
.supporting-evidence>summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.supporting-evidence[open]>summary{margin-bottom:20px}