/* Page FRAME for the prerendered wiki entity + hub pages (dev/prerender.mjs).
 *
 * Loaded LAST, after theme.css and after wiki-data/wiki-detail.css — which is index.html's inline
 * <style> extracted verbatim at build time. That sheet already supplies the entire detail
 * vocabulary the generated markup uses: `header`, `#gsearch`, `nav.tabs`, `.dhead`, `.dmeta`,
 * `.ic`, `h1`, `h2`, `.tag`, `.desc`, `.panel`, `.stat`/`.k`/`.v`, `.dstats`/`.ds`/`.dsk`/`.dsv`,
 * `.sbars`/`.sbar`, `.pill`, `.mcols`/`.mcol-side`, `.mth`, `.mrow`, `.pct`, `.badge`, `.hint`,
 * `table`/`th`/`td`.
 *
 * SO THIS FILE MUST NOT REDEFINE ANY OF THOSE. It used to: a hand-matched `.panel` that drew a
 * bordered card, and a `.dstats` grid of boxes, which is exactly why the static page read as a
 * different site next to the SPA (maintainer side-by-side, 2026-08-04). Loading last, every one of
 * those copies WON. What belongs here is only what the SPA has no equivalent for — the wrapper, the
 * breadcrumb, the hub index, the CTA, the footer, and the ad reservation.
 */

/* ---- page wrapper (index.html sizes #view itself; a static page has no such container) ---- */
.wrap{max-width:1160px;margin:0 auto;padding:18px 20px 90px}
#view{min-height:0}

/* ---- breadcrumb (SPA uses a `.back` link instead; a crawlable page wants the real trail) ---- */
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:var(--faint);margin:0 0 12px}
.crumbs a{color:var(--dim);font-weight:600}
.crumbs a:hover{color:var(--acc)}
.crumbs .sep{opacity:.55}

/* ---- the id alias under the H1 ('also known in game data as …') ---- */
.aka{display:block;font-family:var(--font-body);font-weight:500;font-size:12.5px;color:var(--faint);margin-top:3px}

/* ---- ad mount points ----
   ZERO CLS BY CONSTRUCTION. The box is reserved at FIRST PAINT — never injected into a painted
   page, never collapsed under a reader — so nothing ever moves:
     * reserved only under `html.sv-ads`, which the page adds synchronously in <head> when (and
       only when) a unit is actually coming (dev/prerender.mjs bakes the answer out of slots.js);
     * heights are SVSlots.sizeFor()'s own buckets plus the wrapper's 18px margins and 14.5px
       label — keep the two in step or the ad over/undershoots its box, which is #130 exactly
       (0.25 CLS on /simulator mobile from a unit escaping its reservation);
     * overflow:hidden makes the box a block formatting context, so the .svslot child's margins
       are contained rather than collapsing out and leaving the reservation short;
     * SVSlots mounts with pos:'in' — it FILLS this box instead of inserting a sibling next to it;
     * if the module never arrives (blocked), the page's own guard drops the reservation once the
       box is off screen.
   Still zero ad MARKUP in the generated HTML — this is an empty div with a height. */
#svSlotTop,#svSlotHub{margin:0;overflow:hidden}
html.sv-ads #svSlotTop,html.sv-ads #svSlotHub{min-height:141px}
@media(max-width:1100px){html.sv-ads #svSlotTop,html.sv-ads #svSlotHub{min-height:111px}}
@media(max-width:700px){html.sv-ads #svSlotTop,html.sv-ads #svSlotHub{min-height:151px}}

/* ---- hub header + A-Z index (no SPA equivalent: its list view is filters + a virtual grid) ----
   Vertical rhythm is set HERE, not by each block's own margins: the intro, the CTA box, the empty
   ad anchor and the jump row stack directly on top of each other, and mixed top/bottom margins left
   the CTA glued to the jump row while a 20px gap opened before the first letter. */
.hubintro{color:var(--dim);font-size:14px;margin:6px 0 14px;max-width:82ch}
.azjump{display:flex;flex-wrap:wrap;gap:5px;margin:18px 0 0}
.azjump a{padding:3px 9px;border:1px solid var(--line2);background:var(--panel2);border-radius:8px;font-family:var(--font-mono);font-size:12px;color:var(--dim)}
.azjump a:hover{border-color:var(--acc);color:var(--acc);text-decoration:none}
.azgroup{scroll-margin-top:112px}
.azgroup > h2{font-size:20px;margin:22px 0 10px}
.azgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:8px}
/* .card/.ic/.ci/.cn/.cm are the SPA's list tiles and come from wiki-detail.css; only the
   grid-cell sizing is ours, so a hub row and a wiki list row look like the same component. */
.azgrid .card{align-items:center;padding:9px 11px}
.azgrid .ic{width:38px;height:38px;font-size:13px}

/* ---- "open in the interactive wiki" call-to-action (the on-ramp off a lander) ---- */
.appcta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:14px 0;padding:12px 14px;border:1px dashed var(--line2);border-radius:12px;background:var(--panel2);font-size:13px;color:var(--dim)}
.appcta a{font-weight:700}

footer{max-width:1160px;margin:26px auto 44px;padding:16px 20px;border-top:1px solid var(--line);color:var(--faint);font-size:11.5px;line-height:1.6;text-align:center}
