/* The platform's look (BASE-THEME.md part 3): every customer page in the operator's colours, on the colour engine's tokens
   (--st-bg, --st-fg, --st-s1... written into the page by App\Support\Look\Look). Loaded after look/layout.css (the pages'
   layout, generated) and before the template's own file, which sets the shape tokens below and adds what only it has.
   Gold (--st-win) is wins and boosts, nothing else. */

/* ---------- shape and type: each template sets its own (look/hud.css, arcade.css, pulse.css, signature.css, storefront.css) ---------- */
:root{
  --st-font-display:system-ui,sans-serif;--st-font-body:system-ui,sans-serif;--st-font-mono:var(--st-font-body);
  --st-r:12px;--st-r-sm:8px;--st-r-btn:10px;--st-r-in:10px;--st-bw:1px;--st-border:var(--st-line);
  --st-lift:none;--st-lift-sm:none;--st-btn-lift:none;--st-head-case:none;--st-head-track:normal;--st-label-track:.06em;
  --st-pad:16px;--st-fs-title:29px;--st-fs-h3:19px;--st-fs-body:14px;--st-fs-small:12.5px;--st-fs-label:11px;--st-fs-num:36px;
  --st-s-1:4px;--st-s-2:8px;--st-s-3:12px;--st-s-4:16px;--st-s-5:24px;--st-s-6:32px;--st-s-7:48px;
}
@media (min-width:900px){:root{--st-pad:24px;--st-fs-title:42px;--st-fs-h3:23px;--st-fs-body:16px;--st-fs-small:14px;--st-fs-label:12.5px;--st-fs-num:56px}}

/* ---------- the page ---------- */
*,*::before,*::after{box-sizing:border-box}
html{background:var(--st-bg)}
body.st-look{margin:0;min-height:100vh;background-color:var(--st-bg);color:var(--st-fg);font-family:var(--st-font-body);font-size:15px;line-height:1.45;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;text-rendering:optimizeLegibility}
.st-look ::selection{background:var(--st-p-soft);color:var(--st-fg)}
.st-look a{color:inherit}
.st-look :focus-visible{outline:2px solid var(--st-a-text);outline-offset:2px}
.st-look img{max-width:100%}
.st-look button{font:inherit}
.st-look [hidden]{display:none!important}
.st-muted,.st-meta,.st-lede,.st-caps,.st-notice,.st-hint,.st-foot__small,.st-or{color:var(--st-muted)}
.st-meta b,.st-caps b{color:var(--st-fg)}
.st-link{color:var(--st-a-text);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.st-title{color:var(--st-fg);font-family:var(--st-font-display);text-transform:var(--st-head-case);letter-spacing:var(--st-head-track);text-shadow:none}
.st-title em{color:var(--st-p-text)}
.st-heading{color:var(--st-fg);font-family:var(--st-font-display);text-transform:var(--st-head-case);letter-spacing:var(--st-head-track)}
.st-caps{font-family:var(--st-font-body);letter-spacing:var(--st-label-track)}
.st-num,.st-price b,.st-window,.st-balance b,.st-sum__row b,.st-ticket,.st-iw__stats b,[data-cd]{font-variant-numeric:tabular-nums}
.st-sectionhead::after,.st-prizegroup::after{background:var(--st-line)}

/* ---------- surfaces ---------- */
.st-panel,.st-panel--dark{background:var(--st-s1);color:var(--st-fg);border:var(--st-bw) solid var(--st-border);box-shadow:var(--st-lift)}
.st-panel--dark{background:var(--st-s2)}
.st-panel .st-panel{box-shadow:none}
.st-window{display:inline-flex;align-items:center;gap:6px;background:var(--st-s2);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);font-family:var(--st-font-mono)}
.st-window svg{width:15px;height:15px;stroke:var(--st-a-text)}
.st-window--note{background:var(--st-a-soft);color:var(--st-a-text);border-color:var(--st-a-line)}
.st-tile{background:var(--st-s2);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);text-decoration:none;box-shadow:var(--st-lift-sm)}
.st-tile:hover{border-color:var(--st-p-line)}
.st-media{background:var(--st-s2)}
.st-thumb{background:var(--st-s2);border:1px solid var(--st-line)}
/* the site's logo standing in for a picture (a Results or Instant winners row) is shown whole, never cropped (Chris, 8 Nov 2026) */
.st-thumb.is-logo img{object-fit:contain;padding:14%}
.st-rail{display:none}

/* ---------- buttons ---------- */
.st-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;
  border:var(--st-bw) solid transparent;border-radius:var(--st-r-btn);background:var(--st-btn);color:var(--st-btn-ink);box-shadow:var(--st-btn-lift);
  font-family:var(--st-font-display);font-size:16px;font-weight:700;line-height:1.1;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;
  cursor:pointer;-webkit-appearance:none;appearance:none;transition:transform .08s ease-out,filter .12s}
.st-btn:hover{filter:brightness(1.07);color:var(--st-btn-ink)}
.st-btn:active{transform:translateY(1px)}
.st-btn svg{width:18px;height:18px;flex:none;fill:currentColor}
.st-btn>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.st-btn--quiet,.st-btn--quiet:hover{background:var(--st-s2);color:var(--st-fg);border-color:var(--st-border);box-shadow:var(--st-lift-sm)}
.st-btn--sm{min-height:44px;padding:0 14px;font-size:14px}
.st-btn--block{display:flex;width:100%}
.st-btn[disabled],.st-btn.is-off{opacity:.5;cursor:not-allowed;filter:none}
.st-plainbtn{background:none;border:0;color:inherit;cursor:pointer}
.st-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--st-line);border-radius:var(--st-r-sm);background:var(--st-s1);color:var(--st-fg);cursor:pointer}
.st-iconbtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- chips and tags ---------- */
.st-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid var(--st-line);border-radius:var(--st-r-sm);background:var(--st-s2);color:var(--st-fg);
  font:700 var(--st-fs-label)/1.15 var(--st-font-body);letter-spacing:var(--st-label-track);text-transform:uppercase;white-space:nowrap;text-shadow:none;box-shadow:none}
.st-chip i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--st-a)}
.st-chip--light{background:var(--st-a-soft);border-color:var(--st-a-line);color:var(--st-a-text)}
.st-chip b{color:inherit}
.st-boost{display:inline-flex;align-items:center;gap:4px;padding:4px 9px;border-radius:var(--st-r-sm);background:var(--st-win);color:var(--st-win-ink);
  font:800 11px/1.1 var(--st-font-body);letter-spacing:.05em;text-transform:uppercase;box-shadow:0 0 0 1px var(--st-win-deep)}
.st-boost svg{width:12px;height:12px;fill:currentColor}
.st-price{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 12px;border-radius:var(--st-r-sm);
  background:var(--st-p-soft);color:var(--st-p-text);border:1px solid var(--st-p-line);line-height:1}
.st-price b{font:700 20px/1 var(--st-font-display)}
.st-price small{font:600 10px/1.2 var(--st-font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--st-muted);margin-bottom:3px}
.st-price--lg b{font-size:30px}
.st-num{font-family:var(--st-font-mono);font-weight:700;color:var(--st-fg);line-height:1}
.st-num--md{font-size:22px}
.st-num--lg{font-size:var(--st-fs-num)}
.st-was{color:var(--st-muted)}
.st-was--card{background:var(--st-s1);border:1px solid var(--st-line);border-radius:var(--st-r-sm);padding:1px 6px;box-shadow:none}

/* ---------- meters: one fill; each template draws it its own way ---------- */
.st-meter{position:relative;height:10px;border-radius:var(--st-r-sm);background:var(--st-s3);overflow:hidden}
.st-meter__fill{position:absolute;inset:0 auto 0 0;width:var(--p);border-radius:inherit;background:var(--st-p)}
.st-meter--lg{height:14px}
.st-feature__body .st-meter{width:100%}
.st-prize__body .st-meter{height:8px}

/* ---------- header and menu ---------- */
.st-top{background:var(--st-glass);border-bottom:1px solid var(--st-line);box-shadow:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.st-logo span{color:var(--st-fg);font-family:var(--st-font-display);text-shadow:none;text-transform:var(--st-head-case)}
.st-nav a{color:var(--st-muted);font-family:var(--st-font-body)}
.st-nav a:hover,.st-nav a[aria-current=page]{color:var(--st-fg);background:transparent;box-shadow:inset 0 -2px 0 var(--st-p)}
.st-wallet{background:var(--st-s1);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:none;font-family:var(--st-font-mono)}
.st-wallet__icon{width:17px;height:17px;flex:none;fill:none;stroke:var(--st-p-text);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.st-wallet__part+.st-wallet__part{border-left:1px solid var(--st-line)}   /* the two wallets apart: layout.css keeps the spacing, never a line */
.st-count{background:var(--st-a);color:var(--st-a-ink);box-shadow:0 0 0 2px var(--st-bg)}
.st-auth{background:var(--st-s1);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:none}
.st-auth a{color:var(--st-fg)}
.st-auth a.is-up{background:var(--st-btn);color:var(--st-btn-ink);box-shadow:none}
.st-hwins{background:var(--st-win-soft);color:var(--st-win-text);box-shadow:inset 0 0 0 1px var(--st-win-line)}
.st-community{background:var(--st-s1);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-community.is-whatsapp{background:var(--st-good-soft);color:var(--st-good)}
.st-community svg{fill:none;stroke:currentColor}
.st-menu__btn[aria-expanded=true]{background:var(--st-s2)}
.st-menu__panel{box-shadow:0 18px 40px rgba(0,0,0,.35)}
.st-menu__wins{background:var(--st-win-soft);color:var(--st-win-text);border-radius:var(--st-r-sm)}
.st-menu__community{background:var(--st-s1);color:var(--st-fg);border-radius:var(--st-r-sm);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-menu__community.is-whatsapp{background:var(--st-good-soft);color:var(--st-good)}

/* ---------- messages ---------- */
.st-flash{display:flex;gap:12px;align-items:flex-start;color:var(--st-fg)}
.st-flash svg{flex:none;width:22px;height:22px}
.st-flash.is-bad{border-color:var(--st-bad);background:var(--st-s1)}
.st-flash.is-bad svg{fill:var(--st-bad)}
.st-flash.is-good svg{fill:none;stroke:var(--st-good);stroke-width:2.5}
.st-error{color:var(--st-bad);font-weight:600}
.st-marquee{background:var(--st-btn);box-shadow:none}
.st-marquee__item,.st-marquee__item a{color:var(--st-btn-ink)}
.st-marquee__item::before{opacity:.6}

/* ---------- footer ---------- */
.st-foot{border-top:1px solid var(--st-line)}
.st-foot__small{border-top:1px solid var(--st-line)}
.st-18{display:inline-grid;place-items:center;background:var(--st-s2);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line);font-family:var(--st-font-display)}

/* ---------- forms ---------- */
.st-field>label,.st-field__top>label,.st-label{color:var(--st-fg);font-family:var(--st-font-body);font-weight:600}
.st-input{width:100%;min-height:48px;border:1px solid var(--st-line);border-radius:var(--st-r-sm);background:var(--st-s2);color:var(--st-fg);font:500 16px/1.25 var(--st-font-body);box-shadow:none}
.st-input::placeholder{color:var(--st-muted);opacity:1}
.st-input:focus{outline:2px solid var(--st-p);outline-offset:1px;border-color:var(--st-p)}
.st-input:-webkit-autofill,.st-input:-webkit-autofill:hover,.st-input:-webkit-autofill:focus{-webkit-text-fill-color:var(--st-fg);caret-color:var(--st-fg);-webkit-box-shadow:0 0 0 60px var(--st-s2) inset;box-shadow:0 0 0 60px var(--st-s2) inset}
select.st-input{-webkit-appearance:none;appearance:none;padding-right:38px;background-image:linear-gradient(45deg,transparent 50%,var(--st-muted) 50%),linear-gradient(135deg,var(--st-muted) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
select.st-input option{color:#000;background:#fff}
.st-check{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:var(--st-r-sm);background:var(--st-s2);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-check input{flex:none;position:relative;width:22px;height:22px;margin:0;border:1px solid var(--st-border);border-radius:calc(var(--st-r-sm) / 2);background:var(--st-s1);-webkit-appearance:none;appearance:none;cursor:pointer;box-shadow:none}
.st-check input:checked{background:var(--st-btn);border-color:var(--st-btn)}
.st-check input:checked::after{border:solid var(--st-btn-ink);border-width:0 2.5px 2.5px 0}
.st-check a{color:var(--st-a-text);font-weight:700}
.st-or::before,.st-or::after{border-top:1px dashed var(--st-line)}

/* ---------- segmented controls, tabs, pills ---------- */
.st-seg{background:var(--st-s2);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:none}
.st-seg>a,.st-seg>label{color:var(--st-muted);font-family:var(--st-font-body);border-radius:calc(var(--st-r-sm) - 2px)}
.st-seg>[aria-current=page],.st-seg>input:checked+label,
#st-tab-online:checked~.st-seg label[for=st-tab-online],#st-tab-postal:checked~.st-seg label[for=st-tab-postal]{color:var(--st-btn-ink);background:var(--st-btn);box-shadow:none}
.st-tabsnav a{background:var(--st-s1);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:var(--st-lift-sm);text-decoration:none}
.st-tabsnav a[aria-current=page]{background:var(--st-btn);color:var(--st-btn-ink);border-color:var(--st-btn)}
.st .pagination .page-link{background:var(--st-s1);color:var(--st-fg);border:1px solid var(--st-line);box-shadow:none}
.st .pagination .active .page-link{background:var(--st-btn);color:var(--st-btn-ink);border-color:var(--st-btn)}

/* ---------- competition cards and the home page ---------- */
.st-card{color:var(--st-fg);text-decoration:none}
.st-card .st-heading,.st-feature .st-heading{text-shadow:none;color:var(--st-fg)}
.st-card__sub,.st-card__meta,.st-feature__sub{color:var(--st-muted)}
.st-card__meta b{color:var(--st-fg)}
.st-card__top .st-window{padding:3px 8px}
.st-card__top .st-window .st-num{font-size:16px}
.st-card__top .st-window .st-caps{font-size:9px;line-height:1.05}
.st-card.is-boosted,.st-feature.is-boosted,.st-prize.is-boosted{border-color:var(--st-win);box-shadow:0 0 0 1px var(--st-win),0 0 22px var(--st-win-soft)}
.st-soldout .st-media img{filter:grayscale(.85) brightness(.7)}
.st-arrow{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--st-line);border-radius:var(--st-r-sm);background:var(--st-s1);color:var(--st-fg);cursor:pointer}
.st-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.st-step p{color:var(--st-muted)}
.st-winpill{background:var(--st-s1);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:none}
.st-winpill__av{background:var(--st-win-soft);color:var(--st-win-text);box-shadow:inset 0 0 0 1px var(--st-win-line)}
.st-winpill__who small{color:var(--st-muted)}
.st-gauge .st-row .st-heading,.st-ladder__value,.st-ladder__rungs summary{color:var(--st-fg)}
.st-ladder__line{color:var(--st-muted)}
.st-ladder__rungs .st-table>div.is-on b{color:var(--st-p-text)}

/* ---------- the competition page: picking tickets ---------- */
.st-comp__sub,.st-buy__sum{color:var(--st-muted)}
.st-buy__sum b{color:var(--st-fg)}
.st-offer{color:var(--st-fg)}
.st-spendbox__head{background:var(--st-s2);border-bottom:1px solid var(--st-line)}
.st-spend{border:0}
.st-spend label{background:var(--st-s2);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:var(--st-lift-sm);cursor:pointer}
.st-spend label b{font-family:var(--st-font-display)}
.st-spend label small{color:var(--st-muted)}
.st-spend input:checked+label{background:var(--st-btn);color:var(--st-btn-ink);border-color:var(--st-btn);box-shadow:none}
.st-spend input:checked+label b{text-shadow:none}
.st-spend input:checked+label small{color:var(--st-btn-ink);opacity:.85}
.st-spend input:checked+label::after{display:none}
.st-qty button{background:var(--st-s2);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:none}
.st-answers{border:0}
.st-answers legend{color:var(--st-fg)}
.st-answers label,.st-payopts label{background:var(--st-s2);color:var(--st-fg);border:1px solid var(--st-line);border-radius:var(--st-r-sm);box-shadow:var(--st-lift-sm);cursor:pointer}
.st-answers label::before,.st-payopts label::before{background:var(--st-s1);box-shadow:inset 0 0 0 1.5px var(--st-border);border-radius:50%}
.st-answers input:checked+label{background:var(--st-btn);color:var(--st-btn-ink);border-color:var(--st-btn);box-shadow:none}
.st-answers input:checked+label::before{background:radial-gradient(circle,var(--st-btn) 0 4px,var(--st-btn-ink) 5px);box-shadow:none}
.st-payopts{border:0}
.st-payopts label small{color:var(--st-muted)}
.st-payopts input:checked+label{border-color:var(--st-p);background:var(--st-p-soft);box-shadow:0 0 0 1px var(--st-p)}
.st-payopts input:checked+label::before{background:radial-gradient(circle,var(--st-btn-ink) 0 4px,var(--st-btn) 5px);box-shadow:none}
.st-answers input:focus-visible+label,.st-payopts input:focus-visible+label,.st-spend input:focus-visible+label,.st-seg>input:focus-visible+label{outline:2px solid var(--st-a-text);outline-offset:2px}
.st-gallery button{border:2px solid transparent;background:var(--st-s2);border-radius:var(--st-r-sm)}
.st-gallery button.is-on{border-color:var(--st-p)}
.st-video{background:#000}
.st-fold>summary{background:var(--st-s2);color:var(--st-fg);border-radius:var(--st-r-sm)}
.st-fold>summary::after{color:var(--st-a-text)}

/* ---------- instant wins ---------- */
.st-iw__stats>div+div{box-shadow:inset 1px 0 0 var(--st-line)}
.st-iw__stats b{color:var(--st-fg);font-family:var(--st-font-mono)}
.st-iw__stats span,.st-iw__won{color:var(--st-muted)}
.st-iw__won b{color:var(--st-fg)}
.st-iw__won svg{fill:none;stroke:var(--st-fg)}
.st-iw__boosted{color:var(--st-win-text)}
.st-iw__boosted svg{fill:currentColor}
.st-odds p{color:var(--st-fg)}
.st-odds small{color:var(--st-muted)}
.st-prize__badge{background:var(--st-s3);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line);text-shadow:none;font-family:var(--st-font-display)}
.st-prize__badge.is-credit{background:var(--st-a-soft);color:var(--st-a-text);box-shadow:inset 0 0 0 1px var(--st-a-line)}
.st-prize__badge.is-thing svg{fill:none;stroke:var(--st-fg)}
.st-prize__name{color:var(--st-fg)}
.st-prize__name small,.st-prize__found{color:var(--st-muted)}
.st-last{background:var(--st-a);color:var(--st-a-ink);box-shadow:none}
.st-last::before{background:var(--st-a-ink)}
.st-prize__left{background:var(--st-s2);color:var(--st-fg);box-shadow:inset 1px 0 0 var(--st-line)}
.st-prize__left span{color:var(--st-muted)}
.st-prize.is-gone{filter:grayscale(1);opacity:.7}
.st-prize__nums{border-top:1px solid var(--st-line);color:var(--st-a-text)}
.st-prize__nums::after{border:solid currentColor;border-width:0 2px 2px 0}
.st-prize__nums:hover,.st-prize__nums:focus-visible{color:var(--st-fg)}
.st-prize__strip{color:var(--st-muted);border-top:1px solid var(--st-line)}
.st-prize__strip svg{fill:currentColor}
.st-prize__strip.is-live{color:var(--st-win-ink);background:var(--st-win)}
.st-iwdlg{border:0;background:transparent;color:var(--st-fg)}
.st-iwdlg::backdrop,.st-drawwin::backdrop{background:rgba(0,0,0,.62)}
.st-iwdlg__head{border-bottom:1px solid var(--st-line)}
.st-iwdlg__kicker{color:var(--st-muted)}
.st-iwdlg__title{color:var(--st-fg)}
.st-iwdlg__close{background:var(--st-s2);color:var(--st-fg);border:1px solid var(--st-line)}
.st-iwdlg__close svg{fill:none;stroke:currentColor}
.st-iwskel i{background:linear-gradient(90deg,var(--st-s2),var(--st-s3),var(--st-s2));background-size:200% 100%}
.st-iwcell,.st-iwkey li::before{background:var(--st-s2);color:var(--st-fg);box-shadow:inset 0 0 0 1.5px var(--st-p-line)}
.st-iwcell.is-found,.st-iwkey .is-found::before{background:var(--st-s3);color:var(--st-muted);box-shadow:none}
.st-iwcell.is-forfeited,.st-iwkey .is-forfeited::before{background:var(--st-s1);color:var(--st-muted);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-iwcell.is-gold,.st-iwkey .is-gold::before{background:var(--st-win);color:var(--st-win-ink);box-shadow:0 0 0 1px var(--st-win-deep)}
.st-iwcell.is-boostwon,.st-ticket.is-boostwon{box-shadow:inset 0 0 0 2px var(--st-win)}
.st-iwkey,.st-iwlist__range{color:var(--st-muted)}
.st-iwlist{color:var(--st-fg)}
.st-iwlist a{color:var(--st-a-text)}
.st-iwlist__show a[aria-current]{color:var(--st-fg)}
.st-iwlist__at input,.st-iwlist__find input{border:1px solid var(--st-line);background:var(--st-s2);color:var(--st-fg)}
.st-iwlist__find button{border:0;background:var(--st-btn);color:var(--st-btn-ink)}
.st-iwlist__boost{background:var(--st-win);color:var(--st-win-ink);box-shadow:inset 0 0 0 1px var(--st-win-deep)}
.st-iwlist__boost a{color:var(--st-win-ink)}
.st-ticket{background:var(--st-s2);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line);font-family:var(--st-font-mono)}
.st-ticket.is-win{background:var(--st-win);color:var(--st-win-ink);box-shadow:none}

/* ---------- leaderboard, the draw, the live draw window ---------- */
.st-lb__prize b{color:var(--st-fg)}
.st-lb__prize small,.st-lb__name small{color:var(--st-muted)}
.st-lb__place{background:var(--st-s2);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-lb__me,.st-lb__row{color:var(--st-fg)}
.st-lb__row.is-me{background:var(--st-p-soft);box-shadow:inset 0 0 0 1px var(--st-p-line)}
.st-draw__step,.st-draw__winner,.st-draw__number,.st-drawwin__facts div,.st-trail li,.st-reveal__groups li{background:var(--st-s2);border-radius:var(--st-r-sm)}
.st-draw__step,.st-draw__how,.st-draw__mode,.st-draw__step small,.st-draw__winner span,.st-draw__number span,.st-draw__number em,.st-drawwin__facts dt,.st-drawwin__facts small,.st-drawwin__modes legend,.st-drawwin__mode small{color:var(--st-muted)}
.st-draw__step b,.st-draw__step code,.st-draw__how code,.st-draw__ticket,.st-drawwin__facts dd,.st-drawwin__mode b{color:var(--st-fg)}
.st-draw__winner em,.st-draw__number.is-entry em{color:var(--st-p-text)}
.st-draw__number.is-entry{background:var(--st-p-soft)}
.st-drawwin__modes{border:0}
.st-drawwin__mode{border:1px solid var(--st-line);border-radius:var(--st-r-sm)}
.st-drawwin__mode:has(input:checked){border-color:var(--st-p);background:var(--st-p-soft)}
.st-spinner{border:5px solid var(--st-s3);border-top-color:var(--st-p)}
.st-drandclock{background:var(--st-s2);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-drandclock b,.st-state .st-drandline{color:var(--st-fg)}
.st-drandclock small{color:var(--st-muted)}

/* ---------- lists, basket, order, account ---------- */
.st-doc,.st-item,.st-item .st-heading,.st-line,.st-line__title,.st-win,.st-code__what,.st-linecard__game,.st-sumline__title,.st-summary>.st-heading{color:var(--st-fg)}
.st-doc>.st-doc__head{background:var(--st-s2);border-bottom:1px solid var(--st-line)}
.st-doc>.st-doc__head .st-heading,.st-doc h2,.st-doc h3{color:var(--st-fg)}
.st-doc a,.st-vault__links a{color:var(--st-a-text)}
.st-doc th,.st-doc td{border:1px solid var(--st-line)}
.st-table{box-shadow:inset 0 0 0 1px var(--st-line);border-radius:var(--st-r-sm)}
.st-table>div{color:var(--st-fg)}
.st-table>div:nth-child(odd){background:var(--st-s2)}
.st-statement>div small,.st-line__meta,.st-win small,.st-cardmarks,.st-added p,.st-state p,.st-trail>p,.st-trail__l small,.st-vault__body{color:var(--st-muted)}
.st-statement>div b.is-in{color:var(--st-good)}
.st-line__meta b{color:var(--st-fg)}
.st-status{background:var(--st-s2);color:var(--st-fg);box-shadow:inset 0 0 0 1px var(--st-line)}
.st-status.is-bad{background:var(--st-bad-soft);color:var(--st-bad)}
.st-status.is-good::before{background:var(--st-good);box-shadow:none}
.st-sum__row{color:var(--st-muted)}
.st-sum__row b{color:var(--st-fg)}
.st-sum__total{border-top:1px dashed var(--st-line)}
.st-sum__total span{color:var(--st-muted)}
.st-added .st-heading,.st-state .st-heading,.st-trail .st-heading{color:var(--st-fg)}
.st-trail li.is-next{background:var(--st-p-soft);box-shadow:inset 0 0 0 1px var(--st-p)}
.st-trail__n{background:var(--st-s3);color:var(--st-fg)}
.st-trail li.is-done .st-trail__n{background:var(--st-btn);color:var(--st-btn-ink)}
.st-trail__l{color:var(--st-fg)}
.st-trail li.is-done .st-trail__l{color:var(--st-muted)}
.st-trail__r{background:var(--st-s3);color:var(--st-fg)}
.st-trail li.is-done .st-trail__r{background:var(--st-good-soft);color:var(--st-good)}
.st-balance b{color:var(--st-fg);font-family:var(--st-font-mono)}
.st-balance span,.st-balance small{color:var(--st-muted)}
.st-sumline{border-top:1px solid var(--st-line)}
.st-summary>.st-heading+.st-sumline{border-top:0}
.st-vault__links a{border:1px solid var(--st-a-line);background:var(--st-a-soft)}
.st-upsell-pop{background:rgba(0,0,0,.68);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.st-upsell-pop__no{border:0;background:none;color:var(--st-muted)}
.st-upsell-pop__x{border:1px solid var(--st-line);background:var(--st-s1);color:var(--st-fg);box-shadow:none}

/* ---------- order page: Ruby's reveal widget, the standard reveals ---------- */
.st-reveal button{border:0;background:var(--st-btn);color:var(--st-btn-ink);box-shadow:none;border-radius:var(--st-r-btn)}
.st-reveal .st-reveal__controls button{background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.35);color:#fff}
.st-reveal .st-reveal__end{color:var(--st-fg)}
.st-reveal .st-reveal__count{color:var(--st-muted)}
:is(.st-std,.st-linecard) .st-std__comp,.st-std .st-std__intro:not([hidden]),.st-std .st-std__progress,.st-std [data-std-debug]{color:var(--st-muted)}
.st-std .st-std__loading,.st-std .st-std__bigline{color:var(--st-fg)}
.st-std [data-std-act]{border:1px solid var(--st-line);background:var(--st-s2);color:var(--st-fg);box-shadow:none;border-radius:var(--st-r-sm)}

/* ---------- the cookie banner ---------- */
.st-cookies{background:var(--st-s1);color:var(--st-fg);border:1px solid var(--st-line);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.st-cookies button{border:1px solid var(--st-line);background:transparent;color:inherit;border-radius:var(--st-r-sm)}
.st-cookies .st-cookies__yes{background:var(--st-btn);border-color:var(--st-btn);color:var(--st-btn-ink)}

/* ---------- the menu tiles and the footer links, on a template ---------- */
.st-foot>.st-panel{box-shadow:none}
.st-menu__grid .st-tile,.st-foot__links .st-tile{font-family:var(--st-font-body);font-weight:600}

/* ---------- icons drawn in Ruby's red in the views: in the button's own colours on a template (CSS outranks an SVG's
   fill attribute, so Ruby's pages keep theirs) ---------- */
.st-look .st-btn svg circle{fill:currentColor;opacity:.22}
.st-look .st-btn svg path{fill:currentColor}
.st-look .st-odds svg circle:nth-of-type(odd){fill:var(--st-a)}
.st-look .st-odds svg circle:nth-of-type(2){fill:var(--st-s1)}

/* ---------- the operator's banner, pop-up and toasts (partials/site-messages carries Ruby's skin inline) ---------- */
.st-look .st-banner{background:var(--st-btn);color:var(--st-btn-ink);box-shadow:none;font-family:var(--st-font-body)}
.st-look .st-banner a{color:var(--st-btn-ink)}
.st-look .st-pop{background:rgba(0,0,0,.68)}
.st-look .st-pop .st-heading{color:var(--st-fg)}
.st-look .st-pop p,.st-look .st-toast p,.st-look .st-toast--boost span{font-family:var(--st-font-body);color:var(--st-muted)}
.st-look .st-toast b{font-family:var(--st-font-body);color:var(--st-fg)}
.st-look .st-toast button{color:var(--st-muted);font-family:var(--st-font-body)}
.st-look .st-toast--gold.st-panel,.st-look .st-toast--boost.st-panel{border-color:var(--st-win);box-shadow:0 0 0 1px var(--st-win),0 12px 30px rgba(0,0,0,.35)}
.st-look .st-toast--gold b,.st-look .st-toast--boost b{color:var(--st-win-text)}
.st-look .st-toast--boost a{font-family:var(--st-font-body);color:var(--st-fg)}
.st-look .st-toast--big.st-panel,.st-look .st-toast--refer.st-panel{border-color:var(--st-a);box-shadow:0 0 0 1px var(--st-a),0 12px 30px rgba(0,0,0,.35)}
.st-look .st-toast--big b{color:var(--st-a-text)}
.st-look .st-toast--big .st-amt{background:var(--st-a);color:var(--st-a-ink);border-radius:var(--st-r-sm)}
.st-look .st-toast--big a,.st-look .st-toast--refer a{background:var(--st-btn);color:var(--st-btn-ink);border-radius:var(--st-r-btn);font-family:var(--st-font-body)}
.st-look .st-toast--big a:focus-visible,.st-look .st-toast--refer a:focus-visible,.st-look .st-toast--boost a:focus-visible{outline:2px solid var(--st-a-text)}

/* ---------- the pot cards (public/theme/pots.js draws <div data-fund-pot>; its own sheet assumes a dark page, with white
   words, white see-through fills and gold words that all but vanish on a light one - Chris, 9 Nov 2026). Every rule here is
   one class deep, as pots.js's own, so it beats that sheet (first in the head) and an operator's own pot design, later in the
   page, still beats it. Every word is in the template's colours, which the colour engine holds at 4.5:1; an operator's
   data-color (pots.js puts it on the card's style as --rbf) colours only the card's top rule and its bar, since words in a
   colour nobody checked read 3.3:1 on a light card. Opacity is left alone on .rbf-win: it fades each row in. */
.rbf{--rbf:var(--st-win);--rbf-ink:var(--st-win-text);--rbf-bar:var(--st-win-text);background:var(--st-s1);border:1px solid var(--st-line);border-top:3px solid var(--rbf);border-radius:var(--st-r);color:var(--st-fg)}
.rbf[style*="--rbf"]{--rbf-ink:var(--st-fg);--rbf-bar:var(--rbf)}
.rbf-name,.rbf-last b,.rbf-win b,.rbf-given-list b{color:var(--rbf-ink)}
.rbf-sub,.rbf-meta,.rbf-last,.rbf-given-h,.rbf-split,.rbf-wins-more,.rbf-cd,.rbf-free{opacity:1;color:var(--st-muted)}
.rbf-blurb{opacity:1;color:var(--st-fg)}
.rbf-bar{background:var(--st-s2);box-shadow:inset 0 0 0 1px var(--st-line)}
.rbf-bar i{background:var(--rbf-bar)}
.rbf-done,.rbf-won,.rbf-stub{background:var(--st-win);color:var(--st-win-ink)}
.rbf-stub i{border-right-color:currentColor}
.rbf-last,.rbf-given{border-top-color:var(--st-line)}
.rbf-win,.rbf-given-list li{background:var(--st-s2);border-color:var(--st-line)}
.rbf-rules span{background:var(--st-s2);border-color:var(--st-line);color:var(--st-fg)}
