/* Winners page. Designed at 390px (iPhone) first, then widened: a light canvas, white surfaces, large radii, the system
   font, 20px side margins that respect the safe areas. Loaded only on the Winners page (see functions.php); everything is
   scoped to .tmc-winners so nothing leaks into the theme.
   Motion: transform / opacity / clip-path only. Reveal targets are hidden only under html.tw-motion, a class that
   exists only when the visitor allows motion (inline gate in <head>, see includes/winners-page.php). */

/* ===== Tokens ===== */
.tmc-winners{
  --canvas:#f5f5f7;
  --surface:#fff;
  --ink:var(--tmc-ink,#071426);
  --ink-2:#5f6877;          /* secondary text: 5.2:1 on the canvas */
  --line:rgba(7,20,38,.09);
  --fill:rgba(118,118,128,.12);
  --blue:#1565f0;           /* filled buttons: white text 5.1:1 */
  --blue-ink:#1259e0;       /* links and tinted-button text */
  --blue-tint:rgba(21,101,240,.1);
  --gx:max(20px,env(safe-area-inset-left,0px),env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.2,.8,.2,1);
  --shadow:0 1px 2px rgba(7,20,38,.04),0 12px 32px -14px rgba(7,20,38,.16);
  /* Offset of the theme's sticky header; winners.js measures the real value. */
  --tw-stick-top:0px;
  color-scheme:light;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:1.0625rem;
  line-height:1.4;
  color:var(--ink);
  background:var(--canvas);
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}

/* ===== Base ===== */
html{scroll-padding-top:calc(var(--tw-stick-top,0px) + 12px)}
.tmc-winners *,.tmc-winners *::before,.tmc-winners *::after{box-sizing:border-box}
.tmc-winners img{display:block;max-width:100%;height:auto}
.tmc-winners h1,.tmc-winners h2,.tmc-winners h3,.tmc-winners p,.tmc-winners ul,.tmc-winners figure{margin:0}
.tmc-winners ul{padding:0;list-style:none}
.tmc-winners a{color:var(--blue-ink);text-underline-offset:.18em}
.tmc-winners button,.tmc-winners input,.tmc-winners select{font:inherit;color:inherit}
.tmc-winners .sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.tmc-winners .wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:var(--gx)}
.tmc-winners .tnum{font-variant-numeric:tabular-nums}
.tmc-winners [hidden]{display:none!important}
.tmc-winners :focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:8px}

/* ===== Type ===== */
.tmc-winners .display{font-weight:800;line-height:1.04;letter-spacing:-.035em;font-size:clamp(2.125rem,1.2rem + 4.1vw,3.5rem);text-wrap:balance}
.tmc-winners .display .ln{display:block}
.tmc-winners .h2{font-weight:800;line-height:1.1;letter-spacing:-.028em;font-size:clamp(1.75rem,1.4rem + 1.4vw,2.5rem)}
.tmc-winners .lede{font-size:1.1875rem;line-height:1.4;color:var(--ink-2)}
.tmc-winners .sec-sub{margin-top:8px;font-size:1.0625rem;line-height:1.4;color:var(--ink-2);text-wrap:pretty}

/* ===== Buttons and links: 48px targets (above the 44pt and 48dp minimums), a press that gives back ===== */
.tmc-winners .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 24px;border:0;border-radius:14px;font-weight:600;font-size:1.0625rem;line-height:1.1;text-decoration:none;text-align:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .2s var(--ease),background-color .2s,opacity .2s}
.tmc-winners .btn:active{transform:scale(.97)}
.tmc-winners .btn-primary{background:var(--blue);color:#fff}
.tmc-winners .btn-plain{background:var(--surface);color:var(--blue-ink)}
.tmc-winners .btn-tint{background:var(--blue-tint);color:var(--blue-ink)}
.tmc-winners .btn-light{background:#fff;color:var(--blue-ink)}
@media (hover:hover) and (pointer:fine){
  .tmc-winners .btn-primary:hover{background:#0f54d1}
  .tmc-winners .btn-plain:hover,.tmc-winners .btn-light:hover{background:#f0f4ff}
  .tmc-winners .btn-tint:hover{background:rgba(21,101,240,.16)}
}
.tmc-winners .textlink,.tmc-winners .link{display:inline-flex;align-items:center;gap:6px;min-height:48px;font-weight:600;font-size:1.0625rem;color:var(--blue-ink);text-decoration:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.tmc-winners .link{font-size:.9375rem;text-decoration:underline}
.tmc-winners .textlink svg{width:18px;height:18px;flex:none}
.tmc-winners .textlink:active,.tmc-winners .link:active{opacity:.55}
@media (hover:hover) and (pointer:fine){.tmc-winners .textlink:hover,.tmc-winners .link:hover{text-decoration:underline}}

/* ===== Sections ===== */
.tmc-winners .sec{padding-top:48px}
.tmc-winners .sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:4px 16px;margin-bottom:20px}
.tmc-winners .sec-head>div{min-width:0;max-width:34rem}
@media (min-width:700px){.tmc-winners .sec{padding-top:64px}.tmc-winners .sec-head{margin-bottom:24px}}
@media (min-width:1000px){.tmc-winners .sec{padding-top:80px}}

/* ===== Hero ===== */
.tmc-winners .hero{padding-top:12px}
.tmc-winners .hero-grid{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
.tmc-winners .hero-text{min-width:0}
.tmc-winners .hero-text .lede{margin-top:14px;max-width:30rem}
.tmc-winners .actions{display:flex;flex-direction:column;align-items:stretch;gap:4px;margin-top:24px}
.tmc-winners .actions .textlink{justify-content:center}

/* spotlight: a rounded photo card, the winner and the stub sit on a soft gradient at its foot */
.tmc-winners .spot{position:relative;border-radius:28px;overflow:hidden;isolation:isolate;background:#10243a}
.tmc-winners .spot .ph{aspect-ratio:1}
.tmc-winners .spot-cap{position:absolute;inset:auto 0 0 0;display:block;padding:96px 20px 0;color:#fff;background:linear-gradient(to top,rgba(6,14,28,.9) 0%,rgba(6,14,28,.66) 46%,rgba(6,14,28,0) 100%)}
.tmc-winners .spot-cap .nm{display:block;font-size:1.75rem;line-height:1.1;font-weight:800;letter-spacing:-.03em}
.tmc-winners .spot-cap .pz{display:-webkit-box;margin-top:6px;font-size:1.0625rem;line-height:1.35;color:rgba(255,255,255,.92);overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.tmc-winners .spot .stub{--dash:rgba(255,255,255,.62);--notch:var(--canvas);margin:14px -20px 0;padding-inline:20px}
.tmc-winners .spot .stub .tw-dash{left:20px;right:20px}
.tmc-winners .spot .stub .lab{color:rgba(255,255,255,.82)}
.tmc-winners .spot .stub .num{color:#fff;font-size:1.5rem}
.tmc-winners .spot .stub .verify{color:#fff}
.tmc-winners .spot-cap .when{display:block;margin-bottom:8px;font-size:.9375rem;font-weight:600;color:rgba(255,255,255,.8)}
/* Latest winner without a wall photo: a branded card, the caption flows instead of sitting on a photo. */
.tmc-winners .spot--latest{background:linear-gradient(160deg,#1b4fa8 0%,#0c2552 52%,#071426 100%)}
.tmc-winners .spot--latest .spot-cap{position:relative;inset:auto;padding:28px 20px 0;background:none}
.tmc-winners .spot--latest .spot-cap .nm{font-size:2.25rem}

/* three numerals: no boxes, hairlines between */
.tmc-winners .stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:4px;padding-top:8px;border-top:1px solid var(--line)}
.tmc-winners .stats li{min-width:0;padding:8px 2px 4px;text-align:center}
.tmc-winners .stats li+li{border-left:1px solid var(--line)}
.tmc-winners .stats strong{display:block;font-size:clamp(1.25rem,6.9vw,2.5rem);line-height:1.05;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.tmc-winners .stats .lab{display:block;margin-top:6px;font-size:.9375rem;line-height:1.25;color:var(--ink-2)}

@media (min-width:700px){
  .tmc-winners .hero{padding-top:20px}
  .tmc-winners .hero-grid{gap:32px}
  .tmc-winners .spot .ph{aspect-ratio:1;max-height:none}
  .tmc-winners .spot-cap .nm{font-size:2rem}
  .tmc-winners .actions{flex-direction:row;align-items:center;gap:20px}
  .tmc-winners .actions .textlink{justify-content:flex-start}
}
@media (min-width:1000px){
  .tmc-winners .hero{padding-top:32px}
  .tmc-winners .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,31rem);grid-template-areas:"text spot" "stats spot";grid-template-rows:auto auto;column-gap:64px;row-gap:40px;align-items:center}
  .tmc-winners .hero--solo .hero-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"text" "stats";grid-template-rows:auto}
  .tmc-winners .hero-text{grid-area:text;align-self:end}
  .tmc-winners .stats{grid-area:stats;align-self:start;max-width:38rem}
  .tmc-winners .spot{grid-area:spot}
  .tmc-winners .spot .ph{aspect-ratio:1;max-height:none}
}

/* ===== Photo plate ===== */
.tmc-winners .ph{position:relative;aspect-ratio:1;background:#10243a;overflow:hidden}
.tmc-winners .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%} /* owner 2026-10-27: photos are 1:1 and never cropped */
.tmc-winners .ph .ini{position:absolute;inset:0;display:grid;place-items:center;font-size:3rem;font-weight:800;letter-spacing:-.02em;color:rgba(255,255,255,.28)}
.tmc-winners .ph.is-broken img{display:none}
.tmc-winners .ph.is-broken .ini{color:rgba(255,255,255,.7);background:linear-gradient(160deg,#10243a,#0b1a2e)}

/* ===== Ticket stub: a dashed rule between two notches, the ticket number below. The rule stays put; .stub-in tears off it. ===== */
.tmc-winners .stub{--dash:#c3cad6;--notch:var(--canvas);position:relative;margin-top:auto;padding:16px 20px}
.tmc-winners .stub-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2px 16px;transform-origin:0 0}
.tmc-winners .stub .tw-dash{position:absolute;left:20px;right:20px;top:0;height:2px;background:repeating-linear-gradient(90deg,var(--dash) 0 7px,transparent 7px 13px);transform-origin:left center;pointer-events:none}
.tmc-winners .stub::before,.tmc-winners .stub::after{content:"";position:absolute;top:-6px;width:14px;height:14px;border-radius:50%;background:var(--notch)}
.tmc-winners .stub::before{left:-7px}
.tmc-winners .stub::after{right:-7px}
.tmc-winners .stub .tk{display:inline-flex;align-items:baseline;gap:8px}
.tmc-winners .stub .lab{font-size:.9375rem;font-weight:600;color:var(--ink-2)}
.tmc-winners .stub .num{display:inline-block;font-size:1.375rem;line-height:1.1;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tmc-winners .stub .verify{display:inline-flex;align-items:center;gap:5px;min-height:48px;font-size:.9375rem;font-weight:600;color:var(--blue-ink);text-decoration:none;-webkit-tap-highlight-color:transparent}
.tmc-winners .stub .verify svg{width:16px;height:16px;flex:none}
.tmc-winners .stub .verify:active{opacity:.55}
@media (hover:hover) and (pointer:fine){.tmc-winners .stub .verify:hover{text-decoration:underline}}
@media (forced-colors:active){
  .tmc-winners .stub .tw-dash{background:none;height:0;border-top:2px dashed CanvasText}
  .tmc-winners .stub::before,.tmc-winners .stub::after{background:Canvas;border:1px solid CanvasText}
}

/* ===== Winners Wall: a feed, one large photo card per row on a phone ===== */
.tmc-winners .feed{display:grid;gap:20px}
.tmc-winners .feed>li{min-width:0;display:flex}
.tmc-winners .wcard{display:flex;flex-direction:column;width:100%;overflow:hidden;isolation:isolate;border-radius:26px;background:var(--surface);box-shadow:var(--shadow)}
.tmc-winners .wcard .ph{aspect-ratio:1}
.tmc-winners .wcard-body{padding:18px 20px 18px}
.tmc-winners .wcard-body h3{font-size:1.5rem;line-height:1.12;font-weight:800;letter-spacing:-.025em}
.tmc-winners .wcard-body p{display:-webkit-box;margin-top:6px;font-size:1.0625rem;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.tmc-winners .wcard .stub{padding-top:18px}
@media (min-width:700px){
  .tmc-winners .feed{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .tmc-winners .wcard .ph{aspect-ratio:1}
}
@media (min-width:1000px){.tmc-winners .feed{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1280px){.tmc-winners .feed{grid-template-columns:repeat(4,minmax(0,1fr))}.tmc-winners .wcard-body h3{font-size:1.375rem}}

/* ===== Draw results: search, two selects, an inset grouped list =====
   (height as well as min-height: the theme's all-pages forms guard sets a smaller important min-height on phones) */
.tmc-winners .toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tmc-winners .field{position:relative;min-width:0}
.tmc-winners .field--q{grid-column:1/-1}
.tmc-winners .field input,.tmc-winners .field select{display:block;width:100%;height:48px;min-height:48px;margin:0;border:0;border-radius:14px;background-color:var(--fill);padding:0 14px;font-size:1rem;line-height:1.2;color:var(--ink);-webkit-appearance:none;appearance:none;text-overflow:ellipsis}
.tmc-winners .field input{padding-left:44px}
.tmc-winners .field input::placeholder{color:#586270;opacity:1}
.tmc-winners .field input::-webkit-search-decoration{-webkit-appearance:none}
.tmc-winners .field .ic{position:absolute;left:14px;top:50%;width:20px;height:20px;margin-top:-10px;color:var(--ink-2);pointer-events:none}
.tmc-winners .field .ic svg{display:block;width:20px;height:20px}
.tmc-winners .field select{padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f6877' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px}
.tmc-winners .field input:focus-visible,.tmc-winners .field select:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.tmc-winners .toolbar .btn{grid-column:1/-1}
.tmc-winners .ledger-meta{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;min-height:48px;margin-top:6px}
.tmc-winners .status{font-size:.9375rem;color:var(--ink-2)}

.tmc-winners .ledger-table,.tmc-winners .ledger-table tbody,.tmc-winners .ledger-table tr,.tmc-winners .ledger-table td,.tmc-winners .ledger-table th{display:block}
.tmc-winners .ledger-table{width:100%}
.tmc-winners .ledger-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.tmc-winners .ledger-table tbody{margin-top:20px}
.tmc-winners .ledger-table tbody:first-of-type{margin-top:8px}
.tmc-winners .ledger-table tr.month th{padding:0 20px 8px;text-align:left;font-size:.9375rem;font-weight:600;color:var(--ink-2)}
.tmc-winners .ledger-table tr.row{position:relative;display:grid;grid-template-columns:minmax(0,max-content) minmax(0,1fr) auto;grid-template-areas:"title title date" "name ticket date";row-gap:3px;align-items:start;min-height:64px;padding:14px 20px;background:var(--surface)}
.tmc-winners .ledger-table tr.row+tr.row::before{content:"";position:absolute;left:20px;right:0;top:0;height:1px;background:var(--line)}
.tmc-winners .ledger-table tr.month+tr.row{border-radius:22px 22px 0 0}
.tmc-winners .ledger-table tr.row:last-child{border-radius:0 0 22px 22px}
.tmc-winners .ledger-table tr.month+tr.row:last-child{border-radius:22px}
.tmc-winners .ledger-table td{position:relative;padding:0}
.tmc-winners .c-title{grid-area:title;display:-webkit-box!important;font-size:1.0625rem;font-weight:600;line-height:1.28;letter-spacing:-.01em;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.tmc-winners .c-name,.tmc-winners .c-ticket{font-size:.9375rem;line-height:1.35;color:var(--ink-2)}
.tmc-winners .c-name{grid-area:name;overflow-wrap:anywhere}
.tmc-winners .c-ticket{grid-area:ticket;white-space:nowrap}
.tmc-winners .c-ticket::before{content:"\00B7";margin-inline:7px}
.tmc-winners .c-ticket::before{content:"\00B7" / "";margin-inline:7px}
.tmc-winners .c-name:empty+.c-ticket::before{display:none}
.tmc-winners .c-ticket b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.tmc-winners .c-date{grid-area:date;padding-left:16px!important;font-size:.9375rem;line-height:1.35;white-space:nowrap;color:var(--ink-2);font-variant-numeric:tabular-nums}
.tmc-winners .ledger-table tr.row:focus{outline:3px solid var(--blue);outline-offset:-3px}
.tmc-winners .ledger-table tr.row:focus:not(:focus-visible){outline:0}
.tmc-winners .is-fade{animation:tw-fadein .2s ease-out}
.tmc-winners .ledger-foot{margin-top:20px}
.tmc-winners .ledger-foot .btn{width:100%}
.tmc-winners .state{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin-top:8px;padding:18px 20px;border-radius:22px;background:var(--surface);font-size:1.0625rem}
.tmc-winners .state--note{display:block;margin:0 0 12px;font-size:1rem;color:var(--ink-2)}

@media (min-width:700px){
  .tmc-winners .toolbar{grid-template-columns:minmax(0,1.6fr) repeat(2,minmax(0,1fr))}
  .tmc-winners .field--q{grid-column:auto}
  .tmc-winners .toolbar .btn{grid-column:auto}
  .tmc-winners .ledger-foot .btn{display:flex;max-width:22rem;margin-inline:auto}
}
@media (min-width:900px){
  /* the same list in a wider card: four aligned columns under a quiet header */
  .tmc-winners .ledger-table thead{position:static;width:auto;height:auto;overflow:visible;clip-path:none}
  .tmc-winners .ledger-table thead tr{display:grid;grid-template-columns:7rem minmax(0,1fr) 14rem 9rem;column-gap:16px;margin-top:12px;padding:0 20px 4px}
  .tmc-winners .ledger-table thead th{grid-area:auto;padding:0!important;font-size:.875rem;font-weight:600;text-align:left;color:var(--ink-2)}
  .tmc-winners .ledger-table tr.row{grid-template-columns:7rem minmax(0,1fr) 14rem 9rem;grid-template-areas:"date title name ticket";column-gap:16px;align-items:baseline;padding:16px 20px}
  .tmc-winners .c-date{padding-left:0!important}
  .tmc-winners .c-title{font-size:1.0625rem}
  .tmc-winners .c-name{font-size:1rem;font-weight:600;color:var(--ink)}
  .tmc-winners .c-ticket{font-size:1rem}
  .tmc-winners .c-ticket::before{display:none}
  .tmc-winners .c-ticket .lab{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

/* ===== Rails: a row you swipe, the next card always peeking in ===== */
.tmc-winners .rail{display:flex;gap:12px;margin-inline:calc(var(--gx) * -1);padding:4px var(--gx) 20px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gx);-webkit-overflow-scrolling:touch;scrollbar-width:none}
.tmc-winners .rail::-webkit-scrollbar{display:none}
.tmc-winners .rail>li{position:relative;flex:0 0 min(78vw,300px);min-width:0;display:flex;scroll-snap-align:start} /* position: keeps the screen-reader-only text inside the rail instead of widening the page */
.tmc-winners .rail:focus-visible{outline-offset:-3px;border-radius:0}

.tmc-winners .nt{display:flex;flex-direction:column;width:100%;min-height:200px;padding:20px;border-radius:24px;background:var(--surface);box-shadow:var(--shadow)}
.tmc-winners .nt-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--blue-tint);color:var(--blue-ink)}
.tmc-winners .nt-ic svg{width:24px;height:24px}
.tmc-winners .nt h3{margin-top:16px;font-size:1.25rem;line-height:1.2;font-weight:800;letter-spacing:-.02em;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.tmc-winners .nt-meta{margin-top:auto;padding-top:14px;font-size:.9375rem;line-height:1.35;color:var(--ink-2)}
.tmc-winners .nt-meta b{display:block;font-size:1.0625rem;font-weight:600;color:var(--ink)}
.tmc-winners .nt-meta time{display:block;margin-top:2px}

.tmc-winners .lc{display:flex;flex-direction:column;width:100%;overflow:hidden;isolation:isolate;border-radius:24px;background:var(--surface);box-shadow:var(--shadow)}
.tmc-winners .lc-img{position:relative;aspect-ratio:1;display:grid;place-items:center;overflow:hidden;background:#10243a;color:rgba(255,255,255,.55)}
.tmc-winners .lc-img :is(img,video){position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.tmc-winners .lc-img svg{width:36px;height:36px}
.tmc-winners .lc-body{padding:16px 20px 4px}
.tmc-winners .lc h3{font-size:1.1875rem;line-height:1.25;font-weight:800;letter-spacing:-.02em;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.tmc-winners .lc-price{margin-top:6px;font-size:.9375rem;color:var(--ink-2)}
.tmc-winners .lc-price b{font-size:1.1875rem;font-weight:800;color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tmc-winners .lc .btn{margin:12px 20px 20px;min-height:48px}
.tmc-winners .lc-body{flex:1}

@media (min-width:1000px){
  .tmc-winners .rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-inline:0;padding:0;overflow:visible;scroll-snap-type:none}
  .tmc-winners .rail--live{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tmc-winners .rail>li{flex:none}
}

/* ===== Closing ===== */
.tmc-winners .closing{padding-bottom:max(36px,env(safe-area-inset-bottom,0px))}
.tmc-winners .cta{display:grid;gap:20px;padding:32px 24px;border-radius:28px;background:var(--blue);color:#fff}
.tmc-winners .cta .h2{color:#fff}
.tmc-winners .cta .btn{width:100%}
.tmc-winners .compliance{margin-top:24px;text-align:center;text-wrap:balance;font-size:.875rem;line-height:1.5;color:var(--ink-2)}
.tmc-winners .compliance a{color:inherit;text-decoration:underline;padding-block:12px}
@media (min-width:700px){
  .tmc-winners .cta{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:32px;padding:40px 48px}
  .tmc-winners .cta .btn{width:auto}
}

/* ===== Motion =====
   Everything below applies only under html.tw-motion (set in <head> when the visitor allows motion, removed again if the
   script never starts). Reveal targets are hidden only here; transform, opacity and clip-path only. */
@keyframes tw-fadein{from{opacity:.35}to{opacity:1}}
@keyframes tw-pop{0%{opacity:0;transform:scale(.55)}60%{opacity:1;transform:scale(1.14)}100%{opacity:1;transform:scale(1)}}
@keyframes tw-tear{0%{transform:translateY(0) rotate(0)}34%{transform:translateY(6px) rotate(1deg)}62%{transform:translateY(-1px) rotate(-.35deg)}100%{transform:translateY(0) rotate(0)}}
@keyframes tw-feed{from{opacity:0;transform:translateY(32px) scale(.94)}to{opacity:1;transform:none}}

/* a slow push-in on the spotlight photo */
/* No Ken Burns zoom: scaling a photo crops its edges, and photos are never cropped (owner 2026-10-27). */

/* cards rise in, one by one (winners.js adds .is-in as each one scrolls into view) */
html.tw-motion .tmc-winners .tw-rv{opacity:0;transform:translateY(24px)}
html.tw-motion .tmc-winners .tw-rv--pop{transform:scale(.95)}
html.tw-motion .tmc-winners .tw-rv--feed{transform:translateY(32px) scale(.94)}
html.tw-motion .tmc-winners .tw-rv.is-in{opacity:1;transform:none;transition:opacity .7s var(--ease) var(--tw-delay,0ms),transform .9s var(--ease) var(--tw-delay,0ms)}
/* groups (title block, numerals, rails): the whole group is watched, the children follow with a stagger */
html.tw-motion .tmc-winners .tw-grp>.tw-kid{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease) calc(var(--i,0) * 70ms),transform .9s var(--ease) calc(var(--i,0) * 70ms)}
html.tw-motion .tmc-winners .tw-grp.is-in>.tw-kid{opacity:1;transform:none}
/* where the browser can tie the motion to the scroll position, the feed does that instead (smoother on a phone) */
@supports (animation-timeline:view()){
  html.tw-motion .tmc-winners .tw-rv--feed{animation:tw-feed linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
}
/* ticket stubs: the dashed rule draws across, the number pops */
html.tw-motion .tmc-winners .tw-rv .stub .tw-dash{transform:scaleX(0)}
html.tw-motion .tmc-winners .tw-rv.is-in .stub .tw-dash{transform:scaleX(1);transition:transform .8s var(--ease) calc(var(--tw-delay,0ms) + 300ms)}
html.tw-motion .tmc-winners .tw-rv:not(.is-in) .stub .num{opacity:0}
html.tw-motion .tmc-winners .tw-rv.is-in .stub .num{animation:tw-pop .6s var(--ease) calc(var(--tw-delay,0ms) + 600ms) backwards}
/* then the stub tears a few pixels off the perforation and settles back, once per card */
html.tw-motion .tmc-winners .tw-rv.is-in .stub-in{animation:tw-tear .95s var(--ease) calc(var(--tw-delay,0ms) + 1000ms) both}

/* ===== Preferences ===== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  .tmc-winners *,.tmc-winners *::before,.tmc-winners *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .tmc-winners .tw-rv,.tmc-winners .tw-kid,.tmc-winners .tw-dash,.tmc-winners .stub .num{opacity:1!important;transform:none!important}
}
@media (prefers-contrast:more){
  .tmc-winners{--ink-2:#3d4655;--line:rgba(7,20,38,.3)}
  .tmc-winners a{text-decoration:underline}
  .tmc-winners .field input,.tmc-winners .field select{outline:1px solid currentColor}
}
@media (forced-colors:active){
  .tmc-winners .btn,.tmc-winners .nt,.tmc-winners .lc,.tmc-winners .wcard,.tmc-winners .state{border:1px solid CanvasText}
}
@media print{
  html.tw-motion .tmc-winners .tw-rv,html.tw-motion .tmc-winners .tw-grp>.tw-kid{opacity:1!important;transform:none!important}
}
