/* Holiday Shopping Tracker – WordPress build.
   Every rule is scoped to #hst-root (the wrapper the plugin prints, class .hst-root),
   so nothing here touches the rest of the site. Generated from the standalone page by build_wp.py. */

/* 1. Undo the theme inside the tracker: put HTML elements back to browser defaults.
      :where() keeps this at the specificity of #hst-root alone, so every tracker rule below wins.
      SVG is left out on purpose: chart colors live in SVG attributes, which this would erase. */
#hst-root :where(div,span,header,footer,main,section,article,nav,aside,figure,figcaption,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,thead,tbody,tfoot,tr,th,td,caption,button,select,option,input,label,details,summary,a,b,strong,i,em,small,code,abbr,sup,sub,hr,img) { all: revert; }
#hst-root [hidden]:not([hidden=until-found i]) { display: none !important; }
#hst-root img { max-width: 100%; }

/* 2. The wrapper itself. */
#hst-root.hst-root { display: block; position: relative; margin-block: 0 24px; color-scheme: light;
  text-align: left; letter-spacing: normal; text-transform: none; word-spacing: normal;
  border-radius: 6px; -webkit-text-size-adjust: 100%; }

/* 3. The tracker's own styles. */
#hst-root { --brand: #002DB7; --actual: #0040E6; --forecast: #EF6A3B; --forecast-soft: rgba(239, 106, 59, .22); --teal: #0099CC; --series-2: #0099CC; --price: #CE1C1E; --series-3: #04AA02; --shade: #EDF1F8; --bg: #F4F6FA; --panel: #FFFFFF; --ink: #0B1530; --ink-2: #44526B; --ink-3: #6A778C; --rule: #DCE2EC; --grid: #E9EDF3; --chip: #EBF0FA; --band-ink: #FFFFFF; --band-ink-2: #C9D6FF; --font-display: "Archivo", "Arial Narrow", Arial, sans-serif; --font-body: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --font-data: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace; --r: 6px; }
@media (prefers-color-scheme: dark) {
  #hst-root[data-theme="auto"] { --brand: #6E9BFF; --actual: #3D86F0; --forecast: #CF5B32; --forecast-soft: rgba(207, 91, 50, .30); --teal: #2AA9D6; --bg: #0B1120; --panel: #121A2B; --ink: #E8EDF7; --ink-2: #AEB9CC; --ink-3: #8592A8; --rule: #26314A; --grid: #1D2740; --chip: #1A2540; --band-ink: #FFFFFF; --band-ink-2: #B9C8F5; --series-2: #20A6A0; --shade: #17203A; --price: #E5484A; --series-3: #3DBE4F; color-scheme: dark; }
}
#hst-root[data-theme="dark"] { --brand: #6E9BFF; --actual: #3D86F0; --forecast: #CF5B32; --forecast-soft: rgba(207, 91, 50, .30); --teal: #2AA9D6; --bg: #0B1120; --panel: #121A2B; --ink: #E8EDF7; --ink-2: #AEB9CC; --ink-3: #8592A8; --rule: #26314A; --grid: #1D2740; --chip: #1A2540; --band-ink: #FFFFFF; --band-ink-2: #B9C8F5; --series-2: #20A6A0; --shade: #17203A; --price: #E5484A; --series-3: #3DBE4F; color-scheme: dark; }
#hst-root .band { --band-bg: #002DB7; }
#hst-root, #hst-root * { box-sizing: border-box; }
#hst-root { background: var(--bg); color: var(--ink); font: 15px/1.55 var(--font-body); }
#hst-root a { color: var(--brand); text-underline-offset: 2px; }
#hst-root a:focus-visible, #hst-root button:focus-visible, #hst-root [tabindex]:focus-visible, #hst-root summary:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; border-radius: 3px; }
#hst-root .wrap { max-width: 1080px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
#hst-root .band { background: var(--band-bg); color: var(--band-ink); }
#hst-root .band .wrap { padding-block: 28px 24px; display: grid; gap: 10px; }
#hst-root .eyebrow { font: 600 12px/1 var(--font-body); letter-spacing: .09em; text-transform: uppercase; color: var(--band-ink-2); }
#hst-root .hst-title { margin: 0; font: 800 clamp(30px, 5vw, 46px)/1.02 var(--font-display); font-stretch: 112%; letter-spacing: -.01em; text-wrap: balance; }
#hst-root .lede { margin: 0; max-width: 62ch; color: var(--band-ink-2); font-size: 16px; }
#hst-root .meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font: 13px/1.4 var(--font-data); color: var(--band-ink-2); }
#hst-root .hst-main .wrap { padding-block: 8px 48px; display: grid; gap: 40px; }
#hst-root section { display: grid; gap: 14px; min-width: 0; }
#hst-root section > header { display: grid; gap: 4px; }
#hst-root h2 { margin: 0; font: 750 24px/1.15 var(--font-display); font-stretch: 108%; text-wrap: balance; }
#hst-root h3 { margin: 0; font: 650 16px/1.25 var(--font-display); font-stretch: 104%; }
#hst-root .sub { margin: 0; color: var(--ink-2); max-width: 70ch; }
#hst-root .panel { background: var(--panel); border: 1px solid var(--rule); border-radius: var(--r); padding: 16px; min-width: 0; }
#hst-root .row { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; }
#hst-root .legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--ink-2); padding-top: 4px; }
#hst-root .legend span { display: inline-flex; align-items: center; gap: 6px; }
#hst-root .legend svg { flex: none; }
#hst-root .flag { display: grid; grid-template-columns: auto 1fr; gap: 8px; font-size: 13.5px; color: var(--ink-2); border-top: 1px solid var(--rule); padding-top: 10px; margin-top: 4px; }
#hst-root .flag b { color: var(--ink); font-weight: 600; }
#hst-root .flag-icon { font: 600 12px/18px var(--font-data); width: 18px; height: 18px; text-align: center; border-radius: 50%; background: var(--chip); color: var(--brand); }
#hst-root .tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
#hst-root .tile { background: var(--panel); border: 1px solid var(--rule); border-radius: var(--r); padding: 14px; display: grid; gap: 6px; align-content: start; }
#hst-root .tile .k { font-size: 13px; color: var(--ink-2); line-height: 1.3; }
#hst-root .tile .v { font: 700 clamp(22px, 2.4vw, 28px)/1.1 var(--font-display); font-stretch: 100%; color: var(--ink); font-variant-numeric: tabular-nums; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; min-width: 0; }
#hst-root .tile .v.rng { font-size: clamp(19px, 2vw, 23px); }
#hst-root .tile .v.pending { font-size: 18px; color: var(--ink-3); font-weight: 600; }
#hst-root .tile .s { font: 12px/1.4 var(--font-data); color: var(--ink-3); }
#hst-root .tile .ctx { font-size: 12.5px; color: var(--ink-2); }
#hst-root .seg { display: inline-flex; border: 1px solid var(--rule); border-radius: 999px; padding: 2px; background: var(--panel); }
#hst-root .seg button { font: 600 13px/1 var(--font-body); color: var(--ink-2); background: none; border: 0; padding: 8px 14px; border-radius: 999px; cursor: pointer; min-height: 32px; }
#hst-root .seg button[aria-pressed="true"] { background: var(--brand); color: var(--panel); }
#hst-root .chart { position: relative; width: 100%; min-width: 0; }
#hst-root .chart svg { display: block; width: 100%; height: auto; overflow: visible; }
#hst-root .chart text { font-family: var(--font-body); }
#hst-root .axis text, #hst-root .tick-label { font: 12px var(--font-data); fill: var(--ink-3); }
#hst-root .grid line { stroke: var(--grid); stroke-width: 1; }
#hst-root .baseline { stroke: var(--rule); stroke-width: 1; }
#hst-root .cat-label { font: 600 13px var(--font-body); fill: var(--ink-2); }
#hst-root .dlabel { font: 500 12px var(--font-data); fill: var(--ink-2); }
#hst-root .mark { cursor: pointer; }
#hst-root .mark:focus { outline: none; }
#hst-root .lv > :not(.mark) { pointer-events: none; }
#hst-root .mark:focus-visible .hit, #hst-root .mark:hover .hit { fill: var(--grid); fill-opacity: .6; }
#hst-root .hit { fill: transparent; }
#hst-root .multiples { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
#hst-root .multiples .panel { padding: 12px; display: grid; gap: 6px; align-content: start; }
#hst-root .small-note { font-size: 12.5px; color: var(--ink-3); margin: 0; }
#hst-root .tip { position: absolute; z-index: 5; max-width: 300px; background: var(--panel); color: var(--ink); border: 1px solid var(--rule); border-radius: var(--r); box-shadow: 0 6px 24px rgba(10, 20, 50, .16); padding: 10px 12px; font-size: 13px; line-height: 1.45; pointer-events: none; }
#hst-root .tip.pinned { pointer-events: auto; }
#hst-root .tip .t1 { font-weight: 650; }
#hst-root .tip .t2 { font: 600 18px/1.2 var(--font-display); font-variant-numeric: tabular-nums; margin: 2px 0; }
#hst-root .tip .t3 { color: var(--ink-2); }
#hst-root .tip .t4 { color: var(--ink-3); font-size: 12px; margin-top: 4px; }
#hst-root .badge { display: inline-block; font: 600 11px/1 var(--font-body); letter-spacing: .03em; padding: 4px 7px; border-radius: 999px; background: var(--chip); color: var(--ink-2); white-space: nowrap; }
#hst-root .badge.f { background: var(--forecast-soft); color: var(--ink); }
#hst-root .badge.a { background: color-mix(in srgb, var(--actual) 18%, transparent); color: var(--ink); }
#hst-root .tablewrap { overflow-x: auto; border: 1px solid var(--rule); border-radius: var(--r); background: var(--panel); }
#hst-root table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
#hst-root th, #hst-root td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--rule); vertical-align: top; }
#hst-root th { font: 600 12px/1.3 var(--font-body); color: var(--ink-2); letter-spacing: .02em; background: var(--panel); position: sticky; top: 0; white-space: nowrap; }
#hst-root th button { all: unset; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; }
#hst-root th button:focus-visible { outline: 2px solid var(--teal); }
#hst-root td.num { font-family: var(--font-data); font-variant-numeric: tabular-nums; white-space: nowrap; }
#hst-root tr:last-child td { border-bottom: 0; }
#hst-root td .sm { display: block; font-size: 12px; color: var(--ink-3); }
#hst-root .note-btn { all: unset; cursor: pointer; font: 600 12px var(--font-data); color: var(--brand); }
#hst-root .note-row td { background: var(--chip); color: var(--ink-2); font-size: 13px; }
#hst-root .miss-pos::before { content: "▲ "; font-size: 10px; }
#hst-root .miss-neg::before { content: "▼ "; font-size: 10px; }
#hst-root details.more { background: var(--panel); border: 1px solid var(--rule); border-radius: var(--r); }
#hst-root details.more > summary { cursor: pointer; padding: 12px 16px; font-weight: 600; list-style-position: inside; }
#hst-root details.more[open] > summary { border-bottom: 1px solid var(--rule); }
#hst-root details.more .inner { padding: 12px 16px; display: grid; gap: 12px; }
#hst-root .filterrow { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#hst-root select, #hst-root input[type="search"] { font: 14px var(--font-body); color: var(--ink); background: var(--panel); border: 1px solid var(--rule); border-radius: var(--r); padding: 7px 10px; min-height: 36px; max-width: 100%; }
#hst-root .method { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
#hst-root .method .panel { display: grid; gap: 8px; align-content: start; }
#hst-root .method ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; color: var(--ink-2); font-size: 14px; }
#hst-root .sources { margin: 0; padding-left: 18px; columns: 2 320px; column-gap: 24px; font-size: 13.5px; color: var(--ink-2); }
#hst-root .sources li { break-inside: avoid; margin-bottom: 6px; }
#hst-root footer { color: var(--ink-3); font-size: 12.5px; border-top: 1px solid var(--rule); padding-top: 14px; }
#hst-root .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#hst-root .context { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px 24px; }
#hst-root .context .k { font: 600 12px/1.3 var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
#hst-root .context .v { font: 700 20px/1.2 var(--font-display); font-variant-numeric: tabular-nums; }
#hst-root .context .d { font-size: 13px; color: var(--ink-2); }
#hst-root .context ul { margin: 4px 0 0; padding: 0; list-style: none; display: grid; gap: 3px; font-size: 13.5px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
#hst-root .context li b { color: var(--ink); font-weight: 600; }
#hst-root .pill { display: inline-block; font: 600 11px/1 var(--font-body); padding: 3px 6px; border-radius: 999px; background: var(--chip); color: var(--ink-2); vertical-align: 1px; }
#hst-root .spark .v { font: 700 22px/1.1 var(--font-display); font-variant-numeric: tabular-nums; }
#hst-root .spark .d { font-size: 12.5px; color: var(--ink-2); }
#hst-root .callout { border-left: 4px solid var(--brand); display: grid; gap: 6px; font-size: 15px; }
#hst-root .callout p { margin: 0; max-width: 75ch; }
#hst-root .callout b { font-weight: 650; }
#hst-root .spark .rank { font: 600 13px/1.3 var(--font-body); color: var(--ink); }
#hst-root .ai-body { display: grid; gap: 22px; min-width: 0; }
#hst-root .ai-sub { display: grid; gap: 12px; min-width: 0; scroll-margin-top: 12px; }
#hst-root .ai-sub > header { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
#hst-root .ai-sub > header .sub { flex-basis: 100%; }
#hst-root .ai-h { margin: 0; font: 700 19px/1.2 var(--font-display); font-stretch: 106%; }
#hst-root .ai-h4 { margin: 0 0 4px; font: 650 15px/1.3 var(--font-display); }
#hst-root .ai-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
#hst-root .ai-grid2 > .wide { grid-column: span 2; }
@media (max-width: 700px) {
  #hst-root .ai-grid2 > .wide { grid-column: auto; }
}
#hst-root .ladder { display: grid; gap: 8px; }
#hst-root .lcard { display: grid; grid-template-columns: 44px minmax(0, 1.2fr) minmax(0, 1.5fr) auto; gap: 8px 16px; align-items: center; background: var(--panel); border: 1px solid var(--rule); border-radius: var(--r); padding: 12px 14px; }
#hst-root .lcard .lnum { width: 36px; height: 36px; border-radius: 50%; background: var(--chip); color: var(--brand); font: 800 18px/36px var(--font-display); text-align: center; }
#hst-root .lcard h4 { margin: 0; font: 700 16px/1.2 var(--font-display); }
#hst-root .lcard .k { font: 600 11px/1.2 var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
#hst-root .lcard .d { font-size: 13px; color: var(--ink-2); }
#hst-root .lcard .d.small { font-size: 12px; color: var(--ink-3); }
#hst-root .lcard .lval .v { font: 700 22px/1.15 var(--font-display); font-variant-numeric: tabular-nums; }
#hst-root .lcard .lval .v a { color: inherit; text-decoration-color: var(--rule); }
#hst-root .lcard .lmeta { display: grid; gap: 4px; justify-items: end; text-align: right; }
@media (max-width: 700px) {
  #hst-root .lcard { grid-template-columns: 36px minmax(0, 1fr); }
  #hst-root .lcard .lval, #hst-root .lcard .lmeta { grid-column: 2; }
  #hst-root .lcard .lmeta { justify-items: start; text-align: left; }
}
#hst-root .seg-sm button { padding: 5px 10px; min-height: 28px; font-size: 12px; }
#hst-root .pill.unpub { background: color-mix(in srgb, var(--price) 16%, transparent); color: var(--price); }
#hst-root .unpub-t { color: var(--price) !important; }
#hst-root .ai-kpis { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
#hst-root .stackbar { display: flex; height: 30px; border-radius: 4px; overflow: hidden; margin: 6px 0; }
#hst-root .stackbar .sb { min-width: 4px; border-right: 2px solid var(--panel); }
#hst-root .sb-main, #hst-root .sb-legend i.sb-main { background: color-mix(in srgb, var(--actual) 45%, var(--panel)); }
#hst-root .sb-other, #hst-root .sb-legend i.sb-other { background: var(--grid); }
#hst-root .sb-other2, #hst-root .sb-legend i.sb-other2 { background: color-mix(in srgb, var(--ink-3) 35%, var(--panel)); }
#hst-root .sb-hl, #hst-root .sb-legend i.sb-hl { background: var(--series-2); }
#hst-root .sb-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--ink-2); }
#hst-root .sb-legend i { display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
#hst-root .fct { display: grid; gap: 0; }
#hst-root .fct-h { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1.6fr) minmax(0, 2fr); gap: 12px; padding: 10px 0 6px; font: 600 12px var(--font-body); color: var(--ink-3); letter-spacing: .05em; text-transform: uppercase; border-bottom: 1px solid var(--rule); }
#hst-root .fct-h .fct-axis { grid-column: 3; position: relative; height: 14px; text-transform: none; letter-spacing: 0; }
#hst-root .fct-axis i { position: absolute; transform: translateX(-50%); font: 11px var(--font-data); font-style: normal; color: var(--ink-3); white-space: nowrap; }
#hst-root .fct-axis i:first-child { transform: none; }
#hst-root .fct-axis i:last-child { transform: translateX(-100%); }
#hst-root .fct-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1.6fr) minmax(0, 2fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--rule); align-items: center; }
#hst-root .fct-val { font: 700 16px/1.2 var(--font-display); font-variant-numeric: tabular-nums; }
#hst-root .fct-track { position: relative; height: 18px; background: linear-gradient(var(--grid), var(--grid)) 0 50% / 100% 1px no-repeat; }
#hst-root .fct-rng { position: absolute; top: 5px; height: 8px; background: var(--forecast-soft); border: 2px solid var(--forecast); border-radius: 3px; box-sizing: border-box; }
#hst-root .fct-mid { position: absolute; top: 3px; width: 12px; height: 12px; margin-left: -6px; background: var(--forecast); transform: rotate(45deg); }
@media (max-width: 700px) {
  #hst-root .fct-h { grid-template-columns: 1fr; }
  #hst-root .fct-h .fct-axis { grid-column: 1; }
  #hst-root .fct-row { grid-template-columns: minmax(0, 1fr) auto; }
  #hst-root .fct-row .fct-bar, #hst-root .fct-row .fct-def { grid-column: 1 / -1; }
}
#hst-root .pairs { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
#hst-root .saydo .pair { border-top: 3px solid var(--brand); }
#hst-root .pbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; margin: 10px 0; }
#hst-root .pbar .plabel { grid-column: 1 / -1; font-size: 13px; color: var(--ink-2); }
#hst-root .ptrack { position: relative; height: 16px; background: var(--grid); border-radius: 3px; }
#hst-root .pfill { position: absolute; top: 0; bottom: 0; border-radius: 3px; }
#hst-root .pfill.say { background: var(--forecast); }
#hst-root .pfill.do { background: var(--actual); }
#hst-root .pval { font: 700 15px/16px var(--font-display); font-variant-numeric: tabular-nums; min-width: 3.5em; text-align: right; }
#hst-root .bignum { font: 800 36px/1 var(--font-display); color: var(--brand); }
#hst-root .pair p { margin: 6px 0 0; }
#hst-root .ktile { margin: 12px 0 4px; padding: 10px 12px; border: 1px solid var(--rule); border-left: 4px solid var(--actual); border-radius: var(--r); display: grid; gap: 4px; }
#hst-root .ktile .kv { font: 800 30px/1 var(--font-display); color: var(--actual); font-variant-numeric: tabular-nums; }
#hst-root .ktile .kt { font-size: 13.5px; color: var(--ink); }
#hst-root .ktile .kd { font-size: 12.5px; color: var(--ink-3); display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
#hst-root .uses-take { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
#hst-root .uses-take > div { border-left: 3px solid var(--brand); padding: 2px 0 2px 12px; }
#hst-root .uses-take b { font: 650 14.5px/1.3 var(--font-display); }
#hst-root .uses-take p { margin: 4px 0 0; font-size: 13.5px; color: var(--ink-2); max-width: 60ch; }
#hst-root .uses { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
@media (max-width: 700px) {
  #hst-root .uses { grid-template-columns: minmax(0, 1fr); }
}
#hst-root .ucard header { display: grid; gap: 2px; margin-bottom: 4px; }
#hst-root .ucard .uyr { font: 500 14px var(--font-data); color: var(--ink-3); }
#hst-root .ucard .ukind { font: 600 11px/1.3 var(--font-body); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); }
#hst-root .ucard .ubase { font-size: 12.5px; color: var(--ink-2); }
#hst-root .ubar { display: grid; grid-template-columns: minmax(0, 1fr) 3em; gap: 3px 10px; padding: 5px 0; border-radius: 3px; }
#hst-root .ubar:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
#hst-root .ulabel { grid-column: 1 / -1; font-size: 13px; color: var(--ink-2); line-height: 1.3; }
#hst-root .utrack { position: relative; height: 12px; background: var(--grid); border-radius: 3px; align-self: center; }
#hst-root .ufill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; }
#hst-root .ufill.say { background: var(--forecast); }
#hst-root .ufill.do { background: var(--actual); }
#hst-root .uval { font: 700 14px/12px var(--font-display); font-variant-numeric: tabular-nums; text-align: right; align-self: center; }
#hst-root .ucard .small-note { margin: 8px 0 0; }
#hst-root .roster { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
@media (max-width: 700px) {
  #hst-root .roster { grid-template-columns: minmax(0, 1fr); }
}
#hst-root .rcard header { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 12px; flex-wrap: wrap; }
#hst-root .rcard h4 { margin: 0; font: 700 16px/1.2 var(--font-display); }
#hst-root .rcard .rdate { font: 12px var(--font-data); color: var(--ink-3); white-space: nowrap; }
#hst-root .rcard .rbuy { margin: 8px 0 0; font-size: 13px; color: var(--ink-2); display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: baseline; }
#hst-root .badge.yes { background: color-mix(in srgb, var(--actual) 18%, transparent); color: var(--ink); }
#hst-root .badge.no { background: var(--chip); color: var(--ink-2); }
#hst-root .rcard .rstatus { margin: 8px 0 0; font-size: 13.5px; color: var(--ink); }
#hst-root .rcard dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 10px; margin: 10px 0 0; font-size: 12.5px; }
#hst-root .rcard dt { color: var(--ink-3); font-weight: 600; }
#hst-root .rcard dd { margin: 0; color: var(--ink-2); overflow-wrap: anywhere; }
#hst-root .rcard .rsrc { margin: 10px 0 0; }
#hst-root .ptiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
#hst-root .ptile { margin: 0; background: var(--panel); }
#hst-root .ptile .kv { font-size: 26px; }
#hst-root .hooks { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
#hst-root .hooks > div { border-left: 3px solid var(--brand); padding: 2px 0 2px 12px; }
#hst-root .hooks b { font: 650 14px/1.3 var(--font-display); }
#hst-root .hooks p { margin: 4px 0 0; font-size: 13px; color: var(--ink-2); }
#hst-root .sup ul { margin: 4px 0 12px; padding-left: 18px; display: grid; gap: 4px; font-size: 13.5px; color: var(--ink-2); }
#hst-root .preview-banner { background: color-mix(in srgb, var(--price) 14%, var(--panel)); border: 1px solid var(--price); color: var(--ink); border-radius: var(--r); padding: 10px 14px; font-size: 14px; }
#hst-root .note-under { font-size: 12.5px; color: var(--ink-3); margin: 0; }
#hst-root .status { padding: 24px; text-align: center; color: var(--ink-2); }
#hst-root .band, #hst-root section, #hst-root .ai-sub, #hst-root details.more { scroll-margin-top: 12px; }
#hst-root .toc { background: var(--panel); border: 1px solid var(--rule); border-radius: var(--r); }
#hst-root .toc > details > summary { cursor: pointer; padding: 12px 16px; font: 650 12px/1.2 var(--font-body); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-2); list-style-position: inside; }
#hst-root .toc > details[open] > summary { border-bottom: 1px solid var(--rule); }
#hst-root .toc-list { margin: 0; padding: 14px 16px 8px; list-style: none; columns: 2 300px; column-gap: 32px; counter-reset: toc; }
#hst-root .toc-list > li { break-inside: avoid; margin: 0 0 10px; counter-increment: toc; display: grid; grid-template-columns: 2.1em minmax(0, 1fr); align-items: baseline; }
#hst-root .toc-list > li::before { content: counter(toc, decimal-leading-zero); font: 500 12px/1 var(--font-data); color: var(--ink-3); }
#hst-root .toc a { color: var(--ink); text-decoration: none; font-size: 14.5px; line-height: 1.35; }
#hst-root .toc a:hover { color: var(--brand); text-decoration: underline; }
#hst-root .toc-list ol { grid-column: 2; margin: 6px 0 2px; padding: 0 0 0 10px; list-style: none; border-left: 2px solid var(--rule); display: grid; gap: 5px; }
#hst-root .toc-list ol a { font-size: 13.5px; color: var(--ink-2); }
#hst-root .toc-list ol ol { margin: 3px 0 1px; }
#hst-root .toc-list ol ol a { font-size: 13px; color: var(--ink-3); }
#hst-root .anchor { margin-left: .35em; font: 500 .75em/1 var(--font-data); color: var(--ink-3); text-decoration: none; opacity: 0; vertical-align: .1em; }
#hst-root h2:hover > .anchor, #hst-root h3:hover > .anchor, #hst-root .anchor:focus-visible { opacity: 1; }
@media (hover: none) {
  #hst-root .anchor { opacity: .55; }
}
@media (prefers-reduced-motion: no-preference) {
  #hst-root .anchor { transition: opacity .12s; }
}
#hst-root .totop-row { margin: 0; text-align: right; }
#hst-root .totop { font: 600 13px/1.2 var(--font-body); color: var(--brand); text-decoration: none; }
#hst-root .totop:hover { text-decoration: underline; }
@media (prefers-reduced-motion: no-preference) {
  #hst-root .tip { transition: opacity .12s; }
}
@media (max-width: 520px) {
  #hst-root .panel { padding: 12px; }
  #hst-root th, #hst-root td { padding: 8px 9px; }
}

/* 4. Adjustments for living inside a WordPress page. */
#hst-root .band { border-radius: var(--r) var(--r) 0 0; }
#hst-root .hst-title { color: var(--band-ink); }
#hst-root [id][id] { scroll-margin-top: 96px; } /* clear a sticky site header when jumping to a section */
#hst-root .tip { z-index: 60; }
#hst-root a { box-shadow: none; text-decoration-thickness: auto; }