/* Deals: this week's codes. Tokens from site.css, so light and dark mode follow the system. */
.deals .wrap{ max-width:var(--w); margin:0 auto; padding-left:24px; padding-right:24px; }
.deals .sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.deals .n{ font-variant-numeric:tabular-nums lining-nums; }

/* hero */
.d-hero{ padding-top:40px; padding-bottom:26px; display:grid; grid-template-columns:repeat(auto-fit, minmax(min(520px, 100%), 1fr)); gap:24px 56px; align-items:end; }
.d-hero .eyebrow{ margin:0 0 14px; display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; font:600 15px/1.2 var(--f-ui); }
.d-hero .kicker{ color:var(--accent); }
.d-hero .fresh{ font-size:13.5px; }
.d-hero h1{ margin:0; font:600 clamp(46px, 5.4vw, 76px)/0.95 var(--f-display); letter-spacing:-0.01em; color:var(--ink); text-wrap:balance; }
.d-hero .lede{ margin:0; max-width:56ch; font:400 17.5px/1.5 var(--f-body); color:var(--ink-2); text-wrap:pretty; }

/* this week in numbers */
.d-stats{ padding-bottom:30px; }
.d-stats .tiles{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(250px, 100%), 1fr)); border-top:2px solid var(--ink); }
.d-stats .tile{ padding:16px 20px 16px 0; border-bottom:1px solid var(--rule); display:flex; flex-direction:column; gap:5px; min-width:0; }
.d-stats .t-l{ font:600 13.5px/1.2 var(--f-ui); color:var(--ink-3); }
.d-stats .t-v{ font:600 42px/1 var(--f-display); color:var(--ink); }
.d-stats .t-v small{ margin-left:6px; font:500 17px/1 var(--f-ui); color:var(--ink-2); }
.d-stats .t-s{ font:400 14px/1.4 var(--f-ui); color:var(--ink-2); }
.d-stats .t-note{ margin:10px 0 0; font:400 13.5px/1.5 var(--f-ui); color:var(--ink-3); }

/* the code chip */
.deals .code{ display:inline-block; padding:5px 8px; margin:0 6px 4px 0; border-radius:7px; border:1.5px dashed var(--accent); background:var(--accent-soft); color:var(--accent-hover); font:600 14px/1 var(--f-ui); letter-spacing:0.05em; white-space:nowrap; }
.d-stats .code, .tips .code, .unc .u-a .code{ padding:2px 6px; margin:0 1px; font-size:13px; vertical-align:1px; }
.deals .nocode{ font:500 13.5px/1.3 var(--f-ui); color:var(--ink-3); }

/* the list */
.d-list{ padding-bottom:40px; }
.d-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:12px 24px; margin-bottom:10px; }
.d-head h2{ margin:0 0 10px; font:600 32px/1.1 var(--f-display); color:var(--ink); }
.chips{ display:flex; flex-wrap:wrap; gap:6px; }
.chip{ min-height:44px; padding:0 14px; border-radius:999px; border:1px solid var(--rule-2); background:var(--surface); color:var(--ink); font:500 15px/1 var(--f-ui); cursor:pointer; }
.chip:hover{ border-color:var(--ink-3); }
.chip[aria-pressed="true"]{ background:var(--ink); color:var(--surface); border-color:var(--ink); }
.chip .n{ margin-left:7px; opacity:0.75; }
.d-sort{ display:flex; flex-direction:column; gap:6px; }
.d-sort label{ font:500 13px/1 var(--f-ui); color:var(--ink-3); }
.d-sort select{ min-height:44px; padding:8px 10px; border-radius:9px; border:1px solid var(--rule-2); background:var(--surface); color:var(--ink); font:500 15px/1.2 var(--f-ui); }
.js-only{ display:none !important; }
.js .js-only{ display:flex !important; }
.d-count{ margin:0 0 10px; font:500 14px/1.3 var(--f-ui); color:var(--ink-3); }
.d-table{ border:1px solid var(--rule); border-radius:14px; background:var(--surface); overflow:hidden; }
.d-rows{ list-style:none; margin:0; padding:0; font:400 14.5px/1.35 var(--f-ui); }
.d-empty{ margin:0; padding:22px 16px; font:500 15px/1.4 var(--f-ui); color:var(--ink-2); }

/* desktop: one grid row per program, as in the board */
.d-hrow, .d-row{ display:grid; grid-template-columns:minmax(210px, 1.5fr) 140px minmax(190px, 1.6fr) minmax(170px, 1.2fr) 118px 116px 70px 96px; }
.d-hrow{ border-bottom:1.5px solid var(--ink); font:600 13.5px/1.2 var(--f-ui); color:var(--ink-2); }
.d-hrow > span{ padding:13px 10px 11px; }
.d-hrow > span:first-child{ padding-left:16px; }
.d-hrow small{ display:block; margin-top:2px; font-size:12px; font-weight:500; color:var(--ink-3); }
.d-hrow .n, .d-row .c.n{ text-align:right; }
.d-row{ align-items:start; border-bottom:1px solid var(--rule); }
.d-row:last-child{ border-bottom:0; }
.d-row .c{ padding:12px 10px 6px; min-width:0; }
.d-row .c-prog{ padding-left:16px; display:flex; flex-direction:column; gap:4px; }
.d-row .lbl{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.d-row .nm{ display:flex; flex-wrap:wrap; align-items:baseline; gap:0 7px; }
.d-row .firm{ font:600 16px/1.25 var(--f-ui); color:var(--ink); text-decoration:none; }
.d-row .firm:hover{ color:var(--accent); text-decoration:underline; }
.d-row .pg{ font:500 15px/1.25 var(--f-ui); color:var(--ink-2); }
.deals .rev{ display:inline-flex; align-items:center; gap:5px; padding:2px 7px; border-radius:6px; background:var(--bad-soft); color:var(--ink); font:600 12px/1.3 var(--f-ui); }
.deals .rev::before{ content:""; flex:none; width:7px; height:7px; border-radius:50%; background:var(--bad); }
.d-row .tags{ display:flex; flex-wrap:wrap; gap:3px 12px; font:500 12.5px/1.25 var(--f-ui); color:var(--ink-3); }
.lane{ display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.lane i{ display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--ink-3); }
.lane.allowed i{ background:var(--lane-allowed); }
.lane.approval i, .lane.conditional i{ background:var(--lane-approval); }
.lane.banned i{ background:var(--lane-banned); }
.d-row .c-code{ padding-top:10px; }
.d-row .sub{ display:block; margin-top:3px; font:400 12.5px/1.35 var(--f-ui); color:var(--ink-3); }
.d-row .w{ color:var(--ink); }
.d-row .seen{ display:flex; align-items:baseline; gap:7px; font-size:13.5px; color:var(--ink-2); }
.dot{ flex:none; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--rule-2); }
.dot.ok{ background:var(--lane-allowed); }
.dot.tp{ background:var(--lane-banned); }
.d-row .c.n b{ font:600 17px/1.2 var(--f-ui); color:var(--ink); }
.d-row .c-off b.off{ color:var(--money-ink); font-size:16px; }
.d-row .c-off b.none{ color:var(--ink-3); font-weight:500; }
.d-row s{ color:var(--ink-3); }
.d-row .c-go{ padding-right:16px; text-align:right; padding-top:8px; }
.rank{ display:inline-flex; align-items:center; min-height:40px; padding:0 12px; border-radius:9px; border:1px solid var(--rule-2); color:var(--ink); text-decoration:none; font:600 14px/1 var(--f-ui); }
.rank:hover{ background:var(--tint); color:var(--ink); border-color:var(--ink-3); }

/* every size, the offer and the notes */
.more{ grid-column:1 / -1; padding:0 16px 10px; }
.more > summary{ display:inline-flex; align-items:center; gap:6px; min-height:32px; cursor:pointer; list-style:none; font:500 13.5px/1.2 var(--f-ui); color:var(--accent); border-radius:6px; }
.more > summary::-webkit-details-marker{ display:none; }
.more > summary::before{ content:""; width:7px; height:7px; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(-45deg); transition:transform .15s; margin-right:3px; }
.more[open] > summary::before{ transform:rotate(45deg); margin-top:-3px; }
.more > summary:hover{ color:var(--accent-hover); text-decoration:underline; }
.more-in{ display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr); gap:14px 28px; margin:6px 0 8px; padding:14px 16px; border-radius:12px; background:var(--tint); }
.tw{ overflow-x:auto; }
.sz{ width:100%; border-collapse:collapse; font:400 14px/1.3 var(--f-ui); font-variant-numeric:tabular-nums lining-nums; }
.sz th, .sz td{ padding:7px 8px; text-align:right; border-bottom:1px solid var(--rule); white-space:nowrap; }
.sz thead th{ font:600 12.5px/1.2 var(--f-ui); color:var(--ink-2); border-bottom:1.5px solid var(--rule-2); }
.sz th.l, .sz td.l, .sz tbody th{ text-align:left; }
.sz tbody th{ font-weight:600; color:var(--ink); white-space:normal; min-width:64px; }
.sz tbody th .sub{ display:block; font-weight:500; color:var(--ink-3); font-size:12px; }
.sz td.l{ color:var(--ink-3); }
.sz td.off{ color:var(--money-ink); font-weight:600; }
.sz s{ color:var(--ink-3); }
.sz tbody tr:last-child th, .sz tbody tr:last-child td{ border-bottom:0; }
.more-side{ display:flex; flex-direction:column; gap:8px; font:400 14px/1.5 var(--f-body); color:var(--ink-2); min-width:0; }
.more-side p{ margin:0; }
.more-side .kv b{ color:var(--ink); font-weight:600; }
.notes{ margin:0; padding:0 0 0 18px; display:flex; flex-direction:column; gap:5px; }
.notes li{ overflow-wrap:anywhere; }
.more-side .go{ display:flex; flex-wrap:wrap; gap:6px 18px; font:600 14px/1.3 var(--f-ui); }
.more-side .go a{ display:inline-flex; align-items:center; min-height:32px; }

.deals .foot{ margin:12px 0 0; max-width:110ch; font:400 13.5px/1.5 var(--f-ui); color:var(--ink-3); }

/* codes seen, not in these prices; read before you buy */
.d-end{ padding-bottom:20px; display:grid; grid-template-columns:minmax(0, 1.7fr) minmax(300px, 1fr); gap:28px 48px; align-items:start; }
.d-tips{ position:sticky; top:16px; }
.unc{ columns:2 300px; column-gap:36px; }
.u-firm{ break-inside:avoid; }
.sec-h{ border-top:2px solid var(--ink); padding-top:12px; margin-bottom:10px; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:6px 16px; }
.sec-h h2{ margin:0; font:600 28px/1.1 var(--f-display); color:var(--ink); }
.sec-h span{ font:500 14px/1.3 var(--f-ui); color:var(--ink-3); }
.unc{ list-style:none; margin:0; padding:0; font:400 14.5px/1.45 var(--f-ui); }
.u-firm{ padding:10px 0 8px; border-bottom:1px solid var(--rule); }
.u-firm h3{ margin:0 0 6px; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; font:600 16px/1.25 var(--f-ui); }
.u-firm h3 a{ color:var(--ink); text-decoration:none; }
.u-firm h3 a:hover{ color:var(--accent); text-decoration:underline; }
.u-firm ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; }
.u-firm li{ display:grid; grid-template-columns:118px minmax(0, 1fr); gap:2px 10px; align-items:start; }
.u-firm li .code{ font-size:12.5px; padding:4px 6px; }
.u-firm li .code, .u-firm li .nocode, .u-firm li .u-c{ justify-self:start; }
.u-c{ display:flex; flex-wrap:wrap; gap:4px; min-width:0; }
.u-c .code{ margin:0; }
.u-t{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.u-d{ color:var(--ink); overflow-wrap:anywhere; }
.u-a{ color:var(--ink-3); font-size:13.5px; overflow-wrap:anywhere; }
.tp-tag, .end{ display:inline-block; align-self:flex-start; margin-top:2px; padding:1px 7px; border-radius:6px; font:600 12px/1.4 var(--f-ui); }
.tp-tag{ background:var(--warn-soft); color:var(--ink); }
.end{ background:var(--tint-2); color:var(--ink-2); }
.tips{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; font:400 15px/1.55 var(--f-body); color:var(--ink-2); }
.tips li{ display:grid; grid-template-columns:30px minmax(0, 1fr); gap:12px; }
.tips .num{ width:26px; height:26px; border-radius:50%; background:var(--ink); color:var(--surface); display:grid; place-items:center; font:600 13px/1 var(--f-ui); }
.tips b{ color:var(--ink); font-weight:600; }

@media (max-width: 999px){
  .d-end{ grid-template-columns:minmax(0, 1fr); }
  .d-tips{ position:static; order:-1; }
}
/* below 1180px: each program becomes a card */
@media (max-width: 1179px){
  .d-hrow{ display:none; }
  .d-row{ grid-template-columns:repeat(4, minmax(0, 1fr)); grid-template-areas:"prog prog prog go" "code what what what" "seen seen seen seen" "from cush off ." "more more more more"; padding:6px 0 0; }
  .d-row .c-prog{ grid-area:prog; }
  .d-row .c-code{ grid-area:code; }
  .d-row .c-what{ grid-area:what; }
  .d-row .c-seen{ grid-area:seen; }
  .d-row .c-from{ grid-area:from; }
  .d-row .c-cush{ grid-area:cush; }
  .d-row .c-off{ grid-area:off; }
  .d-row .c-go{ grid-area:go; }
  .d-row .more{ grid-area:more; }
  .d-row .c{ padding:6px 16px 4px; }
  .d-row .c.n{ text-align:left; }
  .d-row .lbl{ position:static; width:auto; height:auto; overflow:visible; clip:auto; white-space:normal; display:block; margin-bottom:3px; font:600 12px/1.2 var(--f-ui); color:var(--ink-3); }
  .d-row .c-go{ padding-top:10px; }
  .more-in{ grid-template-columns:minmax(0, 1fr); }
  /* touch: the row's toggle and its links are at least 40px tall */
  .more > summary, .more-side .go a{ min-height:40px; }
}
@media (max-width: 640px){
  .deals .wrap{ padding-left:16px; padding-right:16px; }
  .d-hero{ padding-top:24px; padding-bottom:18px; gap:14px; }
  .d-hero h1{ font-size:44px; }
  .d-hero .lede{ font-size:16.5px; }
  .d-stats .t-v{ font-size:38px; }
  .d-head h2{ font-size:28px; }
  .chip{ min-height:40px; padding:0 12px; font-size:14.5px; }
  .d-row{ grid-template-columns:minmax(0, 1fr) minmax(0, 1fr) auto; grid-template-areas:"prog prog go" "code off off" "what what what" "seen seen seen" "from cush cush" "more more more"; }
  .d-row .c{ padding:6px 14px 4px; }
  .d-row .c-go{ padding:8px 14px 0 0; }
  .sz thead{ display:none; }
  .sz, .sz tbody{ display:block; }
  .sz tr{ display:flex; flex-wrap:wrap; align-items:baseline; gap:3px 12px; padding:8px 0; border-bottom:1px solid var(--rule); }
  .sz tbody tr:last-child{ border-bottom:0; }
  .sz th, .sz td{ display:inline; padding:0; border:0; text-align:left; white-space:nowrap; }
  .sz tbody th{ flex:1 0 100%; min-width:0; }
  .sz td[data-l]::before{ content:attr(data-l) " "; font-weight:500; color:var(--ink-3); }
  .sz td.l{ color:var(--ink-3); }
  .more{ padding:0 14px 10px; }
  .more-in{ padding:12px; margin-left:-4px; margin-right:-4px; }
  .u-firm li{ grid-template-columns:minmax(0, 1fr); }
}
@media print{
  .js .js-only, .js-only, .d-sort, .chips, .rank{ display:none !important; }
  .deals .code{ background:none; color:#000; border-color:#000; }
  .d-table{ border:0; }
  .d-row{ break-inside:avoid; }
  .more > summary{ display:none; }
}