/* The draw machine and the winner card (Chris, 21 Oct 2026; DRAW-MODES.md "The draw machine").
   The machine is one dark stage on every look - it is what viewers watch, on the site and on a stream - wearing the operator's
   colour (--st-p on the platform's templates, the site's primary colour on Ruby's candy: --dm-op, set by partials/draw-live)
   with gold kept for a win and red for a number that is not an entry. The winner card wears the site's own look. Both are
   drawn in code - no pictures. Driven by public/theme/draw-live.js. */

.dm-wrap{width:100%;min-width:0;container:dm/inline-size}   /* sized by its place, never by its contents */
.st-draw{min-width:0}
.dm{--dm-body:#0f172b;--dm-body2:#16203a;--dm-edge:#26324f;--dm-ink:#eaf0fb;--dm-mute:#9aa7c2;--dm-hi:#e6eaf1;--dm-lo:#5d6779;
  --dm-accent:var(--st-p,var(--dm-op,#046eff));--dm-gold:#f5c451;--dm-gold-ink:#2a1d00;--dm-miss:#ff5a5f;--dm-on:#2ee59d;
  --dm-display:var(--st-font-display,var(--rcc-display,system-ui,sans-serif));--dm-font:var(--st-font-body,var(--rcc-body,system-ui,sans-serif));
  --dm-digit:var(--st-font-display,var(--rcc-display,"Arial Narrow",Impact,sans-serif));--dm-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  position:relative;box-sizing:border-box;width:100%;margin:8px 0 0;padding:14px 14px 16px;border-radius:20px;overflow:hidden;
  text-align:center;color:var(--dm-ink);font:15px/1.45 var(--dm-font);
  background:linear-gradient(180deg,var(--dm-body2),var(--dm-body));
  background:radial-gradient(70% 45% at 50% 0%,color-mix(in srgb,var(--dm-accent) 22%,transparent),transparent 70%),linear-gradient(180deg,var(--dm-body2),var(--dm-body));
  border:1px solid var(--dm-edge);box-shadow:0 24px 60px -30px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06)}
.dm::before{content:"";position:absolute;inset:7px;border-radius:15px;border:1px solid var(--dm-edge);border-color:color-mix(in srgb,var(--dm-accent) 38%,transparent);pointer-events:none}
.dm *{box-sizing:border-box}
.dm p{margin:0;max-width:none;text-align:center}

.dm__plate{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 12px;
  font:700 11px/1.2 var(--dm-display);letter-spacing:.2em;text-transform:uppercase;color:var(--dm-mute)}
.dm__live{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px;vertical-align:middle;background:var(--dm-miss);box-shadow:0 0 8px var(--dm-miss)}
.dm__live.is-on{background:var(--dm-on);box-shadow:0 0 10px var(--dm-on)}

/* the tape: the sealed list, then the public random number running past */
.dm__tape{position:relative;display:flex;align-items:center;height:38px;margin-top:10px;border-radius:10px;overflow:hidden;background:#04070f;border:1px solid var(--dm-edge)}
.dm__tape-l{position:relative;z-index:2;flex:none;align-self:stretch;display:flex;align-items:center;padding:0 12px;background:#04070f;border-right:1px solid var(--dm-edge);
  box-shadow:14px 0 14px #04070f;font:700 10px/1 var(--dm-display);letter-spacing:.14em;text-transform:uppercase;color:var(--dm-ink)}
.dm__tape-win{position:relative;flex:1;min-width:0;align-self:stretch;overflow:hidden;font:500 13px/1 var(--dm-mono);
  color:#cfe0ff;color:color-mix(in srgb,var(--dm-accent) 55%,#dfe9ff)}
/* the run is out of the flow, so however long its words it can never widen the machine or the page (21 Oct: it did) */
.dm__tape-run{position:absolute;top:0;bottom:0;left:0;right:0;display:flex;align-items:center;padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.dm__tape.is-go .dm__tape-run{right:auto;overflow:visible;padding-left:100%;animation:dm-tape 14s linear infinite}
.dm__tape.is-fast .dm__tape-run{animation-duration:2.4s}
@keyframes dm-tape{to{transform:translateX(-100%)}}

/* the rotors: one per digit of the highest ticket, a strip of 0-9 turned to land the next digit in the window */
.dm__rotors{display:flex;align-items:flex-start;justify-content:center;gap:clamp(6px,2.2vw,16px);margin-top:16px}
.dm__rotor{--cell:46px;position:relative;flex:0 1 92px;min-width:0;aspect-ratio:92/144;border-radius:12px;overflow:hidden;
  background:linear-gradient(90deg,#1a2135,#0a0e19 18%,#0a0e19 82%,#1a2135);border:1px solid var(--dm-edge)}
.dm__rotor::before,.dm__rotor::after{content:"";position:absolute;left:0;right:0;height:34%;z-index:2;pointer-events:none}
.dm__rotor::before{top:0;background:linear-gradient(#0a0e19,rgba(10,14,25,0))}
.dm__rotor::after{bottom:0;background:linear-gradient(rgba(10,14,25,0),#0a0e19)}
.dm__edge{position:absolute;top:0;bottom:0;z-index:3;width:6px;opacity:.55;background:repeating-linear-gradient(0deg,var(--dm-lo) 0 2px,var(--dm-hi) 2px 4px)}
.dm__edge--l{left:0}.dm__edge--r{right:0}
.dm__win{position:absolute;left:6px;right:6px;top:50%;z-index:1;height:var(--cell);transform:translateY(-50%);border-radius:6px;
  border:1px solid var(--dm-accent);box-shadow:0 0 22px -4px var(--dm-accent);transition:border-color .2s,box-shadow .2s}
.dm__rotor.is-locked .dm__win{border-color:var(--dm-ink)}
.dm__rotor.is-win .dm__win{border-color:var(--dm-gold);box-shadow:0 0 26px -2px var(--dm-gold)}
.dm__rotor.is-miss .dm__win{border-color:var(--dm-miss);box-shadow:0 0 22px -4px var(--dm-miss)}
.dm__strip{position:absolute;left:0;right:0;top:50%;display:block;will-change:transform}
.dm__strip b{display:flex;align-items:center;justify-content:center;height:var(--cell);font:700 calc(var(--cell)*.8)/1 var(--dm-digit);font-variant-numeric:tabular-nums;
  color:var(--dm-hi);background:linear-gradient(180deg,var(--dm-hi),var(--dm-lo));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dm__rotor.is-win .dm__strip b{background-image:linear-gradient(180deg,#fff3c4,var(--dm-gold))}

/* the lampboard: letters light in turn, as a cipher machine types its answer */
.dm__lamps{display:grid;gap:5px;justify-content:center;margin-top:14px}
.dm__lamprow{display:flex;justify-content:center;gap:5px}
.dm__lamp{display:grid;place-items:center;width:clamp(20px,6vw,28px);height:clamp(20px,6vw,28px);border-radius:50%;font:700 clamp(10px,2.6vw,12px)/1 var(--dm-display);
  color:#5a6684;background:radial-gradient(circle at 35% 30%,#2a3350,#121a2e);border:1px solid #2a3554;transition:color .12s,background .12s,box-shadow .12s}
.dm__lamp.is-lit{color:#1b1300;background:radial-gradient(circle at 35% 30%,#fff6d8,var(--dm-gold));box-shadow:0 0 14px var(--dm-gold)}
.dm__lamp.is-lit.is-red{color:#2a0607;background:radial-gradient(circle at 35% 30%,#ffd9da,var(--dm-miss));box-shadow:0 0 14px var(--dm-miss)}

/* the plate: WINNER with the name, or NO ENTRY - the moment the rotors stop */
.dm__result{display:grid;place-items:center;min-height:196px;margin-top:16px;padding:14px;border-radius:14px;background:#060a14;border:1px solid var(--dm-edge);
  transition:background .3s,border-color .3s}
.dm .dm__eyebrow{font:700 12px/1.2 var(--dm-display);letter-spacing:.24em;text-transform:uppercase;color:var(--dm-gold)}
.dm .dm__word{font:700 clamp(30px,9vw,54px)/1 var(--dm-display);letter-spacing:.06em;text-transform:uppercase;color:var(--dm-ink)}
.dm .dm__name{margin-top:8px!important;font:700 clamp(20px,5vw,28px)/1.15 var(--dm-display);color:var(--dm-ink);overflow-wrap:anywhere}
.dm .dm__name.is-held{color:var(--dm-mute);font-size:clamp(16px,4vw,20px)}
.dm .dm__line{margin-top:6px!important;font-size:14.5px;color:var(--dm-mute)}
.dm .dm__lock{display:inline-block;margin-top:8px!important;padding:5px 10px;border-radius:999px;font:700 12px/1.2 var(--dm-display);letter-spacing:.08em;text-transform:uppercase;
  color:var(--dm-mute);border:1px solid var(--dm-edge);font-variant-numeric:tabular-nums}
.dm .dm__lock.is-locked{color:var(--dm-gold-ink);background:var(--dm-gold);border-color:var(--dm-gold)}
.dm__result.is-win{border-color:var(--dm-gold);background:#1c1606;background:radial-gradient(80% 120% at 50% 0%,color-mix(in srgb,var(--dm-gold) 26%,#060a14),#060a14)}
.dm .dm__result.is-win .dm__word{color:var(--dm-gold);text-shadow:0 0 24px rgba(245,196,81,.55)}
.dm__result.is-miss{border-color:var(--dm-miss)}
.dm .dm__result.is-miss .dm__word{color:var(--dm-miss)}

/* every number drawn, and the winners so far */
.dm__history{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;min-height:24px;margin-top:10px}
.dm__history span{padding:5px 7px;border-radius:6px;border:1px solid var(--dm-edge);font:600 12px/1 var(--dm-mono);color:var(--dm-mute)}
.dm__history span.is-miss{text-decoration:line-through;text-decoration-color:var(--dm-miss)}
.dm__history span.is-win{color:var(--dm-gold-ink);background:var(--dm-gold);border-color:var(--dm-gold)}
.dm__history em{font:600 12px/24px var(--dm-font);font-style:normal;color:var(--dm-mute)}
.dm__winners{display:grid;gap:8px;margin:12px 0 0;padding:0;list-style:none;text-align:left}
.dm__winners li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 11px;border-radius:12px;background:rgba(0,0,0,.28);border:1px solid var(--dm-edge)}
.dm__winners .dm__pl{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font:700 13px/1 var(--dm-display);color:var(--dm-gold-ink);background:var(--dm-gold)}
.dm__winners b{display:block;font:700 17px/1.2 var(--dm-display);overflow-wrap:anywhere}
.dm__winners small{display:block;font:600 12.5px/1.3 var(--dm-font);color:var(--dm-mute)}
.dm__winners .dm__st{font:700 11px/1.2 var(--dm-display);letter-spacing:.06em;text-transform:uppercase;color:var(--dm-mute);text-align:right;font-variant-numeric:tabular-nums}
.dm__winners .dm__st.is-locked{color:var(--dm-gold)}
.dm__sound{position:relative;margin-top:12px;padding:6px 11px;border-radius:999px;border:1px solid var(--dm-edge);background:transparent;color:var(--dm-mute);
  font:600 12.5px/1 var(--dm-font);cursor:pointer}
.dm__sound[aria-pressed="true"]{color:var(--dm-ink);border-color:var(--dm-ink)}
.dm__sound:focus-visible{outline:2px solid var(--dm-ink);outline-offset:2px}
.dm__check{display:inline-block;margin-top:12px;color:var(--dm-ink);font:600 14px/1 var(--dm-font);text-decoration:underline;text-underline-offset:3px}
.dm__sparkle{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:20px}
.dm__sparkle i{position:absolute;top:0;width:6px;height:10px;border-radius:2px;opacity:0;animation:dm-fall 1.8s ease-in forwards}
@keyframes dm-fall{0%{opacity:1;transform:translateY(-20px) rotate(0)}100%{opacity:0;transform:translateY(460px) rotate(540deg)}}

/* the facts under it, and the team's panel (the Live draw screen) */
.dm-side{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;min-width:0}
.dm-side>.dm-facts,.dm-side>.dm-team{margin-top:0}
.dm-facts{display:grid;gap:8px;width:100%;margin:12px 0 0;text-align:left}
.dm-facts>div{display:grid;gap:2px;padding:9px 12px;border-radius:12px;background:var(--st-s2,rgba(0,0,0,.05))}
.dm-facts dt{font:700 12px/1.3 var(--st-font-body,var(--rcc-body,inherit));color:var(--st-muted,var(--rcc-mute,#666))}
.dm-facts dd{margin:0;font:600 13px/1.4 var(--st-font-body,var(--rcc-body,inherit));color:var(--st-fg,var(--rcc-text,inherit))}
.dm-facts code{display:block;font:600 11.5px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere}
.dm-facts small{font-weight:700;color:var(--st-muted,var(--rcc-mute,#666))}
.dm-team{display:grid;gap:10px;width:100%;margin-top:14px;padding:14px;border-radius:14px;text-align:left;border:1px dashed var(--st-line,rgba(0,0,0,.25))}
.dm-team .dm-team__h{margin:0;font:700 11px/1.3 var(--st-font-display,var(--rcc-display,inherit));letter-spacing:.14em;text-transform:uppercase;color:var(--st-muted,var(--rcc-mute,#666))}
.dm-team .dm-team__say{margin:0;font:600 15px/1.45 var(--st-font-body,var(--rcc-body,inherit));color:var(--st-fg,var(--rcc-text,inherit));max-width:none}
.dm-team .st-draw__presses{justify-content:flex-start}
.dm-team__locks .st-btn small{display:block;margin-top:3px;font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;opacity:.85}
.dm-team .st-btn[disabled]{opacity:.5;cursor:default}
.dm-team .st-btn.is-gold,.rc-candy .dm-team .st-btn.is-gold{background:#f5c451;color:#2a1d00;border-color:#f5c451;text-shadow:none}

/* the stream page: the machine alone, filling the browser source */
.st-draw--stream{border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;max-width:none!important}
.st-draw--stream .dm{margin:0;padding:22px 22px 24px}
.st-draw--stream .dm__rotor{flex-basis:150px}
.st-draw--stream .dm__lamp{width:clamp(22px,3.2vw,36px);height:clamp(22px,3.2vw,36px);font-size:clamp(11px,1.4vw,15px)}
.st-draw--stream .dm__word{font-size:clamp(34px,7vw,84px)}
.st-draw--stream .dm__name{font-size:clamp(22px,4.4vw,48px)}
.st-draw--stream .dm__line{font-size:clamp(14px,1.8vw,20px)}
/* ...and wherever the machine itself is wide on a landscape screen (the stream view, the admin's Live draw screen): two
   columns sized by the screen's height, so the whole machine fits with no scrolling - the rotors and lampboard on the
   left, the plate, the numbers and the winners on the right */
@media (min-aspect-ratio:4/3){@container dm (min-width:720px){
  .dm-wrap .dm{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:3.4vh;row-gap:0;align-items:start;padding:2.4vh 3vh 3vh;
    grid-template-areas:"plate plate" "tape tape" "rotors result" "lamps result" ". history" ". winners";grid-template-rows:auto auto auto auto auto minmax(0,1fr)}
  .dm-wrap .dm__plate{grid-area:plate;font-size:1.5vh}
  .dm-wrap .dm__tape{grid-area:tape;height:4.6vh;margin-top:1.4vh}
  .dm-wrap .dm__tape-l{font-size:1.25vh}
  .dm-wrap .dm__tape-win{font-size:1.7vh}
  .dm-wrap .dm__rotors{grid-area:rotors;margin-top:2.4vh;gap:1.4vh}
  .dm-wrap .dm__rotor{flex-basis:21vh}
  .dm-wrap .dm__lamps{grid-area:lamps;margin-top:2.4vh;gap:.9vh}
  .dm-wrap .dm__lamprow{gap:.9vh}
  .dm-wrap .dm__lamp{width:4.4vh;height:4.4vh;font-size:1.8vh}
  .dm-wrap .dm__result{grid-area:result;align-self:stretch;min-height:30vh;margin-top:2.4vh;padding:2vh}
  .dm-wrap .dm .dm__word{font-size:9vh}
  .dm-wrap .dm .dm__name{font-size:5.2vh}
  .dm-wrap .dm .dm__line{font-size:2.2vh}
  .dm-wrap .dm .dm__lock{font-size:1.7vh;padding:.7vh 1.4vh}
  .dm-wrap .dm__sound{justify-self:center;align-self:start;margin-top:2vh}
  .dm-wrap .dm__history{grid-area:history;margin-top:1.6vh;gap:.6vh}
  .dm-wrap .dm__history span{font-size:1.6vh;padding:.6vh .8vh}
  .dm-wrap .dm__winners{grid-area:winners;align-self:stretch;margin-top:1.4vh;gap:1vh;grid-template-columns:repeat(auto-fill,minmax(26vh,1fr));align-content:start;overflow:hidden}
  .dm-wrap .dm__winners li{padding:1vh 1.2vh;gap:1.2vh}
  .dm-wrap .dm__winners .dm__pl{width:4.4vh;height:4.4vh;font-size:1.8vh}
  .dm-wrap .dm__winners b{font-size:2.5vh}
  .dm-wrap .dm__winners small,.dm-wrap .dm__winners .dm__st{font-size:1.5vh}
}}
/* six digits or more (a competition of 100,000+ tickets): slimmer rotors, and on a wide screen the row of them takes the
   machine's whole width, the lampboard and the plate side by side under it */
.dm--long .dm__rotors{gap:clamp(3px,1.2vw,10px)}
.dm--long .dm__edge{width:3px}
.dm--long .dm__win{left:3px;right:3px}
@media (min-aspect-ratio:4/3){@container dm (min-width:720px){
  .dm-wrap .dm.dm--long{grid-template-areas:"plate plate" "tape tape" "rotors rotors" "lamps result" "history history" "winners winners";grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-rows:auto auto auto auto auto auto}
  .dm-wrap .dm--long .dm__sound{grid-area:lamps;align-self:end;margin:0}
  .dm-wrap .dm--long .dm__rotors{gap:1vh}
  .dm-wrap .dm--long .dm__rotor{flex-basis:12vh}
  .dm-wrap .dm--long .dm__result{min-height:22vh}
}}
@media (max-width:420px){.dm{padding:12px 10px 14px}.dm__plate{letter-spacing:.12em}.dm__tape-l{font-size:9px;letter-spacing:.06em;padding:0 8px}.dm__tape-win{font-size:12px;padding-left:8px}}
@media (prefers-reduced-motion:reduce){.dm__tape.is-go .dm__tape-run{animation:none;padding-left:0}.dm__sparkle{display:none}}

/* the winner card: the competition page once every winner is locked in, in place of the machine */
.st-wcard{--wc-gold:var(--st-win,var(--rcc-gold,#f5c451));--wc-gold-ink:var(--st-win-ink,#2a1d00);--wc-fg:var(--st-fg,var(--rcc-text,inherit));
  --wc-mute:var(--st-muted,var(--rcc-mute,#666));--wc-line:var(--st-line,rgba(0,0,0,.12));--wc-display:var(--st-font-display,var(--rcc-display,inherit));
  position:relative;overflow:hidden;text-align:left!important;align-items:stretch!important;border-top:4px solid var(--wc-gold)!important}
.st-wcard::before{content:"";position:absolute;inset:0 0 auto;height:140px;pointer-events:none;background:linear-gradient(180deg,rgba(245,196,81,.16),transparent)}
.st-wcard>*{position:relative}
.st-wcard__ribbon{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;font:700 11.5px/1.2 var(--wc-display);letter-spacing:.12em;text-transform:uppercase;color:var(--wc-mute)}
.st-wcard__ribbon b{padding:6px 9px;border-radius:6px;letter-spacing:.2em;color:var(--wc-gold-ink);background:var(--wc-gold)}
.st-wcard__body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:16px;margin-top:14px}
.st-wcard .st-wcard__eyebrow{margin:14px 0 0;font:700 13px/1.2 var(--wc-display);letter-spacing:.26em;text-transform:uppercase;color:var(--wc-fg)}
.st-wcard .st-wcard__body .st-wcard__eyebrow{margin-top:0}
.st-wcard__name{margin:6px 0 0;font:700 clamp(30px,8vw,44px)/1.05 var(--wc-display);color:var(--wc-fg);overflow-wrap:anywhere}
.st-wcard .st-wcard__prize{margin:6px 0 0;font-size:16px;color:var(--wc-fg);max-width:none}
.st-wcard__ticket small{display:block;margin-bottom:6px;font:700 10.5px/1 var(--wc-display);letter-spacing:.2em;text-transform:uppercase;color:var(--wc-mute)}
.st-wcard__tiles{display:flex;gap:5px}
.st-wcard__tiles b{display:grid;place-items:center;flex:0 1 44px;min-width:0;aspect-ratio:44/60;border-radius:9px;font:700 clamp(24px,7vw,36px)/1 var(--wc-display);font-variant-numeric:tabular-nums;
  color:#2a1d00;background:linear-gradient(180deg,#ffe7a3,#f5c451);box-shadow:inset 0 -3px 0 rgba(0,0,0,.18),0 6px 16px -8px rgba(160,110,0,.7)}
.st-wcard__tiles--sm b{flex:0 0 28px;aspect-ratio:28/38;border-radius:6px;font-size:21px}
.st-wcard__list{display:grid;gap:8px;margin:12px 0 0;padding:0;list-style:none}
.st-wcard__list li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 11px;border-radius:12px;border:1px solid var(--wc-line)}
.st-wcard__list li>b{font:700 18px/1.2 var(--wc-display);color:var(--wc-fg);overflow-wrap:anywhere}
.st-wcard__place{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font:700 13px/1 var(--wc-display);color:#2a1d00;background:#f5c451}
.st-wcard__place--2{background:#d9dee7}.st-wcard__place--3{background:#e0a46e}.st-wcard__place--4{background:transparent;color:var(--wc-fg);border:1px solid var(--wc-line)}
.st-wcard__proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0 0;padding:12px 0 0;border-top:1px solid var(--wc-line)}
.st-wcard__proof dt{font:700 10.5px/1.2 var(--wc-display);letter-spacing:.14em;text-transform:uppercase;color:var(--wc-mute)}
.st-wcard__proof dd{margin:4px 0 0;font-size:13.5px;line-height:1.35;color:var(--wc-fg)}
.st-wcard__more{margin-top:10px;font-size:13px;color:var(--wc-mute)}
.st-wcard__more summary{cursor:pointer;font-weight:700}
.st-wcard__more .st-draw__how{margin:6px 0 0;text-align:left}
.st-wcard__acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
@media (max-width:560px){.st-wcard__body{grid-template-columns:minmax(0,1fr)}.st-wcard__proof{grid-template-columns:minmax(0,1fr)}}

/* a finished competition's instant winners, prize by prize: who found each, or "No winners" - never the numbers nobody
   found. Gold edge on a prize somebody won */
.st-iwwin__tiers{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:12px;align-items:start}
.st-iwwin__tier{display:grid;gap:8px;min-width:0;text-align:left;padding:12px 14px;border-radius:14px;
  background:var(--st-s1,var(--rcc-pearl,#fff));border:1px solid var(--st-line,rgba(0,0,0,.12));color:var(--st-fg,var(--rcc-text,inherit))}
.st-iwwin__tier.is-won{border-color:var(--st-win,var(--rcc-gold,#f5c451));box-shadow:inset 0 3px 0 var(--st-win,var(--rcc-gold,#f5c451))}
.st-iwwin__head{display:grid;gap:2px}
.st-iwwin__head:has(.st-iwwin__pic){grid-template-columns:auto minmax(0,1fr);grid-template-areas:"pic prize" "pic count";column-gap:10px;row-gap:0;align-items:center}
/* the named places only where they exist - a name with no area is put on top of the next one */
.st-iwwin__head:has(.st-iwwin__pic) .st-iwwin__pic{grid-area:pic}
.st-iwwin__head:has(.st-iwwin__pic) .st-iwwin__prize{grid-area:prize}
.st-iwwin__head:has(.st-iwwin__pic) .st-iwwin__count{grid-area:count}
.st-iwwin__pic{width:44px;height:44px;border-radius:9px;object-fit:cover}
.st-iwwin__prize{font:700 15.5px/1.25 var(--st-font-display,var(--rcc-display,inherit));overflow-wrap:anywhere}
.st-iwwin__count{font:600 12.5px/1.3 var(--st-font-body,var(--rcc-body,inherit));color:var(--st-muted,var(--rcc-mute,#666))}
.st-iwwin__names{display:grid;gap:0;margin:0;padding:0;list-style:none;border-top:1px dashed var(--st-line,rgba(0,0,0,.15))}
.st-iwwin__names li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:6px 0;border-bottom:1px dashed var(--st-line,rgba(0,0,0,.12));
  font:700 14px/1.3 var(--st-font-body,var(--rcc-body,inherit))}
.st-iwwin__names li>span{min-width:0;overflow-wrap:anywhere}
.st-iwwin__names li>small{flex:none;font-weight:600;font-size:12.5px;color:var(--st-muted,var(--rcc-mute,#666));font-variant-numeric:tabular-nums}
.st-iwwin__names span small{margin-left:4px;padding:1px 6px;border-radius:99px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#2a1d00;background:var(--st-win,var(--rcc-gold,#f5c451))}
.st-iwwin__none{margin:0;padding-top:6px;border-top:1px dashed var(--st-line,rgba(0,0,0,.15));font:700 14px/1.3 var(--st-font-body,var(--rcc-body,inherit));color:var(--st-muted,var(--rcc-mute,#666))}
.st-iwwin__all{justify-self:start;font-size:14px;font-weight:700;color:var(--st-p-text,#b0102a)!important}