/* TonyBet CA — shell: tokens, S3 layout, side panel, buttons, sticky bar, footer.
   Palette taken from the brand's own promo art and logo plate:
   purple #8820ff, orange #ff4200, ink #210c2c; second orange #ec622b. */
:root{
  --tb-brand:#8820ff;
  --tb-brand-ink:#6b10d0;
  --tb-accent:#ff4200;
  --tb-accent2:#ec622b;
  --tb-ink:#210c2c;
  --tb-muted:#5d5170;
  --tb-bg:#ffffff;
  --tb-surface:#f8f4fe;
  --tb-surface2:#efe7fb;
  --tb-line:#e2d7f3;
  --tb-r:14px;
  --tb-side:280px;
  --pico-font-family:"Onest",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --pico-font-size:100%;
  --pico-border-radius:14px;
  --pico-primary:#6b10d0;
  --pico-primary-hover:#8820ff;
  --pico-primary-focus:rgba(136,32,255,.2);
  --pico-color:#210c2c;
  --pico-background-color:#ffffff;
  --pico-muted-color:#5d5170;
  --pico-h1-color:#210c2c;
  --pico-h2-color:#210c2c;
  --pico-h3-color:#210c2c;
  --pico-spacing:1rem;
  --pico-typography-spacing-vertical:1rem;
}
*{box-sizing:border-box}
/* ---------- scrollbars in the brand colours ---------- */
html{scrollbar-color:var(--tb-brand) var(--tb-surface2)}
.tb-side,.tb-top,.tb-rail,.tb-wrap{scrollbar-width:thin;scrollbar-color:var(--tb-brand) var(--tb-surface2)}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:var(--tb-surface2)}
::-webkit-scrollbar-thumb{background:var(--tb-brand);border:3px solid var(--tb-surface2);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:var(--tb-brand-ink)}
.tb-side::-webkit-scrollbar,.tb-top::-webkit-scrollbar,.tb-rail::-webkit-scrollbar,.tb-wrap::-webkit-scrollbar{width:8px;height:8px}
.tb-top::-webkit-scrollbar-track,.tb-rail::-webkit-scrollbar-track,.tb-wrap::-webkit-scrollbar-track{border-radius:99px}
.tb-side::-webkit-scrollbar-thumb,.tb-top::-webkit-scrollbar-thumb,.tb-rail::-webkit-scrollbar-thumb,.tb-wrap::-webkit-scrollbar-thumb{border-width:2px}
body{background:var(--tb-bg);color:var(--tb-ink);margin:0;overflow-x:hidden}
img,svg{max-width:100%}
ul li,ol li{list-style:none}
h1,h2,h3{line-height:1.15;letter-spacing:-.01em}
h2{font-size:clamp(1.45rem,1.1rem + 1.4vw,2.1rem);margin:0 0 .6rem}
h3{font-size:1.12rem;margin:0 0 .5rem}
p{margin:0 0 .85rem}
.tb-i{width:1.15em;height:1.15em;flex:0 0 auto;vertical-align:-.16em;fill:none}
.tb-skip{position:absolute;left:-9999px;top:0;background:var(--tb-ink);color:#fff;padding:.5rem .8rem;z-index:80}
.tb-skip:focus{left:0}

/* ---------- buttons ---------- */
.tb-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  font:600 .95rem/1 "Onest",system-ui,sans-serif;white-space:nowrap;
  padding:.78rem 1.05rem;border-radius:12px;border:2px solid transparent;cursor:pointer;
  text-decoration:none;width:auto;margin:0}
.tb-btn--brand{background:var(--tb-brand);color:#fff}
.tb-btn--ghost{background:#fff;color:var(--tb-brand-ink);border-color:var(--tb-brand)}
.tb-btn--dark{background:var(--tb-ink);color:#fff}
.tb-btn--sm{padding:.55rem .8rem;font-size:.85rem}
.tb-btn--wide{width:100%}
@media(min-width:1024px){
  .tb-btn--brand:hover{background:var(--tb-brand-ink)}
  .tb-btn--ghost:hover{background:var(--tb-surface2)}
}
/* brand CTA animation: arrow nudge (no sheen/shine — that one is on the neighbours) */
@keyframes tb-nudge{0%,100%{transform:translateX(0)}30%{transform:translateX(5px)}60%{transform:translateX(-1px)}}
.tb-i--nudge{animation:tb-nudge 5.5s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.tb-i--nudge{animation:none}}
.tb-link-cta{font-weight:600;color:var(--tb-brand-ink);text-underline-offset:3px}

/* ---------- fixed left navigation column ---------- */
.tb-topbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.5rem .75rem;background:#fff;border-bottom:1px solid var(--tb-line);position:sticky;top:0;z-index:40}
.tb-topbar__logo{display:block;line-height:0}
.tb-topbar__logo img{height:34px;width:auto;object-fit:contain}
.tb-burger{display:inline-flex;align-items:center;gap:.35rem;background:transparent;border:1px solid var(--tb-line);
  color:var(--tb-ink);border-radius:10px;padding:.42rem .6rem;font:600 .85rem/1 "Onest",system-ui,sans-serif;cursor:pointer;margin:0;width:auto}
.tb-side{position:fixed;inset:0 auto 0 0;width:min(86vw,var(--tb-side));background:var(--tb-surface);
  border-right:1px solid var(--tb-line);padding:1.1rem 1rem 1.4rem;overflow:auto;z-index:60;
  transform:translateX(-102%);transition:transform .25s ease}
.tb-side.is-open{transform:none;box-shadow:0 0 40px rgba(33,12,44,.35)}
.tb-scrim{position:fixed;inset:0;background:rgba(33,12,44,.5);z-index:50;display:none}
.tb-scrim.is-open{display:block}
.tb-side__top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.tb-side__logo{display:inline-block;line-height:0}
.tb-side__close{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;margin:0;
  flex:0 0 auto;background:#fff;border:1px solid var(--tb-line);border-radius:10px;color:var(--tb-ink);cursor:pointer}
.tb-side__close .tb-i{width:20px;height:20px}
.tb-side__logo img{height:48px;width:auto;object-fit:contain}
.tb-nav{margin:1rem 0 .9rem}
.tb-nav ul{list-style:none;margin:0;padding:0}
.tb-nav a{display:flex;align-items:center;gap:.6rem;padding:.6rem .7rem;border-radius:10px;
  color:var(--tb-ink);text-decoration:none;font-weight:600}
.tb-nav a:hover{background:var(--tb-surface2)}
.tb-nav a[aria-current="page"]{background:#fff;color:var(--tb-brand-ink);font-weight:700;
  box-shadow:inset 3px 0 0 var(--tb-accent2),0 2px 10px rgba(33,12,44,.07)}
.tb-nav a[aria-current="page"] svg{color:var(--tb-accent2)}
.tb-side__cta{display:flex;flex-direction:column;gap:.55rem;padding-bottom:1rem;border-bottom:1px solid var(--tb-line)}
.tb-side__facts{font-size:.8rem;color:var(--tb-muted);padding-top:.9rem}
.tb-side__facts p{margin:0 0 .55rem}
.tb-side__h{font-weight:800;color:var(--tb-ink);text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}
.tb-side__links{list-style:none;margin:0 0 .7rem;padding:0}
.tb-side__links a{color:var(--tb-brand-ink);font-size:.8rem}
.tb-side__age{font-weight:700;color:var(--tb-ink)}
.tb-side__note{border-top:1px dashed var(--tb-line);padding-top:.6rem}
main,body>main{padding:0}
@media(min-width:1024px){
  .tb-topbar,.tb-scrim,.tb-side__close{display:none}
  .tb-side{transform:none;box-shadow:none}
  main,.tb-foot{margin-left:var(--tb-side)}
}

/* ---------- sticky bottom CTA bar ---------- */
.tb-sticky{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--tb-ink);
  display:none;align-items:center;gap:.5rem;padding:.55rem .7rem;
  box-shadow:0 -6px 24px rgba(33,12,44,.25)}
.tb-sticky.is-on{display:flex}
.tb-sticky .tb-btn{flex:1 1 0;min-width:0}
.tb-sticky__close{background:transparent;border:0;color:#fff;opacity:.75;cursor:pointer;padding:.4rem;width:auto;margin:0;flex:0 0 auto}
@media(min-width:1024px){.tb-sticky{left:var(--tb-side);justify-content:flex-end}.tb-sticky .tb-btn{flex:0 0 auto}}

.tb-byline{display:flex;flex-direction:column;align-items:center;gap:.3rem;text-align:center;padding:1.4rem 1rem;
  border-top:1px solid var(--tb-line);font-size:.82rem;color:var(--tb-muted)}
.tb-byline__who{display:inline-flex;align-items:center;gap:.55rem;color:var(--tb-ink);text-decoration:none}
.tb-byline__who img{width:34px;height:34px;border-radius:50%}
.tb-byline__dates{display:flex;flex-wrap:wrap;justify-content:center;gap:.15rem .9rem;margin:0}
.tb-byline__note{margin:0;max-width:44rem;font-size:.78rem}
/* ---------- footer: dark ink, brand glow, columns, responsible-gambling panel ---------- */
.tb-foot{position:relative;overflow:hidden;color:#e6ddf2;padding:2rem 1rem 5.5rem;
  background:radial-gradient(60% 55% at 0% 0%,rgba(136,32,255,.32),transparent 70%),
    radial-gradient(50% 60% at 100% 100%,rgba(236,98,43,.22),transparent 70%),var(--tb-ink);
  --pico-color:#e6ddf2;--pico-h2-color:#fff;--pico-h3-color:#fff;--pico-muted-color:#c4b6d8;--pico-primary:#fff;--pico-primary-hover:#ffb08f}
.tb-foot::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--tb-brand),var(--tb-accent2))}
.tb-foot a{color:#fff;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px}
.tb-foot h2{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:#f58b5f;margin:0 0 .8rem}
.tb-foot ul{list-style:none;margin:0;padding:0;font-size:.88rem}
.tb-foot li{display:flex;gap:.55rem;align-items:flex-start;margin-bottom:.55rem}
.tb-foot li svg{color:var(--tb-accent2);margin-top:.12rem}
.tb-foot__cols{display:grid;gap:1.6rem;grid-template-columns:1fr}
.tb-foot__brand h2{font-size:1.2rem;text-transform:none;letter-spacing:-.01em;color:#fff;margin:.7rem 0 .4rem}
.tb-foot__brand p{margin:0;font-size:.88rem;color:#c4b6d8;max-width:22rem}
.tb-foot__mark{width:44px;height:44px;padding:8px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.tb-foot__badges li{display:inline-flex;margin:0 .35rem .45rem 0;padding:.35rem .65rem;border-radius:99px;font-size:.8rem;white-space:nowrap;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.tb-foot__badges{display:flex;flex-wrap:wrap}
.tb-foot__legal{display:flex;gap:1rem;align-items:flex-start;margin-top:1.8rem;padding:1rem 1.1rem;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);font-size:.84rem;color:#c4b6d8}
.tb-foot__legal p{margin:0}
.tb-foot__legal strong{color:#fff}
.tb-foot__age{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;
  border:2px solid var(--tb-accent2);color:#fff;font-weight:800;font-size:.95rem}
.tb-foot__legal .tb-foot__rg{display:flex;flex-wrap:wrap;gap:.45rem;margin:.7rem 0 0}
.tb-foot__rg a{padding:.3rem .75rem;border-radius:99px;border:1px solid rgba(255,255,255,.3);text-decoration:none;font-size:.8rem;font-weight:600}
.tb-foot__note{margin:1rem 0 0;font-size:.75rem;opacity:.55;color:#c4b6d8}
.tb-foot__copy{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-top:1rem;padding-top:.9rem;
  border-top:1px solid rgba(255,255,255,.14);font-size:.8rem;color:#c4b6d8}
.tb-foot__links{display:grid;grid-template-columns:repeat(2,max-content);column-gap:1.4rem}
.tb-foot__links a{white-space:nowrap}
@media(min-width:760px){.tb-foot__cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1180px){.tb-foot{padding:2.6rem 2rem 5rem}
  .tb-foot__cols{grid-template-columns:1fr 1.6fr 1.2fr 1.15fr;gap:1.6rem}}
@media(min-width:1024px){.tb-foot__rg a:hover{border-color:var(--tb-accent2)}}