.pane-line {
  position: fixed; left: 0; top: 0; bottom: 0; z-index: 40;
  width: min(300px, 86vw);
  overflow-y: auto;
  background: #fff1f6;
  border-right: var(--dls) solid rgba(58, 22, 72, 0.14);
  transform: translateX(-102%); transition: transform 320ms var(--yu5b);
}
.note-flag.tab-media .pane-line { transform: none; }
@media (max-width: 720px) {
  .card-step { gap: 12px; padding: 0 16px 0 12px; }
  .club-row { min-width: 0; }
  .card-step .win-copy { display: none; }
  .club-row .link-card { display: none; }
}
@media (max-width: 480px) {
  .card-step { gap: 8px; padding-right: 10px; }
  .club-row { gap: 6px; }
  .club-row .menu-wrap { padding: 0 12px; letter-spacing: 0.02em; }
}
.gold-club { display: grid; grid-template-columns: 88px minmax(0, 1fr); min-height: 100vh; }
.shape-win {
  position: sticky; top: 0; height: 100vh;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 16px 8px;
  background: var(--s230);
  border-right: var(--dls) solid rgba(58, 22, 72, 0.14);
  overflow-y: auto; scrollbar-width: none;
}
.deal-ace { display: grid; gap: 4px; width: 100%; margin-top: 6px; }
.crown-crest {
  display: grid; justify-items: center; gap: 5px;
  padding: 10px 2px 9px;
  border-radius: var(--jhc);
  font-size: 10px; line-height: 1.1; text-align: center; color: #9c84a6;
  transition: color var(--lx7q), background var(--lx7q);
}
.crown-crest .frame-lead { font-size: 22px; color: var(--uexv); }
.crown-crest:hover { color: var(--t2i); background: #FFFFFF; }
.crown-crest.feature-inner { color: var(--t2i); background: #fff6fa; }
.crown-crest.feature-inner .frame-lead { color: var(--w9f); }
.slab-jackpot { margin-top: auto; width: 100%; }
.hero-stack { min-width: 0; }
.gold-club .card-step { gap: 28px; }
.core-ace { display: none; }
.dock-reel { display: flex; gap: 4px; }
.rear-inner {
  border-radius: var(--jsw); padding: 0 14px;
  font-size: 14px; font-weight: 500;
  display: inline-flex; align-items: center; color: var(--uexv);
  transition: color var(--lx7q), background var(--lx7q); height: 38px;
}
.rear-inner:hover { color: var(--t2i); }
.rear-inner.feature-inner { box-shadow: inset 0 calc(var(--dls) * -2) 0 var(--w9f); background: #fff6fa; color: var(--t2i); }
.tray-club { width: 260px; }
@media (max-width: 1280px) { .dock-reel { display: none; } }
@media (max-width: 900px) {
  .gold-club { grid-template-columns: minmax(0, 1fr); }
  .shape-win { display: none; }
  .core-ace { display: inline-grid; }
}
@media (max-width: 720px) { .tray-club { display: none; } }
.unit-gold { color: var(--uexv); }
.unit-gold p { margin: 0 0 1em; }
.unit-gold p:last-child { margin-bottom: 0; }
.core-wrap { margin: 1.4em 0 0.5em; font-size: var(--pxy); font-weight: 600; color: var(--t2i); }
.outer-race, .reel-side { margin: 0 0 1.1em; padding: 0; list-style: none; display: grid; gap: 0.55em; }
.outer-race li { position: relative; padding-left: 1.4em; }
.outer-race li::before {
  background: var(--w9f); top: 0.62em; height: 0.45em;
  width: 0.45em;
  content: ""; position: absolute; border-radius: calc(var(--jhc) * 0.2);
  transform: rotate(45deg); left: 0.1em;
}
.reel-side { counter-reset: step; }
.reel-side li { counter-increment: step; position: relative; padding-left: 2.3em; min-height: 1.7em; }
.reel-side li::before { top: -0.05em; left: 0;
  font: 600 0.8em/1 "Fredoka", "Chillax", sans-serif; width: 1.7em;
  background: var(--w9f);
  display: grid; height: 1.7em; border-radius: 50%;
  position: absolute; color: var(--tm4l);
  content: counter(step); place-items: center;
}
.unit-gold, .unit-gold > * { min-width: 0; }
.front-game { max-width: 100%; margin: 0 0 1.1em; overflow-x: auto; border: var(--dls) solid rgba(58, 22, 72, 0.14); border-radius: var(--jhc); }
.front-game table { font-size: 14px; border-collapse: collapse; width: 100%; }
.front-game th, .front-game td { padding: 10px 14px; text-align: left; border-bottom: var(--dls) solid rgba(58, 22, 72, 0.14); white-space: nowrap; }
.front-game tbody tr:last-child > * { border-bottom: 0; }
.front-game thead th { font-size: var(--io6f); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #9c84a6; background: #FFFFFF; }
.front-game tbody th { font-weight: 600; color: var(--t2i); }
.front-game caption { color: var(--w9f); padding: 10px 14px; text-align: left; border-bottom: var(--dls) solid rgba(58, 22, 72, 0.14); text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--io6f); font-weight: 600; caption-side: top; }
.front-game tbody tr:nth-child(even) > * { background: color-mix(in srgb, #fff6fa 45%, transparent); }
.tile-main, .media-body { display: inline-grid; font-size: 12px; font-weight: 700; width: 22px; place-items: center; border-radius: 50%; height: 22px; }
.tile-main { background: color-mix(in srgb, var(--qq7y) 18%, transparent); color: var(--qq7y); }
.media-body { background: color-mix(in srgb, #ff7a2e 14%, transparent); color: #ff7a2e; }
.crest-seal tbody th { width: 42%; white-space: normal; color: var(--uexv); font-weight: 500; }
.crest-seal td { color: var(--t2i); font-weight: 600; white-space: normal; }
.base-reel td, .base-reel thead th:not(:first-child) { text-align: center; }
.base-reel tbody td:nth-child(2), .base-reel thead th:nth-child(2) { background: var(--d9t) !important; }
.base-reel thead th:nth-child(2) { color: var(--w9f); }
@media (max-width: 520px) { .view-mark { flex-wrap: wrap; row-gap: 8px; } }
img[src^="img/card/"], img[src^="img/wide/"], img[src^="img/square/"] { background-color: var(--pwvs, var(--thx)); }
.page-jackpot { --e82: 3 / 4; position: relative; }
.page-jackpot img {
  background: linear-gradient(180deg, color-mix(in srgb, var(--pwvs, #222) 72%, #0B0B10) 0 50%, color-mix(in srgb, var(--pwvs, #222) 38%, #0b0b10)) !important; object-position: 50% 0 !important;
  object-fit: contain !important;
}
.page-jackpot::before { left: 0; content: ""; height: 24%; position: absolute; right: 0; z-index: 1; top: 49%; background: linear-gradient(rgba(0, 0, 0, 0.28), transparent); pointer-events: none; }
.shape-bonus { position: absolute; left: 10px; right: 10px; bottom: 12px; z-index: 2; display: grid; gap: 2px; color: #fff; text-shadow: 0 1px 6px rgba(0, 0, 0, 0.45); pointer-events: none; }
.live-feature { font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; -webkit-line-clamp: 2; line-height: 1.05; -webkit-box-orient: vertical; text-transform: none; letter-spacing: -0.01em; font-size: 17px; font-weight: var(--va0); overflow: hidden; display: -webkit-box; }
.jackpot-lobby { font-size: 11px; opacity: 0.78; }
.body-lead.page-jackpot + .unit-line, .body-lead.page-jackpot + .base-live { display: none; }
img[src^="img/brand/"] {
  background: none !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important;
  box-shadow: none !important; mask-image: none !important;
}
.link-flag { align-self: stretch;
  position: relative;
  pointer-events: none; justify-self: center;
  width: 100%; min-height: var(--g9g2, 340px);
}
.link-flag .page-tab {
  object-fit: contain; top: 50%; left: 50%; transform: translate(-50%, -50%); height: auto;
  position: absolute; object-position: 50% 100%; max-width: 116%; max-height: 100%;
  width: auto;
  filter: drop-shadow(0 18px 26px rgba(0, 0, 0, 0.35));
}
@media (max-width: 820px) {
  .link-flag { align-self: auto; min-height: var(--ry2, 260px); }
  .link-flag .page-tab { object-position: 50% 100%; }
}
img[src^="img/providers/"] { object-fit: contain; filter: var(--f1f, none); border-radius: 0; }
.game-win { align-items: center; line-height: 1; display: inline-flex; vertical-align: middle; gap: 0.5em; }
.game-win svg { max-width: 3em; height: 1.6em; width: auto; flex: none; }
.group-step { height: 1px; overflow: hidden; width: 1px; position: absolute; white-space: nowrap; clip-path: inset(50%); }
.copy-club { display: block; }
.race-deal { color: var(--w9f); }
.meta-chip2 {
  letter-spacing: 0.06em;
  display: block; margin-top: 0.5em; line-height: 1.2; color: var(--uexv); font-weight: 600;
  font-family: var(--p75); font-size: clamp(12px, 0.22em, 17px); text-transform: uppercase;
}
.foot-menu {
  letter-spacing: -0.01em; font-weight: var(--va0);
  margin: 0; line-height: 1.05; text-transform: none; display: block;
  font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; font-size: clamp(22px, 2.4vw, 38px);
}
/*  legacy  */
.top-outer { font-style: normal; color: var(--w9f); }
.flag-page { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 6px; font-size: var(--io6f); line-height: 1.3; color: #9c84a6; }
.vip-set { letter-spacing: 0.06em; text-transform: uppercase; }
.block-core { font-weight: 600; color: var(--t2i); }
.media-offer { color: rgba(255, 255, 255, 0.72); }
.media-offer .block-core { color: #fff; }
.deal-jackpot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ace-inner { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; font-size: var(--io6f); color: #9c84a6; border-radius: var(--jhc); transition: color .15s, border-color .15s, background-color .15s; }
.ace-inner:hover { color: var(--t2i); }
.ace-inner .frame-lead { font-size: 1.25em; }
.lobby-inner .ace-inner { background: var(--s230); border-radius: var(--jsw); }
.star-panel .ace-inner { border: var(--dls) solid #3a1648; }
.star-panel .ace-inner:hover { border-color: #3A1648; }
.deal-tile .ace-inner { background: #FFFFFF; border: var(--dls) solid rgba(58, 22, 72, 0.14); font-weight: 600; }
.panel-star { gap: 4px 18px; }
.panel-star .ace-inner { padding: 0; height: auto; text-underline-offset: 3px; text-decoration: underline; text-decoration-color: #3A1648; }
.base-label .ace-inner { padding: 0 8px; text-transform: uppercase; letter-spacing: 0.08em; font: 500 11px/1 "Fredoka", "Chillax", sans-serif; border-radius: 0; border-left: 2px solid var(--w9f); }
a[role="button"] { cursor: pointer; }
.card-step { background: rgba(255, 241, 246, 0.88); border-bottom: 2.5px solid var(--t2i); }
.note-nav, .shape-win { background: #fff; border-right: 2.5px solid var(--t2i); }
.bar-slot { border-radius: 999px; font-weight: 600; font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; font-size: 15px; color: var(--uexv); padding: 0 14px; }
.bar-slot .frame-lead { color: var(--w9f); }
.bar-slot:hover { background: #fff1f6; color: var(--t2i); }
.bar-slot.feature-inner { background: #ffcf3f; color: var(--t2i); box-shadow: inset 0 0 0 2.5px var(--t2i), 3px 3px 0 var(--t2i); }
.bar-slot.feature-inner .frame-lead { color: var(--w9f); }
.page-head { font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; color: var(--w9f); font-weight: 600; letter-spacing: 0; font-size: 14px; text-transform: none; }
.spin-shape { border: 2.5px solid var(--t2i); border-radius: 22px; box-shadow: 3px 3px 0 var(--t2i); background: #fff6fa; color: var(--t2i); font-weight: 600; text-transform: none; font-size: 13px; letter-spacing: 0; }
.spin-shape:nth-child(2) { background: #e9fbf3; }
.spin-shape img { border-radius: 50%; border: 2px solid var(--t2i); }
.crown-crest.feature-inner { background: #ffcf3f; box-shadow: inset 0 0 0 2px var(--t2i); }
.stack-menu { border-bottom: 2.5px solid var(--t2i); background: rgba(255, 241, 246, 0.94); }
.panel-bonus { border: 2px solid var(--t2i); font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; font-weight: 600; color: var(--t2i); background: #fff; }
.panel-bonus.feature-inner { color: #fff; border-color: var(--t2i); background: var(--w9f); box-shadow: 2px 2px 0 var(--t2i); }
.rear-inner { font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; font-weight: 600; }
.rear-inner.feature-inner { background: #ffcf3f; box-shadow: inset 0 0 0 2px var(--t2i); }
.bonus-note { font-family: "Fredoka", "Chillax", "Trebuchet MS", sans-serif; font-size: 16px; font-weight: 600; }
.bonus-note.feature-inner::after { height: 5px; background: var(--w9f); }
.live-lead .inner-body { border: 2.5px solid var(--t2i); box-shadow: 5px 5px 0 var(--t2i); }
.row-chip { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(260px, 1fr); gap: 14px; }
.slot-tray { position: relative; overflow: hidden; isolation: isolate; }
.slot-tray::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 70% at 80% 50%, rgba(255, 207, 63, 0.45), transparent 70%), radial-gradient(circle at 4px 4px, rgba(255, 79, 154, 0.35) 2px, transparent 2.5px) 0 0 / 28px 28px, radial-gradient(circle at 18px 18px, rgba(63, 217, 160, 0.35) 2px, transparent 2.5px) 0 0 / 28px 28px; }
.inner-seal {
  display: grid; scrollbar-width: none; grid-auto-flow: column; scroll-snap-type: x mandatory; grid-auto-columns: 100%;
  overflow-x: auto;
}
.inner-seal::-webkit-scrollbar { display: none; }
.body-nav {
  scroll-snap-align: start;
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: center; gap: 24px;
  min-height: 400px; padding: 40px 40px 76px clamp(24px, 4vw, 52px);
}
.tile-row { justify-items: start; gap: 18px; display: grid; }
.star-deck { font-size: clamp(36px, 3.6vw, 60px); max-width: 13ch; }
.star-deck em { display: block; }
.stage-hero { max-width: 42ch; color: var(--uexv); }
.note-deck {
  justify-self: center; width: min(100%, 320px); aspect-ratio: 1; object-fit: cover;
  border-radius: 20px;
  transform: rotate(calc(var(--b8u9) * -1));
  box-shadow: 6px 6px 0 0 #3A1648;
}
.tab-star {
  position: absolute; left: clamp(24px, 4vw, 52px); bottom: 22px;
  display: flex; align-items: center; gap: 12px;
}
.pane-body { display: flex; gap: 6px; }
.field-dot { height: 4px; width: 22px; border-radius: var(--jhc); transition: width var(--lx7q) var(--yu5b), background var(--lx7q); background: #3a1648; }
.field-dot.feature-inner { width: 44px; background: var(--w9f); }
.ace-field { display: grid; grid-template-rows: 1fr 1fr; gap: 14px; }
.list-seal {
  padding: 16px; gap: 18px;
  transition: transform var(--lx7q) var(--yu5b), box-shadow var(--lx7q); align-items: center; grid-template-columns: 112px minmax(0, 1fr);
  display: grid; overflow: hidden;
}
.list-seal:hover { transform: translateY(calc(var(--ix5r) * -1)); box-shadow: var(--cr71); }
.list-seal img { width: 112px; height: 112px; object-fit: cover; border-radius: 20px; }
.live-gold { display: grid; gap: 8px; }
.feature-body { font-size: 24px; }
.hero-menu { color: var(--uexv); gap: 6px; align-items: center; display: inline-flex; font-size: var(--io6f); }
@media (max-width: 1180px) {
  .row-chip { grid-template-columns: 1fr; }
  .ace-field { grid-template-rows: none; grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .body-nav { min-height: 0; padding: 24px 20px 76px; grid-template-columns: 1fr; }
  .note-deck { order: -1; width: 180px; }
  .tab-star { left: 20px; }
  .ace-field { grid-template-columns: 1fr; }
  .list-seal { grid-template-columns: 84px minmax(0, 1fr); }
  .list-seal img { width: 84px; height: 84px; }
}
.slab-body { --g9g2: 320px; width: min(100%, 380px); }
@media (max-width: 720px) {
  .slab-body { order: -1; justify-self: start; width: min(78vw, 320px); --ry2: min(64vw, 280px); }
}
.feature-lobby { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-bottom: 18px; }
/*  keep in sync with the build  */
.race-panel { font-size: var(--yy7r); }
.slot-link { flex: 1; min-width: 260px; font-size: 14px; color: var(--uexv); }
.field-dice { padding: 0; margin: 0; list-style: none; gap: 12px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.25fr); }
.crest-row { isolation: isolate; display: grid; align-content: start; justify-items: center; gap: 10px; padding: 26px 18px 22px; text-align: center; }
.crest-row.line-deal { background: radial-gradient(50% 70% at 80% 50%, rgba(255, 207, 63, 0.45), transparent 70%), #FFFFFF; border-color: var(--w9f); }
.race-gold {
  position: relative;
  --ol0i: #8A5A2B; height: 68px; display: grid;
  width: 68px; --bvd: #d59a61;
  background: radial-gradient(circle at 35% 30%, var(--bvd), var(--ol0i) 70%); border-radius: 50%; place-items: center;
  box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.18), inset 0 -6px 10px rgba(0, 0, 0, 0.25), 0 6px 16px -6px rgba(0, 0, 0, 0.5);
}
.race-gold::before, .race-gold::after { top: -14px;
  background: var(--ol0i); z-index: -1; width: 16px; position: absolute; height: 22px;
  content: ""; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 75%, 0 100%);
}
.race-gold::before { left: 14px; transform: rotate(-18deg); }