/* hide the original page's leftover breadcrumbs (my mini-nav now carries them) */
.wl-dossier .crumbs-anchor,.wl-dossier .idbar-crumbs{display:none !important}
/* remove the bottom-left match floater (.reel) per request */
.wl-dossier .reel{display:none !important}
/* mini-nav row: full-bleed + TRANSPARENT; only the centered plate is opaque; right side kept clear for the rail */
.idn{position:sticky;top:104px;z-index:48;background:transparent;pointer-events:none}
@media(max-width:1199px){.idn{top:0}}
/* full-bleed row so breadcrumbs sit at the far-left gutter (aligned with the mega-nav), plate still centers */
.idn-in{width:100%;padding:8px clamp(14px,2.4vw,26px);display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);align-items:center;gap:16px}
.idn *{pointer-events:auto}

/* LEFT — breadcrumbs: far left, transparent, and NOT locked — they scroll away (hide) once you scroll */
.idn-crumbs{display:flex;align-items:center;gap:7px;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;justify-self:start;padding-left:2px;transition:opacity .18s ease,transform .18s ease}
.idn.scrolled .idn-crumbs{opacity:0;transform:translateY(-8px);pointer-events:none}
.idn-crumbs a{color:#9aa0a8;text-decoration:none}
.idn-crumbs a:hover{color:#d4af37}
.idn-crumbs .sep{color:#3a3d45}
.idn-crumbs .cur{color:#cfd2d8}

/* CENTER — the opaque nameplate plate (variant A treatment) */
/* --- luxurious condense: one refined expo-out curve across every property --- */
.idn-plate{justify-self:center;display:flex;align-items:center;gap:11px;background:linear-gradient(180deg,#111319,#0b0c10);border:1px solid rgba(212,175,55,.28);border-radius:13px;padding:9px 16px;box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.03);transition:padding .55s cubic-bezier(.16,1,.3,1),gap .55s cubic-bezier(.16,1,.3,1),box-shadow .6s cubic-bezier(.16,1,.3,1),border-color .6s ease,border-radius .55s cubic-bezier(.16,1,.3,1),background .6s ease;will-change:padding,box-shadow}
.idn.condensed .idn-plate{padding:6px 15px;gap:9px;border-radius:11px;border-color:rgba(212,175,55,.5);background:linear-gradient(180deg,#0f1116,#090a0d);box-shadow:0 16px 44px rgba(0,0,0,.62),0 0 0 1px rgba(212,175,55,.06),inset 0 1px 0 rgba(255,255,255,.05)}
.idn-eye{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:10px;letter-spacing:.17em;color:#d4af37;overflow:hidden;white-space:nowrap;max-width:120px;transition:max-width .55s cubic-bezier(.16,1,.3,1),opacity .3s ease,margin .55s cubic-bezier(.16,1,.3,1)}
.idn.condensed .idn-eye{max-width:0;opacity:0;margin-right:-11px}
.idn-name{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:20px;letter-spacing:.01em;color:#ececec;line-height:1;transition:font-size .55s cubic-bezier(.16,1,.3,1),letter-spacing .55s cubic-bezier(.16,1,.3,1),color .5s ease}
.idn.condensed .idn-name{font-size:17px;letter-spacing:.03em;color:#f4f5f7}
.idn-dia{color:#f2cc4b;font-size:11px;margin-left:-4px;filter:drop-shadow(0 0 5px rgba(242,204,75,.5));transition:filter .5s ease,transform .55s cubic-bezier(.16,1,.3,1)}
.idn.condensed .idn-dia{filter:drop-shadow(0 0 9px rgba(242,204,75,.85))}
.idn-vitals{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.02em;color:#8a8f98;white-space:nowrap;overflow:hidden;max-width:520px;transition:max-width .6s cubic-bezier(.16,1,.3,1),opacity .34s ease,margin .6s cubic-bezier(.16,1,.3,1),filter .5s ease}
.idn-vitals i{color:#3a3d45;font-style:normal;margin:0 3px}
.idn-vitals b{color:#f2cc4b;font-weight:400}
.idn.condensed .idn-vitals{max-width:0;opacity:0;margin-left:-11px;filter:blur(2px)}
.idn-sep{width:1px;height:18px;background:rgba(212,175,55,.25)}
.idn-soc{display:flex;gap:5px}
.idn-soc a{width:32px;height:32px;display:grid;place-items:center;color:#ffffff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:8px;transition:.14s}
.idn-soc svg{width:17px;height:17px;fill:currentColor}   /* paths had no fill -> defaulted to black (the "too dark") */
.idn-soc a:hover{color:#0b0c10;background:#f2cc4b;border-color:#f2cc4b;transform:translateY(-1px)}
.idn-support{background:none;border:1px solid rgba(212,175,55,.4);color:#ececec;font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:11px;letter-spacing:.07em;padding:6px 11px;border-radius:8px;cursor:pointer;transition:.14s;display:flex;align-items:center;gap:6px}
.idn-support:hover{border-color:#f2cc4b;background:rgba(242,204,75,.06)}
.idn-support .chev{color:#d4af37;font-size:.8em;transition:transform .18s ease}
.idn-support[aria-expanded="true"] .chev{transform:rotate(180deg)}
/* dropdown anchored directly UNDER the Support button, right-aligned */
.idn-supwrap{position:relative;display:flex}
.idn-panel{position:absolute;top:calc(100% + 9px);right:0;width:340px;max-width:calc(100vw - 32px);background:#13151c;border:1px solid rgba(212,175,55,.32);border-radius:14px;padding:9px;display:none;flex-direction:column;gap:1px;box-shadow:0 22px 52px rgba(0,0,0,.62);z-index:20}
.idn-panel:before{content:"";position:absolute;top:-6px;right:20px;width:11px;height:11px;background:#13151c;border-left:1px solid rgba(212,175,55,.32);border-top:1px solid rgba(212,175,55,.32);transform:rotate(45deg)}
.idn-panel.open{display:flex}
.sp-head{display:flex;flex-direction:column;gap:2px;padding:6px 10px 10px;margin-bottom:4px;border-bottom:1px solid rgba(255,255,255,.08)}
.sp-k{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:12.5px;letter-spacing:.09em;color:#f4f5f7;font-weight:600}
.sp-note{font-family:'JetBrains Mono',monospace;font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#8a8f98}
.sp-item{display:flex;align-items:center;gap:11px;padding:8px 9px;border-radius:10px;text-decoration:none;transition:background .13s ease}
.sp-item:hover{background:rgba(212,175,55,.09)}
.sp-ic{width:33px;height:33px;flex:none;display:grid;place-items:center;border-radius:8px;background:linear-gradient(135deg,rgba(212,175,55,.24),rgba(212,175,55,.05));border:1px solid rgba(212,175,55,.34);color:#f2cc4b;font-family:'Anton',sans-serif;font-size:12px;letter-spacing:.02em}
.sp-txt{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.sp-txt b{color:#f2f3f5;font-size:13px;font-weight:600;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-txt span{color:#8a8f98;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-tag{flex:none;font-family:'JetBrains Mono',monospace;font-size:8.5px;text-transform:uppercase;letter-spacing:.07em;color:#a7abb2;border:1px solid rgba(255,255,255,.15);border-radius:6px;padding:3px 7px}
.sp-item:hover .sp-tag{border-color:rgba(212,175,55,.4);color:#f2cc4b}
.sp-charity{margin-top:3px;border-top:1px solid rgba(255,255,255,.06);padding-top:11px}
.sp-charity .sp-ic{background:linear-gradient(135deg,rgba(225,29,42,.24),rgba(225,29,42,.05));border-color:rgba(225,29,42,.38);color:#ff6b73}
.sp-charity .sp-tag{color:#ff6b73;border-color:rgba(225,29,42,.4)}
.sp-charity:hover{background:rgba(225,29,42,.09)}
.sp-charity:hover .sp-tag{color:#ff8a90;border-color:rgba(225,29,42,.55)}

/* RIGHT — kept empty so the sticky right rail owns this column */
.idn-rightspace{justify-self:end}

@media(max-width:1080px){.idn-vitals{display:none}}
@media(max-width:820px){.idn-in{grid-template-columns:1fr auto 1fr}.idn-crumbs{display:none}.idn-soc,.idn-sep{display:none}}
@media(max-width:600px){.idn-name{font-size:16px}.idn-in{grid-template-columns:1fr}.idn-rightspace{display:none}.idn-plate{justify-self:center}}


.wl-dossier .sec-lead{font-family:'Inter',system-ui,sans-serif;color:rgba(244,245,247,.62);font-size:15px;line-height:1.55;max-width:74ch;margin:-4px 0 22px}
/* FACTIONS */
.wl-dossier .fac-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:14px}
.wl-dossier .fac-card{position:relative;background:linear-gradient(180deg,#14161d,#0f1116);border:1px solid rgba(255,255,255,.07);border-left:2px solid #d4af37;border-radius:12px;padding:16px 18px;min-width:0;transition:border-color .16s,transform .16s}
.wl-dossier .fac-card:hover{border-left-color:#f2cc4b;transform:translateY(-2px)}
.wl-dossier .fac-era{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#d4af37}
.wl-dossier .fac-name{font-family:'Anton',sans-serif;text-transform:uppercase;letter-spacing:.01em;font-size:22px;color:#f4f5f7;margin:6px 0 6px;line-height:1.02}
.wl-dossier .fac-mem{font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:.02em;color:rgba(244,245,247,.82);text-transform:uppercase;margin:0 0 9px}
.wl-dossier .fac-desc{font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.5;color:rgba(244,245,247,.6);margin:0}
/* PERSONAS */
.wl-dossier .per-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:12px}
.wl-dossier .per-card{background:#12141a;border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:16px;min-width:0}
.wl-dossier .per-mono{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:9px;background:linear-gradient(135deg,rgba(212,175,55,.22),rgba(212,175,55,.04));border:1px solid rgba(212,175,55,.32);color:#f2cc4b;font-family:'Anton',sans-serif;font-size:14px;margin-bottom:10px}
.wl-dossier .per-era{display:block;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#8a8f98}
.wl-dossier .per-name{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:16px;color:#f4f5f7;margin:3px 0 7px}
.wl-dossier .per-desc{font-family:'Inter',sans-serif;font-size:12.5px;line-height:1.5;color:rgba(244,245,247,.58);margin:0}
/* TAG TEAMS */
.wl-dossier .tag-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.wl-dossier .tag-card{position:relative;background:linear-gradient(180deg,#14161d,#0f1116);border:1px solid rgba(255,255,255,.08);border-radius:13px;padding:18px;min-width:0;overflow:hidden}
.wl-dossier .tag-yr{position:absolute;top:12px;right:16px;font-family:'Anton',sans-serif;font-size:34px;color:rgba(212,175,55,.16);line-height:1}
.wl-dossier .tag-name{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:21px;color:#f4f5f7;margin:0 0 8px;line-height:1.04}
.wl-dossier .tag-belt{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:#0b0c10;background:#d4af37;border-radius:5px;padding:3px 8px;margin-bottom:9px}
.wl-dossier .tag-part{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:12px;color:rgba(244,245,247,.8);margin:0 0 8px}
.wl-dossier .tag-desc{font-family:'Inter',sans-serif;font-size:13px;line-height:1.5;color:rgba(244,245,247,.6);margin:0}
.wl-dossier .tag-note{font-family:'Inter',sans-serif;font-size:12.5px;color:rgba(244,245,247,.45);margin:14px 0 0;font-style:italic}
/* THE ARCHITECT */
.wl-dossier .arch-line{position:relative;padding-left:20px}
.wl-dossier .arch-line:before{content:"";position:absolute;left:4px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,#d4af37,rgba(212,175,55,.15))}
.wl-dossier .arch-row{position:relative;display:grid;grid-template-columns:96px 1fr;gap:16px;padding:11px 0;align-items:start}
.wl-dossier .arch-row:before{content:"";position:absolute;left:-19px;top:16px;width:9px;height:9px;border-radius:50%;background:#f2cc4b;box-shadow:0 0 0 3px rgba(242,204,75,.14)}
.wl-dossier .arch-yr{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.02em;color:#d4af37;padding-top:2px;text-transform:uppercase}
.wl-dossier .arch-title{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:15.5px;color:#f4f5f7;margin:0 0 4px}
.wl-dossier .arch-desc{font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.52;color:rgba(244,245,247,.6);margin:0}
@media(max-width:560px){.wl-dossier .arch-row{grid-template-columns:1fr;gap:2px}}
/* PODCASTS */
.wl-dossier .pod-list{display:flex;flex-direction:column;gap:8px}
.wl-dossier .pod-row{display:flex;align-items:center;gap:14px;background:#12141a;border:1px solid rgba(255,255,255,.06);border-radius:11px;padding:13px 16px;min-width:0}
.wl-dossier .pod-when{flex:none;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#d4af37;width:72px}
.wl-dossier .pod-body{flex:1;min-width:0}
.wl-dossier .pod-title{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:14.5px;color:#f4f5f7;margin:0 0 3px}
.wl-dossier .pod-desc{font-family:'Inter',sans-serif;font-size:12.5px;line-height:1.45;color:rgba(244,245,247,.55);margin:0}
.wl-dossier .pod-kind{flex:none;font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;color:#a7abb2;border:1px solid rgba(255,255,255,.14);border-radius:6px;padding:4px 8px}
@media(max-width:560px){.wl-dossier .pod-kind{display:none}.wl-dossier .pod-when{width:auto}}
/* BOOKS */
.wl-dossier .bk-feature{display:flex;gap:18px;background:linear-gradient(180deg,#14161d,#0f1116);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px}
.wl-dossier .bk-cover{flex:none;width:64px;height:88px;display:grid;place-items:center;border-radius:8px;background:linear-gradient(160deg,#d4af37,#8a6d1f);color:#0b0c10;font-family:'Anton',sans-serif;font-size:22px;box-shadow:0 8px 20px rgba(0,0,0,.4)}
.wl-dossier .bk-body{min-width:0}
.wl-dossier .bk-meta{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:#8a8f98}
.wl-dossier .bk-title{font-family:'Oswald',sans-serif;font-weight:600;font-size:17px;color:#f4f5f7;margin:5px 0 7px;line-height:1.2}
.wl-dossier .bk-desc{font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.5;color:rgba(244,245,247,.6);margin:0 0 12px}
.wl-dossier .bk-links{display:flex;gap:9px}
.wl-dossier .bk-links a{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:12px;letter-spacing:.05em;color:#f4f5f7;text-decoration:none;border:1px solid rgba(212,175,55,.4);border-radius:8px;padding:7px 15px;transition:.14s}
.wl-dossier .bk-links a:hover{background:#f2cc4b;color:#0b0c10;border-color:#f2cc4b}
.wl-dossier .bk-more{font-family:'Inter',sans-serif;font-size:12.5px;color:rgba(244,245,247,.5);margin:14px 0 0}
.wl-dossier .bk-more a{color:#d4af37;text-decoration:none}
.wl-dossier .bk-more a:hover{text-decoration:underline}
@media(max-width:480px){.wl-dossier .bk-feature{flex-direction:column}}
/* FAQ */
.wl-dossier .faq2-list{display:flex;flex-direction:column;gap:8px}
.wl-dossier .faq2-item{background:#12141a;border:1px solid rgba(255,255,255,.07);border-radius:11px;overflow:hidden}
.wl-dossier .faq2-item[open]{border-color:rgba(212,175,55,.28)}
.wl-dossier .faq2-q{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:14px;color:#f4f5f7}
.wl-dossier .faq2-q::-webkit-details-marker{display:none}
.wl-dossier .faq2-ic{flex:none;position:relative;width:14px;height:14px}
.wl-dossier .faq2-ic:before,.wl-dossier .faq2-ic:after{content:"";position:absolute;background:#d4af37;transition:transform .2s}
.wl-dossier .faq2-ic:before{left:0;top:6px;width:14px;height:2px}
.wl-dossier .faq2-ic:after{left:6px;top:0;width:2px;height:14px}
.wl-dossier .faq2-item[open] .faq2-ic:after{transform:scaleY(0)}
.wl-dossier .faq2-a{font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.6;color:rgba(244,245,247,.66);margin:0;padding:0 16px 15px}


.wl-dossier .rec2-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px;margin:2px 0 16px}
.wl-dossier .rec2-stat{background:#12141a;border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:11px 13px}
.wl-dossier .rec2-stat b{display:block;font-family:'Anton',sans-serif;font-size:22px;color:#f4f5f7;letter-spacing:.01em}
.wl-dossier .rec2-stat span{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#8a8f98}
.wl-dossier .rec2-filters{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.wl-dossier .rec2-fbtn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);color:#cfd2d8;font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:11.5px;letter-spacing:.04em;padding:7px 12px;border-radius:8px;cursor:pointer;transition:.13s;display:flex;align-items:center;gap:6px}
.wl-dossier .rec2-fbtn span{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:#8a8f98}
.wl-dossier .rec2-fbtn:hover{border-color:rgba(212,175,55,.4);color:#fff}
.wl-dossier .rec2-fbtn.on{background:linear-gradient(180deg,rgba(242,204,75,.16),rgba(212,175,55,.05));border-color:#d4af37;color:#fff}
.wl-dossier .rec2-fbtn.on span{color:#f2cc4b}
.wl-dossier .rec2-scroll{max-height:366px;overflow-y:auto;overflow-x:auto;border:1px solid rgba(255,255,255,.08);border-radius:12px;scrollbar-width:thin;scrollbar-color:#d4af37 transparent}
.wl-dossier .rec2-scroll::-webkit-scrollbar{width:9px;height:9px}
.wl-dossier .rec2-scroll::-webkit-scrollbar-thumb{background:rgba(212,175,55,.5);border-radius:9px}
.wl-dossier .rec2-table{width:100%;border-collapse:collapse;font-family:'Inter',sans-serif;font-size:12.5px;min-width:760px}
.wl-dossier .rec2-table thead th{position:sticky;top:0;z-index:2;background:#0f1116;text-align:left;padding:10px 12px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:#8a8f98;border-bottom:1px solid rgba(212,175,55,.28);white-space:nowrap}
.wl-dossier .rec2-sort{cursor:pointer;color:#d4af37;user-select:none;text-decoration:underline dotted rgba(212,175,55,.5);text-underline-offset:3px}
.wl-dossier .rec2-sort:hover{color:#f2cc4b}
.wl-dossier .rec2-sort[aria-sort="ascending"]:after{content:" \25B4";color:#f2cc4b}
.wl-dossier .rec2-sort[aria-sort="descending"]:after{content:" \25BE";color:#f2cc4b}
.wl-dossier .rec2-table td{padding:9px 12px;border-bottom:1px solid rgba(255,255,255,.045);vertical-align:top;color:rgba(244,245,247,.82)}
.wl-dossier .rec2-table tbody tr:nth-child(even){background:rgba(255,255,255,.015)}
.wl-dossier .rec2-table tbody tr:hover{background:rgba(212,175,55,.06)}
.wl-dossier .rec2-table td.dim{color:rgba(244,245,247,.5)}
.wl-dossier .rec2-date{font-family:'JetBrains Mono',monospace;font-size:11px;white-space:nowrap}
.wl-dossier .rec2-per{font-size:11.5px;color:rgba(244,245,247,.62);white-space:nowrap}
.wl-dossier .rec2-ev{font-weight:500;color:#f4f5f7;min-width:150px}
.wl-dossier .rec2-opp{color:rgba(244,245,247,.8)}
.wl-dossier .opp-link{color:inherit;text-decoration:none;border-bottom:1px solid rgba(212,175,55,.28);transition:color .12s,border-color .12s}
.wl-dossier .opp-link:hover{color:#f2cc4b;border-bottom-color:#f2cc4b}
.wl-dossier .opp-link:focus-visible{outline:2px solid #d4af37;outline-offset:2px;border-radius:2px}
.wl-dossier .rw{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;font-family:'Anton',sans-serif;font-size:12px}
.wl-dossier .rw-w{background:rgba(37,181,110,.16);color:#4ce39a;border:1px solid rgba(37,181,110,.44)}
.wl-dossier .rw-l{background:rgba(225,29,42,.14);color:#ff6b73;border:1px solid rgba(225,29,42,.34)}
.wl-dossier .rw-d{background:rgba(255,255,255,.08);color:#cfd2d8;border:1px solid rgba(255,255,255,.16)}
.wl-dossier .pchip{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.04em;text-transform:uppercase;padding:3px 7px;border-radius:5px;background:rgba(255,255,255,.06);color:#a7abb2;white-space:nowrap}
.wl-dossier .pchip-wwe{background:rgba(225,29,42,.14);color:#ff8a90}
.wl-dossier .pchip-tna{background:rgba(90,140,255,.14);color:#8fb0ff}
.wl-dossier .pchip-njpw{background:rgba(220,30,40,.14);color:#ff8888}
.wl-dossier .pchip-roh{background:rgba(180,30,30,.18);color:#ff9090}
.wl-dossier .pchip-nwa{background:rgba(212,175,55,.12);color:#f2cc4b}
.wl-dossier .pchip-wwe{background:rgba(225,29,42,.14);color:#ff8a90}
.wl-dossier .rec2-type-active{background:rgba(90,140,255,.1);border-color:rgba(90,140,255,.5);color:#c0d0ff}
.wl-dossier .rec2-type-active span{color:#8fb0ff}
.wl-dossier .rec2-scope{display:inline-flex;margin:0 0 12px;border:1px solid rgba(212,175,55,.4);border-radius:10px;overflow:hidden;background:rgba(255,255,255,.02)}
.wl-dossier .rec2-scopebtn{background:transparent;border:0;color:#9aa0aa;font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:12.5px;letter-spacing:.05em;padding:9px 16px;cursor:pointer;transition:.13s;display:flex;align-items:center;gap:7px}
.wl-dossier .rec2-scopebtn+.rec2-scopebtn{border-left:1px solid rgba(212,175,55,.28)}
.wl-dossier .rec2-scopebtn span{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:#7f8590}
.wl-dossier .rec2-scopebtn:hover{color:#fff}
.wl-dossier .rec2-scopebtn.on{background:linear-gradient(180deg,rgba(242,204,75,.18),rgba(212,175,55,.06));color:#fff}
.wl-dossier .rec2-scopebtn.on span{color:#f2cc4b}
.wl-dossier .rec2-empty td{padding:26px 14px;text-align:center;color:rgba(244,245,247,.55);font-family:'Inter',sans-serif;font-size:13px}
.wl-dossier .rec2-empty a{color:#f2cc4b;text-decoration:underline dotted rgba(212,175,55,.5);text-underline-offset:3px;cursor:pointer}
.wl-dossier .rec2-ctrl{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin:0 0 12px}
.wl-dossier .rec2-ctrl .rec2-scope{margin:0}
.wl-dossier .rec2-wl{display:flex;align-items:center;flex-wrap:wrap;gap:10px 28px;background:#12141a;border:1px solid rgba(212,175,55,.26);border-radius:12px;padding:14px 20px;margin:0 0 14px}
.wl-dossier .rec2-donut{width:118px;height:118px;flex:none}
.wl-dossier .dn-bg{fill:none;stroke:rgba(255,255,255,.06);stroke-width:12}
.wl-dossier .dn-seg{fill:none;stroke-width:12;transform:rotate(-90deg);transform-origin:60px 60px;transition:stroke-dasharray .35s ease,stroke-dashoffset .35s ease}
.wl-dossier #dn-w{stroke:#35c983}
.wl-dossier #dn-l{stroke:#e1525c}
.wl-dossier #dn-d{stroke:#cfd2d8}
.wl-dossier #dn-n{stroke:#8a8f98}
.wl-dossier .dn-pct{font-family:'Anton',sans-serif;font-size:21px;fill:#f4f5f7}
.wl-dossier .dn-cap{font-family:'JetBrains Mono',monospace;font-size:7.5px;letter-spacing:.12em;fill:#8a8f98}
.wl-dossier .rec2-wl-rec{margin:0 0 8px}
.wl-dossier .rec2-wl-rec b{font-family:'Anton',sans-serif;font-size:26px;color:#f4f5f7;letter-spacing:.02em}
.wl-dossier .rec2-wl-rec span{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:#8a8f98;margin-left:9px}
.wl-dossier .rec2-wl-legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;padding:0}
.wl-dossier .rec2-wl-legend li{font-family:'Inter',sans-serif;font-size:12.5px;color:rgba(244,245,247,.78);display:flex;align-items:center;gap:7px}
.wl-dossier .rec2-wl-legend b{font-family:'JetBrains Mono',monospace;font-size:11px;color:#f4f5f7}
.wl-dossier .lg{width:9px;height:9px;border-radius:3px;display:inline-block}
.wl-dossier .lg-w{background:#35c983}
.wl-dossier .lg-l{background:#e1525c}
.wl-dossier .lg-d{background:#cfd2d8}
.wl-dossier .lg-n{background:#8a8f98}
.wl-dossier .rec2-wl-note{margin:9px 0 0;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:#6f747e}
.wl-dossier .rec2-wl{position:relative;overflow:hidden}
.wl-dossier .rec2-wl-veiled .rec2-donut,.wl-dossier .rec2-wl-veiled .rec2-wl-side{filter:blur(9px);pointer-events:none;user-select:none}
.wl-dossier .rec2-wl-veil{display:none}
.wl-dossier .rec2-wl-veiled .rec2-wl-veil{display:flex;position:absolute;inset:0;z-index:2;flex-direction:column;align-items:center;justify-content:center;gap:11px;background:rgba(11,12,16,.42);text-align:center;padding:12px}
.wl-dossier .rec2-wl-veil p{margin:0;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:#cfd2d8}
.wl-dossier .rec2-wl-unveil{background:linear-gradient(180deg,rgba(242,204,75,.2),rgba(212,175,55,.07));border:1px solid #d4af37;color:#fff;font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:12px;letter-spacing:.05em;padding:8px 18px;border-radius:9px;cursor:pointer;transition:.13s}
.wl-dossier .rec2-wl-unveil:hover{background:rgba(242,204,75,.28)}
.wl-dossier .pchip-wwf{background:rgba(212,175,55,.14);color:#f2cc4b}
.wl-dossier .pchip-wcw{background:rgba(90,140,255,.14);color:#8fb0ff}
.wl-dossier .rec2-count{font-family:'JetBrains Mono',monospace;font-size:11px;color:#8a8f98;margin:11px 0 0}
.wl-dossier .rec2-count b{color:#f2cc4b}
/* SIGNATURE */
.wl-dossier .sig2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:12px}
.wl-dossier .sig2-card{background:linear-gradient(180deg,#14161d,#0f1116);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:15px 16px}
.wl-dossier .sig2-card--link{display:block;text-decoration:none;color:inherit;position:relative;transition:transform .14s,border-color .14s,box-shadow .14s}
.wl-dossier .sig2-card--link:hover{transform:translateY(-2px);border-color:rgba(212,175,55,.45);box-shadow:0 10px 26px rgba(0,0,0,.4)}
.wl-dossier .sig2-card--link:focus-visible{outline:2px solid #d4af37;outline-offset:2px}
.wl-dossier .sig2-card--link .sig2-ev{transition:color .13s}
.wl-dossier .sig2-card--link:hover .sig2-ev{color:#f2cc4b}
.wl-dossier .sig2-card--link::after{content:"Breakdown";position:absolute;top:13px;right:14px;font-family:'JetBrains Mono',monospace;font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:#565b64;transition:color .13s}
.wl-dossier .sig2-card--link:hover::after{color:#d4af37}
.wl-dossier .sig2-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}
.wl-dossier .sig2-rate{font-family:'Anton',sans-serif;font-size:26px;color:#f2cc4b;line-height:1}
.wl-dossier .sig2-stars{color:#d4af37;font-size:12px;letter-spacing:1px}
.wl-dossier .sig2-ev{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;font-size:15px;color:#f4f5f7;margin:0 0 4px}
.wl-dossier .sig2-opp{font-family:'Inter',sans-serif;font-size:13px;color:rgba(244,245,247,.72);margin:0 0 3px}
.wl-dossier .sig2-stip{font-family:'Inter',sans-serif;font-size:12px;color:rgba(244,245,247,.5);margin:0}
/* REFERENCE */
.wl-dossier .ref2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:9px}
.wl-dossier .ref2-item{display:flex;flex-direction:column;gap:2px;background:#12141a;border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:12px 14px;text-decoration:none;transition:.13s}
.wl-dossier .ref2-item:hover{border-color:rgba(212,175,55,.4);background:rgba(212,175,55,.05)}
.wl-dossier .ref2-k{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:13px;letter-spacing:.03em;color:#f4f5f7}
.wl-dossier .ref2-v{font-family:'JetBrains Mono',monospace;font-size:10px;color:#8a8f98}


.wl-dossier .biz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:12px}
.wl-dossier .biz-card{display:flex;gap:13px;background:linear-gradient(180deg,#14161d,#0f1116);border:1px solid rgba(255,255,255,.08);border-left:2px solid #d4af37;border-radius:12px;padding:15px;text-decoration:none;transition:.15s}
.wl-dossier .biz-card:hover{border-left-color:#f2cc4b;transform:translateY(-2px)}
.wl-dossier .biz-ic{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,rgba(212,175,55,.24),rgba(212,175,55,.05));border:1px solid rgba(212,175,55,.34);color:#f2cc4b;font-family:'Anton',sans-serif;font-size:15px}
.wl-dossier .biz-cat{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:#d4af37}
.wl-dossier .biz-name{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:19px;color:#f4f5f7;margin:4px 0 6px;line-height:1.05}
.wl-dossier .biz-desc{font-family:'Inter',sans-serif;font-size:13px;line-height:1.5;color:rgba(244,245,247,.6);margin:0}
.wl-dossier .ch-list{display:flex;flex-direction:column;gap:2px}
.wl-dossier .ch-row{display:flex;align-items:center;gap:14px;padding:13px 4px;border-bottom:1px solid rgba(255,255,255,.06)}
.wl-dossier .ch-ic{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:8px;background:rgba(212,175,55,.14);border:1px solid rgba(212,175,55,.32);color:#f2cc4b;font-family:'Anton',sans-serif;font-size:15px}
.wl-dossier .ch-body{flex:1;min-width:0}
.wl-dossier .ch-name{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;font-size:15px;color:#f4f5f7;margin:0 0 2px}
.wl-dossier .ch-sub{font-family:'Inter',sans-serif;font-size:12.5px;color:rgba(244,245,247,.55);margin:0}
.wl-dossier .ch-cnt{flex:none;text-align:right}
.wl-dossier .ch-cnt b{font-family:'Anton',sans-serif;font-size:24px;color:#f2cc4b}
.wl-dossier .ch-cnt span{display:block;font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:#8a8f98}
/* ===== MOBILE ERGONOMICS ===== */
@media(max-width:640px){
  .wl-dossier .rec2-table{min-width:640px;font-size:12px}
  .wl-dossier .rec2-table thead th{padding:9px 10px}
  .wl-dossier .rec2-table td{padding:8px 10px}
  .wl-dossier .rec2-date{font-size:10.5px}
  .wl-dossier .rec2-ev{min-width:130px}
  .wl-dossier .rec2-stats{grid-template-columns:repeat(2,1fr)}
  .wl-dossier .sec-lead{font-size:14px}
  .wl-dossier .rec2-filters{gap:5px}
  .wl-dossier .rec2-fbtn{padding:6px 10px;font-size:11px}
  /* larger tap targets on sortable headers */
  .wl-dossier .rec2-sort{padding-top:12px;padding-bottom:12px}
  /* single-column card grids */
  .wl-dossier .sig2-grid,.wl-dossier .fac-grid,.wl-dossier .per-row,
  .wl-dossier .biz-grid,.wl-dossier .ref2-grid,.wl-dossier .tag-grid{grid-template-columns:1fr}
}
/* horizontal-scroll hint: gold edge fade that recedes at the ends (Lea Verou scroll-shadow) */
.wl-dossier .rec2-scroll{
  background:
    linear-gradient(90deg,#0f1116 30%,rgba(15,17,22,0)) 0 0/28px 100% no-repeat,
    linear-gradient(90deg,rgba(15,17,22,0),#0f1116 70%) 100% 0/28px 100% no-repeat,
    radial-gradient(farthest-side at 0 50%,rgba(212,175,55,.28),transparent) 0 0/14px 100% no-repeat,
    radial-gradient(farthest-side at 100% 50%,rgba(212,175,55,.28),transparent) 100% 0/14px 100% no-repeat;
  background-attachment:local,local,scroll,scroll;
}

/* ===== SPOILER SHIELD ===== */
.wl-dossier .sec-h .spl,.wl-dossier .rec2-ctrl .spl{display:inline-flex;align-items:center;gap:9px;background:none;border:0;cursor:pointer;padding:4px 2px;margin-left:auto}
.wl-dossier .spl-track{position:relative;flex:none;width:36px;height:19px;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.22);transition:.18s}
.wl-dossier .spl-knob{position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:#8a8f98;transition:left .18s ease,background .18s ease}
.wl-dossier .spl[aria-pressed="true"] .spl-track{background:rgba(212,175,55,.28);border-color:#d4af37}
.wl-dossier .spl[aria-pressed="true"] .spl-knob{left:19px;background:#f2cc4b}
.wl-dossier .spl-lbl{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:#8a8f98;white-space:nowrap;transition:color .18s}
.wl-dossier .spl[aria-pressed="true"] .spl-lbl{color:#f2cc4b}
.wl-dossier .rec2-table th:first-child,.wl-dossier .rec2-table td:first-child{min-width:88px}
.wl-dossier .rw-show{display:none;align-items:center;height:22px;padding:0 9px;border-radius:6px;border:1px dashed rgba(212,175,55,.45);background:rgba(212,175,55,.05);color:#d4af37;font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;transition:.13s;white-space:nowrap}
.wl-dossier .rw-show:hover{background:rgba(212,175,55,.16);color:#f2cc4b;border-style:solid}
.wl-dossier .rec2-spoiler .rw{display:none}
.wl-dossier .rec2-spoiler .rw-show{display:inline-flex}
.wl-dossier .rec2-spoiler tr.rev-open .rw{display:inline-grid}
.wl-dossier .rec2-spoiler tr.rev-open .rw-show{display:none}
.wl-dossier .rec2-title{transition:filter .22s ease}
.wl-dossier .rec2-spoiler .rec2-title{filter:blur(5px);user-select:none}
.wl-dossier .rec2-spoiler tr.rev-open .rec2-title{filter:none}

/* ===== FILMOGRAPHY = CONCIERGE TRIGGERS ===== */
.wl-dossier #film-body tr{cursor:pointer}
.wl-dossier #film-body tr:hover .rec2-ev{color:#f2cc4b}
.wl-dossier #film-body tr:focus-visible{outline:2px solid #d4af37;outline-offset:-2px}
.wl-dossier .mv-hint{float:right;margin-left:14px;font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#565b64;white-space:nowrap;transition:color .13s}
.wl-dossier #film-body tr:hover .mv-hint{color:#d4af37}
@media(max-width:640px){.wl-dossier .mv-hint{display:none}}

/* ===== CONCIERGE MOVIE MODAL ===== */
.mv-modal[hidden]{display:none}
.mv-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px}
.mv-backdrop{position:absolute;inset:0;background:rgba(5,6,9,.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.mv-card{position:relative;width:min(438px,100%);background:linear-gradient(180deg,#14161d,#0d0e13);border:1px solid rgba(212,175,55,.34);border-radius:16px;padding:26px 24px 18px;box-shadow:0 30px 80px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.04);animation:mvIn .22s cubic-bezier(.16,1,.3,1)}
@keyframes mvIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.mv-card::before{content:"";position:absolute;left:24px;right:24px;top:0;height:2px;background:linear-gradient(90deg,transparent,#d4af37,transparent)}
.mv-x{position:absolute;top:12px;right:13px;width:30px;height:30px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#cfd2d8;border-radius:8px;cursor:pointer;font-size:17px;line-height:1;transition:.13s}
.mv-x:hover{border-color:#e11d2a;color:#ff6b73}
.mv-eyebrow{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;font-size:9.5px;letter-spacing:.24em;color:#d4af37;margin:0 0 9px;display:flex;align-items:center;gap:8px}
.mv-eyebrow::before{content:"";width:16px;height:1px;background:#d4af37}
.mv-title{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:27px;line-height:1.03;color:#f4f5f7;margin:0 0 5px}
.mv-meta{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.03em;color:#8a8f98;margin:0 0 18px}
.mv-lead{font-family:'Inter',sans-serif;font-size:13px;line-height:1.5;color:rgba(244,245,247,.72);margin:0 0 14px}
.mv-actions{display:grid;gap:10px}
.mv-btn{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:11px;text-decoration:none;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);transition:transform .14s,border-color .14s,background .14s}
.mv-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.05)}
.mv-ic{flex:none;width:38px;height:38px;border-radius:9px;display:grid;place-items:center;font-family:'Anton',sans-serif;font-size:12.5px;letter-spacing:.02em}
.mv-rt .mv-ic{background:rgba(225,29,42,.16);border:1px solid rgba(225,29,42,.42);color:#ff6b73}
.mv-az .mv-ic{background:rgba(70,132,255,.16);border:1px solid rgba(70,132,255,.42);color:#8fb0ff}
.mv-rt:hover{border-color:rgba(225,29,42,.5)}
.mv-az:hover{border-color:rgba(70,132,255,.5)}
.mv-bt{display:flex;flex-direction:column;gap:1px;min-width:0}
.mv-bt b{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:14px;color:#f4f5f7}
.mv-bt span{font-family:'Inter',sans-serif;font-size:11.5px;color:#8a8f98}
.mv-note{font-family:'Inter',sans-serif;font-size:10.5px;line-height:1.5;color:#6b7079;margin:15px 4px 2px;text-align:center}
.mv-note b{color:#9aa0a8;font-weight:500}

/* ==== gap-fill: classes used in dossier markup but previously undefined ====
   Found by template dissection. john-cena patched .pchip-ppv/-tv/-hs via a
   per-page <style> block; .pchip-aew/-ecw/-ind and .rw-n were never defined
   anywhere and fell back to the base chip. Defined once here so no generated
   page needs an override block. */
.wl-dossier .pchip-aew{background:rgba(196,168,90,.14);color:#d8c079;border-color:rgba(196,168,90,.42)}
.wl-dossier .pchip-ecw{background:rgba(190,60,60,.14);color:#e08a8a;border-color:rgba(190,60,60,.42)}
.wl-dossier .pchip-ind{background:rgba(150,150,160,.12);color:#b8bcc6;border-color:rgba(150,150,160,.34)}
.wl-dossier .pchip-ppv{background:rgba(212,175,55,.16);color:#e7c65b;border-color:rgba(212,175,55,.45)}
.wl-dossier .pchip-tv{background:rgba(120,160,220,.14);color:#9ec1ee;border-color:rgba(120,160,220,.4)}
.wl-dossier .pchip-hs{background:rgba(150,150,160,.12);color:#b8bcc6;border-color:rgba(150,150,160,.34)}
.wl-dossier .rw-n{background:rgba(150,150,160,.16);color:#c2c6cf;border-color:rgba(150,150,160,.4)}

/* Signature reel: applied when a subject has 8+ signature cards. Was a
   per-page <style> block on cm-punk and john-cena. */
.wl-dossier .sig2-reel{display:flex;grid-template-columns:none;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 12px;scrollbar-width:thin;scrollbar-color:rgba(212,175,55,.5) transparent}
.wl-dossier .sig2-reel > .sig2-card{flex:0 0 clamp(210px,23vw,250px);scroll-snap-align:start;min-width:0}
.wl-dossier .sig2-reel::-webkit-scrollbar{height:8px}
.wl-dossier .sig2-reel::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:99px}
.wl-dossier .sig2-reel::-webkit-scrollbar-thumb{background:rgba(212,175,55,.4);border-radius:99px}
.wl-dossier .sig2-reel::-webkit-scrollbar-thumb:hover{background:rgba(212,175,55,.65)}

/* ==========================================================================
   TALE OF THE TAPE — the sticky rail, made reachable
   --------------------------------------------------------------------------
   THE DEFECT
   `.wl-dossier .rail` (profile.css:237) is `position:sticky;top:112px` with no
   bound, so any Tale-of-the-Tape card taller than `100vh - 112px` has a
   permanently unreachable bottom. The height driver was never the facts — it
   was the `.cm` provenance sub-line hung under each one (rhea-ripley: 14 of 14
   rows carry one, 1389px of card against a 788px slot).

   THE FIX — hierarchy, not a scrollbar.
     register 1 · the fact.  One line per row. Always visible. Never folded.
     register 2 · the source note.  Folded into a native <details> whose
       <summary> IS the fact line, so folding costs exactly zero vertical space
       and the disclosure's label and its content are the same row.

   No JS is required for the mechanism: <details> gives keyboard operation, the
   expanded/collapsed state in the a11y tree, and per-row reveal on its own.
   /js/rail.js only adds the card-level SOURCED control and the
   fold-only-what-does-not-fit default.

   TWO REGISTERS OF METRIC, AND ONLY TWO.
   Everything below the "base" section is gated behind a state class that
   /js/rail.js puts on the `.rail` element, never on the page as a whole:

     (no class)   the card fits its slot. ORIGINAL profile.css metrics —
                  92px label column, 9px row padding, 10.5px dt, 11px .cm.
                  Byte-identical to the pre-change page. cm-punk lives here.
     .tt-cap      the card must be bounded: flex column, capped, the ledger
                  scrolls inside its own frame, notes fold. Metrics still
                  original.
     .tt-dense    folding alone was not enough: tighter tape setting on top of
                  .tt-cap. This — and ONLY this — is where 88px/8px/10px/the
                  gold-ruled mono note live.

   Idioms taken from the dossier rather than invented: the CSS-drawn gold +/-
   of `.faq2-ic` (dossier.css:128), the `aria-expanded` control grammar of
   `.idn-support`, the thin gold scrollbar of `.mdx-picks`, and the JS-toggled
   bottom scroll-fade of `.mnav-fade` (site.css:4452).
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. BASE — present on every dossier page, in every state.
      Nothing here may change the tape's metrics. It only makes the
      <details>/<summary> wrapper render exactly like the text node + block
      `.cm` it replaced.
   -------------------------------------------------------------------------- */
.wl-dossier .tott .tsrc{display:block}

.wl-dossier .tott .tsrc-v{
  display:block;             /* was an anonymous block box around the fact */
  list-style:none;
  cursor:pointer;
  border-radius:2px;
}
.wl-dossier .tott .tsrc-v::-webkit-details-marker{display:none}
.wl-dossier .tott .tsrc-v::marker{content:"";font-size:0}
.wl-dossier .tott .tsrc-v:focus-visible{outline:2px solid var(--goldb,#f2cc4b);outline-offset:2px}

/* the +/- rides the fact's own baseline, so folding costs no height.
   It is HIDDEN while the row is open in an uncapped card — that is the state
   that has to stay pixel-identical to the old page, and an open row has
   nothing left to disclose. */
.wl-dossier .tott .tsrc-ic{
  display:none;
  position:relative;
  width:9px;height:9px;
  margin-left:7px;
  color:rgba(212,175,55,.62);
  transition:color .18s ease;
}
.wl-dossier .tott .tsrc:not([open]) .tsrc-ic,
.wl-dossier .rail.tt-cap .tott .tsrc-ic{display:inline-block}
.wl-dossier .tott .tsrc-ic:before,
.wl-dossier .tott .tsrc-ic:after{
  content:"";position:absolute;background:currentColor;transition:transform .2s ease;
}
.wl-dossier .tott .tsrc-ic:before{left:0;top:4px;width:9px;height:1.5px}
.wl-dossier .tott .tsrc-ic:after{left:4px;top:0;width:1.5px;height:9px}
.wl-dossier .tott .tsrc[open] .tsrc-ic:after{transform:scaleY(0)}
.wl-dossier .tott .tsrc-v:hover .tsrc-ic,
.wl-dossier .tott .tsrc[open] .tsrc-ic{color:var(--goldb,#f2cc4b)}

/* --------------------------------------------------------------------------
   2. THE CREDIBILITY LINE — "we show our sources", asserted while collapsed.
      The old footer line ("14 of 14 entries carry a source note") cost 34px of
      the very height we are trying to buy back. It is restored here on the
      title's own baseline, where it costs ZERO vertical space, and it carries
      the ratio — not a bare count — so the claim survives folding. With
      /js/rail.js absent it is a static <p>; with it, the same element becomes
      the button that opens or closes every note at once, and its accessible
      name is the full sentence.
   -------------------------------------------------------------------------- */
.wl-dossier .tott .tt-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
}
.wl-dossier .tott .tt-head .kick{margin:0 0 12px}   /* unchanged from profile.css */

.wl-dossier .tott .tt-cred{
  flex:none;
  display:inline-flex;
  align-items:baseline;
  gap:5px;
  margin:0;
  padding:0;
  background:none;
  border:0;
  line-height:1;
  white-space:nowrap;
  font-family:var(--osw,'Oswald',system-ui,sans-serif);
  font-weight:600;
  font-size:9.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8c7420;
  transition:color .18s ease;
}
button.tt-cred{cursor:pointer}
.wl-dossier .tott button.tt-cred:hover,
.wl-dossier .tott button.tt-cred[aria-expanded="true"]{color:var(--gold,#d4af37)}
.wl-dossier .tott .tt-cred:focus-visible{
  outline:2px solid var(--goldb,#f2cc4b);
  outline-offset:3px;
  border-radius:2px;
}
.wl-dossier .tott .tt-cred .tt-n{
  font-family:var(--mono,'JetBrains Mono',ui-monospace,monospace);
  font-size:9.5px;
  letter-spacing:.02em;
  color:#a98d27;
  transition:color .18s ease;
}
.wl-dossier .tott button.tt-cred:hover .tt-n,
.wl-dossier .tott button.tt-cred[aria-expanded="true"] .tt-n{color:var(--goldb,#f2cc4b)}

/* the house +/- glyph, at header scale */
.wl-dossier .tott .tt-ic{flex:none;position:relative;width:10px;height:10px;align-self:center}
.wl-dossier .tott .tt-ic:before,
.wl-dossier .tott .tt-ic:after{
  content:"";position:absolute;background:currentColor;transition:transform .2s ease;
}
.wl-dossier .tott .tt-ic:before{left:0;top:4.5px;width:10px;height:1.5px}
.wl-dossier .tott .tt-ic:after{left:4.5px;top:0;width:1.5px;height:10px}
.wl-dossier .tott .tt-cred[aria-expanded="true"] .tt-ic:after{transform:scaleY(0)}

/* --------------------------------------------------------------------------
   3. .tt-cap — the bounded card. Applied by /js/rail.js only when the fully
      expanded card cannot fit the sticky slot. Header and (on triple-h) the
      rating block stay pinned; only the ledger moves.
      METRICS ARE UNCHANGED HERE — this section buys height by folding, not by
      tightening.
   -------------------------------------------------------------------------- */
/* site.css:2352 declares a global, unscoped `.rail` (a horizontal snap
   carousel) carrying `padding-block:var(--sp-2)`. The dossier's vertical
   sidebar inherits those 16px by accident. Reclaimed only when height is
   actually scarce, so an uncapped page is left exactly where it was. */
.wl-dossier .rail.tt-cap{padding-block:0}

.wl-dossier .rail.tt-cap .card.tott{
  position:relative;
  display:flex;
  flex-direction:column;
  max-height:calc(100vh - 124px);   /* sticky top 112px + a 12px foot */
}
.wl-dossier .rail.tt-cap .card.tott > .tt-head{flex:none}
.wl-dossier .rail.tt-cap .card.tott > .tott-rating{flex:none}

/* transient state used by rail.js to measure the un-bounded height */
.wl-dossier .rail .card.tott.tt-measure{max-height:none}
.wl-dossier .rail .card.tott.tt-measure dl{overflow:visible;max-height:none}

.wl-dossier .rail.tt-cap .tott dl{
  min-height:0;                 /* flex plumbing: shrink first, then scroll */
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  padding-right:2px;
  scrollbar-width:thin;
  scrollbar-color:#8c7420 transparent;
}
.wl-dossier .rail.tt-cap .tott dl:focus-visible{outline:2px solid var(--goldb,#f2cc4b);outline-offset:3px;border-radius:4px}
.wl-dossier .rail.tt-cap .tott dl::-webkit-scrollbar{width:5px}
.wl-dossier .rail.tt-cap .tott dl::-webkit-scrollbar-track{background:transparent}
.wl-dossier .rail.tt-cap .tott dl::-webkit-scrollbar-thumb{background:#8c7420;border-radius:99px}

/* Safety net: the collapsed card always fits. If the reader opens everything
   and the tape then outgrows the slot, the LEDGER scrolls inside its own frame
   and a gold bottom fade says there is more below. It recedes at the end of the
   scroll, exactly as `.mnav-fade` does. */
.wl-dossier .rail.tt-cap .card.tott::after{
  content:"";
  position:absolute;
  left:16px;right:16px;
  bottom:14px;
  height:46px;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(180deg,rgba(15,16,21,0),rgba(15,16,21,.97) 76%);
  transition:opacity .25s ease;
}
.wl-dossier .rail.tt-cap .card.tott.is-scrollable:not(.is-end)::after{opacity:1}

/* --------------------------------------------------------------------------
   4. .tt-dense — the ONLY place the tape's setting changes. Reached only when
      a fully folded card at the original setting still will not fit.
      This is the register the prototype wrongly applied to every page.
   -------------------------------------------------------------------------- */
.wl-dossier .rail.tt-dense .card.tott{padding:16px 16px 14px}
.wl-dossier .rail.tt-dense .tott .tt-head .kick{margin:0 0 10px}
.wl-dossier .rail.tt-dense .tott .row{grid-template-columns:88px 1fr;gap:10px;padding:5px 0}
.wl-dossier .rail.tt-dense .tott dt{font-size:10px;letter-spacing:.085em;line-height:1.5}
.wl-dossier .rail.tt-dense .tott dd{font-size:14px;line-height:1.42}
/* the note, set as marginal apparatus: mono, dim, hung off a gold rule */
.wl-dossier .rail.tt-dense .tott dd .cm{
  margin:4px 0 2px;
  padding-left:9px;
  border-left:1px solid rgba(212,175,55,.3);
  font-size:10.5px;
  line-height:1.55;
}

/* --------------------------------------------------------------------------
   4b. .tt-tight — LAST RESORT, on top of .tt-dense. Reached only when the
      fully folded dense ledger still overflows the slot, which happens when a
      tape's values are long enough to wrap two or three times. In this tree
      that is cody-rhodes at 1440x700 and nothing else. It buys its height from
      the label column and the leading, not from a fifth type size.
   -------------------------------------------------------------------------- */
.wl-dossier .rail.tt-dense.tt-tight .card.tott{padding:14px 14px 12px}
.wl-dossier .rail.tt-dense.tt-tight .tott .tt-head .kick{margin:0 0 8px}
.wl-dossier .rail.tt-dense.tt-tight .tott .row{grid-template-columns:80px 1fr;gap:8px;padding:4px 0}
.wl-dossier .rail.tt-dense.tt-tight .tott dt{font-size:9.5px;letter-spacing:.07em;line-height:1.45}
.wl-dossier .rail.tt-dense.tt-tight .tott dd{font-size:13.5px;line-height:1.4}
.wl-dossier .rail.tt-dense.tt-tight .card.tott::after{left:14px;right:14px;bottom:12px}

/* --------------------------------------------------------------------------
   5. <=960px — the rail is already static, full-width and un-pinned there, so
      there is no height to save. Every state class is released and rail.js
      defaults every note to open.
   -------------------------------------------------------------------------- */
@media(max-width:960px){
  .wl-dossier .rail.tt-cap{padding-block:revert}
  .wl-dossier .rail.tt-cap .card.tott{display:block;max-height:none;padding:18px}
  .wl-dossier .rail.tt-cap .tott dl{overflow:visible;max-height:none;padding-right:0}
  .wl-dossier .rail.tt-cap .card.tott::after{display:none}
  /* belt and braces: if a reader drags the window down past 960px while the
     dense setting is still latched, release it here too. */
  .wl-dossier .rail.tt-dense .card.tott,
  .wl-dossier .rail.tt-dense.tt-tight .card.tott{padding:18px}
  .wl-dossier .rail.tt-dense.tt-tight .tott .tt-head .kick{margin:0 0 12px}
  .wl-dossier .rail.tt-dense.tt-tight .tott .row{grid-template-columns:92px 1fr;gap:12px;padding:9px 0}
  .wl-dossier .rail.tt-dense.tt-tight .tott dt{font-size:10.5px;letter-spacing:.09em;line-height:normal}
  .wl-dossier .rail.tt-dense.tt-tight .tott dd{font-size:14.5px;line-height:normal}
  .wl-dossier .rail.tt-dense .tott .tt-head .kick{margin:0 0 12px}
  .wl-dossier .rail.tt-dense .tott .row{grid-template-columns:92px 1fr;gap:12px;padding:9px 0}
  .wl-dossier .rail.tt-dense .tott dt{font-size:10.5px;letter-spacing:.09em;line-height:normal}
  .wl-dossier .rail.tt-dense .tott dd{font-size:14.5px;line-height:normal}
  .wl-dossier .rail.tt-dense .tott dd .cm{margin:0;padding-left:0;border-left:0;font-size:11px;line-height:normal}
}

/* --------------------------------------------------------------------------
   6. Reduced motion
   -------------------------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  .wl-dossier .tott .tt-cred,
  .wl-dossier .tott .tt-cred .tt-n,
  .wl-dossier .tott .tt-ic:before,
  .wl-dossier .tott .tt-ic:after,
  .wl-dossier .tott .tsrc-ic,
  .wl-dossier .tott .tsrc-ic:before,
  .wl-dossier .tott .tsrc-ic:after,
  .wl-dossier .rail.tt-cap .card.tott::after{transition:none}
}
/* ====================== end Tale of the Tape rail ====================== */

/* ==========================================================================
   ==== PROSE & SPREAD — merged reading pass (proto A) + layout events (proto B)
   --------------------------------------------------------------------------
   GEOMETRY, one paragraph: the text column and the rail are ONE centered
   editorial spread. >=1200px the grid is [minmax(0,72ch)] [rail], centered,
   with the body size fluid (16.5px -> 18.7px) so the 72ch measure grows in px
   while staying 72ch. >=1600px a third track opens between them — the
   PULL BAND, var(--pull-w) wide — and .profile-main spans tracks 1-2 so data
   exhibits (record table, tiles, timeline, the wide .corr) may breathe out to
   72ch + gap + band while paragraphs stay capped at 72ch. Margin pull-facts
   float out of the 72ch paragraph box into the band; their right edge lands
   exactly on the main area's right edge, one full column-gap short of the
   rail, so they can never touch it. Below 1600px the band is 0 and every
   .pull is display:none — each pull only DUPLICATES a fact already in the
   running text (aria-hidden), so nothing is lost. Below 1200px (and <=960px
   single-column) nothing here changes the layout at all.

   AUTHORING CONVENTION for pull-facts (raw HTML inside overview strings /
   hand-authored paragraphs — see build_dossier.py sec_overview docstring):
     <span class="pull" aria-hidden="true">
       <span class="pull-fig">650</span>          big Anton numeral
       <span class="pull-cap">days as champion…</span></span>
     variants: pull-fig--sm (Oswald, for words/dates), pull--q + pull-quote.
   Facts only, already present in the text; never inside the .corr paragraph.
   ========================================================================== */

/* ------------------------------------------------------------- 1. the scale */
.wl-dossier{--prose-size:16.5px; --pull-w:0px; --pull-gap:0px}
@media (min-width:1200px){
  .wl-dossier{--prose-size:clamp(16.5px, 12.9px + 0.3vw, 18.7px)}
}
@media (min-width:1600px){
  .wl-dossier{--pull-w:240px; --pull-gap:clamp(44px, 3vw, 64px)}
}
@media (min-width:1900px){
  .wl-dossier{--pull-w:260px}
}

/* ------------------------------------------ 2. the centered spread (>=1200) */
@media (min-width:1200px){
  .wl-dossier .layout{
    font-size:var(--prose-size);   /* the 72ch track resolves against this */
    grid-template-columns:minmax(0,72ch) var(--rail-w);
    justify-content:center;
    column-gap:clamp(56px, 4.2vw + 8px, 96px);
    padding-top:48px;
  }
  .wl-dossier .profile-main{max-width:none}
}
/* three tracks: [prose 72ch] [pull band] [rail], still centered as one object */
@media (min-width:1600px){
  .wl-dossier .layout{
    grid-template-columns:minmax(0,72ch) var(--pull-w) var(--rail-w);
    column-gap:var(--pull-gap);
  }
  .wl-dossier .profile-main{grid-column:1 / 3}
  .wl-dossier .rail{grid-column:3}
}

/* ------------------------------------------------------------ 3. body prose
   .ov-p is the class the generator emits. The [style] variants exist only to
   beat the legacy inline styles still carried by the hand-authored pages;
   the .prose variant covers triple-h, whose overview wraps its paragraphs. */
.wl-dossier .ov-p{
  font-family:'Inter',system-ui,sans-serif;
  color:rgba(244,245,247,.84);
  font-size:var(--prose-size);
  line-height:1.72;
  max-width:72ch;
  margin:0;
}
.wl-dossier #overview > p[style],
.wl-dossier #overview .corr > p[style]{
  font-size:var(--prose-size) !important;
  line-height:1.72 !important;
  color:rgba(244,245,247,.84) !important;
  margin:0 !important;
}
.wl-dossier #overview .prose > p{
  font-size:var(--prose-size);
  line-height:1.72;
  color:rgba(244,245,247,.84);
  max-width:72ch;
  margin:0;
}
.wl-dossier #overview > p,
.wl-dossier #overview .prose > p{
  text-wrap:pretty;
  hanging-punctuation:first last;
}
/* the [style] variants must outrank the margin:0 in the [style] reset above
   ((1,3,2) vs (1,2,1)) or legacy inline-styled pages lose their spacing */
.wl-dossier #overview > p + p,
.wl-dossier #overview > p[style] + p[style],
.wl-dossier #overview > aside + p,
.wl-dossier #overview > aside + p[style],
.wl-dossier #overview .prose > p + p,
.wl-dossier #overview .prose > aside + p{margin-top:1em !important}

/* --------------------------------------------- 4. the lead-in (first para) */
.wl-dossier #overview > p:first-of-type,
.wl-dossier #overview .prose > p:first-of-type{
  font-size:calc(var(--prose-size)*1.09) !important;
  line-height:1.62 !important;
  color:rgba(244,245,247,.92) !important;
  /* its ch is 1.09x the layout's, so cap the measure at the BASE-size 72ch —
     otherwise the lead spills past the 72ch grid track into the pull band and
     pushes its margin pulls onto the rail. calc resolves against the
     element's own (inflated) font, hence the division. */
  max-width:calc(72ch / 1.09) !important;
}
@media (min-width:1200px){
  .wl-dossier #overview > p:first-of-type::first-letter,
  .wl-dossier #overview .prose > p:first-of-type::first-letter{
    float:left;
    font-family:var(--anton,'Anton',sans-serif);
    font-weight:400;
    font-size:3.65em;
    line-height:.8;
    padding:.08em .16em 0 0;
    color:var(--gold,#d4af37);
  }
}

/* ------------------------------------------ 5. emphasis, italics and links */
.wl-dossier #overview b, .wl-dossier #overview strong,
.wl-dossier .prose b,    .wl-dossier .prose strong{color:#fff;font-weight:600}
.wl-dossier #overview i, .wl-dossier #overview em,
.wl-dossier .prose i,    .wl-dossier .prose em{color:rgba(244,245,247,.94)}
.wl-dossier #overview a{color:var(--goldb,#f2cc4b);border-bottom:1px solid rgba(242,204,75,.25)}
.wl-dossier #overview a:hover{border-color:var(--goldb,#f2cc4b)}

/* --------------------------- 6. section rhythm (A) + giant ordinals (B) */
.wl-dossier .sec{display:flow-root}   /* contain pulls + drop cap floats */
.wl-dossier .sec-h{gap:18px}
.wl-dossier .sec-h .n{
  font-family:var(--anton,'Anton',sans-serif);
  font-size:clamp(30px,3vw,52px);
  line-height:.8;
  letter-spacing:.01em;
  color:rgba(212,175,55,.30);
}
@supports (-webkit-text-stroke:1px #000){
  .wl-dossier .sec-h .n{
    color:transparent;
    -webkit-text-stroke:1px rgba(212,175,55,.55);
  }
}
.wl-dossier .sec-h .rule{display:none}   /* ::after below replaces it */
.wl-dossier .sec-h::after{
  content:"";
  flex:1 1 24px;
  height:1px;
  align-self:center;
  background:linear-gradient(90deg, rgba(212,175,55,.35), var(--line,rgba(255,255,255,.09)) 45%, transparent);
}
@media (max-width:640px){
  .wl-dossier .sec-h .n{font-size:24px}
}
@media (min-width:1200px){
  .wl-dossier .sec{margin-bottom:clamp(52px, 4.5vw, 74px)}
  .wl-dossier .sec-h{margin-bottom:16px}
  .wl-dossier .sec-h h2{text-wrap:balance}
  .wl-dossier .sec-lead{
    font-size:calc(var(--prose-size)*.94);
    line-height:1.6;
    margin:-2px 0 24px;
  }
}

/* --------------------------------------------------- 7. margin pull-facts
   Floated right out of the 72ch paragraph box via a negative right margin
   sized by the same tokens that size the band's grid track, so a pull's right
   edge coincides with .profile-main's right edge — one full column-gap short
   of the rail. Net outer width ~0: the text lines never shorten. */
.wl-dossier .pull{display:none}
@media (min-width:1600px){
  .wl-dossier .pull{
    display:block;
    float:right;
    clear:right;
    width:var(--pull-w);
    margin-right:calc(-1 * (var(--pull-w) + var(--pull-gap)));
    margin-left:0;
    text-align:left;
  }
  .wl-dossier .pull::before{
    content:"";
    display:block;
    width:34px;
    height:2px;
    background:var(--gold,#d4af37);
    margin-bottom:12px;
  }
  .wl-dossier .pull-fig{
    display:block;
    font-family:var(--anton,'Anton',sans-serif);
    font-size:clamp(36px,2.6vw,54px);
    line-height:.92;
    color:var(--gold,#d4af37);
    letter-spacing:.01em;
  }
  .wl-dossier .pull-fig--sm{
    font-family:var(--osw,'Oswald',sans-serif);
    font-weight:600;
    font-size:clamp(19px,1.4vw,26px);
    line-height:1.15;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  .wl-dossier .pull-cap{
    display:block;
    margin-top:9px;
    font-family:var(--inter,'Inter',sans-serif);
    font-size:12.5px;
    line-height:1.55;
    color:rgba(244,245,247,.55);
  }
  .wl-dossier .pull--q::before{display:none}
  .wl-dossier .pull-quote{
    display:block;
    font-family:var(--inter,'Inter',sans-serif);
    font-style:italic;
    font-size:15.5px;
    line-height:1.6;
    color:rgba(244,245,247,.78);
  }
  .wl-dossier .pull-quote::before{
    content:"\201C";
    display:block;
    font-family:var(--anton,'Anton',sans-serif);
    font-style:normal;
    font-size:46px;
    line-height:.6;
    padding-top:10px;
    color:var(--gold,#d4af37);
    margin-bottom:10px;
  }
  .wl-dossier .pull-quote::after{content:"\201D"}
}

/* -------------------------------------------- 8. "Setting one thing straight"
   The correction callout, promoted to a framed exhibit. At >=1600px it breaks
   the 72ch column and splits into two print columns across the pull band,
   right edge aligned with the pulls' (== .profile-main's right edge). */
.wl-dossier .corr{
  position:relative;
  clear:right;               /* never render under a margin pull */
  margin:26px 0 28px;
  padding:22px 26px 21px;
  max-width:72ch;
  background:linear-gradient(180deg,#15171d,#0f1015);
  border:1px solid rgba(212,175,55,.26);
  border-left:3px solid var(--gold,#d4af37);
  border-radius:14px;
}
.wl-dossier .corr-kick{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 13px;
  font-family:var(--osw,'Oswald',sans-serif);
  font-weight:600;
  font-size:11.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold,#d4af37);
}
.wl-dossier .corr-kick::before{
  content:"\25C6";
  font-size:9px;
  line-height:1;
  transform:translateY(-1px);
}
.wl-dossier .corr p{
  max-width:none !important;
  margin:0 !important;
  font-size:15px !important;
  line-height:1.68 !important;
}
.wl-dossier .corr b{color:var(--goldb,#f2cc4b)}
@media (min-width:1600px){
  .wl-dossier .corr{
    max-width:calc(72ch + var(--pull-gap) + var(--pull-w));
    padding:26px 32px 24px;
  }
  .wl-dossier .corr p{
    column-count:2;
    column-gap:44px;
  }
}
@media (max-width:640px){
  .wl-dossier .corr{padding:16px 16px 15px;border-radius:11px}
}

/* --------------------------------- 9. wide exhibits' internal measures (B)
   The data sections take .profile-main's full span at >=1600px; single-column
   list content inside them is re-capped so line lengths stay sane. */
@media (min-width:1600px){
  .wl-dossier .faq2-list{max-width:920px}
  .wl-dossier .pod-list{max-width:980px}
  .wl-dossier .ch-list{max-width:1080px}
  .wl-dossier .arch-desc{max-width:70ch}
  .wl-dossier .arch-line{padding-left:24px}
  .wl-dossier .arch-row{grid-template-columns:132px 1fr;padding:13px 0}
  .wl-dossier .arch-yr{font-size:13px;letter-spacing:.04em}
  .wl-dossier .arch-title{font-size:16.5px}
  .wl-dossier .arch-desc{font-size:14px}
}

/* -------------------------------------- 10. the rail's SOURCE NOTES control
   Wording is B's — "10 SOURCE NOTES" (count + noun) — the chip treatment is
   A's, so the live control finally looks like the button it is. The static
   no-JS <p> keeps the plain text-badge look. The accessible name set by
   rail.js is unchanged: "10 of 14 entries carry a source note. Show all
   source notes." */
.wl-dossier .tott .tt-cred{font-size:10px;gap:6px}
.wl-dossier .tott .tt-cred .tt-n{font-size:10px}
.wl-dossier .tott button.tt-cred{
  border:1px solid rgba(212,175,55,.28);
  border-radius:7px;
  padding:5px 8px 5px 9px;
  margin-top:-4px;               /* keep the baseline where the <p> sat */
  transition:color .18s ease,border-color .18s ease;
}
.wl-dossier .tott button.tt-cred:hover,
.wl-dossier .tott button.tt-cred[aria-expanded="true"]{
  border-color:rgba(212,175,55,.55);
}
/* ================== end PROSE & SPREAD ================== */

/* ==== SUBNAV STICKY FIX ==================================================
   The subnav pins at top:var(--nav-h) where profile.css declares --nav-h:62px.
   That token predates the current header: .site-header.nav7 stacks the ticker
   above the nav bar and is 103px tall, sticky, z-index 100. So a pinned subnav
   slid 41px under the header and was painted over - "the subnav goes away when
   I click Personas". Correct the token where the dossier uses it, and give
   every section a scroll margin so anchor jumps land below the full stack. */
.wl-dossier{--nav-h:103px;--stack-top:calc(var(--nav-h) + var(--subnav-h))}
/* profile.js computes its scroll offset from these tokens read off :root (with
   stale 60/44 fallbacks) - so they must exist at :root, not only on the dossier. */
:root{--nav-h:103px;--subnav-h:42px;--idbar-h:0px}
.wl-dossier .sec,.wl-dossier [id]{scroll-margin-top:calc(var(--nav-h) + var(--subnav-h) + 28px)}
@media(max-width:760px){.wl-dossier{--nav-h:96px}}

/* ===== Hero "Fight Metrics" panel (roster-file card) ===================== */
.wl-dossier .portrait .fm-tag{position:absolute;top:14px;right:14px;z-index:2;
  font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.1em;color:#d4af37;
  border:1px solid rgba(212,175,55,.35);padding:3px 7px;border-radius:6px;background:rgba(15,16,21,.55)}
.wl-dossier .portrait .fm{position:relative;z-index:1;display:flex;flex-direction:column;gap:8px;
  padding:44px 14px 84px}
/* big-digit strip */
.wl-dossier .fm-digits{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.wl-dossier .fm-d{background:rgba(21,23,29,.82);border:1px solid rgba(255,255,255,.09);border-radius:12px;
  padding:9px 4px 7px;text-align:center;min-width:0}
.wl-dossier .fm-d b{display:block;font-family:'Anton',sans-serif;font-weight:400;font-size:25px;line-height:1;color:#f2cc4b}
.wl-dossier .fm-d span{display:block;margin-top:4px;font-family:'Oswald',sans-serif;font-weight:600;
  font-size:7.5px;letter-spacing:.11em;text-transform:uppercase;color:rgba(244,245,247,.42);line-height:1.35}
/* middle row: veiled win-rate ring + kayfabe-legal ledger */
.wl-dossier .fm-mid{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px}
.wl-dossier .fm-wl{position:relative;overflow:hidden;background:rgba(15,16,21,.85);
  border:1px solid rgba(212,175,55,.26);border-radius:12px;padding:8px 10px 7px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:116px}
.wl-dossier .fm-wl .rec2-donut{width:86px;height:86px}
.wl-dossier #fm-w{stroke:#d4af37}
.wl-dossier #fm-l{stroke:#e1525c}
.wl-dossier #fm-d{stroke:#cfd2d8}
.wl-dossier #fm-n{stroke:#8a8f98}
.wl-dossier .fm-wl-rec{margin:0;text-align:center}
.wl-dossier .fm-wl-rec b{font-family:'Anton',sans-serif;font-weight:400;font-size:15px;letter-spacing:.03em;color:#f4f5f7}
.wl-dossier .fm-wl-rec span{display:block;margin-top:2px;font-family:'JetBrains Mono',monospace;
  font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:rgba(244,245,247,.42)}
/* the veil reuses .rec2-wl-veil / .rec2-wl-unveil verbatim; only sized down here */
.wl-dossier .fm-wl .rec2-wl-veil{gap:8px;padding:8px}
.wl-dossier .fm-wl .rec2-wl-veil p{font-size:7.5px;letter-spacing:.08em}
.wl-dossier .fm-wl .rec2-wl-unveil{font-size:10px;padding:5px 12px;border-radius:8px}
/* two-ledger record card */
.wl-dossier .fm-ledger{background:rgba(21,23,29,.82);border:1px solid rgba(255,255,255,.09);border-radius:12px;
  padding:9px 11px;min-width:0;display:flex;flex-direction:column;justify-content:center}
.wl-dossier .fm-lg-h{display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:0 0 7px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.07)}
.wl-dossier .fm-lg-h span:first-child{font-family:'Oswald',sans-serif;font-weight:600;font-size:9px;
  letter-spacing:.2em;text-transform:uppercase;color:#d4af37}
.wl-dossier .fm-chip{font-family:'Oswald',sans-serif;font-weight:600;font-size:8.5px;letter-spacing:.13em;
  text-transform:uppercase;color:#0a0b0e;background:linear-gradient(180deg,#f2cc4b,#d4af37);
  padding:3px 9px;border-radius:999px}
.wl-dossier .fm-lg{margin:0;display:flex;flex-direction:column;gap:5px}
.wl-dossier .fm-lg>div{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.wl-dossier .fm-lg dt{font-family:'Oswald',sans-serif;font-weight:500;font-size:8.5px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(244,245,247,.42);white-space:nowrap}
.wl-dossier .fm-lg dd{margin:0;font-family:'JetBrains Mono',monospace;font-size:9px;line-height:1.4;
  color:rgba(244,245,247,.85);text-align:right}
.wl-dossier .fm-lg dd em{font-style:normal;color:#d4af37}
/* bouts-by-promotion bars */
.wl-dossier .fm-bars{background:rgba(21,23,29,.82);border:1px solid rgba(255,255,255,.09);border-radius:12px;
  padding:9px 11px 10px}
.wl-dossier .fm-bars-h{font-family:'Oswald',sans-serif;font-weight:600;font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:#d4af37;margin-bottom:6px}
.wl-dossier .fm-bar{display:grid;grid-template-columns:28px minmax(0,1fr) 20px 28px;align-items:center;gap:7px;margin-top:4px}
.wl-dossier .fm-bar .l{font-family:'Oswald',sans-serif;font-weight:600;font-size:8.5px;letter-spacing:.09em;color:rgba(244,245,247,.75)}
.wl-dossier .fm-bar .t{height:5px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden}
.wl-dossier .fm-bar .t i{display:block;height:100%;min-width:2px;border-radius:3px;
  background:linear-gradient(90deg,#8c7420,#d4af37)}
.wl-dossier .fm-bar .n{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:400;color:#f4f5f7;text-align:right}
.wl-dossier .fm-bar .p{font-family:'JetBrains Mono',monospace;font-size:8px;color:rgba(244,245,247,.42);text-align:right}
/* narrow roster card (portrait maxes at 320px under 900px) */
@media(max-width:900px){
  .wl-dossier .portrait .fm{padding:40px 11px 76px;gap:6px}
  .wl-dossier .fm-d b{font-size:21px}
  .wl-dossier .fm-wl{min-width:104px;padding:7px 8px 6px}
  .wl-dossier .fm-wl .rec2-donut{width:74px;height:74px}
  .wl-dossier .fm-lg dd{font-size:8.5px}
}
/* let the narrow roster card grow past its 3/4 ratio when the metrics need the room
   (aspect-ratio wins over max-content minimums, so drop the ratio where the card is 320px) */
@media(max-width:900px){.wl-dossier .portrait:has(.fm){aspect-ratio:auto}}

/* ==== RIGHT NOW - curated social pulse ==== */
/* RIGHT NOW — social pulse (curated, press-sourced). Scoped under .wl-dossier like every other section family. */

.wl-dossier .pulse-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.wl-dossier .pulse-card{display:flex;flex-direction:column;min-width:0;position:relative;
  background:linear-gradient(180deg,#15171d,#0f1015);
  border:1px solid rgba(255,255,255,.07);border-left:2px solid var(--gold,#d4af37);
  border-radius:12px;padding:16px 18px 15px;transition:border-color .16s,transform .16s}
.wl-dossier .pulse-card:hover{border-left-color:var(--goldb,#f2cc4b);transform:translateY(-2px)}
.wl-dossier .pulse-featured{grid-column:span 2}
.wl-dossier .pulse-featured .pulse-quote{font-size:21px}

/* top row: platform chip + date */
.wl-dossier .pulse-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
.wl-dossier .pulse-chip{font-family:var(--mono,'JetBrains Mono',monospace);font-size:9px;letter-spacing:.09em;
  text-transform:uppercase;color:rgba(244,245,247,.62);border:1px solid rgba(255,255,255,.14);
  border-radius:5px;padding:3px 7px;white-space:nowrap}
.wl-dossier .pulse-chip-ig{color:var(--goldb,#f2cc4b);border-color:rgba(212,175,55,.4);background:rgba(212,175,55,.06)}
.wl-dossier .pulse-date{font-family:var(--mono,'JetBrains Mono',monospace);font-size:10px;letter-spacing:.05em;
  text-transform:uppercase;color:rgba(244,245,247,.42);white-space:nowrap}

/* the quote / the moment */
.wl-dossier .pulse-quote{font-family:var(--osw,'Oswald',sans-serif);font-weight:500;font-size:17px;line-height:1.32;
  color:#f4f5f7;margin:0 0 9px;letter-spacing:.005em}
.wl-dossier .pulse-quote::first-letter{color:var(--goldb,#f2cc4b)} /* gilds the opening ldquo */
.wl-dossier .pulse-moment{font-family:var(--osw,'Oswald',sans-serif);font-weight:400;font-size:15.5px;line-height:1.38;
  color:rgba(244,245,247,.88);margin:0 0 9px;font-style:italic}
.wl-dossier .pulse-why{font-family:var(--inter,'Inter',sans-serif);font-size:12.5px;line-height:1.5;
  color:rgba(244,245,247,.5);margin:0 0 13px}
.wl-dossier .pulse-del{color:var(--redb,#ff2d3d);font-style:normal}

/* source link, pinned to card bottom */
.wl-dossier .pulse-src{margin-top:auto;align-self:flex-start;font-family:var(--osw,'Oswald',sans-serif);font-weight:600;
  font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold,#d4af37);transition:color .14s}
.wl-dossier .pulse-src:hover{color:var(--goldb,#f2cc4b)}

/* context card: the feed's editorial closer — mono, hairline frame, no gold spine */
.wl-dossier .pulse-context{grid-column:1/-1;background:transparent;
  border:1px solid rgba(212,175,55,.22);border-left-width:1px;border-radius:12px}
.wl-dossier .pulse-context:hover{border-color:rgba(212,175,55,.38);transform:none}
.wl-dossier .pulse-context .pulse-quote{font-family:var(--mono,'JetBrains Mono',monospace);font-weight:500;
  font-size:15px;line-height:1.45;letter-spacing:0}
.wl-dossier .pulse-context .pulse-why{font-family:var(--mono,'JetBrains Mono',monospace);font-size:11px;line-height:1.6;
  color:rgba(244,245,247,.46);max-width:88ch}
@media(min-width:901px){
  .wl-dossier .pulse-context{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:34px;align-items:start}
  .wl-dossier .pulse-context .pulse-top{grid-column:1/-1}
  .wl-dossier .pulse-context .pulse-quote{grid-column:1;font-size:17px;margin-bottom:0}
  .wl-dossier .pulse-context .pulse-why{grid-column:2;grid-row:2 / span 2;margin-bottom:0}
  .wl-dossier .pulse-context .pulse-src{grid-column:1;margin-top:14px}
}

/* footer row */
.wl-dossier .pulse-foot{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-top:16px;padding-top:13px;border-top:1px solid rgba(255,255,255,.07)}
.wl-dossier .pulse-follow{font-family:var(--osw,'Oswald',sans-serif);font-weight:600;font-size:12.5px;
  letter-spacing:.05em;text-transform:uppercase;color:var(--gold,#d4af37);transition:color .14s}
.wl-dossier .pulse-follow:hover{color:var(--goldb,#f2cc4b)}
.wl-dossier .pulse-dormant{font-family:var(--mono,'JetBrains Mono',monospace);font-size:10px;letter-spacing:.05em;
  text-transform:uppercase;color:rgba(244,245,247,.34)}

/* reflow: 3 → 2 → 1 */
@media(max-width:1080px){
  .wl-dossier .pulse-grid{grid-template-columns:repeat(2,1fr)}
  .wl-dossier .pulse-featured{grid-column:1/-1}
}
@media(max-width:640px){
  .wl-dossier .pulse-grid{grid-template-columns:1fr}
  .wl-dossier .pulse-featured .pulse-quote{font-size:18px}
}


/* The idn nameplate pinned at a hardcoded 104px - written for the old 62px
   header, where it sat just below the subnav. With the corrected 103px header
   the subnav now occupies 103-145, so the plate slid underneath it. Pin it
   below the full stack instead. */
.wl-dossier .idn{top:calc(var(--nav-h) + var(--subnav-h))}
@media(max-width:1199px){.wl-dossier .idn{top:var(--nav-h)}}

/* ==== LEDGER DISCLAIMER =================================================
   "Some bouts may not be listed." A curated ledger is not a career count;
   say so at the point of reading, not only in the lead paragraph. One line,
   mono, gold tick - the house annotation voice, not a warning box. */
.wl-dossier .ledger-note{display:flex;align-items:center;gap:8px;margin:10px 0 0;
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.06em;
  text-transform:uppercase;color:rgba(244,245,247,.38)}
.wl-dossier .ledger-note::before{content:"";flex:0 0 18px;height:1px;background:var(--gold,#d4af37);opacity:.55}
.wl-dossier .ledger-note b{color:rgba(244,245,247,.6);font-weight:600}
.wl-dossier .fm .ledger-note{margin:8px 2px 0;font-size:9.5px}

/* ==== PULSE: X-embed card chrome =========================================
   A pulse card carrying x_url renders with real post anatomy - avatar
   monogram, name/handle, the X glyph, View on X - in the house palette, not
   Twitter's. Static and curated: only verified posts, real status URLs, no
   invented engagement numbers. */
.wl-dossier .pulse-card--x{border-color:rgba(244,245,247,.14)}
.wl-dossier .pulse-xhead{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.wl-dossier .pulse-av{flex:0 0 34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,#2a2416,#15171d);border:1px solid rgba(212,175,55,.4);
  font-family:'Anton',sans-serif;font-size:13px;color:var(--gold,#d4af37);letter-spacing:.04em}
.wl-dossier .pulse-who{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.wl-dossier .pulse-who b{font-family:'Inter',sans-serif;font-size:13.5px;font-weight:600;color:#f4f5f7}
.wl-dossier .pulse-who span{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:rgba(244,245,247,.42)}
.wl-dossier .pulse-xglyph{margin-left:auto;font-size:15px;color:rgba(244,245,247,.5)}
.wl-dossier .pulse-card--x .pulse-quote{font-style:normal}
.wl-dossier .pulse-links{display:flex;align-items:center;gap:14px;margin-top:12px;flex-wrap:wrap}
.wl-dossier .pulse-links .pulse-date{margin-left:0}

/* ============================================================ */
/* ==== HERO TABS - FIGHT METRICS / LIVE FEED (portrait card) == */
/* ============================================================ */
/* Tab bar: subnav vocabulary - Oswald caps, gold underline indicator,
   hairline separator, no pills. Sits in flow below the absolute .vlabel. */
.wl-dossier .portrait .fm-tabbar{position:relative;z-index:2;display:flex;gap:4px;
  margin:36px 14px 0;border-bottom:1px solid rgba(255,255,255,.09)}
.wl-dossier .fm-tab{appearance:none;background:none;border:0;cursor:pointer;position:relative;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(244,245,247,.45);padding:6px 12px 8px;transition:color .2s}
.wl-dossier .fm-tab:hover{color:#fff}
.wl-dossier .fm-tab::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;
  border-radius:2px;background:var(--gold,#d4af37);transform:scaleX(0);transform-origin:left;
  transition:transform .28s ease}
.wl-dossier .fm-tab[aria-selected="true"]{color:var(--gold,#d4af37)}
.wl-dossier .fm-tab[aria-selected="true"]::after{transform:scaleX(1)}
.wl-dossier .fm-tab:focus-visible{outline:2px solid var(--gold,#d4af37);outline-offset:2px;border-radius:4px}
@media(prefers-reduced-motion:reduce){
  .wl-dossier .fm-tab,.wl-dossier .fm-tab::after{transition:none}}
.wl-dossier .fm-panel[hidden]{display:none}
/* the tab bar replaces .fm-tag and eats into .fm's old 44px top clearance */
.wl-dossier .portrait[data-fm-tabs] .fm{padding:8px 14px 78px;gap:7px}
.wl-dossier .portrait[data-fm-tabs] .fm .ledger-note,
.wl-dossier .portrait[data-fm-tabs] .fm-panel>.ledger-note{margin:7px 16px 0;font-size:9px}
/* ---- FEED panel ---- */
.wl-dossier .fm-feed{position:relative;z-index:1;padding:8px 14px 78px}
/* fixed-height stage: live mount and fallback swap inside it, so the figure
   never jumps when the widget attempt fails over to the curated cards */
.wl-dossier .fm-feed-body{position:relative;min-height:344px;display:flex;flex-direction:column}
.wl-dossier .fm-feed-live{min-height:0;flex:1 1 auto;display:flex;flex-direction:column}
.wl-dossier .fm-feed-live[hidden]{display:none}
.wl-dossier .fm-feed-live .twitter-timeline{font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.08em;color:rgba(244,245,247,.42);text-transform:uppercase;padding:10px 2px}
.wl-dossier .fm-feed-live iframe{border-radius:12px}
.wl-dossier .fm-feed.is-fallback .fm-feed-live{display:none}
.wl-dossier .fm-feed-fallback{display:flex;flex-direction:column;gap:6px}
.wl-dossier .fm-feed-fallback[hidden]{display:none}
/* compact post card */
.wl-dossier .fm-mini{background:rgba(21,23,29,.82);border:1px solid rgba(255,255,255,.09);
  border-radius:12px;padding:8px 10px;min-width:0}
.wl-dossier .fm-mini-top{display:flex;align-items:center;gap:7px;min-width:0}
.wl-dossier .fm-mini-av{flex:0 0 20px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(180deg,#f2cc4b,#d4af37);color:#0a0b0e;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:8px;letter-spacing:.04em}
.wl-dossier .fm-mini-who{display:flex;align-items:baseline;gap:6px;min-width:0}
.wl-dossier .fm-mini-who b{font-family:'Oswald',sans-serif;font-weight:600;font-size:10px;
  letter-spacing:.05em;color:#f4f5f7;white-space:nowrap}
.wl-dossier .fm-mini-who span{font-family:'JetBrains Mono',monospace;font-size:8px;
  color:rgba(244,245,247,.42);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl-dossier .fm-mini-top .pulse-chip{font-size:7.5px;padding:2px 7px}
.wl-dossier .fm-mini-date{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:7.5px;
  letter-spacing:.04em;color:rgba(244,245,247,.42);white-space:nowrap}
/* clamped quote: ~120 chars are emitted, the clamp guarantees two lines max */
.wl-dossier .fm-mini-q{margin:5px 0 0;font-family:'Inter',sans-serif;font-size:10.5px;line-height:1.45;
  color:rgba(244,245,247,.85);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.wl-dossier .fm-mini-src{display:inline-block;margin-top:5px;font-family:'Oswald',sans-serif;font-weight:600;
  font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold,#d4af37)}
.wl-dossier .fm-mini-src:hover{color:#fff}
.wl-dossier .fm-feed-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:auto;padding-top:7px;border-top:1px solid rgba(255,255,255,.09);flex-wrap:wrap}
.wl-dossier .fm-feed-foot a{font-family:'Oswald',sans-serif;font-weight:600;font-size:8.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold,#d4af37)}
.wl-dossier .fm-feed-foot a:hover{color:#fff}
.wl-dossier .fm-feed-foot .fm-foot-note{color:rgba(244,245,247,.45)}
.wl-dossier .fm-feed-foot .fm-foot-note:hover{color:#fff}
/* the tabbed card carries taller content than the 3/4 frame on narrow screens;
   the :has(.fm) escape at <=900px already covers both pages (both panels hold .fm) */
@media(max-width:900px){
  .wl-dossier .portrait[data-fm-tabs] .fm{padding:8px 11px 72px;gap:6px}
  .wl-dossier .fm-feed{padding:8px 11px 72px}
  .wl-dossier .portrait .fm-tabbar{margin:34px 11px 0}
}
/* Desktop (fixed 3/4 card): the tab bar costs ~23px the untabbed card did not
   pay, so the metrics panel compresses to keep six promo bars clear of the
   caption. The in-panel ledger-note was already clipped invisible by the
   3/4 frame on the untabbed card; keep that contract explicit here and let it
   show only under 900px where the card grows with its content. */
@media(min-width:901px){
  .wl-dossier .portrait[data-fm-tabs] .fm-tabbar{margin-top:32px}
  .wl-dossier .portrait[data-fm-tabs] .fm-tab{padding:5px 12px 7px}
  .wl-dossier .portrait[data-fm-tabs] .fm{gap:6px}
  .wl-dossier .portrait[data-fm-tabs] .fm-d{padding:7px 4px 6px}
  .wl-dossier .portrait[data-fm-tabs] .fm-d b{font-size:23px}
  .wl-dossier .portrait[data-fm-tabs] .fm-wl .rec2-donut{width:76px;height:76px}
  .wl-dossier .portrait[data-fm-tabs] .fm-bar{margin-top:3px}
  .wl-dossier .portrait[data-fm-tabs] .fm-panel .ledger-note{display:none}
}
/* <=900px the card is content-height: the flow ledger-note is the last thing
   before the absolute caption, so IT carries the caption clearance instead of
   .fm's bottom padding (which would put the note underneath the caption). */
@media(max-width:900px){
  .wl-dossier .portrait[data-fm-tabs] .fm{padding-bottom:10px}
  .wl-dossier .portrait[data-fm-tabs] .fm-panel>.ledger-note{margin:6px 16px 72px}
}

/* ============================================================================
   FACTION PAGES  (build/build_factions.py)  --  ADDITIVE ONLY
   ----------------------------------------------------------------------------
   /factions/<slug>/ is a SITE page (css/site.css), built from the same
   vocabulary as the hand-authored /factions/the-shield/ and
   /factions/the-bloodline/: .ev-hero, .meta-chips, .sec-h, .grid-cards >
   .card, .moment-body, .related-links. Almost nothing new is needed, and
   nothing here restyles an existing class: every rule is scoped to
   .wl-faction, which only <main id="main" class="wl-faction"> sets.

   Two gaps in site.css, and only two:
     1. .timeline is a bare <li> list with an inline .tl-year. The faction
        timeline is a date + heading + paragraph per beat, which has no
        equivalent. site.css also declares .timeline twice (a ul border-left at
        the top of the file, per-li borders further down), so the ul rule is
        neutralised here to avoid a doubled 4px rail.
     2. .card__initials is sized at --fs-800 (up to 3.6rem). The shipped cards
        use 2-5 characters; a six-character surname (SERENA, CABANA, OTUNGA)
        overflows the 4:5 media box, so it gets a one-step-down modifier.
   ========================================================================== */

/* --- 1. timeline rows ---------------------------------------------------- */
.wl-faction .timeline{border-left:0;margin-left:0;padding-left:0;list-style:none}
.wl-faction .timeline li{padding:0 0 var(--sp-5) var(--sp-5)}
.wl-faction .timeline li:last-child{padding-bottom:0}
.wl-faction .timeline .tl-year{display:block;margin:0 0 .15em;font-size:var(--fs-300);
  text-transform:uppercase;letter-spacing:.08em}
.wl-faction .timeline .tl-title{margin:0 0 .25em;font-family:var(--font-cond);
  text-transform:uppercase;letter-spacing:.01em;font-size:var(--fs-500);line-height:1.15;
  color:var(--c-text)}
.wl-faction .timeline .tl-desc{margin:0;color:var(--c-text-muted);font-size:var(--fs-400);
  line-height:var(--lh-body);max-width:74ch}

/* --- 2. six-character card initials -------------------------------------- */
.wl-faction .card__initials--long{font-size:var(--fs-600);letter-spacing:.02em}

/* --- 3. rhythm ------------------------------------------------------------
   The site template has no "section" element on these pages - .sec-h supplies
   its own top margin - so the only spacing the faction pages add is the gap
   under the last block before the footer, and a little air around the
   sub-headings that group a section's second half. */
.wl-faction .related-links{margin-bottom:var(--sp-8)}
.wl-faction .night-h{margin-top:var(--sp-6)}
.wl-faction .stats-strip{margin-top:var(--sp-5)}
.wl-faction .sig-card>p:last-child,.wl-faction .persona-card>p:last-child{margin-bottom:0}
.wl-faction .champ-row+.champ-row{margin-top:0}
.wl-faction .faq__body p:last-child{margin-bottom:0}


/* ==== training partners (cm-punk #mma, Roufusport .fac-card) ================
   Reuses .ref2-item so each partner is a discrete key/value element rather than
   a run-on sentence. Two rules only, both needed:
   1. .fac-mem carries no top margin, so the label needs air above the grid.
   2. .ref2-item is authored for <a>; partners with no page on disk render as
      <div>, and must not keep the hover affordance of a link that isn't there. */
.wl-dossier .fac-partners-h{margin-top:14px}
.wl-dossier .fac-partners{margin:0}
.wl-dossier div.ref2-item:hover{border-color:rgba(255,255,255,.07);background:#12141a}
/* 3. and the reverse: a partner who DOES have a page must read as a link, so the
      gold that means "go here" everywhere else on the page marks the name. */
.wl-dossier .fac-partners a.ref2-item .ref2-k{color:#d4af37}
.wl-dossier .fac-partners a.ref2-item:hover .ref2-k{color:#f2cc4b}
/* ==== /training partners ==== */

/* ============================================================================
   THE WALK-OUT  —  entrance-theme strip  (build/build_dossier.py :: theme_band,
   js/theme-song.js, optional DATA["theme"] dict)  --  ADDITIVE ONLY
   ----------------------------------------------------------------------------
   A full-bleed band between the hero and .layout: the overture before the
   dossier. Everything here is scoped to .walkout, so nothing above is touched.

   Rules of the house that this block obeys:
     * gold #d4af37 / dim gold #8c7420, panels #15171d / #0f1015, 12px radii,
       the same rgba(255,255,255,.09) hairline used everywhere else;
     * NO green. Spotify is named as the source, never as the skin;
     * no new shadows, no pills — rules and hairlines do the separating;
     * Anton for the track, Oswald caps for labels, JetBrains Mono for
       annotations, Inter for the one paragraph of prose.

   LAYOUT-STABILITY CONTRACT (the reason the swap is free):
   .wo-stage is a fixed 154px box and both of its children (.wo-live,
   .wo-listen) are position:absolute;inset:0. The player and the listen row
   therefore occupy exactly the same box, so js/theme-song.js can swap one for
   the other without moving a single pixel of the page. 154 is deliberate: the
   1px hairline on each side leaves the iframe exactly 152 CSS pixels, which is
   the height Spotify's own oEmbed returns for a compact track player. Measured
   across the swap at 1440/1280/760: CLS 0.000, geometry byte-identical.
   ========================================================================== */
.wl-dossier .walkout{--golddim:#8c7420;position:relative;border-top:1px solid rgba(212,175,55,.22);
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(620px 200px at 7% 0%, rgba(212,175,55,.075), transparent 62%),
    linear-gradient(180deg,#0f1015 0%,#0c0d12 100%)}
.wl-dossier .walkout-in{max-width:var(--max);margin-inline:auto;
  padding:16px var(--gutter) 18px}

/* --- the rule line: gold dash, label, hairline to the right margin -------- */
.wl-dossier .wo-rule{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.wl-dossier .wo-rule::before{content:"";flex:0 0 34px;height:2px;
  background:linear-gradient(90deg,var(--gold),transparent)}
.wl-dossier .wo-rule-k{font-family:var(--osw);font-weight:600;font-size:11.5px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.wl-dossier .wo-rule-line{flex:1 1 auto;height:1px;background:var(--line)}
.wl-dossier .wo-rule-src{font-family:var(--mono);font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--dim);white-space:nowrap}

/* --- three columns, separated by hairlines rather than boxes -------------- */
.wl-dossier .wo-grid{display:grid;grid-template-columns:minmax(0,1fr) 348px 286px;
  gap:28px;align-items:start}
.wl-dossier .wo-play,.wl-dossier .wo-line{border-left:1px solid var(--line);padding-left:28px}

/* --- column 1: the track, set editorially -------------------------------- */
.wl-dossier .wo-kick{margin:0;font-family:var(--osw);font-weight:600;font-size:10.5px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.wl-dossier .wo-kick i{font-style:normal;color:var(--golddim,#8c7420);margin:0 5px}
.wl-dossier .wo-track{margin:7px 0 0;font-family:var(--anton);font-weight:400;
  font-size:clamp(26px,3vw,38px);line-height:.9;letter-spacing:.008em;
  text-transform:uppercase;color:var(--ink)}
.wl-dossier .wo-by{margin:9px 0 0;font-family:var(--osw);font-weight:600;font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--goldb)}
.wl-dossier .wo-meta{display:block;margin-top:5px;font-family:var(--mono);font-weight:400;
  font-size:10px;letter-spacing:.05em;text-transform:none;color:var(--dim)}
.wl-dossier .wo-note{margin:11px 0 0;font-family:var(--inter);font-size:13.5px;
  line-height:1.5;color:var(--muted)}
.wl-dossier .wo-note b{color:var(--ink);font-weight:600}
/* --- the caption strip under the three columns --------------------------
   The crowd-pop cue and the sourcing line share one full-width row, which is
   what keeps this a band: the cue would otherwise stretch column one to twice
   the height of the player beside it. */
.wl-dossier .wo-under{display:flex;align-items:flex-start;justify-content:space-between;
  gap:34px;margin-top:13px;padding-top:11px;border-top:1px solid var(--line2)}
.wl-dossier .wo-cue{margin:0;padding-left:13px;border-left:1px solid var(--golddim,#8c7420);
  max-width:72ch}
.wl-dossier .wo-cue p{margin:0;font-family:var(--inter);font-style:italic;font-size:14px;
  line-height:1.45;color:var(--ink)}
.wl-dossier .wo-cue cite{display:block;margin-top:4px;font-family:var(--mono);font-style:normal;
  font-size:9.5px;letter-spacing:.04em;line-height:1.5;color:var(--dim)}
.wl-dossier .wo-cue cite i{font-style:italic}

/* --- column labels shared by the player and the lineage ------------------- */
.wl-dossier .wo-lbl{margin:0 0 8px;font-family:var(--osw);font-weight:600;font-size:9.5px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}

/* --- column 2: the player stage (fixed box — see the contract above) ------ */
.wl-dossier .wo-stage{position:relative;height:154px;border:1px solid var(--line);
  border-radius:12px;background:#15171d;overflow:hidden}
.wl-dossier .wo-live{position:absolute;inset:0}
.wl-dossier .wo-live[hidden]{display:none}
.wl-dossier .wo-live iframe{display:block;width:100%;height:100%;border:0}
/* shown behind the frame while an attempt is in flight; never an error message */
.wl-dossier .wo-wait{position:absolute;inset:0;z-index:0;display:none;
  align-items:center;justify-content:center;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.wl-dossier .wo-stage.is-pending .wo-wait{display:flex}

/* --- the fallback: a listen row that stands on its own ------------------- */
.wl-dossier .wo-listen{position:absolute;inset:0;z-index:1;margin:0;padding:0;list-style:none;
  display:flex;flex-direction:column;justify-content:center}
.wl-dossier .wo-listen[hidden]{display:none}
.wl-dossier .wo-listen li+li{border-top:1px solid var(--line)}
.wl-dossier .wo-listen a{display:flex;align-items:baseline;gap:10px;padding:11px 14px;
  text-decoration:none;color:var(--ink);transition:background .2s ease,color .2s ease}
.wl-dossier .wo-listen a:hover{background:rgba(212,175,55,.06)}
.wl-dossier .wo-svc{font-family:var(--osw);font-weight:600;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase}
.wl-dossier .wo-listen a:hover .wo-svc{color:var(--goldb)}
.wl-dossier .wo-sub{font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--dim);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl-dossier .wo-go{margin-left:auto;color:var(--golddim,#8c7420);font-size:12px;line-height:1}
.wl-dossier .wo-listen a:hover .wo-go{color:var(--gold)}
.wl-dossier .wo-listen a:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:11px}

/* --- column 3: the lineage, as small dated entries ----------------------- */
.wl-dossier .wo-lin{margin:0;padding:0;list-style:none}
.wl-dossier .wo-lin li{display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;
  align-items:baseline;padding:6px 0;border-top:1px solid var(--line2)}
.wl-dossier .wo-lin li:first-child{border-top:0;padding-top:0}
.wl-dossier .wo-d{font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;color:var(--golddim,#8c7420)}
.wl-dossier .wo-lin b{display:block;font-family:var(--osw);font-weight:600;font-size:10.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted);line-height:1.3}
.wl-dossier .wo-lin span.wo-w{display:block;font-family:var(--mono);font-size:9px;
  letter-spacing:.04em;color:var(--dim);margin-top:2px}
.wl-dossier .wo-lin li.is-now .wo-d{color:var(--goldb)}
.wl-dossier .wo-lin li.is-now b{color:var(--ink)}
.wl-dossier .wo-now{display:block;margin-top:2px;font-family:var(--osw);font-weight:600;
  font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);white-space:nowrap}

/* --- the sourcing line, in the house's credibility voice ----------------- */
.wl-dossier .wo-foot{flex:0 1 auto;margin:0;max-width:58ch;text-align:right;line-height:1.7;
  font-family:var(--mono);font-size:9px;letter-spacing:.04em;color:var(--dim)}
.wl-dossier .wo-foot a{color:var(--dim);text-decoration:none;border-bottom:1px solid rgba(140,116,32,.5)}
.wl-dossier .wo-foot a:hover{color:var(--goldb);border-bottom-color:var(--gold)}

@media(prefers-reduced-motion:reduce){
  .wl-dossier .wo-listen a{transition:none}}

/* --- narrow: lineage drops under the first two columns ------------------- */
@media(max-width:1180px){
  .wl-dossier .wo-grid{grid-template-columns:minmax(0,1fr) 330px}
  .wl-dossier .wo-line{grid-column:1/-1;border-left:0;padding-left:0;padding-top:14px;
    border-top:1px solid var(--line)}
  .wl-dossier .wo-lin{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 22px}
  .wl-dossier .wo-lin li{border-top:0;padding:0;grid-template-columns:1fr;gap:3px}
  .wl-dossier .wo-lin li:first-child{padding-top:0}
}
@media(max-width:1180px){
  .wl-dossier .wo-under{flex-direction:column;gap:12px}
  .wl-dossier .wo-foot{text-align:left;max-width:none}
}
@media(max-width:860px){
  .wl-dossier .walkout-in{padding:18px var(--gutter) 20px}
  .wl-dossier .wo-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .wl-dossier .wo-play{border-left:0;padding-left:0;padding-top:16px;border-top:1px solid var(--line)}
  .wl-dossier .wo-line{padding-top:16px}
  .wl-dossier .wo-lin{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}
  .wl-dossier .wo-rule-src{display:none}
  .wl-dossier .wo-note,.wl-dossier .wo-cue{max-width:none}
}
@media(max-width:480px){
  .wl-dossier .wo-lin{grid-template-columns:minmax(0,1fr);gap:10px}
  .wl-dossier .wo-rule-k{letter-spacing:.24em;font-size:10.5px}
}
/* ======================= end THE WALK-OUT ======================= */

/* ============================================================================
   SIGNATURE PREVIEW  —  hover/focus card for a linked .sig2-card
   (build/build_dossier.py :: sig_card / sig_preview, js/sig-preview.js,
   build/patch_sig_links.py for the hand-authored pages)  --  ADDITIVE ONLY
   ----------------------------------------------------------------------------
   .sig2-reel is `overflow-x:auto`, which makes it a scroll container and CLIPS
   every descendant on both axes. A popover parented to the card is therefore
   impossible to show — it is cut off at the reel's padding box no matter what
   z-index or transform it carries, because clipping is not a paint-order
   problem. So the panel is NOT a descendant: js/sig-preview.js appends ONE
   .sig-prev to <body> and positions it `fixed` from the hovered card's
   getBoundingClientRect(). Nothing about the reel can clip it, and because it
   is a single shared node the DOM cost is one element per page, not one per
   card. `pointer-events:none` means the panel can never sit between the cursor
   and the card, so hover can never flicker or stick.

   Rules of the house that this block obeys:
     * gold #d4af37 / dim gold #8c7420, panels #15171d / #0f1015, 12px radii
     * hairlines only — no new shadows, no pills, no green
     * `fixed` + a body parent means the panel is out of flow: zero layout shift
   ========================================================================== */
.sig-prev{
  position:fixed;top:0;left:0;z-index:140;
  width:min(320px,calc(100vw - 24px));
  box-sizing:border-box;padding:14px 15px 13px;
  background:#15171d;border:1px solid rgba(212,175,55,.34);border-radius:12px;
  pointer-events:none;visibility:hidden;opacity:0;
  transform:translateY(4px);
  transition:opacity .13s ease,transform .13s ease,visibility 0s linear .13s;
}
.sig-prev.is-open{visibility:visible;opacity:1;transform:none;transition-delay:0s}

/* --- the head: what the match is, and how it rated ------------------------ */
.sig-prev-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.sig-prev-ttl{
  font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;
  font-size:15px;line-height:1.2;color:#f4f5f7;margin:0;
}
.sig-prev-rate{font-family:'Anton',sans-serif;font-size:22px;line-height:1;color:#f2cc4b;flex:0 0 auto}
.sig-prev-stars{display:block;font-size:9.5px;letter-spacing:1px;color:#d4af37;text-align:right;margin-top:3px}

/* --- the dateline, in the house's mono voice ------------------------------ */
.sig-prev-meta{
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;
  text-transform:uppercase;color:#8a8f98;margin:9px 0 0;line-height:1.55;
}
.sig-prev-meta b{color:#d4af37;font-weight:400}
.sig-prev-hook{
  font-family:'Inter',sans-serif;font-size:12.5px;line-height:1.5;
  color:rgba(244,245,247,.72);margin:10px 0 0;
  padding-top:10px;border-top:1px solid rgba(255,255,255,.07);
}
.sig-prev-cue{
  display:block;font-family:'JetBrains Mono',monospace;font-size:7.5px;
  letter-spacing:.1em;text-transform:uppercase;color:#8c7420;margin-top:10px;
}

/* --- the card that owns the open panel reads as active -------------------- */
.wl-dossier .sig2-card--link.is-previewing{border-color:rgba(212,175,55,.45)}

/* Touch and coarse pointers never get the panel at all: there is no hover
   there, a tap must simply follow the link, and a panel with no way to
   dismiss it would strand the reader. JS gates on the same query. */
@media (hover:none) and (pointer:coarse){
  .sig-prev{display:none}
}
@media (prefers-reduced-motion:reduce){
  .sig-prev{transition:none;transform:none}
  .sig-prev.is-open{transform:none}
}
/* ==================== end SIGNATURE PREVIEW ==================== */

/* ==== MMA SECTION: shield, order, breathing room ========================
   Three fixes. (1) The MMA record carried no spoiler shield while the
   pro-wrestling ledger above it did - inconsistent, and these results spoil
   too. (2) The gym card sat ABOVE the record; the record is the point of the
   section, so it leads. (3) The Roufusport card had no separation from the
   table above or the section below. */
.wl-dossier .mma-ledger{position:relative;border-radius:12px;overflow:hidden}
.wl-dossier .mma-ledger .mma-body{transition:filter .3s ease,opacity .3s ease}
.wl-dossier .mma-veiled .mma-body{filter:blur(7px);opacity:.5;pointer-events:none;user-select:none}
.wl-dossier .mma-veil{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:12px;text-align:center;padding:18px;
  background:linear-gradient(180deg,rgba(15,16,21,.72),rgba(15,16,21,.88))}
.wl-dossier .mma-veil p{margin:0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;
  letter-spacing:.07em;text-transform:uppercase;color:rgba(244,245,247,.62);max-width:44ch;line-height:1.6}
.wl-dossier .mma-ledger:not(.mma-veiled) .mma-veil{display:none}

/* the gym card, given room to breathe on both sides */
.wl-dossier .mma-subhead{margin:30px 0 12px;font-family:'Oswald',system-ui,sans-serif;font-size:11.5px;
  font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,245,247,.5)}
.wl-dossier #mma .fac-grid{margin-bottom:8px}
.wl-dossier #mma .fac-card{padding:20px 22px}
.wl-dossier #mma .fac-desc{margin-top:10px}
@media(prefers-reduced-motion:reduce){.wl-dossier .mma-ledger .mma-body{transition:none}}

/* ==== FACTION PROSE MEASURE ==============================================
   The faction pages inherit .wrap (1200px) with no measure of their own, so
   the lead callout (p.answer) and the deck line (p.muted) set at the full
   1200px - roughly 130 characters per line, about double the 55-75 that
   people read comfortably. .moment-body already carries max-width:68ch and
   was the only reason the body copy below looked right; the two lead
   elements above it did not, which is exactly the "too far left, too wide"
   read: a 1200px line has no right edge to return to.

   Scoped to main.wl-faction so nothing on the dossier or hub pages moves.
   First attempt used 68ch on each element and did NOT work: ch is relative to
   the element's own font-size, and .answer sets at --fs-500 while .moment-body
   sets at body size, so "the same 68ch" resolved to 926px and 720px - two
   different right edges, which is the defect, not the fix. A measure that is
   supposed to be shared has to be ONE value, so it is a single custom property
   in px, applied to all three. Verified: lead, callout and body all end at the
   same x.
   ========================================================================== */
.wl-faction{--fac-measure:720px}
.wl-faction .answer{max-width:var(--fac-measure)}
.wl-faction > .wrap > p.muted{max-width:var(--fac-measure)}
.wl-faction .sec-h + p.muted{max-width:var(--fac-measure)}
.wl-faction .moment-body{max-width:var(--fac-measure)}
/* ==================== end FACTION PROSE MEASURE ==================== */