/* GENERATED by port/extract-assets.py — shared inline scaffold blocks
   block bd514129 on 6 pages
   block c0d94b4a on 6 pages
   block 2a0cbb6d on 4 pages
   Do not hand-edit. */

/* — scaffold bd514129 (6 pages) — */
.crumb{display:inline-block;font-size:13px;font-weight:700;color:var(--ink-soft);margin:4px 0 14px}
.crumb:hover{color:var(--ink)}
.reveal{animation:lbpReveal .5s cubic-bezier(.22,.6,.36,1) both;animation-delay:var(--d,0ms)}
@keyframes lbpReveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.p-hero{border-radius:var(--r);padding:26px 28px;margin-bottom:20px}
.p-kick{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--orange)}
.p-hero h1{font-family:var(--display);font-weight:700;font-size:30px;letter-spacing:-.025em;line-height:1.05;margin:9px 0 6px;color:var(--ink)}
.p-hero p{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:0;max-width:66ch}
/* search + chips shared */
.l-search,.wsearch,.rv-search,.lb-search{font-family:var(--body);font-size:14px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:11px;padding:10px 14px;outline:none;transition:border-color .15s,box-shadow .15s}
.l-search:focus,.wsearch:focus,.rv-search:focus,.lb-search:focus{border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-tint)}
html[data-motion="off"] .reveal{animation:none!important}
@media (prefers-reduced-motion:reduce){.reveal{animation:none!important}}

.tl-hero{text-align:left;padding:10px 0 22px}
.tl-kick{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--orange)}
.tl-hero h1{font-family:var(--display);font-weight:700;font-size:30px;letter-spacing:-.025em;color:var(--ink);margin:8px 0 6px}
.tl-hero p{font-size:14px;color:var(--ink-soft);margin:0}
.tl-wrap{display:grid;grid-template-columns:268px 1fr;gap:18px;align-items:start}
.tl-nav{display:flex;flex-direction:column;gap:9px;position:sticky;top:84px}
.tl-tab{display:flex;align-items:center;gap:12px;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:13px 15px;cursor:pointer;transition:border-color .15s,transform .15s;font-family:var(--body)}
.tl-tab:hover{border-color:var(--orange);transform:translateX(2px)}
.tl-tab.on{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange)}
.tl-ic{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:800;color:var(--on-tint);background:var(--orange-tint)}
.tl-tx b{display:block;font-family:var(--display);font-weight:700;font-size:14.5px;color:var(--ink)}
.tl-tx i{font-style:normal;font-size:11.5px;color:var(--ink-faint);line-height:1.35;display:block;margin-top:2px}
.tl-panel{min-width:0}
.tl-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;box-shadow:var(--shadow)}
.tl-card.tl-in{animation:tlIn .3s ease both}
@keyframes tlIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
html[data-motion="off"] .tl-card.tl-in{animation:none}
.tl-card h2{font-family:var(--display);font-weight:700;font-size:21px;color:var(--ink);margin:0 0 4px}
.tl-sub{font-size:13px;color:var(--ink-soft);margin:0 0 18px}
.tl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:13px;margin-bottom:18px}
.tf{display:flex;flex-direction:column;gap:5px}
.tf-wide{margin-bottom:18px}
.tf-l{font-size:11.5px;font-weight:700;color:var(--ink-soft)}
.tf-i{font-family:var(--body);font-size:15px;color:var(--ink);background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:11px 13px;outline:none;transition:border-color .15s,box-shadow .15s;width:100%}
.tf-i:focus{border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-tint)}
.tf-h{font-size:10.5px;color:var(--ink-faint)}
.tl-out{display:flex;flex-direction:column;gap:1px;border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-top:4px}
.to-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 15px;background:var(--paper-2)}
.to-row:nth-child(odd){background:var(--card)}
.to-row:first-child{color:var(--on-tint);background:var(--orange-tint)}
.to-k{font-size:13px;color:var(--ink-soft);font-weight:600}
.to-v{font-family:var(--display);font-weight:700;font-size:16px;color:var(--ink)}
.to-row:first-child .to-v{color:var(--on-tint)}
.tl-err{font-size:13px;color:var(--ink-faint);background:var(--paper-2);border:1px dashed var(--line);border-radius:10px;padding:14px;text-align:center}
.tl-legs{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.tl-leg{display:flex;gap:8px}
.tl-leg .pl-odds{flex:1}
.pl-del{flex:0 0 auto;width:40px;border:1px solid var(--line);background:var(--paper-2);border-radius:10px;color:var(--ink-faint);cursor:pointer;font-size:13px}
.pl-del:hover{color:#E0483C;border-color:#E0483C}
.tl-add{font-family:var(--body);font-weight:700;font-size:13px;color:var(--on-tint);background:var(--orange-tint);border:0;border-radius:10px;padding:9px 15px;cursor:pointer;margin-bottom:16px}
.tl-add:hover{filter:brightness(.96)}
@media(max-width:760px){.tl-wrap{grid-template-columns:1fr}.tl-nav{position:static;flex-direction:row;overflow-x:auto;min-width:0;padding-bottom:6px;-webkit-overflow-scrolling:touch}.tl-tab{flex:0 0 auto;min-width:0;padding:11px 14px}.tl-tab i{display:none}.tl-tx b{white-space:nowrap}}

/* — scaffold c0d94b4a (6 pages) — */
.crumb{display:inline-block;font-size:13px;font-weight:700;color:var(--ink-soft);margin:4px 0 14px}
.crumb:hover{color:var(--ink)}
/* #83 — cap any staggered entrance so a long list never leaves its tail at
   0-30% opacity while scrolling (it read as a fade-to-transparent overlay). */
.reveal{animation-delay:min(var(--d,0ms),240ms)}
/* #89 — the guide's comment thread ran the full ~1130px column (~150 characters
   a line). Bring prose to a comfortable measure. */
.promo-thread .reply p,.promo-thread .op-card p,.promo-intro p,.fq-a,.promo-disc2 p{max-width:72ch}

/* ---- sponsored one-pager ---- */
#promoRoot{--pa:#0E8C97;--pb:#0BB0BC;--pacc:#0B9BA8}
.promo-hero{position:relative;padding:4px 0 8px;margin-bottom:6px}
.ph-in{position:relative;z-index:1;max-width:64ch}
.ph-kick{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--orange)}
.ph-h1{font-family:var(--display);font-weight:700;font-size:32px;line-height:1.05;letter-spacing:-.025em;color:var(--ink);margin:8px 0 0}
.ph-sub{font-size:15px;line-height:1.55;color:var(--ink-soft);margin:10px 0 0;max-width:64ch}
.ph-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.ph-pill{font-size:12.5px;font-weight:700;color:var(--ink-soft);background:var(--card);border:1px solid var(--line);padding:6px 13px;border-radius:30px}
.ph-jump{font-size:13px;font-weight:800;color:#fff;background:var(--orange);padding:9px 16px;border-radius:30px;margin-left:auto;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.ph-jump:hover{transform:translateY(-1px)}
.promo-disc{font-size:12px;color:var(--ink-faint);line-height:1.5;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:11px 15px;margin-bottom:22px}
.ps-h{font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-.02em;margin:0 0 15px;padding-left:13px;position:relative}
/* PALETTE: --pacc was a per-guide accent (teal/…) set INLINE by promo-render.js,
   so it outranked any rule here. Dropping the var from each consuming declaration
   makes the inline value inert without touching the markup — one house accent. */
.ps-h::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:5px;border-radius:4px;background:var(--orange)}
.promo-intro{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;margin-bottom:26px;box-shadow:var(--shadow)}
.promo-intro p{font-size:15px;line-height:1.65;color:var(--ink-soft);margin:0 0 10px}
.promo-intro p:last-child{margin-bottom:0}
.promo-crit{margin-bottom:30px}
.cr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.cr{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--orange);border-radius:var(--r-sm);padding:14px 15px;box-shadow:var(--shadow)}
.cr-t{font-family:var(--display);font-weight:700;font-size:14.5px;color:var(--ink);margin-bottom:5px}
.cr-x{font-size:12.5px;line-height:1.5;color:var(--ink-soft)}
.promo-list{margin-bottom:28px}
.bc-wrap{display:flex;flex-direction:column;gap:14px}
.bc{display:grid;grid-template-columns:48px minmax(0,1fr) 234px;grid-template-areas:"rank id shot" "rank body shot" "rank act shot";column-gap:20px;row-gap:11px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow);transition:border-color .15s,transform .2s,box-shadow .2s}
/* #97-class: confine the hover treatment to real pointers so a tap cannot leave a
   card stuck in its accented hover state, and never inherit an underline. */
.bc,.bc:hover,.bc:focus,.bc:hover *,.bc:focus *{text-decoration:none}
@media (hover:hover){.bc:hover{border-color:var(--orange);transform:translateY(-2px);box-shadow:var(--shadow-2)}}
.bc-top{border-color:var(--orange)}
.bc-rank{grid-area:rank;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:16px;color:var(--ink-soft);background:var(--paper-2)}
.bc-top .bc-rank{color:#fff;background:var(--orange)}
.bc-id{grid-area:id;display:flex;align-items:center;gap:13px;min-width:0}
/* #82 — a pure-white tile glares against the navy paper in dark mode */
.bc-logo{width:58px;height:58px;flex:0 0 auto;border-radius:13px;object-fit:contain;background:var(--logo-plate);border:1px solid var(--logo-plate-line);padding:6px}
.bc-logo-txt{display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:24px;color:#fff;background:linear-gradient(135deg,var(--orange-2),var(--orange));border:0}
.bc-name{min-width:0}
.bc-brand{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:-.01em;color:var(--ink);line-height:1.1}
.bc-tag{display:inline-block;margin-top:5px;font-size:11px;font-weight:700;color:var(--on-tint);background:var(--orange-tint);padding:3px 9px;border-radius:20px}
.bc-body{grid-area:body;min-width:0}
.bc-bonus{display:flex;flex-direction:column;gap:2px;background:var(--paper-2);border:1px dashed var(--line);border-radius:var(--r-sm);padding:9px 13px;margin-bottom:9px}
.bc-bk{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
.bc-bv{font-size:14.5px;font-weight:700;color:var(--ink);line-height:1.3}
.bc-facts{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:9px}
.pf{display:inline-flex;align-items:baseline;gap:5px;font-size:11.5px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:3px 9px}
.pf-k{color:var(--ink-faint);font-weight:600}
.pf-v{color:var(--ink);font-weight:700}
.bc-blurb{font-size:13.5px;line-height:1.55;color:var(--ink-soft);margin:0 0 9px}
.bc-pc{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:3px 16px;margin:0;padding:0}
/* #103 — below ~760px the two columns collapse into one, and a thin grey "–"
   next to a green "✓" stopped reading as its opposite. The markers now differ by
   GLYPH (tick vs cross), by COLOUR (the one green vs the one red) and by their
   own tinted plate, so the distinction survives a single stacked column. */
.bc-pc li{font-size:12.5px;line-height:1.45;padding-left:24px;position:relative;color:var(--ink-soft);min-height:18px}
.bc-pc li::before{position:absolute;left:0;top:1px;width:16px;height:16px;line-height:16px;
  text-align:center;border-radius:5px;font-size:10.5px;font-weight:800}
.bc-pc li.pro::before{content:"✓";color:var(--sem-pos);background:var(--sem-pos-tint)}
.bc-pc li.con::before{content:"✕";color:var(--sem-neg);background:var(--sem-neg-tint)}
.bc-shot{grid-area:shot;display:block;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;background:var(--paper-2)}
.bc-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .35s}
.bc-shot:hover img{transform:scale(1.04)}
.bc-shot-ph{display:grid;place-items:center;background:linear-gradient(150deg,var(--paper-2),var(--paper));padding:18px}
.bc-shot-ph img{width:auto;max-width:78%;max-height:60%;height:auto;object-fit:contain;filter:none}
.bc-shot-ph span{font-family:var(--display);font-weight:700;font-size:17px;color:var(--ink-soft);text-align:center}
.bc-shot-ph:hover img{transform:none}
.bc-act{grid-area:act;display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:2px}
.bc-cta{font-weight:800;font-size:14px;color:#fff;background:linear-gradient(135deg,var(--orange-2),var(--orange));padding:11px 20px;border-radius:11px;box-shadow:var(--shadow);transition:transform .15s,filter .15s}
.bc-cta span{font-weight:700}
.bc-cta:hover{transform:translateY(-1px);filter:brightness(1.07)}
.bc-tc{font-size:11px;color:var(--ink-faint);font-weight:600}
.promo-verdict{color:var(--on-tint);background:var(--orange-tint);border:1px solid var(--line);border-radius:var(--r);padding:16px 20px;margin-bottom:26px}
.promo-verdict p{margin:0;font-size:15px;line-height:1.55;color:var(--on-tint);font-weight:600}
.promo-faq{margin-bottom:26px}
.fq{background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:8px;overflow:hidden}
.fq summary{cursor:pointer;font-weight:700;font-size:14.5px;color:var(--ink);padding:13px 16px;list-style:none;position:relative;padding-right:40px}
.fq summary::-webkit-details-marker{display:none}
.fq summary::after{content:"+";position:absolute;right:16px;top:11px;font-size:19px;font-weight:400;color:var(--orange)}
.fq[open] summary::after{content:"–"}
.fq-a{font-size:13.5px;line-height:1.6;color:var(--ink-soft);padding:0 16px 14px}
.promo-disc2{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:15px 18px;margin-bottom:30px}
.promo-disc2 h3{font-family:var(--display);font-weight:700;font-size:14px;color:var(--ink);margin:0 0 6px}
.promo-disc2 p{font-size:12.5px;line-height:1.6;color:var(--ink-soft);margin:0}
/* discussion */
.pt-head{display:flex;align-items:baseline;gap:12px;margin-bottom:15px}
.pt-head .ps-h{margin:0}
.disc-note{font-size:11px;font-weight:700;color:var(--ink-faint);background:var(--paper-2);border:1px solid var(--line);padding:3px 10px;border-radius:20px}.op-av{background:var(--orange);color:#fff;font-size:12px;font-weight:700}
.reply-form{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-top:18px;box-shadow:var(--shadow)}
.reply-form h3{font-size:16px;margin:0 0 12px;color:var(--ink)}
.reply-form input,.reply-form textarea{width:100%;font-family:var(--body);font-size:14.5px;color:var(--ink);background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.reply-form textarea{min-height:90px;resize:vertical}
.reply-form .rf-submit{background:linear-gradient(135deg,var(--orange-2),var(--orange));color:#fff;font-weight:700;font-size:14px;border:0;border-radius:10px;padding:10px 22px;cursor:pointer}
@media (prefers-reduced-motion:reduce){.reply.is-new{animation:none}}
html[data-motion="off"] .bc,html[data-motion="off"] .bc-shot img,html[data-motion="off"] .bc-cta,html[data-motion="off"] .ph-jump{transition:none}
@media(max-width:980px){.cr-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){
  .promo-hero{padding:26px 20px 22px}.ph-h1{font-size:28px}.ph-sub{font-size:14.5px}
  .ph-jump{margin-left:0}
  .bc{grid-template-columns:40px 1fr;grid-template-areas:"rank id" "body body" "shot shot" "act act";column-gap:13px}
  .bc-shot{aspect-ratio:16/9;margin-top:2px}
  .bc-pc{grid-template-columns:1fr;row-gap:5px}
}

/* — scaffold 2a0cbb6d (4 pages) — */
/* doc pages (how-we-test / standards / contact / terms) — token-based so theme + accent inherit automatically */
main .doc{max-width:820px}
.doc .kick{display:block;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--orange);margin-bottom:6px}
.doc h1{font-family:var(--display);font-size:33px;line-height:1.08;letter-spacing:-.02em;color:var(--ink);margin-bottom:10px}
.doc .lede{font-size:17px;line-height:1.6;color:var(--ink-soft);margin-bottom:8px}
.doc .updated{font-size:12.5px;color:var(--ink-faint);margin-bottom:26px}
.doc section.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:22px 24px;margin:16px 0}
.doc h2{font-family:var(--display);font-size:20px;color:var(--ink);letter-spacing:-.01em;margin-bottom:10px}
.doc p{color:var(--ink-soft);line-height:1.66;margin:0 0 12px}
.doc p:last-child{margin-bottom:0}
.doc ul{list-style:none;margin:4px 0 8px}
.doc li{position:relative;padding-left:20px;color:var(--ink-soft);line-height:1.6;margin-bottom:8px}
.doc li::before{content:"";position:absolute;left:2px;top:9px;width:7px;height:7px;border-radius:2px;background:var(--orange)}
.doc li b{color:var(--ink);font-weight:700}
.doc a.inl{color:var(--orange);font-weight:600}
.doc a.inl:hover{text-decoration:underline}
.doc .rg{background:var(--orange-tint);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px 16px;font-size:13.5px;color:var(--on-tint);margin-top:18px}
.doc .rg b{color:var(--on-tint)}
.doc .crumb{margin-bottom:14px}
.doc dl{display:grid;grid-template-columns:1fr;gap:14px;margin-top:4px}
.doc .ct{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2)}
.doc .ct .l{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint)}
.doc .ct a{color:var(--orange);font-weight:700}
@media(min-width:640px){.doc dl{grid-template-columns:1fr 1fr}}