/* ============================================================================
   SPINSIGHT — theme stylesheet (BEM). Character: light premium / warm-editorial.
   Palette: coral + amber accents on a soft off-white canvas.
   Unique custom-property namespace: --vd-*  (verdict)
   Sections: 1 tokens · 2 reset · 3 layout · 4 buttons · 5 masthead · 6 beacon
             7 venue-tile · 8 ladder · 9 pledge · 10 spotlight · 11 queries
             12 flare · 13 guardrail · 14 colophon · 15 dropdock/lingo
             16 misc slabs · 17 responsive
   ============================================================================ */

/* 1 · design tokens ------------------------------------------------------- */
:root {
  --vd-ink: #201a24;                 /* deep neutral — text on bright accent surfaces */
  --vd-bg: #f4f2f8;                  /* soft off-white canvas */
  --vd-bg-2: #ffffff;
  --vd-panel: #ffffff;
  --vd-panel-2: #f6f4fb;
  --vd-line: rgba(32,26,36,.10);
  --vd-line-strong: rgba(32,26,36,.18);
  --vd-text: #241f2b;                /* primary text (dark) */
  --vd-text-dim: #5c576a;
  --vd-text-mute: #8b869a;

  --vd-accent: #ff5a5f;      /* coral */
  --vd-accent-2: #ffab40;    /* amber */
  --vd-accent-soft: rgba(255,90,95,.10);
  --vd-gold: #f6a723;

  --vd-radius-sm: 8px;
  --vd-radius: 16px;
  --vd-radius-lg: 24px;
  --vd-radius-pill: 999px;

  --vd-shadow: 0 16px 40px -22px rgba(32,26,36,.28);
  --vd-shadow-glow: 0 0 0 1px rgba(255,90,95,.30), 0 18px 46px -18px rgba(255,90,95,.28);

  --vd-font-display: "Sora", "Segoe UI", system-ui, sans-serif;
  --vd-font-body: "Manrope", system-ui, -apple-system, sans-serif;

  --vd-shell: 1180px;
  --vd-gap: clamp(16px, 3vw, 32px);
}

/* 2 · reset --------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: clip; }
body { overflow-x: clip; }
body {
  margin: 0;
  font-family: var(--vd-font-body);
  color: var(--vd-text);
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(255,171,64,.20), transparent 60%),
    radial-gradient(900px 500px at -10% 10%, rgba(255,90,95,.12), transparent 55%),
    var(--vd-bg);
  line-height: 1.6;
  min-height: 100vh;
}
body.is-nav-locked { overflow: hidden; }
h1, h2, h3 { font-family: var(--vd-font-display); line-height: 1.12; margin: 0 0 .4em; font-weight: 700; }
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: none; }
img, svg { max-width: 100%; height: auto; display: block; }
ul { margin: 0; padding: 0; list-style: none; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--vd-accent); outline-offset: 3px; border-radius: 4px; }

.skip {
  position: absolute; left: 12px; top: -60px; z-index: 200;
  background: var(--vd-accent); color: var(--vd-ink); padding: 10px 16px;
  border-radius: var(--vd-radius-sm); font-weight: 700; transition: top .2s;
}
.skip:focus { top: 12px; }

/* 3 · layout -------------------------------------------------------------- */
.shell { width: min(100% - 40px, var(--vd-shell)); margin-inline: auto; }
.slab { padding: clamp(40px, 7vw, 80px) 0; }
.slab__head { max-width: 720px; margin-bottom: clamp(20px, 4vw, 40px); }
.slab__title { font-size: clamp(1.6rem, 3.6vw, 2.5rem); }
.slab__sub { color: var(--vd-text-dim); font-size: 1.05rem; margin: 0; }

/* 4 · buttons ------------------------------------------------------------- */
.btn {
  --btn-bg: var(--vd-panel);
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 48px; padding: 0 22px; border: 1px solid transparent;
  border-radius: var(--vd-radius-pill); font-weight: 700; letter-spacing: .01em;
  background: var(--btn-bg); color: var(--vd-text);
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
  text-align: center;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--primary {
  background: linear-gradient(120deg, var(--vd-accent), var(--vd-accent-2));
  color: var(--vd-ink); box-shadow: var(--vd-shadow-glow);
}
.btn--primary:hover { box-shadow: 0 0 0 1px rgba(255,90,95,.6), 0 24px 60px -18px rgba(255,90,95,.5); }
.btn--ghost { background: var(--vd-accent-soft); color: var(--vd-accent); border-color: rgba(255,90,95,.3); }
.btn--outline { background: transparent; border-color: var(--vd-line-strong); color: var(--vd-text); }
.btn--link { background: none; min-height: 44px; color: var(--vd-accent); padding: 0 8px; }
.btn--lg { min-height: 56px; padding: 0 30px; font-size: 1.06rem; }

/* 5 · masthead ------------------------------------------------------------ */
.masthead {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255,255,255,.82); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--vd-line);
}
.masthead__inner { display: flex; align-items: center; gap: 20px; min-height: 68px; }
.masthead__brand { margin-right: auto; }
.masthead__nav-list { display: flex; gap: 4px; flex-wrap: wrap; }
.masthead__nav-link {
  display: inline-flex; padding: 8px 12px; border-radius: var(--vd-radius-sm);
  color: var(--vd-text-dim); font-weight: 600; font-size: .93rem; transition: color .15s, background .15s;
}
.masthead__nav-link:hover { color: var(--vd-accent); background: var(--vd-accent-soft); }
.masthead__nav { display: flex; align-items: center; gap: 16px; }
.masthead__burger { display: none; }

.brandmark { display: inline-flex; align-items: center; gap: 10px; }
.brandmark__word { display: inline-flex; align-items: baseline; font-family: var(--vd-font-display); font-weight: 800; font-size: 1.28rem; letter-spacing: -.01em; }
.brandmark__name { background: linear-gradient(100deg, var(--vd-text), var(--vd-accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brandmark__dot { color: var(--vd-accent); }
.brandmark--footer .brandmark__word { font-size: 1.15rem; }

/* 6 · beacon (hero) ------------------------------------------------------- */
.beacon { padding: clamp(40px, 7vw, 84px) 0 clamp(24px, 4vw, 40px); }
.beacon__inner { display: grid; grid-template-columns: 1.35fr .65fr; gap: var(--vd-gap); align-items: center; }
.beacon__eyebrow {
  display: inline-block; font-size: .8rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--vd-accent); font-weight: 700; margin-bottom: 14px;
}
.beacon__title { font-size: clamp(2.1rem, 6vw, 4rem); letter-spacing: -.02em; }
.beacon__lede { color: var(--vd-text-dim); font-size: clamp(1rem, 2.2vw, 1.2rem); max-width: 46ch; }
.beacon__actions { display: flex; flex-wrap: wrap; gap: 14px; margin: 26px 0 22px; }
.beacon__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.beacon__chip {
  font-size: .8rem; color: var(--vd-text-mute); background: var(--vd-panel);
  border: 1px solid var(--vd-line); padding: 5px 12px; border-radius: var(--vd-radius-pill);
}
.beacon__aside { display: flex; justify-content: center; }

/* 7 · venue-tile (casino card) -------------------------------------------- */
.tile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--vd-gap); }
.venue-tile {
  position: relative; display: flex; flex-direction: column; gap: 14px;
  background: linear-gradient(180deg, var(--vd-panel), var(--vd-bg-2));
  border: 1px solid var(--vd-line); border-radius: var(--vd-radius-lg);
  padding: 24px 22px; box-shadow: var(--vd-shadow);
}
.venue-tile--editor { border-color: rgba(255,90,95,.4); box-shadow: var(--vd-shadow-glow); }
.venue-tile__ribbon {
  position: absolute; top: -12px; left: 22px; background: linear-gradient(120deg, var(--vd-accent), var(--vd-accent-2));
  color: var(--vd-ink); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  padding: 5px 12px; border-radius: var(--vd-radius-pill);
}
.venue-tile__head { display: flex; align-items: center; gap: 14px; }
.venue-tile__logo, .ladder__logo {
  --tile-accent: var(--vd-accent);
  display: grid; place-items: center; width: 52px; height: 52px; flex: none;
  border-radius: 14px; font-family: var(--vd-font-display); font-weight: 800; font-size: 1.15rem;
  color: var(--vd-ink); background: linear-gradient(135deg, var(--tile-accent), color-mix(in srgb, var(--tile-accent) 55%, #fff));
}
.venue-tile__id { margin-right: auto; }
.venue-tile__name { font-size: 1.2rem; margin: 0 0 4px; }
.venue-tile__rank { color: var(--vd-text-mute); font-family: var(--vd-font-display); font-weight: 700; }
.venue-tile__bonus { background: var(--vd-accent-soft); border: 1px dashed rgba(255,90,95,.35); border-radius: var(--vd-radius); padding: 12px 14px; }
.venue-tile__bonus-label { display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .12em; color: var(--vd-accent); margin-bottom: 3px; }
.venue-tile__bonus-value { font-family: var(--vd-font-display); font-weight: 700; font-size: 1.05rem; }
.venue-tile__bonus-plus { display: block; font-size: .82rem; color: var(--vd-text-dim); font-weight: 600; }
.venue-tile__meta-row { display: flex; justify-content: space-between; border-top: 1px solid var(--vd-line); padding-top: 10px; }
.venue-tile__meta dt { color: var(--vd-text-mute); font-size: .9rem; margin: 0; }
.venue-tile__meta dd { margin: 0; font-weight: 700; }
.venue-tile__tags { display: flex; flex-wrap: wrap; gap: 7px; }
.venue-tile__tag { font-size: .74rem; color: var(--vd-text-dim); background: var(--vd-panel-2); border: 1px solid var(--vd-line); padding: 4px 10px; border-radius: var(--vd-radius-pill); }
.venue-tile__trust { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--vd-text-dim); }
.venue-tile__trust-badge { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: rgba(255,90,95,.2); color: var(--vd-accent); font-size: .75rem; }
.venue-tile__cta { margin-top: auto; }
.venue-tile__terms { text-align: center; font-size: .72rem; color: var(--vd-text-mute); }

/* rating */
.rating { display: inline-flex; align-items: center; gap: 8px; }
.rating__orbs { display: inline-flex; gap: 2px; }
.rating-orb { width: 11px; height: 11px; border-radius: 50%; background: var(--vd-line-strong); }
.rating-orb.is-on { background: var(--vd-gold); box-shadow: 0 0 8px rgba(255,207,92,.5); }
.rating__num { font-weight: 700; font-size: .9rem; color: var(--vd-gold); }

/* 8 · ladder (comparison table) ------------------------------------------- */
.ladder { border: 1px solid var(--vd-line); border-radius: var(--vd-radius-lg); overflow: hidden; background: var(--vd-panel); }
.ladder__scroll { overflow-x: auto; }
.ladder__table { width: 100%; border-collapse: collapse; min-width: 720px; }
.ladder__head th {
  text-align: left; font-family: var(--vd-font-display); font-size: .8rem; letter-spacing: .06em;
  text-transform: uppercase; color: var(--vd-text-mute); padding: 16px 18px; border-bottom: 1px solid var(--vd-line-strong);
  background: var(--vd-bg-2);
}
.ladder__cell { padding: 16px 18px; border-bottom: 1px solid var(--vd-line); vertical-align: middle; }
.ladder__row:last-child .ladder__cell { border-bottom: 0; }
.ladder__row--editor { background: rgba(255,90,95,.06); }
.ladder__cell--rank { font-family: var(--vd-font-display); font-weight: 700; color: var(--vd-text-dim); }
.ladder__cell--casino { display: flex; align-items: center; gap: 12px; }
.ladder__logo { width: 40px; height: 40px; font-size: .95rem; }
.ladder__name { font-weight: 700; }
.ladder__flag { display: inline-block; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--vd-accent); }

/* 9 · pledge (trust widget) ----------------------------------------------- */
.pledge {
  display: inline-flex; align-items: center; gap: 14px; width: 100%; max-width: 320px;
  background: var(--vd-panel); border: 1px solid var(--vd-line-strong); border-radius: var(--vd-radius-lg);
  padding: 18px 20px; box-shadow: var(--vd-shadow); transition: transform .15s, border-color .2s;
}
.pledge:hover { transform: translateY(-2px); border-color: rgba(255,90,95,.4); }
.pledge__star { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 12px; background: #00b67a; color: #fff; font-size: 1.4rem; }
.pledge__body { display: flex; flex-direction: column; }
.pledge__rating { font-family: var(--vd-font-display); font-weight: 800; font-size: 1.5rem; line-height: 1; }
.pledge__label { font-weight: 700; font-size: .95rem; }
.pledge__sub { font-size: .8rem; color: var(--vd-text-mute); }
.pledge__mark { margin-left: auto; color: #00b67a; font-weight: 800; font-size: .8rem; letter-spacing: .02em; align-self: flex-start; }

/* 10 · spotlight (BitGuruz editor's choice) ------------------------------- */
.spotlight { padding: clamp(30px,5vw,56px) 0; }
.spotlight__inner {
  display: grid; grid-template-columns: 1.3fr .7fr; gap: var(--vd-gap); align-items: center;
  background:
    radial-gradient(600px 300px at 90% 10%, rgba(255,171,64,.25), transparent 60%),
    linear-gradient(140deg, var(--vd-panel-2), var(--vd-bg-2));
  border: 1px solid rgba(255,171,64,.35); border-radius: var(--vd-radius-lg);
  padding: clamp(24px, 4vw, 44px); box-shadow: var(--vd-shadow);
}
.spotlight__eyebrow { display: inline-block; color: var(--vd-accent); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: .78rem; margin-bottom: 8px; }
.spotlight__title { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.spotlight__lede { color: var(--vd-text-dim); max-width: 52ch; }
.spotlight__perks { display: grid; gap: 8px; margin: 18px 0 22px; }
.spotlight__perks li { position: relative; padding-left: 28px; font-weight: 600; }
.spotlight__perks li::before { content: "◆"; position: absolute; left: 0; color: var(--vd-accent); }
.spotlight__actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.spotlight__mini { margin-top: 14px; font-size: .78rem; color: var(--vd-text-mute); }
.spotlight__panel { display: flex; justify-content: center; }

/* 11 · queries (FAQ) ------------------------------------------------------ */
.queries { display: grid; gap: 12px; max-width: 820px; }
.queries__item { border: 1px solid var(--vd-line); border-radius: var(--vd-radius); background: var(--vd-panel); overflow: hidden; }
.queries__q { margin: 0; font-size: 1rem; }
.queries__toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; background: none; border: 0; color: var(--vd-text); font-weight: 700; text-align: left; font-family: var(--vd-font-display); }
.queries__sign { position: relative; width: 18px; height: 18px; flex: none; }
.queries__sign::before, .queries__sign::after { content: ""; position: absolute; background: var(--vd-accent); border-radius: 2px; inset: 0; margin: auto; }
.queries__sign::before { width: 100%; height: 2.5px; }
.queries__sign::after { width: 2.5px; height: 100%; transition: transform .2s ease; }
.queries__toggle[aria-expanded="true"] .queries__sign::after { transform: scaleY(0); }
.queries__a { padding: 0 20px 18px; color: var(--vd-text-dim); }
.queries__a p { margin: 0; }

/* 12 · flare (sticky mobile CTA) ------------------------------------------ */
.flare { display: none; }

/* 13 · guardrail (responsible gambling) ----------------------------------- */
.guardrail { border-top: 1px solid var(--vd-line); background: var(--vd-bg-2); }
.guardrail__inner { display: flex; align-items: center; gap: 18px; padding: 22px 0; flex-wrap: wrap; }
.guardrail__age { display: grid; place-items: center; width: 46px; height: 46px; flex: none; border-radius: 12px; border: 2px solid var(--vd-gold); color: var(--vd-gold); font-weight: 800; font-family: var(--vd-font-display); }
.guardrail__text { margin: 0; color: var(--vd-text-dim); font-size: .92rem; flex: 1 1 300px; }
.guardrail__text strong { color: var(--vd-text); display: block; }
.guardrail__help { color: var(--vd-accent); font-weight: 700; border-bottom: 1px solid rgba(255,90,95,.4); }

/* 14 · colophon (footer) -------------------------------------------------- */
.colophon { background: var(--vd-panel-2); border-top: 1px solid var(--vd-line); margin-top: 20px; }
.colophon__inner { display: grid; grid-template-columns: 1.4fr 1fr 1.4fr; gap: var(--vd-gap); padding: clamp(40px,6vw,64px) 0; }
.colophon__tagline { color: var(--vd-text-mute); max-width: 34ch; margin: 14px 0 18px; }
.colophon__h { font-size: .95rem; text-transform: uppercase; letter-spacing: .1em; color: var(--vd-text-mute); margin-bottom: 14px; }
.colophon__list { display: grid; gap: 8px; }
.colophon__link { color: var(--vd-text-dim); }
.colophon__link:hover { color: var(--vd-accent); }
.colophon__disclaimer { color: var(--vd-text-mute); font-size: .85rem; }
.colophon__badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.colophon__badge { font-size: .72rem; color: var(--vd-text-dim); border: 1px solid var(--vd-line); padding: 4px 10px; border-radius: var(--vd-radius-pill); }
.colophon__help { color: var(--vd-accent); font-weight: 700; }
.colophon__base { border-top: 1px solid var(--vd-line); padding: 20px 0; color: var(--vd-text-mute); font-size: .85rem; }

/* 15 · dropdock (custom select) + lingo ----------------------------------- */
.dropdock { position: relative; display: inline-block; }
.dropdock__trigger {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px;
  background: var(--vd-panel); border: 1px solid var(--vd-line-strong); border-radius: var(--vd-radius-pill);
  color: var(--vd-text); font-weight: 700; transition: border-color .2s, background .2s;
}
.dropdock__trigger:hover { border-color: rgba(255,90,95,.4); }
.dropdock__caret { width: 8px; height: 8px; border-right: 2px solid var(--vd-text-dim); border-bottom: 2px solid var(--vd-text-dim); transform: rotate(45deg) translateY(-2px); transition: transform .2s ease; }
.dropdock.is-open .dropdock__caret { transform: rotate(-135deg) translateY(-2px); }
.dropdock__menu {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 60; min-width: 200px; max-height: 320px; overflow-y: auto;
  background: var(--vd-panel-2); border: 1px solid var(--vd-line-strong); border-radius: var(--vd-radius);
  box-shadow: var(--vd-shadow); padding: 6px; opacity: 0; transform: translateY(-6px) scale(.98);
  visibility: hidden; transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.dropdock.is-open .dropdock__menu { opacity: 1; transform: translateY(0) scale(1); visibility: visible; }
.dropdock__option { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--vd-radius-sm); color: var(--vd-text-dim); font-weight: 600; }
.dropdock__option.is-active { background: var(--vd-accent-soft); color: var(--vd-text); }
.dropdock__option[aria-selected="true"] { color: var(--vd-accent); }
.dropdock__option[aria-selected="true"]::after { content: "✓"; margin-left: auto; }
.lingo__flag { font-size: 1.1rem; }
.lingo__code { font-weight: 800; letter-spacing: .04em; }

/* 16 · misc slabs --------------------------------------------------------- */
.bonus-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px,1fr)); gap: var(--vd-gap); }
.bonus-strip__item { background: var(--vd-panel); border: 1px solid var(--vd-line); border-radius: var(--vd-radius-lg); padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.bonus-strip__type { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--vd-accent); font-weight: 800; }
.bonus-strip__title { font-size: 1.15rem; margin: 0; }
.bonus-strip__sub { color: var(--vd-text-dim); font-size: .9rem; margin: 0 0 auto; }
.bonus-strip__item .btn { margin-top: 12px; }

/* 17 · responsive --------------------------------------------------------- */
@media (max-width: 1024px) {
  .beacon__inner, .spotlight__inner { grid-template-columns: 1fr; }
  .beacon__aside, .spotlight__panel { justify-content: flex-start; }
  .colophon__inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 860px) {
  .masthead__burger {
    display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 46px; height: 46px; background: var(--vd-panel); border: 1px solid var(--vd-line-strong);
    border-radius: 12px; padding: 0 12px;
  }
  .masthead__burger-bar { height: 2.5px; background: var(--vd-text); border-radius: 2px; transition: transform .25s, opacity .2s; }
  .masthead.is-nav-open .masthead__burger-bar:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
  .masthead.is-nav-open .masthead__burger-bar:nth-child(2) { opacity: 0; }
  .masthead.is-nav-open .masthead__burger-bar:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

  .masthead__nav {
    position: fixed; top: 68px; right: 0; bottom: auto; left: auto; width: min(84vw, 340px);
    height: calc(100vh - 68px); height: calc(100dvh - 68px);
    flex-direction: column; align-items: stretch; gap: 20px;
    background: var(--vd-bg-2); border-left: 1px solid var(--vd-line); padding: 24px;
    transform: translateX(110%); transition: transform .3s cubic-bezier(.4,0,.2,1);
    overflow-y: auto; -webkit-overflow-scrolling: touch;
  }
  .masthead.is-nav-open .masthead__nav { transform: translateX(0); }
  .masthead__nav-list { flex-direction: column; gap: 4px; }
  .masthead__nav-link { padding: 12px 14px; font-size: 1rem; }
  .masthead__lingo { margin-top: auto; }
  .dropdock__menu { left: 0; right: auto; }

  /* comparison table → stacked cards */
  .ladder { border: 0; background: none; }
  .ladder__scroll { overflow: visible; }
  .ladder__table, .ladder__table tbody { min-width: 0; display: block; }
  .ladder__head { display: none; }
  .ladder__row {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px;
    background: var(--vd-panel); border: 1px solid var(--vd-line); border-radius: var(--vd-radius-lg);
    padding: 18px; margin-bottom: 14px;
  }
  .ladder__row--editor { border-color: rgba(255,90,95,.4); }
  .ladder__cell { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border: 0; align-items: center; }
  .ladder__cell::before { content: attr(data-th); color: var(--vd-text-mute); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; }
  .ladder__cell--casino { grid-column: 1 / -1; justify-content: flex-start; border-bottom: 1px solid var(--vd-line); padding-bottom: 12px; }
  .ladder__cell--casino::before { display: none; }
  .ladder__cell--cta { grid-column: 1 / -1; }
  .ladder__cell--cta::before { display: none; }
  .ladder__cell--cta .btn { width: 100%; }

  /* sticky mobile CTA */
  .flare {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    align-items: center; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,.96); backdrop-filter: blur(12px);
    border-top: 1px solid var(--vd-line-strong); box-shadow: 0 -10px 30px -12px rgba(32,26,36,.22);
  }
  .flare__text { display: flex; flex-direction: column; line-height: 1.2; }
  .flare__promo { font-family: var(--vd-font-display); font-size: 1rem; }
  .flare__sub { font-size: .74rem; color: var(--vd-text-dim); }
  .flare__cta { margin-left: auto; white-space: nowrap; }
  body { padding-bottom: 84px; }
}

@media (max-width: 560px) {
  .colophon__inner { grid-template-columns: 1fr; }
  .beacon__actions .btn, .spotlight__actions .btn--lg { width: 100%; }
}

@media (min-width: 1440px) {
  :root { --vd-shell: 1280px; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}