/* BoosterOdds — pack page styles ("on paper"). The dark tool has its own
   stylesheet (boosterodds.css); this is everything around it: the hero, the
   value strip, the odds and value sections and the ranking table. Values
   follow the PageHeader / Type / Palette / Components design sheets. */
.bo-page{
  --ink:#0B0910;--ink-raised:#171320;--volt:#B08CFF;--volt-dark:#C4A8FF;--volt-ink:#6A47C9;--lift:#B08CFF;--paper:#F7F7F4;--white:#FFFFFF;--on-volt:#0B0910;
  --muted:#6B7280;--body:#2A2E39;--body-2:#4B5162;--rule:var(--l12);--rule-soft:var(--l08);
  --l06:rgba(11,9,16,.06);--l08:rgba(11,9,16,.08);--l1:rgba(11,9,16,.1);--l12:rgba(11,9,16,.12);--l14:rgba(11,9,16,.14);--l16:rgba(11,9,16,.16);--l18:rgba(11,9,16,.18);--l2:rgba(11,9,16,.2);--l24:rgba(11,9,16,.24);--l4:rgba(11,9,16,.4);--l5:rgba(11,9,16,.5);
  --accent-soft:rgba(176,140,255,.12);
  --ahead:#0E7C43;--near:#96580E;--behind:#C21F2F;
  --r-common:#8B94A8;--r-uncommon:#B9C8DC;--r-rare:#D9B45F;--r-mythic:#EC6B34;--cyan:#8FE3FF;
  --f-display:'Anton','Haettenschweiler','Arial Narrow',sans-serif;
  --f-text:'Archivo',system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--ink);font-family:var(--f-text);font-size:15px;line-height:1.65;
  /* fluid: edge to edge with a gutter, capped only on very wide screens.
     Override from the theme with .bo-page{--bo-max:none} or a different gutter. */
  --bo-max:1720px;--bo-gutter:clamp(16px,3vw,56px);
  box-sizing:border-box;width:100%;max-width:var(--bo-max);margin:0 auto;padding:0 var(--bo-gutter);text-align:left;
}
.bo-page *{box-sizing:border-box}
.bo-page .anton{font-family:var(--f-display);font-weight:400;font-variant-numeric:tabular-nums}
.bo-page .mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.bo-page .ahead{color:var(--ahead)}.bo-page .near{color:var(--near)}.bo-page .behind{color:var(--behind)}.bo-page .muted{color:var(--muted)}
.bo-page a{color:inherit;text-decoration:none}
.bo-page .bo-kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500}
.bo-page .bo-dim{color:var(--muted);font-size:12.5px;line-height:1.55}
.bo-page p{margin:0}

/* ---------------- hero ---------------- */
.bo-hero{display:flex;gap:40px;align-items:flex-start;justify-content:space-between;padding:6px 0 22px}
.bo-hero-main{flex:0 1 860px;min-width:0}
.bo-badges{display:flex;gap:7px;flex-wrap:wrap}
.bo-badge{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--body-2);background:var(--l06);border-radius:4px;padding:4px 8px;line-height:1.3}
.bo-badge.volt{color:var(--on-volt);background:var(--volt)}
.bo-page h1.bo-h1{font-family:var(--f-display);font-weight:400;font-size:52px;line-height:.98;letter-spacing:-.02em;color:var(--ink);text-wrap:balance;
  margin:0 0 14px!important;padding:0!important}     /* themes reset heading margins in odd ways; the hero owns its rhythm */
.bo-page p.bo-lede{font-size:16px;line-height:1.6;color:var(--body);max-width:58ch;margin:0!important;padding:0!important}
.bo-page .bo-actions{display:flex;gap:10px;margin:20px 0 0!important;flex-wrap:wrap}
.bo-page .bo-badges{margin:0 0 12px!important}
.bo-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;border-radius:8px;border:0;
  font-family:var(--f-text);font-size:14px;font-weight:700;letter-spacing:.01em;cursor:pointer;transition:.15s;text-decoration:none}
.bo-btn.primary{background:var(--volt);color:var(--on-volt)}.bo-btn.primary:hover{background:var(--volt-dark);color:var(--on-volt)}
.bo-btn.outline{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--l24)}.bo-btn.outline:hover{box-shadow:inset 0 0 0 1.5px var(--l5)}

/* value strip — a compact card beside the title so the tool starts high on the page */
.bo-value{flex:0 1 560px;min-width:440px;border:1px solid var(--l14);border-radius:12px;background:var(--white);padding:16px 20px 14px}
.bo-value .bo-kicker{display:block;margin-bottom:10px}
.bo-value-grid{display:flex;gap:24px;align-items:stretch}
.bo-value-main{flex:0 0 200px;min-width:0}
.bo-value .bo-big{font-size:56px;line-height:.92;letter-spacing:-.01em}
.bo-value .bo-sub{font-size:12px;color:var(--body-2);margin-top:7px;line-height:1.4}
.bo-value-rows{flex:1 1 auto;min-width:0;border-left:1px solid var(--l1);padding-left:22px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.bo-row{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.bo-row span{color:var(--muted)}.bo-row b{font-weight:500}
.bo-value .bo-note{font-size:11px;line-height:1.5;color:var(--muted);margin-top:12px;padding-top:10px;border-top:1px solid var(--l08)}

/* the tool: the brand's night mode, a block on the page */
.bo-tool{margin:0 0 34px}
.bo-tool .boosterodds{border-radius:14px}

/* ---------------- sections ---------------- */
.bo-section{padding:26px 0 8px;border-top:1px solid var(--rule)}
.bo-sec-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.bo-page h2.bo-h2,.bo-page h3.bo-h2{font-family:var(--f-display);font-weight:400;font-size:32px;line-height:1.05;letter-spacing:-.015em;margin:0;color:var(--ink)}
.bo-sec-head .bo-kicker{margin-left:auto}
.bo-explain{font-size:13.5px;line-height:1.6;color:var(--body-2);max-width:72ch;margin-top:14px}

/* stat tiles */
.bo-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.bo-tile{border:1px solid var(--l14);border-radius:8px;padding:12px 13px;background:var(--white);min-width:0}
.bo-tile .anton{font-size:26px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bo-tile span{display:block;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-top:5px;line-height:1.35}

/* tables — hairlines, a 2px ink rule under the header */
.bo-table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums;margin:0}
.bo-table th,.bo-table td{text-align:left;padding:12px 10px 12px 0;border-bottom:1px solid var(--l1);vertical-align:middle}
.bo-table thead th{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;padding-bottom:9px;border-bottom:2px solid var(--ink)}
.bo-table thead th.sort{color:var(--ink);font-weight:700}
.bo-table th.num,.bo-table td.num{text-align:right;padding-right:0}
.bo-table td.num+td,.bo-table th.num+th{padding-left:22px}
.bo-table td.num{font-family:var(--f-mono);font-size:13.5px;white-space:nowrap}
.bo-table td.name b{font-weight:700}.bo-table td.name small{color:var(--muted);font-size:13px;display:inline-block;margin-left:4px}
.bo-table td.rank{color:#9AA0AC;font-size:13px;width:34px}
.bo-table a:hover{color:var(--volt-ink)}
.bo-table .bo-ret{font-size:19px;line-height:1}
.bo-table td.mix{font-size:12.5px;color:var(--body-2);line-height:1.8}
.bo-r{display:inline-block;padding:1px 8px;border-radius:99px;margin-right:4px;font-size:11.5px;font-weight:600;white-space:nowrap}
.bo-r.common{background:rgba(139,148,168,.18);color:#5A6274}.bo-r.uncommon{background:rgba(185,200,220,.3);color:#4E5B6E}
.bo-r.rare{background:rgba(217,180,95,.22);color:#7A5F14}.bo-r.mythic{background:rgba(236,107,52,.18);color:#A8410F}
.bo-r.special,.bo-r.bonus{background:var(--accent-soft);color:var(--volt-ink)}
.bo-foil{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#0A0B10;background:var(--cyan);border-radius:99px;padding:2px 7px;vertical-align:middle}

/* pack order chain */
.bo-order{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.bo-chain{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 0;counter-reset:bo}
.bo-chain li{font-size:12.5px;color:var(--body);background:var(--white);border:1px solid var(--l14);border-radius:6px;padding:4px 9px;position:relative;margin-right:22px}
.bo-chain li::after{content:"→";position:absolute;right:-17px;top:4px;color:#9AA0AC;font-size:12px}
.bo-chain li:last-child::after{content:none}
.bo-chain li.dim{color:var(--muted);border-style:dashed}

/* cards that drive the value */
.bo-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:10px 28px}
.bo-card{display:grid;grid-template-columns:22px 56px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule-soft)}
.bo-card .bo-rank{color:#9AA0AC;font-size:13px}
.bo-thumb{display:block;width:56px;aspect-ratio:488/680;border-radius:4px;overflow:hidden;background:#E7E8EC;box-shadow:0 2px 8px var(--l16)}
.bo-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.bo-card-txt b{display:block;font-size:14.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bo-card-meta{font-size:12px;color:var(--muted);margin-top:3px}
.bo-card-ev{text-align:right;white-space:nowrap}
.bo-card-ev .anton{display:block;font-size:22px;line-height:1;color:var(--ink)}
.bo-card-ev small{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}

/* method notes */
.bo-method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:14px}
.bo-note-card{border:1px solid var(--l12);border-radius:10px;background:var(--white);padding:16px 18px;font-size:13px;line-height:1.6;color:var(--body-2)}
.bo-note-card .bo-kicker{display:block;margin-bottom:8px}
.bo-note-card p+p{margin-top:8px}
.bo-note-card a{color:var(--volt-ink)}

/* more boosters */
.bo-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.bo-link{display:flex;flex-direction:column;gap:4px;border:1px solid var(--l14);border-radius:10px;background:var(--white);padding:14px 16px;transition:.15s}
.bo-link:hover{border-color:var(--volt-ink)}
.bo-link b{font-size:15px}.bo-link span{font-size:12.5px;color:var(--muted)}
.bo-link.ghost{background:var(--ink);color:var(--paper);border-color:var(--ink)}.bo-link.ghost span{color:#9B95AD}

/* ---------------- ranking page ---------------- */
.bo-band{background:var(--ink);color:var(--paper);border-radius:14px 14px 0 0;padding:30px 44px 26px;display:flex;align-items:flex-end;gap:32px}
.bo-band-main{flex:1 1 auto;min-width:0}
.bo-band-kicker{display:flex;align-items:center;gap:9px;margin-bottom:11px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#9B95AD}
.bo-page h1.bo-band-h1{font-family:var(--f-display);font-weight:400;font-size:50px;line-height:.96;letter-spacing:-.022em;margin:0!important;padding:0!important;color:var(--paper);text-wrap:balance;max-width:28ch}
.bo-band-lede{font-size:15px;line-height:1.6;color:#C7C2D4;margin:12px 0 0!important;max-width:60ch}
.bo-band-stats{flex:none;display:flex;gap:26px;padding-bottom:6px}
.bo-band-stats .anton{font-size:40px;line-height:1;color:var(--paper)}.bo-band-stats .anton.lift{color:var(--lift)}
.bo-band-stats span{display:block;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:#8A8499;margin-top:3px}
.bo-filter{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 44px;background:var(--white);border-bottom:1px solid var(--rule)}
.bo-pill{font-family:var(--f-text);font-size:13px;font-weight:500;border-radius:7px;box-shadow:inset 0 0 0 1px var(--l18);color:var(--body-2);padding:8px 13px;background:transparent;border:0;cursor:pointer;transition:.15s;line-height:1.2}
.bo-pill small{font-size:11px;color:var(--muted);margin-left:3px;font-weight:500}
.bo-pill:hover{box-shadow:inset 0 0 0 1px var(--l4)}
.bo-pill.on{background:var(--ink);color:#fff;font-weight:700;box-shadow:none}.bo-pill.on small{color:#9B95AD}
.bo-filter-cur{margin-left:auto;display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--muted)}
.bo-cur{font-size:12.5px;border-radius:6px;padding:6px 11px}
.bo-cur.on{font-weight:600;color:var(--on-volt);background:var(--volt)}
.bo-cur.off{color:#9AA0AC;box-shadow:inset 0 0 0 1px var(--l12);text-decoration:line-through;cursor:help}
.bo-rankpage .bo-ranktable{background:var(--white);padding:6px 44px 18px;border-radius:0 0 14px 14px}
.bo-ranking td{padding-top:13px;padding-bottom:13px}
.bo-ranking td.dim{color:var(--body-2)}
.bo-ranking tr.unpriced td{opacity:.55}
.bo-ranking tr.repriced td{background:var(--accent-soft)}
.bo-ranking tr.hit td{background:rgba(176,140,255,.22)}
.bo-price{font-family:var(--f-mono);font-size:13.5px;background:transparent;border:0;padding:4px 8px;margin:-4px -8px;border-radius:5px;color:var(--ink);cursor:text;box-shadow:inset 0 0 0 1px transparent;transition:.15s;font-variant-numeric:tabular-nums}
.bo-price:hover{box-shadow:inset 0 0 0 1px var(--l2)}
.bo-price.empty{color:#9AA0AC}
tr.repriced .bo-price{font-weight:600;color:var(--volt-ink);box-shadow:inset 0 0 0 1.5px var(--volt)}
.bo-price-in{width:92px;font-family:var(--f-mono);font-size:13.5px;text-align:right;border:1.5px solid var(--volt);border-radius:5px;padding:3px 7px;background:#fff;color:var(--ink);outline:none;-moz-appearance:textfield}
.bo-price-in::-webkit-outer-spin-button,.bo-price-in::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* ---------------- blocks used on the homepage ---------------- */
.bo-rankblock .bo-h2{margin-bottom:4px}
.bo-rank-sub{margin:0 0 14px!important}
.bo-more{display:inline-block;margin-top:14px;font-size:13px;font-weight:600;color:var(--volt-ink)}
.bo-compact .bo-table.bo-ranking th:last-child,.bo-compact .bo-table.bo-ranking td:last-child{display:none}
.bo-page h2.bo-h3{font-family:var(--f-display);font-weight:400;font-size:19px;line-height:1.15;letter-spacing:-.01em;margin:0 0 8px;color:var(--ink)}
.bo-faq details{border-top:1px solid var(--rule-soft);padding:9px 0}
.bo-faq details:first-of-type{border-top:0;padding-top:2px}
.bo-faq summary{cursor:pointer;font-size:13.5px;font-weight:600;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px}
.bo-faq summary::-webkit-details-marker{display:none}
.bo-faq summary::after{content:"+";color:var(--muted);font-weight:400}
.bo-faq details[open] summary::after{content:"–"}
.bo-faq details p{margin-top:6px!important}
.bo-card-block+.bo-card-block{margin-top:12px}

/* dark variant (bo-dark): the same blocks on Ink, for the fully dark homepage */
.bo-page.bo-dark{--ink:#EDEBF2;--paper:#F7F7F4;--white:#171320;--muted:#9B95AD;--body:#C7C2D4;--body-2:#C7C2D4;--volt-ink:#B08CFF;
  --ahead:#3BE08A;--near:#F5B44C;--behind:#FF8593;
  --l06:rgba(255,255,255,.06);--l08:rgba(255,255,255,.09);--l1:rgba(255,255,255,.1);--l12:rgba(255,255,255,.12);--l14:rgba(255,255,255,.12);--l16:rgba(255,255,255,.16);--l18:rgba(255,255,255,.18);--l2:rgba(255,255,255,.2);--l24:rgba(255,255,255,.24);--l4:rgba(255,255,255,.4);--l5:rgba(255,255,255,.5);
  color:var(--ink)}
.bo-dark .bo-table thead th{border-bottom-color:rgba(255,255,255,.28)}
.bo-dark .bo-table thead th.sort{color:var(--ink)}
.bo-dark .bo-table td.rank{color:#8A8499}
.bo-dark .bo-price{color:var(--ink)}.bo-dark .bo-price.empty{color:#8A8499}
.bo-dark .bo-price-in{background:#0B0910;color:var(--ink)}
.bo-dark .bo-ranking tr.repriced td{background:rgba(176,140,255,.08)}
.bo-dark .bo-r.common{background:rgba(139,148,168,.2);color:#B9C0D0}.bo-dark .bo-r.uncommon{background:rgba(185,200,220,.2);color:#D5DEEA}
.bo-dark .bo-r.rare{background:rgba(217,180,95,.2);color:#E8C978}.bo-dark .bo-r.mythic{background:rgba(236,107,52,.2);color:#F08A5A}
.bo-dark .bo-page h2.bo-h2,.bo-page.bo-dark h2.bo-h2,.bo-page.bo-dark h2.bo-h3{color:var(--paper)}

/* ---------------- responsive ---------------- */
@media (max-width:900px){
  .bo-band{flex-direction:column;align-items:flex-start;gap:18px;padding:24px 22px 22px}
  .bo-page h1.bo-band-h1{font-size:38px}
  .bo-filter{padding:12px 22px}.bo-rankpage .bo-ranktable{padding:0 22px 14px}
  .bo-filter-cur{margin-left:0;flex-basis:100%}
  .bo-hero{flex-direction:column;gap:22px}
  .bo-hero-main{flex-basis:auto}
  .bo-value{width:100%;min-width:0;flex-basis:auto}
  .bo-page h1.bo-h1{font-size:40px}
  .bo-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bo-cards{grid-template-columns:1fr}
  .bo-method-grid,.bo-links{grid-template-columns:1fr}
}
@media (max-width:560px){
  .bo-page h1.bo-h1{font-size:34px}
  .bo-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bo-value-grid{flex-direction:column;gap:14px}.bo-value-rows{border-left:0;padding-left:0}
  .bo-cards{grid-template-columns:1fr}
  .bo-page h2.bo-h2{font-size:26px}
  .bo-sec-head .bo-kicker{margin-left:0}
  .bo-table td.mix{font-size:11.5px}
  .bo-table.bo-ranking th:last-child,.bo-table.bo-ranking td:last-child{display:none}
  .bo-table.bo-ranking td.name small{display:block;margin-left:0}
  .bo-page h1.bo-band-h1{font-size:32px}
}
/* theme integration: in a block theme's constrained layout .alignfull bleeds to the
   viewport edge; the page then applies its own cap and gutter. */
.boosterodds-pack-page .wp-block-post-content>.bo-page.alignfull{max-width:var(--bo-max)}