/* Breaking Analytics player pages. Built file, do not edit by hand. */
/* ===== 3. EDITORIAL — heavy grotesque headline against a reading serif.
   Generous space, one accent, flat surfaces. Reads like a print feature. */
:root{
  --paper:#FAFAFA;--tint:#FFFFFF;--ink:#1F1F1F;--ink-2:#3B3B3B;--muted:#666666;
  --rule:#DDDDDD;--rule-soft:#ECECEC;--orange:#D9531A;--orange-soft:#FDEFE8;
  --red:#B04408;--red-soft:#FDEFE8;--amber:#7A5A12;--good:#B04408;--good-soft:#FDEFE8;
  --on-photo:#F4F4F4;--found-amber:#E8B84A;--found-grey:#C9C9C9;--on-photo-2:#C2C2C2;--photo-scrim:16,16,16;
  --found-bg:#1F1F1F;--found-br:#EE4F13;--found-ink:#FF8A3D;--found-ink-2:#FDBE8E;
  --foil:linear-gradient(100deg,#FD5A1E,#1F1F1F);
  --shadow:none;
  --f-display:"Antonio",Impact,sans-serif;
  --f-body:"Newsreader",Georgia,serif;
  --f-mono:"Roboto Mono",monospace;
}
body{font-size:17px;line-height:1.65}
/* Width now comes from --page in the template; the ch caps below keep the
   prose measure readable even though the page box is wide. */
.foilbar{height:10px;background:var(--ink)}
.card,.tbl-wrap,.tiers,.kpis{border-radius:0;box-shadow:none}
.masthead{padding:44px 0 26px;text-align:center}
/* The hero sat between two centred blocks with its big number pinned far left
   and its paragraph far right, a metre of white paper between them. Stack it
   and centre it so the three blocks read as one column. */
.hero{grid-template-columns:1fr;justify-items:center;text-align:center;
  max-width:74ch;margin-left:auto;margin-right:auto;gap:14px}
.hero .bignum{justify-content:center}
.mh-top{justify-content:center}
.mh-sub{margin-left:auto;margin-right:auto}
.mh-title{font-weight:400;text-transform:none;letter-spacing:-.035em;line-height:.92;
  font-size:clamp(40px,8vw,86px)}
.mh-set{font-family:var(--f-body);font-style:italic;font-weight:400;text-transform:none;
  letter-spacing:0;color:var(--muted);font-size:clamp(18px,2.4vw,22px)}
.mh-sub{font-size:17px;max-width:60ch;color:var(--ink-2)}
.sec{margin-top:0}
.sec-tag{background:transparent;border:0;padding:0;color:var(--ink);letter-spacing:.2em}
.sec-title{font-weight:400;text-transform:none;letter-spacing:-.03em;font-size:clamp(26px,4vw,40px)}
.sec-note{font-size:16px;max-width:62ch}
/* The header stays pinned while the body scrolls, so it cannot be transparent —
   player names read straight through it. Light gold sits apart from both the
   white paper and the warm hover tint, so the pinned row stays legible as
   content passes behind it. Ink on this gold is 16.7:1. */
:root{--thead-bg:#EDEDED;--thead-rule:#DADADA}
thead th{background:var(--thead-bg);border-bottom:2px solid var(--ink);color:var(--ink);letter-spacing:.14em}
tbody tr:hover{background:var(--tint)}
.pname{font-family:var(--f-display);font-weight:400;font-size:15px;letter-spacing:-.01em}
.pip{border-radius:0;min-width:24px;height:22px}
/* The bare element selectors here are (0,0,1) and lost to the template's
   .ff input / .ff select / .ff textarea / input[type=text] at (0,1,1), so the
   search box and every form field kept 5px corners while the rest of this
   flat-surface theme was square. Match the specificity. */
.par,.status,.btn,input,select,textarea,
.ff input,.ff select,.ff textarea,input[type=text]{border-radius:0}
.btn.primary,.btn.on{background:var(--ink);border-color:var(--ink)}
.bignum{font-weight:400;letter-spacing:-.06em}
.tier-bar{border-radius:0}
.tier-v,.kpi-v,.found-lbl,.br-price{font-weight:400}

/* Flat chips. The base gradient runs orange->green in this palette, which leaves
   dark text at 1.97:1 on the green stop — unreadable. Editorial is a flat-surface
   theme anyway, so each parallel gets a solid fill with checked contrast. */
.par{font-weight:600;letter-spacing:.09em;padding:3px 8px;border-width:1px}
.par[data-p="SuperFractor"],
.par[data-p="Black"],
.par[data-p="Padparadscha Sapphire"]{
  background:var(--ink);border-color:var(--ink);color:#FFFFFF}          /* 15.8:1 */
.par[data-p="Red Refractor"],
.par[data-p="Red Sapphire"]{
  background:#FDEFE8;border-color:#F5CDBB;color:#8E3406}                /* 8.0:1  */
.par[data-p="White Refractor"]{
  background:#F5F5F5;border-color:#DADADA;color:#3B3B3B}                /* 9.4:1  */
.par[data-p="Black Sapphire"]{
  background:#EDEDED;border-color:#DADADA;color:#2E2E2E}                /* 9.4:1  */
.par[data-p="Refractor"]{
  background:#FFFFFF;border-color:#DDDDDD;color:#3B3B3B}                /* 8.8:1 */
.chip.rare{background:var(--ink);color:#fff}

/* Section headings. A tiny mono label sitting beside a 40px headline reads as
   two unrelated elements. Editorial convention is a kicker stacked above the
   headline. Now that the page runs to the full table width, a heading block
   pinned to the left edge leaves a metre of empty paper beside it, so the
   kicker, headline and note are centred as one unit. */
.sec-head{flex-direction:column;align-items:center;text-align:center;gap:8px;margin-bottom:10px}
.sec-tag{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:.26em;
  text-transform:uppercase;color:var(--ink);padding:0;background:none;border:0;line-height:1}
.sec-title{line-height:.95;margin:0}
.sec-note{margin-top:12px;margin-left:auto;margin-right:auto;text-align:center}
/* Masthead kicker gets the same treatment for consistency. */
.mh-top .eyebrow{font-size:12px;letter-spacing:.26em}
.mh-top .eyebrow:first-child{color:var(--ink)}

/* Antonio — condensed. Narrow faces carry more characters per line, so the
   headline can run larger without dominating, and the tracking needs less negative. */
.mh-title,.sec-title,.pname,.bignum,.tier-v,.kpi-v,.found-lbl,.br-price,.sfield h4{
  font-weight:700;letter-spacing:-.015em}
.mh-title{font-size:clamp(46px,9vw,96px);line-height:.9}
.sec-title{font-size:clamp(30px,4.8vw,50px)}
.pname{font-size:16px;letter-spacing:0}

/* Numerator and denominator are one figure and are set at one size. Shrinking
   the "/ 99" to a mono caption made it read as a footnote rather than as the
   other half of the fraction. Colour alone separates them: the count in red,
   the total in muted grey, same face, same size. */
.bignum{display:flex;align-items:baseline;gap:.06em;flex-wrap:wrap}
.bignum em{font-family:inherit;font-weight:inherit;font-style:normal;
  font-size:1em;letter-spacing:inherit;color:var(--muted);white-space:nowrap}
.tier-v{display:flex;align-items:baseline;gap:.1em}
.tier-v span{font-family:inherit;font-size:1em;font-weight:inherit;
  letter-spacing:inherit;color:var(--muted)}
/* Antonio is condensed, so it occupies less width and reads smaller than a
   normal-width face at the same pixel size. Scale the hero figure up to match
   the presence Archivo Black had. */
.bignum{font-size:clamp(76px,13.5vw,148px);line-height:.86}

/* ---------- red accents ----------
   #B4102A scores 6.5:1 both as text on paper and with white text on it, so the
   same red works for type, fills and rules. Green is kept strictly semantic —
   it only ever means "verified" — so red can carry the brand without confusion. */
:root{--red:#B04408;--red-soft:#FDEFE8;}
.foilbar{background:var(--red);height:10px}
.mh-title{border-bottom:none}
.mh-set{color:var(--ink);font-style:normal;font-family:var(--f-display);
  font-weight:500;letter-spacing:.01em;text-transform:uppercase}
.bignum{color:var(--ink)}
.bignum em{color:var(--muted)}
.sec-title{position:relative;padding-top:14px}
.sec-title::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:52px;height:5px;background:var(--red)}
.mh-top .eyebrow:first-child{color:var(--ink)}
/* A collapsed border does not paint reliably on a sticky cell, so the red rule
   under the header is drawn as an inset shadow instead. */
thead th{border-bottom:2px solid var(--red);box-shadow:inset 0 -2px 0 var(--red)}
thead th:hover{color:var(--red)}
.btn.primary,.btn.on{background:var(--red);border-color:var(--red);color:#fff}
.btn.primary:hover{background:#8A3506;border-color:#8A3506}
.btn:hover{border-color:var(--red);color:var(--red)}
a.lnk{color:var(--red);border-bottom-color:#EFC0A8}
a.lnk:hover{background:var(--red-soft)}
a.uname:hover{color:var(--red);border-bottom-color:var(--red)}
.ff label b,.captcha-wrap .hint b{color:var(--red)}
.found-lbl.none{color:var(--muted)}
.found-lbl.some{color:var(--ink)}
.par[data-p="Red Refractor"],.par[data-p="Red Sapphire"]{
  background:var(--red);border-color:var(--red);color:#fff}
.notes h3{color:var(--ink)}
.notes strong{color:var(--ink)}
footer{border-top:2px solid var(--red)}


/* ---------- alternating bands ----------
   Two colours, both taken from the page itself: the masthead's ink and the
   table's paper, swapping at every section. The nav takes the leading band so
   no white strip sits on top of the ink masthead.

   Half the body copy lands on dark, so the ink band is held well above the 4.5
   floor — small type reads worse on a dark ground than the same ratio on a
   light one. Its targets are muted 5.5, body 9.0, headings 13.0, semantics 5.0.
   Both palettes were solved against the band AND the card tint, since cards,
   tier boxes and the table wrapper sit on the tint rather than the band itself.

   Measured on the rendered page. Both bands are light in this scheme, a half
   tone apart, so the grid carries the weight instead of the background.
   Band one: ink 14.32, ink-2 10.10, muted 5.33, orange 5.34, gold 5.95.
   Band two: ink 14.31, muted 5.53, orange 5.59, gold 6.24.
   Found cell: black fill with orange type at 6.53 and the first name at 9.44,
   fill against the page at 14.32. Orange carries links, rules and borders;
   gold is kept for money and live auctions so the two never read alike. */
.band[data-band="ink"]{
  --paper:#F1F1F1;
  --muted:#606060;
  --ink-2:#383838;
  --ink:#1B1B1B;
  --red:#A33F07;
  --good:#A33F07;
  --amber:#705312;
  --tint:#FAFAFA;
  --rule:#D8D8D8;
  --rule-soft:#E6E6E6;
  --thead-bg:#E7E7E7;
  --orange:#D9531A;
  --orange-soft:#FBEDE6;
  --good-soft:#FAFAFA;--red-soft:#FAFAFA;
  background:var(--paper);color:var(--ink-2);
  --row-a:#FAFAFA;--row-b:#F3F3F3;--row-hover:#E5E5E5;
  --found-bg:#1F1F1F;--found-br:#EE4F13;--found-ink:#FF8A3D;--found-ink-2:#FDBE8E;
}
.band[data-band="paper"]{
  --paper:#FAFAFA;
  --muted:#666666;
  --ink-2:#3B3B3B;
  --ink:#1F1F1F;
  --red:#B04408;
  --good:#B04408;
  --amber:#7A5A12;
  --tint:#FFFFFF;
  --rule:#DDDDDD;
  --rule-soft:#ECECEC;
  --thead-bg:#EDEDED;
  --orange:#D9531A;
  --orange-soft:#FDEFE8;
  --good-soft:#FFFFFF;--red-soft:#FFFFFF;
  background:var(--paper);color:var(--ink-2);
  --row-a:#FFFFFF;--row-b:#F5F5F5;--row-hover:#E9E9E9;
  --found-bg:#1F1F1F;--found-br:#EE4F13;--found-ink:#FF8A3D;--found-ink-2:#FDBE8E;
}

/* Every surface follows its band, or it reads as a hole cut in the page. */
.band .card,.band .tier,.band .tiers,.band .tbl-wrap,.band table{background:var(--tint)}
.band thead th{background:var(--thead-bg);box-shadow:inset 0 -2px 0 var(--red);color:var(--ink)}
.band tbody tr:hover{background:var(--thead-bg)}
.band tbody td,.band .card,.band .tier,.band .tbl-wrap{border-color:var(--rule)}
/* The accents are solved against the band, and the header fill is a shade
   lighter than that — green landed at 4.44 there and red at 4.41. The arrow
   says which column is sorted, so it takes the body colour at 11.5:1. */
.band thead th .arw{opacity:1;color:var(--ink-2)}
.band thead th[aria-sort] .arw{opacity:1;color:var(--ink)}
.band input,.band select,.band textarea{
  background:var(--paper);color:var(--ink);border-color:var(--rule)}
.band ::placeholder{color:var(--muted);opacity:1}
.band .btn{color:var(--ink-2);border-color:var(--rule)}
/* White on this red is 6.5:1 either way round; ink on it was 2.86:1. */
.band .btn.primary,.band .btn.on{background:var(--red);border-color:var(--red);color:#fff}
.band[data-band="ink"] .btn.primary,.band[data-band="ink"] .btn.on{color:#FFFFFF}
.band .btn:hover{border-color:var(--red);color:var(--red)}
.band .lastbar{background:var(--thead-bg);border-color:var(--rule);border-left-color:var(--red)}
.band .lb-k{color:var(--muted)}
.band .lb-v,.band .pname,.band .money{color:var(--ink)}
.band .mh-title,.band .sec-title,.band .notes h3{color:var(--ink)}
.band .mh-set,.band .sec-tag,.band .bignum{color:var(--ink)}
.band .notes strong,.band .foot-home{color:var(--ink)}
.band a.lnk,.band .notes a{color:var(--red);border-bottom-color:var(--rule)}
.band a.uname{color:var(--ink-2)}
.band .found-lbl.all{color:var(--good)}
.band .found-lbl.none{color:var(--muted)}
.band .sec-title::before{background:var(--red)}
.band .tier-bar{background:var(--thead-bg)}
.band .sub,.band .count,.band .ff small,.band .tier-k{color:var(--muted)}
.band .sitenav{border-bottom-color:var(--rule)}
.band .nav-brand,.band .nav-l{color:var(--ink-2)}
.band .nav-l.here,.band .nav-brand:hover,.band .nav-l:hover{color:var(--red)}
.band .nav-sub{background:var(--tint);border-color:var(--rule)}
.band .nav-s{color:var(--ink-2)}
.band .nav-s:hover{background:var(--thead-bg);color:var(--red)}
.band[data-band="ink"] .foilbar{background:var(--red)}
@media print{.band{background:#fff!important;color:#000!important}}

/* Chips and pips on the ink band.
   Both were designed as coloured fills for light paper: the parallel chips
   measured 1.11:1 and the serial pips 2.47:1 once the band went dark. Neither
   shows on a pure 1/1 set, so this only bites on a numbered release — which is
   exactly why it has to be fixed in the shared template rather than noticed
   later. On ink they invert: the band's own solved tokens, which are already
   verified against both the band and the card tint. */
.band[data-band="ink"] .par{background:var(--tint);border-color:var(--rule);color:var(--ink-2)}
.band[data-band="ink"] .par[data-p="SuperFractor"],
.band[data-band="ink"] .par[data-p="Black"],
.band[data-band="ink"] .par[data-p="Padparadscha Sapphire"]{
  background:var(--ink);border-color:var(--ink);color:var(--paper)}
.band[data-band="ink"] .par[data-p="Red Refractor"],
.band[data-band="ink"] .par[data-p="Red Sapphire"]{
  background:var(--tint);border-color:var(--red);color:var(--red)}
.band[data-band="ink"] .par[data-p="Black Sapphire"]{
  background:var(--tint);border-color:var(--good);color:var(--good)}
.band[data-band="ink"] .par[data-p="White Refractor"],
.band[data-band="ink"] .par[data-p="Refractor"]{
  background:var(--tint);border-color:var(--rule);color:var(--ink-2)}

.band[data-band="ink"] .pip{background:var(--tint);border-color:var(--rule);color:var(--muted)}
.band[data-band="ink"] .pip.verified{background:var(--good);border-color:var(--good);color:var(--paper)}
.band[data-band="ink"] .pip.reported{background:var(--amber);border-color:var(--amber);color:var(--paper)}
.band[data-band="ink"] .pip.disputed{background:var(--red);border-color:var(--red);color:var(--paper)}
.band[data-band="ink"] .pip-unplaced{color:var(--red)}
.band[data-band="ink"] .status.verified{background:var(--tint);border-color:var(--good);color:var(--good)}
.band[data-band="ink"] .status.reported{background:var(--tint);border-color:var(--amber);color:var(--amber)}
.band[data-band="ink"] .status.disputed{background:var(--tint);border-color:var(--red);color:var(--red)}
.band .nav-toggle{color:var(--ink-2);border-color:var(--rule)}
.band .nav-toggle:hover{color:var(--red);border-color:var(--red)}

/* ---------- striped rows ----------
   Alternating rows on a 99-row table are a real aid: your eye keeps its place
   across eight columns without a ruler. The cost is that every piece of text in
   the table now has to clear its floor on four surfaces rather than one — two
   stripes, the hover, and the pinned first column — so the band tokens above
   were re-solved against all of them.

   The hover is deliberately the smallest step that still reads as a hover.
   Letting it go as far as the contrast budget allowed put it 22 dE from the row
   and dragged every token darker to compensate, which cost the muted grey its
   muted quality for no gain. */
.band tbody tr:nth-child(odd){background:var(--row-a)}
.band tbody tr:nth-child(even){background:var(--row-b)}
.band tbody tr:hover{background:var(--row-hover)}
/* The card table cannot stripe on nth-child. Its debut panels are sibling
   rows in the same tbody, so the pattern counts them and the alternation
   collapses the moment any card has debut data — with a full debut file it
   puts every card row on an odd index and the stripes vanish entirely.
   The JS tags each card row .sa/.sb instead; these rules are that half, and
   they have to outrank the nth-child pair above. */
#cardTbl tbody tr:nth-child(odd),
#cardTbl tbody tr:nth-child(even){background:transparent}
#cardTbl tbody tr.sa{background:var(--row-a)}
#cardTbl tbody tr.sb{background:var(--row-b)}
/* A panel belongs to the row above it, so it carries that row's stripe
   rather than reading as a band of its own. */
#cardTbl tbody tr.debut.under-sa{background:var(--row-a)}
#cardTbl tbody tr.debut.under-sb{background:var(--row-b)}
#cardTbl tbody tr.cardrow:hover{background:var(--row-hover)}
.band table,.band .tbl-wrap{background:var(--row-a)}
/* The pinned player column on narrow screens paints its own background, so it
   has to follow the stripe underneath it or it slides over the wrong colour. */
@media (max-width:820px){
  #cardTbl.one-of-one tbody tr.sa td:nth-child(1){background:var(--row-a)}
  #cardTbl.one-of-one tbody tr.sb td:nth-child(1){background:var(--row-b)}
  #cardTbl.one-of-one tbody tr.cardrow:hover td:nth-child(1){background:var(--row-hover)}
}
@media print{.band tbody tr:nth-child(even){background:#EDF1F5}
  .band tbody tr:nth-child(odd){background:#fff}}

/* The "Latest" badge sits on --red, which is lightened on the ink band so that
   it reads against dark. White on that lightened red is 2.48:1; the band's own
   paper is 7.46:1. Set the badge text per band rather than hardcoding it. */
.band[data-band="ink"]{--badge-ink:#FFFFFF}
.band[data-band="paper"]{--badge-ink:#FFFFFF}
.band .ended{background:var(--amber);color:var(--paper)}

/* ---------- site menu ----------
   These pages sit outside WordPress and inherit none of the theme's chrome, so
   the menu is rebuilt here in the page's own voice: same links, same order. */
.sitenav{border-bottom:1px solid var(--rule);background:var(--paper);
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;
  width:100%;margin:0;padding:13px max(var(--gutter,22px),calc((100% - var(--wrap,1120px))/2 + var(--gutter,22px)));box-sizing:border-box}
.nav-brand{font-family:var(--f-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.02em;font-size:19px;color:var(--ink);text-decoration:none;
  line-height:1;margin-right:auto;white-space:nowrap}
.nav-brand:hover{color:var(--red)}
.nav-brand{display:inline-flex;align-items:center;gap:.45em}.nav-mark{width:1.25em;height:1.25em;flex:none;color:#EE4F13;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.nav-list{display:flex;flex-wrap:wrap;align-items:center;gap:4px 22px;
  list-style:none;margin:0;padding:0}
.nav-i{position:relative}
.nav-l{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-2);text-decoration:none;
  background:none;border:0;padding:6px 0;cursor:pointer;display:inline-flex;
  align-items:center;gap:5px;white-space:nowrap}
.nav-l:hover{color:var(--red)}
.nav-l.here,.nav-s.here{color:var(--red)}
.nav-i>.nav-l.here{box-shadow:inset 0 -2px 0 var(--red)}
.nav-c{font-size:9px;line-height:1}
.nav-sub{display:none;position:absolute;top:100%;left:0;z-index:40;
  min-width:230px;margin:0;padding:6px 0;list-style:none;
  background:var(--paper);border:1px solid var(--rule)}
.nav-s{display:block;padding:9px 14px;font-family:var(--f-mono);font-size:11px;
  letter-spacing:.04em;color:var(--ink-2);text-decoration:none}
.nav-s:hover{color:var(--red)}
.nav-i.open .nav-sub{display:block}
/* A hover bridge, so the pointer can cross the gap into the submenu. */
.nav-i.has-sub:hover::after{content:"";position:absolute;top:100%;left:0;
  right:0;height:8px}
.nav-toggle{display:none;font-family:var(--f-mono);font-size:11.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink-2);
  background:none;border:1px solid var(--rule);padding:8px 13px;cursor:pointer}
.nav-toggle:hover{color:var(--red);border-color:var(--red)}
.nav-l:focus-visible,.nav-s:focus-visible,.nav-toggle:focus-visible,
.nav-brand:focus-visible{outline:2px solid var(--red);outline-offset:2px}
@media (hover:hover){
  .nav-i.has-sub:hover > .nav-sub,
  .nav-i.has-sub:focus-within > .nav-sub{display:block}
  .nav-i.has-sub:hover > .nav-l,
  .nav-i.has-sub:focus-within > .nav-l{color:var(--red)}
}
@media (max-width:820px){
  .nav-toggle{display:inline-block;order:2}
  .nav-list{display:none;width:100%;flex-direction:column;align-items:stretch;
    gap:0;order:3}
  .sitenav.open .nav-list{display:flex}
  .nav-list .nav-i{width:100%;border-top:1px solid var(--rule-soft)}
  .nav-list .nav-l{display:flex;width:100%;padding:13px 0;
    justify-content:space-between}
  .nav-i.has-sub .nav-sub{position:static;display:none;min-width:0;border:0;
    padding:0 0 8px 14px}
  .nav-i.has-sub.open .nav-sub{display:block}
}

/* ---------- social ---------- */
.social{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 18px;margin:0 0 18px}
.soc-h{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted)}
.soc-list{display:flex;flex-wrap:wrap;gap:8px}
.soc-l{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);text-decoration:none;border:1px solid var(--rule);padding:7px 12px;
  transition:border-color .15s,color .15s}
.soc-l:hover,.soc-l:focus-visible{color:var(--red);border-color:var(--red)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink-2);
  font-family:var(--f-body);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased}
a{color:var(--red)}
a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.wrap{width:min(var(--wrap),100%);margin:0 auto;padding:0 var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted)}
h1,h2,h3{font-family:var(--f-display);font-weight:700;color:var(--ink);
  letter-spacing:.005em;line-height:1;margin:0}
.k{font-family:var(--f-mono)}
.num{font-family:var(--f-display);font-weight:700;color:var(--ink)}
.sec{padding:56px 0 8px}
.sec-h{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;
  border-top:3px solid var(--red);padding-top:16px;margin-bottom:22px}
.sec-h h2{font-size:30px}
.sec-h .eyebrow{margin-left:auto}
.good{color:var(--good)}.amber{color:var(--amber)}.redt{color:var(--red)}.mut{color:var(--muted)}

/* --- progressive enhancement ---
   Nothing below hides content unless the page has already proven a script is
   running (html.js is set by a one-line inline script in <head>). With no
   script, everything renders fully; with one, it reveals and animates. --- */
.js .rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  *{animation:none!important;transition-duration:0s!important}
}

.foot{border-top:1px solid var(--rule);margin-top:60px;padding:22px 0 48px;
  font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.foot a{color:var(--muted)}

:root{--wrap:1120px;--gutter:22px;--ease:cubic-bezier(.2,.7,.2,1)}
/* The question is the lead-in to the answer, so it gets a real size — the
   body serif at subheading scale — rather than the eyebrow treatment. It
   still needs to outrank the theme's .band h2 rule. */
.ph h2.q-h{font-family:var(--f-body);font-weight:400;font-size:clamp(19px,2.3vw,27px);
  line-height:1.3;letter-spacing:0;text-transform:none;color:var(--ink-2);margin:0;max-width:30ch}
/* ---- player page ---- */

.crumb{font-family:var(--f-mono);font-size:11px;color:var(--muted);display:flex;gap:8px;
  flex-wrap:wrap;padding:12px 0;border-bottom:1px solid var(--rule-soft)}
.crumb a{color:var(--muted);text-decoration:none}.crumb a:hover{color:var(--red)}
/* Identity band: name left, accolades right. */
.pid{display:grid;grid-template-columns:minmax(0,1fr) var(--railw);gap:30px 48px;align-items:start;
  padding:44px 0 30px;border-bottom:1px solid var(--rule-soft)}
.pid h1{font-size:clamp(46px,7vw,92px);letter-spacing:-.01em;margin:10px 0 20px}
.pid .card-line{font-family:var(--f-mono);font-size:11.5px;color:var(--muted);margin:0}
:root{--railw:400px}
.acc{padding-top:8px;min-width:0}
.acc .eyebrow{margin-bottom:10px}
/* Verdict band: the question and the answer. */
/* Verdict band: the same two-column shape as the identity band above it,
   so the page reads as one system — eyebrow and big type on the left, a
   labelled column on the right. */
.ph{display:grid;grid-template-columns:minmax(0,1fr) var(--railw);gap:30px 48px;align-items:start;
  padding:34px 0;border-bottom:1px solid var(--rule)}
.ph .facts{grid-template-columns:1fr;gap:14px;margin:0}
.ph .facts div{padding:0}
.ph .facts dd{font-size:18px}
.none-yet{margin:0;max-width:34ch;font-size:15px;color:var(--muted)}
/* The word rises from behind its own bottom edge, so it needs room to land
   clear of the rule that draws underneath it. */
/* line-height 1.05 keeps the descender of the y inside the box, and the
   padding puts clear air between it and the rule that draws underneath. */
.vd{position:relative;display:inline-block;overflow:hidden;padding-bottom:18px;margin-top:14px}
/* Same size as the name in the identity band, so the two bands read as one
   system instead of the answer shouting over the player. */
.vd .w{font-family:var(--f-display);font-weight:700;font-size:clamp(72px,10.5vw,140px);
  line-height:1.02;letter-spacing:-.015em;display:block;color:var(--good);
  transition:transform .8s var(--ease) .15s}
.js .vd .w{transform:translateY(110%)}
.js .vd.in .w{transform:none}
.vd.n .w{color:var(--muted)}
.vd::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--red);
  transform-origin:left;transition:transform .7s var(--ease) .6s}
.js .vd::after{transform:scaleX(0)}
.js .vd.in::after{transform:none}
.facts{display:grid;grid-template-columns:repeat(3,auto);gap:0 34px;margin:20px 0 0}
.facts div{padding-right:6px}
.facts dt{font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.facts dd{margin:3px 0 0;font-size:17px;color:var(--ink)}
.facts dd a{color:var(--ink);text-decoration:none;border-bottom:1px dotted var(--muted)}
.facts dd a:hover{color:var(--red);border-bottom-color:var(--red)}
.awds{list-style:none;padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:5px;margin:0}
.awd{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
  padding:4px 9px;display:inline-flex;gap:6px;align-items:center}
.awd-roy{background:var(--amber);color:var(--paper);font-weight:500}
.awd-ar1,.awd-ar2,.awd-rotm{border:1px solid #5C5C46;color:var(--muted)}
@media (max-width:1040px){:root{--railw:320px}}
@media (max-width:760px){.pid,.ph{grid-template-columns:1fr;gap:18px}.acc{min-width:0;padding-top:0}}
@media (max-width:560px){.stats{grid-template-columns:repeat(2,1fr)}.stat .v{font-size:36px}
  .story{padding-left:26px}.story .t{font-size:21px}}

/* ---------- story timeline ---------- */
.story{position:relative;list-style:none;margin:0;padding:0 0 0 30px}
.story::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:1px;background:var(--rule);
  transform-origin:top;transition:transform 1.2s var(--ease)}
.js .story::before{transform:scaleY(0)}
.js .story.in::before{transform:none}
.story li{position:relative;padding:0 0 26px}
.story li::before{content:"";position:absolute;left:-26px;top:7px;width:9px;height:9px;
  background:var(--paper);border:1px solid var(--rule);transition:background .3s,border-color .3s}
.story.in li::before{border-color:var(--ink-2)}
.story li.hi::before{background:var(--good);border-color:var(--good)}
.story li.aw::before{background:var(--amber);border-color:var(--amber)}
.story li.pending::before{border-style:dashed}
.story .d{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.story .t{font-family:var(--f-display);font-weight:700;font-size:24px;color:var(--ink);line-height:1.1;margin:3px 0 4px}
.story p{margin:0;max-width:60ch;font-size:16px}
.story li.pending .t{color:var(--muted)}

/* ---------- debut stats with rank bars ---------- */
.game{font-family:var(--f-display);font-weight:500;font-size:26px;color:var(--ink);margin:0 0 4px;line-height:1.2}
.game-when{font-family:var(--f-mono);font-size:11px;color:var(--muted);margin:0 0 20px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--rule);
  border:1px solid var(--rule);border-top:3px solid var(--red)}
.stat{background:var(--paper);padding:14px 14px 12px}
.stat .v{font-family:var(--f-display);font-weight:700;font-size:42px;line-height:1;color:var(--ink)}
.stat .l{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;color:var(--muted);margin:2px 0 10px}
.stat .rk{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-2)}
.stat .rk b{color:var(--good);font-weight:500}
.stat .bar{height:4px;background:var(--rule-soft);margin:6px 0 0;position:relative;overflow:hidden}
.stat .bar i{position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--good);transition:width 1s var(--ease)}
.js .stat .bar i{width:0}
.js .stat.in .bar i{width:var(--w)}
.stat.top .v{color:var(--good)}
.hl{margin:-8px 0 18px}
.hl a{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;display:inline-block;
  border:1px solid var(--red);color:var(--red);padding:9px 14px;text-decoration:none}
.hl a:hover{background:var(--red);color:var(--paper)}
.ctx{font-size:17px;max-width:64ch;margin:20px 0 10px}
.fine{font-size:14px;color:var(--muted);max-width:64ch}

/* ---------- comps ---------- */
.comps{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.comp{display:grid;grid-template-columns:150px 1fr 90px;gap:14px;align-items:center;font-family:var(--f-mono);font-size:12px}
.comp .who a{color:var(--ink-2);text-decoration:none;border-bottom:1px dotted var(--muted)}
.comp .who a:hover{color:var(--red)}
.comp .b{height:18px;background:var(--row-b);position:relative}
.comp .b i{position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--amber);opacity:.8;transition:width 1s var(--ease)}
.js .comp .b i{width:0}
.js .comp.in .b i{width:var(--w)}
.comp .amt{text-align:right;color:var(--amber)}
.range{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin:18px 0 0}
.range div{background:var(--paper);padding:12px 14px}
.range b{display:block;font-family:var(--f-display);font-size:28px;color:var(--amber);line-height:1}
.none{border:1px dashed var(--rule);padding:16px 18px;font-size:15px;color:var(--muted);max-width:64ch}
.auct{border:1px solid var(--rule);border-left:4px solid var(--amber);padding:16px 20px;max-width:64ch}
.auct-l{font-family:var(--f-display);font-weight:500;font-size:24px;color:var(--ink);margin:6px 0 10px;line-height:1.2}
.auct-bid{margin:8px 0 2px;display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
.auct-bid b{font-family:var(--f-mono);font-size:30px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.auct-bid .asof{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;color:var(--muted)}
.auct-bid .dlt{margin-top:0}
.auct-l b{color:var(--amber);font-weight:700}
.auct .cta{margin:4px 0 8px}
@media (max-width:560px){.comp{grid-template-columns:110px 1fr 76px}.range{grid-template-columns:1fr}}

/* ---------- related ---------- */
.rel{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px}
.rel a{display:block;border:1px solid var(--rule);padding:12px 14px;text-decoration:none;color:var(--ink);
  transition:border-color .15s,transform .2s var(--ease)}
.rel a:hover{border-color:var(--red);transform:translateY(-2px)}
.rel .nm{font-family:var(--f-display);font-weight:700;font-size:20px;line-height:1.1}
.rel .st{font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;color:var(--muted);margin-top:4px}
.rel .st.y{color:var(--good)}
.rel .aw{font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;color:var(--amber);margin-top:6px}
.back{margin-top:44px}
.cta{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;display:inline-block;
  border:1px solid var(--red);color:var(--red);padding:11px 16px;text-decoration:none}
.cta:hover{background:var(--red);color:var(--paper)}

/* ---------- price movement ----------
   Green is reserved for a rise and appears nowhere else, the way gold is
   reserved for money and orange for anything clickable. The arrow and the
   sign carry the meaning, so colour is never doing the work on its own. */
:root{--rise:#15703E;--rise-soft:#E8F2EB;--rise-br:#CBE2D4;
      --fall:#A11E1E;--fall-soft:#F7EAEA;--fall-br:#E9CFCF}
.dlt{display:inline-flex;align-items:baseline;gap:5px;margin-top:4px;
  font-family:var(--f-mono);font-size:11px;font-variant-numeric:tabular-nums;
  letter-spacing:.02em;padding:2px 6px;white-space:nowrap}
.dlt .ar{font-size:9px;line-height:1}
.dlt .pc{opacity:.78}
.dlt.up{color:var(--rise);background:var(--rise-soft);border:1px solid var(--rise-br)}
.dlt.dn{color:var(--fall);background:var(--fall-soft);border:1px solid var(--fall-br)}
.dlt.flat{color:var(--muted);background:transparent;border:1px solid var(--rule)}
.au .cur-v{display:block;font-size:17px;color:var(--ink)}

/* The Current cell now holds a figure, a chip and an as-of line. The column
   widths live in pulled_template_v2.html and are declared after this block,
   so these need the extra specificity to land. */
.au-wrap table.au col.c-who{width:21%}
.au-wrap table.au col.c-lst{width:15%}
.au-wrap table.au col.c-typ{width:11%}
.au-wrap table.au col.c-cur{width:24%}
.au-wrap table.au col.c-prj{width:9%}
.au-wrap table.au col.c-end{width:20%}

/* ---------- price history chart ---------- */
.hsec{margin-top:36px;border-top:1px solid var(--rule);padding-top:24px}
.hsec-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:4px 18px}
.hsec-h{font-family:var(--f-display);font-weight:500;letter-spacing:-.03em;
  font-size:clamp(22px,3.2vw,32px);color:var(--ink);margin:0;line-height:1;text-wrap:balance}
.hsec-head .eyebrow{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted)}
.vtabs{display:flex;flex-wrap:wrap;margin:14px 0 4px;border-bottom:1px solid var(--rule)}
.vtab{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  background:transparent;border:0;border-bottom:3px solid transparent;color:var(--muted);
  padding:9px 14px;cursor:pointer;margin-bottom:-1px}
.vtab:hover{color:var(--ink)}
.vtab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--red)}
.vhint{font-size:14.5px;color:var(--muted);margin:12px 0 16px;max-width:72ch}
.legend{display:flex;flex-wrap:wrap;gap:6px 20px;margin:2px 0 12px}
.lg{display:inline-flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:11px;
  letter-spacing:.06em;color:var(--ink-2);background:none;border:0;padding:2px 0;cursor:pointer}
.lg .sw{width:16px;height:3px;flex:0 0 16px}
.lg[aria-pressed="false"]{color:var(--muted)}
.lg[aria-pressed="false"] .sw{opacity:.22}
.combo{border:1px solid var(--rule);background:var(--paper);padding:16px 16px 8px}
.combo svg.hchart{display:block;width:100%;height:auto}
.cwrap{position:relative}
.tip{position:absolute;pointer-events:none;background:var(--ink);color:var(--paper);
  font-family:var(--f-mono);font-size:11px;line-height:1.5;padding:8px 10px;
  transform:translate(-50%,-100%);white-space:nowrap;z-index:5}
.tip[hidden]{display:none}
.tip .td{color:#C2C2C2;letter-spacing:.08em;text-transform:uppercase;font-size:9.5px;
  display:block;margin-bottom:4px}
.tip .tr{display:flex;align-items:center;gap:7px}
.tip .tr .sw{width:9px;height:9px;flex:0 0 9px}
.tip .tr b{font-weight:500;min-width:74px;display:inline-block}
.tip .tr .mx{color:#C2C2C2}
.hsec .tv{margin-top:20px;border-top:1px solid var(--rule);padding-top:4px}
.hsec .tv summary{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--red);cursor:pointer;padding:8px 0}
.hsec .tv-scroll{overflow-x:auto;margin-top:8px}
table.hist{border-collapse:collapse;width:100%;min-width:420px;font-size:14px;
  font-variant-numeric:tabular-nums}
.hist th,.hist td{padding:7px 10px;border-bottom:1px solid var(--rule-soft);
  text-align:right;white-space:nowrap}
.hist th{background:var(--thead-bg,#EDEDED);font-family:var(--f-mono);font-weight:400;
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.hist th:first-child,.hist td:first-child{text-align:left}
.hist td.dt{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.hist .mut{color:var(--muted)}
.hist tbody tr:last-child td{font-weight:600;color:var(--ink)}
@media (max-width:760px){
  .vtab{padding:9px 10px;font-size:10px;letter-spacing:.08em}
  .combo{padding:12px 10px 6px}
}
@media print{.vtabs,.legend,.tip{display:none}}
