@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(bungee-400-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(bungee-400.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Kanit';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(kanit-700italic-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Kanit';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(kanit-700italic.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Kanit';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(kanit-800italic-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Kanit';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(kanit-800italic.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(kanit-400-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(kanit-400.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(kanit-500-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(kanit-500.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(kanit-600-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(kanit-600.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/*  components  */
:root {
  --sib: hsl(247 58% 14%);
  --v3y: rgba(255, 79, 139, 0.14);
  --vl17: 16px;
  --ew9f: clamp(46px, 4.8vw, 72px);
  --zdiz: "Bungee", "Kanit", sans-serif;
  --pwr7: 0px;
  --oxj8: radial-gradient(45% 60% at 80% 100%, rgba(255, 138, 61, 0.35), transparent 70%), radial-gradient(40% 50% at 20% 0%, rgba(61, 224, 255, 0.15), transparent 70%);

  --dvj:12px;--ncq8:hsl(257 27% 58%);--et4:hsl(305 73% 6%);--jvc:24px;
  --ocbd: 0 0 0 1px var(--mygs), 0 0 30px -6px rgba(61, 224, 255, 0.6);
  --b9xs: clamp(46px, 5.4vw, 84px);
  --eopb: 999px;

  --aj7:14px;--gk61:hsl(245 60% 11%);--mygs:hsl(190 100% 62%);

  --k47: linear-gradient(transparent 60%, rgba(10, 8, 34, 1)), linear-gradient(90deg, rgba(255, 79, 139, 0.18) 1px, transparent 1px) 50% 100% / 40px 40px, linear-gradient(0deg, rgba(255, 79, 139, 0.18) 1px, transparent 1px) 50% 100% / 40px 40px;
  --fyn: "Kanit", "Segoe UI", sans-serif;
  --et14: 1px;
  --xoe1: 248px;
  --y6t: clamp(16px, 2.4vw, 36px);
  --hsq: rgba(255, 90, 140, 0.3);

  --s98u: 0.2em;
  --j2he: 0.95;
  --a6d: 8px;

  --lxa: hsl(335 100% 98%);
  --umua: 3px;
  --tvoi: 19px;
  --e9z9: 220ms;
  --ogv: hsl(24 100% 62%);
  --uiu: 14px;
  --g9vy: 10px;

  --xsz7: hsl(340 100% 65%);
  --hp2c: hsl(36 100% 62%);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scrollbar-color: hsl(250 52% 25%) transparent; }
body {
  margin: 0;
  color: var(--lxa);
  font: 400 var(--vl17)/1.55 var(--fyn);
  -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(1000px 420px at 50% -120px, rgba(255, 79, 139, 0.28), transparent 70%),
    linear-gradient(180deg, hsl(245 62% 8%), hsl(253 66% 11%) 60%, hsl(263 65% 12%));
  background-attachment: fixed;
}
body::before {
  content: ""; position: fixed; left: -50%; right: -50%; bottom: -10vh; height: 55vh; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 79, 139, 0.22) 1px, transparent 1px) 50% 0 / 60px 60px,
    linear-gradient(0deg, rgba(255, 79, 139, 0.22) 1px, transparent 1px) 50% 0 / 60px 60px;
  transform: perspective(500px) rotateX(62deg);
  transform-origin: 50% 100%;
  mask-image: linear-gradient(transparent, #000 60%);
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { padding: 0; font: inherit; color: inherit; cursor: pointer; background: none; border: 0; }
h1, h2, h3, h4, p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
::selection { background: var(--xsz7); color: #fff; }
:focus-visible { border-radius: 0.375rem; outline-offset: 3px; outline: 2px solid var(--mygs); }
.crown-crown { font-size: 1.2em; line-height: 1; flex: none; }
.edge-seal { font-family: var(--zdiz); font-weight: 400; font-variant-numeric: tabular-nums; letter-spacing: 0.02em; }
.star-chip { position: absolute; width: 1px; clip: rect(0 0 0 0); height: 1px; overflow: hidden; }
.box-vip {
  --tug: 46px;
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  height: var(--tug); padding: 0 1.625rem;
  border-radius: 62.4375rem;
  font: 700 15px/1 var(--fyn); font-style: italic; letter-spacing: 0.04em; text-transform: uppercase;
  white-space: nowrap;
  transition: filter var(--e9z9), box-shadow var(--e9z9), transform var(--e9z9) cubic-bezier(0.2, 0.9, 0.3, 1);
}
.feature-cell { font-size: 0.8125rem; padding: 0 1.125rem; --tug: 38px; }
.flag-box { --tug: 58px; padding: 0 2.125rem; font-size: 1.0625rem; }
.outer-live { background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); color: #fff; text-shadow: 0 1px 2px rgba(80, 0, 40, 0.5); box-shadow: 0 8px 26px -8px rgba(255, 79, 139, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.4); }
.outer-live:hover { filter: brightness(1.1) saturate(1.1); transform: translateY(-2px); }
.shape-crown { color: var(--mygs); background: rgba(61, 224, 255, 0.06); box-shadow: inset 0 0 0 1.5px rgba(61, 224, 255, 0.6), 0 0 18px -6px rgba(61, 224, 255, 0.6); }
.shape-crown:hover { background: rgba(61, 224, 255, 0.14); }

.panel-feature { box-shadow: inset 0 0 0 1px var(--hsq); display: inline-grid; place-items: center; width: 2.625rem; transition: color var(--e9z9), box-shadow var(--e9z9); height: 2.625rem; color: var(--lxa); background: rgba(255, 255, 255, 0.05); border-radius: 50%; }
.panel-feature:hover { color: var(--mygs); box-shadow: inset 0 0 0 1px var(--mygs), 0 0 14px -4px var(--mygs); }
.hero-outer { display: flex; align-items: center; gap: 0.625rem; height: 2.875rem; padding: 0 0.625rem 0 1.125rem; border-radius: 62.4375rem; background: rgba(10, 8, 34, 0.75); box-shadow: inset 0 0 0 1px var(--hsq); color: var(--ncq8); }
.hero-outer:focus-within { box-shadow: inset 0 0 0 1.5px var(--mygs), 0 0 20px -8px var(--mygs); color: var(--mygs); }
.hero-outer input { flex: 1; min-width: 0; height: 100%; background: none; border: 0; outline: 0; color: var(--lxa); font: inherit; font-size: var(--uiu); }
.hero-outer input::placeholder { color: var(--ncq8); }
.hero-outer kbd { border-radius: 62.4375rem; font: 400 11px/1 var(--zdiz); color: var(--xsz7); background: rgba(255, 79, 139, 0.12); padding: 0.3125rem 0.5625rem; }
.unit-box { display: inline-flex; align-items: center; gap: 0.625rem; font: 600 12px/1 var(--fyn); letter-spacing: var(--s98u); text-transform: uppercase; background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.unit-box::before { background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); content: ""; border-radius: 2px; width: 1.625rem; height: 3px; }
.menu-field { letter-spacing: -0.01em; text-transform: uppercase; font-style: italic; font-weight: 800; font-family: "Kanit", "Arial Black", sans-serif; line-height: var(--j2he); }
.menu-field em {
  font-style: italic;
  background: linear-gradient(180deg, hsl(202 100% 96%) 0%, hsl(201 100% 78%) 40%, hsl(228 55% 25%) 48%, hsl(28 100% 83%) 52%, hsl(336 100% 69%) 90%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 14px rgba(255, 79, 139, 0.45));
}
.edge-crown { border-radius: 62.4375rem; padding: 0 0.5625rem; background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); height: 1.375rem; align-items: center; letter-spacing: 0.06em; text-transform: uppercase; font: 400 10px/1 var(--zdiz); display: inline-flex; color: #fff; }
[data-copy-vip] { background: linear-gradient(90deg, hsl(345 100% 62%), hsl(24 100% 62%)); }
.link-ace { background: linear-gradient(90deg, hsl(190 100% 62%), hsl(246 100% 71%)); color: hsl(223 75% 9%); }
.crest-club {
  position: relative;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 30%), var(--sib);
  border: 1px solid transparent;
  border-radius: var(--aj7);
  background-clip: padding-box;
  box-shadow: 0 0 0 1px rgba(255, 79, 139, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 0 0 1px rgba(255, 255, 255, 0.04), 0 20px 40px -24px rgba(255, 79, 139, 0.45);
}
.cell-outer { overflow: hidden; padding: 0.375rem; background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); position: relative; border-radius: 50%; box-shadow: 0 0 60px -10px rgba(255, 79, 139, 0.7); }
.cell-outer::after { pointer-events: none; bottom: 0.375rem; background: repeating-linear-gradient(0deg, transparent 0 7px, rgba(10, 8, 34, 0.55) 7px 11px); position: absolute; content: ""; left: 0.375rem; right: 0.375rem; border-radius: 0 0 62.4375rem 62.4375rem; height: 40%; }
.cell-outer img { border-radius: 50%; height: 100%; object-fit: cover; width: 100%; }

.slab-meta { flex: none; display: inline-block; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--mygs); box-shadow: 0 0 10px var(--mygs), 0 0 2px #fff; }

.slab-lead { display: grid; gap: 0.375rem; }
[data-win-table] { font: 500 11px/1 var(--fyn); color: var(--ncq8); letter-spacing: 0.16em; text-transform: uppercase; }
.body-crown { text-shadow: 0 0 12px rgba(61, 224, 255, 0.5); color: var(--mygs); font: 400 22px/1 var(--zdiz); }

/*  header  */

[data-ring-offer] { display: inline-flex; box-shadow: inset 0 0 0 1px var(--hsq); background: rgba(255, 255, 255, 0.05); text-transform: uppercase; transition: box-shadow var(--e9z9), color var(--e9z9); letter-spacing: 0.1em; font: 600 12px/1 var(--fyn); border-radius: 62.4375rem; align-items: center; gap: 0.375rem; height: 2.125rem; padding: 0 0.875rem; color: var(--lxa); }
[data-ring-offer] .edge-seal { color: var(--ogv); }
[data-ring-offer]:hover { color: var(--mygs); box-shadow: inset 0 0 0 1px var(--mygs); }
.deck-media { display: flex; align-items: center; margin-bottom: 1.25rem; gap: 0.875rem; }
.zone-rail { display: none; }
.line-panel { text-transform: uppercase; gap: 0.75rem; font: italic 800 36px/1 "Kanit", "Arial Black", sans-serif; position: relative; padding-left: 1.125rem; display: flex; align-items: center; margin-right: auto; white-space: nowrap; }
.line-panel::before { content: ""; left: 0; bottom: 10%; box-shadow: 0 0 12px rgba(255, 79, 139, 0.8); position: absolute; top: 10%; background: linear-gradient(180deg, hsl(36 100% 62%), hsl(336 100% 62%)); border-radius: 3px; width: 0.3125rem; }
.line-panel .crown-crown { color: var(--mygs); filter: drop-shadow(0 0 8px var(--mygs)); }
.club-body { display: none; }
.edge-tab { display: flex; gap: 0.375rem; }
.deck-media [data-ring-offer] { white-space: nowrap; }
.star-crown { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; color: var(--lxa); background: rgba(255, 255, 255, 0.05); box-shadow: inset 0 0 0 1px var(--hsq); transition: color var(--e9z9), box-shadow var(--e9z9), opacity var(--e9z9); }
.star-crown:hover { color: var(--mygs); box-shadow: inset 0 0 0 1px var(--mygs); }
.star-crown[disabled] { opacity: 0.3; pointer-events: none; }
@media (max-width: 720px) {
  .line-panel { font-size: 1.625rem; white-space: normal; min-width: 0; }
  .edge-tab { display: none; }
  .deck-media [data-ring-offer] { flex: none; }
}
.copy-zone { display: grid; grid-auto-flow: column; grid-auto-columns: 172px; gap: 0.875rem; padding: 0.25rem 2px 0.875rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
.copy-zone::-webkit-scrollbar { display: none; }
.copy-zone > * { scroll-snap-align: start; }
[data-copy-head] { gap: 0.625rem; display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; }
.race-dock { position: relative; aspect-ratio: var(--h6q, 3 / 2); overflow: hidden; border-radius: var(--g9vy); background: hsl(248 55% 18%); box-shadow: 0 0 0 1px rgba(255, 79, 139, 0.25); transition: box-shadow var(--e9z9), transform var(--e9z9) cubic-bezier(0.2, 0.9, 0.3, 1); }
.race-dock::after { position: absolute; opacity: 0; transition: opacity var(--e9z9); inset: 0; content: ""; background: linear-gradient(180deg, transparent 55%, rgba(255, 79, 139, 0.35)); }
.race-dock img { width: 100%; height: 100%; object-fit: cover; }
.nav-promo { left: 0.5rem; top: 0.5rem; z-index: 1; position: absolute; }
[data-copy-head]:hover .race-dock { transform: translateY(-4px); box-shadow: 0 0 0 1.5px var(--mygs), 0 14px 30px -10px rgba(61, 224, 255, 0.55); }
[data-copy-head]:hover .race-dock::after { opacity: 1; }
.side-live { white-space: nowrap; text-overflow: ellipsis; font: 600 14px/1.2 var(--fyn); overflow: hidden; }
.band-set { gap: 0.5rem; font-size: 0.75rem; color: var(--ncq8); justify-content: space-between; margin-top: 2px; align-items: center; display: flex; }
.band-set > span { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.tray-ace { gap: 0.375rem; font: 400 11px/1 var(--zdiz); color: var(--mygs); align-items: center; display: inline-flex; flex: none; }
.wrap-inner {
  --biw: 34px;
  display: inline-flex; align-items: center; gap: 0.3em;
  font-size: var(--biw); line-height: 1;
  color: var(--lxa);
  white-space: nowrap;
  text-decoration: none;
}
.link-bonus { --biw: 44px; }
.cell-block { font-weight: 800;
  text-transform: uppercase;
  font-size: 0.74em;
  font-family: "Kanit", "Arial Black", sans-serif; line-height: 1; letter-spacing: -0.01em;
}
.wrap-head { position: relative; flex: none; }
@media (max-width: 720px) { .bar-offer .wrap-inner { --biw: 28px; } }
[data-tile-body] { place-items: center; color: hsl(245 62% 8%);
  box-shadow: 0.1em 0.04em 0 -0.02em var(--xsz7);
  border-radius: 0.09em;
  transform: rotate(calc(-7deg - -2deg));
  width: 0.72em; height: 1em;
  display: grid;
  background: var(--lxa); margin: 0 0.06em;
}
.panel-stage { font-size: 0.5em; line-height: 1; font-family: "Segoe UI Symbol", "Apple Symbols", serif; }
[data-front-chip2] .panel-stage { color: var(--xsz7); }
.base-chip {
  position: absolute; left: 0.08em; top: 0.07em;
  font: 700 0.2em/1 var(--fyn);
}
.field-box { left: auto; top: auto; right: 0.08em; bottom: 0.07em; transform: rotate(180deg); }
.bonus-box { overflow-x: clip; }
.menu-page { padding-right: var(--y6t); padding-left: var(--y6t); margin: 0 auto; max-width: 1520px; width: 100%; }
.dot-seal { padding-top: 1.5rem; display: grid; padding-bottom: var(--ew9f); grid-template-columns: minmax(0, 1fr); gap: var(--ew9f); }
.dot-seal > * { min-width: 0; }

.bar-offer{position:sticky;top:0;z-index:30;background:color-mix(in srgb,hsl(245 62% 8%) 90%,transparent);backdrop-filter:blur(12px);border-bottom:var(--et14) solid rgba(255, 138, 61, 0.14)}.page-mark{display:flex;align-items:center;gap:1.25rem;height:70px}.row-offer{margin-left:auto;gap:0.625rem;align-items:center;display:flex}

.grid-chip { display: none; }
.outer-rear { display: none; }
.bonus-box.table-band .outer-rear { display: block; position: fixed; inset: 0; z-index: 45; background: rgba(0, 0, 0, 0.55); }
.jackpot-ace {
  position: fixed; left: 0; top: 0; gap: 1.125rem; padding: 1rem; z-index: 50; border-right: var(--et14) solid rgba(255, 138, 61, 0.14); bottom: 0;
  width: min(320px, 88vw);
  transform: translateX(-102%);
  overflow-y: auto;
  display: flex; flex-direction: column; background: hsl(245 62% 8%); transition: transform 320ms cubic-bezier(0.2, 0.9, 0.3, 1);
}
.bonus-box.table-band .jackpot-ace { transform: none; }
.media-core { justify-content: space-between; align-items: center; display: flex; }
.head-grid { display: grid; gap: 0.25rem; }
.club-cell { display: flex; align-items: center; gap: 0.75rem; height: 2.875rem; padding: 0 0.75rem; border-radius: var(--a6d); color: hsl(261 46% 80%); }
.club-cell.side-inner, .club-cell:hover { background: var(--sib); color: var(--lxa); }
.club-cell .crown-crown { color: var(--xsz7); }
.dock-ace { display: grid; gap: 0.5rem; }
.offer-bonus { display: grid; gap: 0.625rem; margin-top: auto; font-size: var(--uiu); color: var(--ncq8); }

@media (max-width: 1080px) {
  .grid-chip { display: inline-grid; }
}
@media (max-width: 640px) {
  .row-offer .shape-crown { display: none; }
  .page-mark { gap: 0.75rem; }
}
.win-mark { flex: 1; max-width: 35rem; margin: 0 auto; }
.shape-top { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0 0.625rem; font-size: var(--uiu); font-weight: 600; color: hsl(261 46% 80%); }
.shape-top .crown-crown { color: var(--xsz7); }
.crown-row { border-top: var(--et14) solid rgba(255, 138, 61, 0.14); background: color-mix(in srgb, var(--gk61) 70%, transparent); }
.area-inner { display: flex; gap: 0.25rem; overflow-x: auto; scrollbar-width: none; }
.area-inner::-webkit-scrollbar { display: none; }
.table-stack { justify-items: center;
  flex: 1 0 auto; font-weight: 600;
  border-bottom: 3px solid transparent; min-width: 6rem; padding: 0.625rem 0.75rem 0.5625rem; display: grid; color: var(--ncq8); gap: 0.25rem; transition: color var(--e9z9), border-color var(--e9z9), background var(--e9z9);
  font-size: 0.75rem;
}
.table-stack .crown-crown { font-size: 1.375rem; }
.table-stack:hover { color: var(--lxa); background: var(--sib); }
.table-stack.side-inner { color: var(--lxa); border-bottom-color: var(--xsz7); }
.table-stack.side-inner .crown-crown { color: var(--xsz7); }
.set-grid { display: none; }
@media (max-width: 900px) { .win-mark { display: none; } .shape-top { display: none; } }
@media (max-width: 720px) {
  .crown-row { display: none; }
  .set-grid {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
    display: grid; grid-template-columns: repeat(5, 1fr);
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--gk61) 95%, transparent); backdrop-filter: blur(12px);
    border-top: var(--et14) solid rgba(255, 138, 61, 0.14);
  }
  .list-chip { display: grid; justify-items: center; gap: 3px; padding: 0.375rem 0; font-size: 0.625rem; color: var(--ncq8); }
  .list-chip .crown-crown { font-size: 1.375rem; }
  .list-chip.side-inner { color: var(--xsz7); }
  .lead-grid { padding-bottom: 4.375rem; }
}
.table-outer { color: hsl(261 46% 80%); }
.table-outer p { margin: 0 0 1em; }
.table-outer p:last-child { margin-bottom: 0; }
.live-rear { font-weight: 600; color: var(--lxa); margin: 1.4em 0 0.5em; font-size: var(--tvoi); }
.slab-lobby, [data-dice-race] { margin: 0 0 1.1em; padding: 0; list-style: none; display: grid; gap: 0.55em; }
.slab-lobby li { position: relative; padding-left: 1.4em; }
.slab-lobby li::before { border-radius: calc(var(--a6d) * 0.2);
  content: ""; top: 0.62em;
  background: var(--xsz7); position: absolute;
  width: 0.45em;
  transform: rotate(45deg); height: 0.45em; left: 0.1em;
}
[data-dice-race] { counter-reset: step; }
/*  components  */
[data-dice-race] li { counter-increment: step; min-height: 1.7em; position: relative; padding-left: 2.3em; }
[data-dice-race] li::before {
  position: absolute; border-radius: 50%;
  background: var(--xsz7);
  display: grid; width: 1.7em;
  font: 600 0.8em/1 var(--zdiz); color: var(--et4);
  content: counter(step); top: -0.05em; height: 1.7em; left: 0; place-items: center;
}
.table-outer, .table-outer > * { min-width: 0; }
.grid-stage { max-width: 100%; margin: 0 0 1.1em; overflow-x: auto; border: var(--et14) solid rgba(255, 138, 61, 0.14); border-radius: var(--a6d); }
.grid-stage table { font-size: var(--uiu); border-collapse: collapse; width: 100%; }
.grid-stage th, .grid-stage td { border-bottom: var(--et14) solid rgba(255, 138, 61, 0.14); text-align: left; padding: 0.625rem 0.875rem; white-space: nowrap; }
.grid-stage tbody tr:last-child > * { border-bottom: 0; }
.grid-stage thead th { font-size: var(--dvj); font-weight: 600; letter-spacing: var(--s98u); text-transform: uppercase; color: var(--ncq8); background: var(--sib); }
.grid-stage tbody th { font-weight: 600; color: var(--lxa); }
.grid-stage caption { caption-side: top; text-align: left; padding: 0.625rem 0.875rem; font-size: var(--dvj); font-weight: 600; letter-spacing: var(--s98u); text-transform: uppercase; color: var(--xsz7); border-bottom: var(--et14) solid rgba(255, 138, 61, 0.14); }
.grid-stage tbody tr:nth-child(even) > * { background: color-mix(in srgb, hsl(248 55% 18%) 45%, transparent); }
.side-lead, .set-game { display: inline-grid; place-items: center; width: 1.375rem; height: 1.375rem; border-radius: 50%; font-weight: 700; font-size: 0.75rem; }
.side-lead { background: color-mix(in srgb, hsl(190 100% 62%) 18%, transparent); color: hsl(190 100% 62%); }
.set-game { background: color-mix(in srgb, var(--hp2c) 14%, transparent); color: var(--hp2c); }
.seal-race tbody th { width: 42%; color: hsl(261 46% 80%); font-weight: 500; white-space: normal; }
.seal-race td { white-space: normal; font-weight: 600; color: var(--lxa); }
.wrap-field td, .wrap-field thead th:not(:first-child) { text-align: center; }
.wrap-field tbody td:nth-child(2), .wrap-field thead th:nth-child(2) { background: var(--v3y) !important; }
.wrap-field thead th:nth-child(2) { color: var(--xsz7); }
@media (max-width: 520px) { .deck-media { flex-wrap: wrap; row-gap: 8px; } }
img[data-gold-list], img.pane-dot, img.media-note { background-color: var(--ymui, var(--u4x3)); }
.item-line { --h6q: 3 / 4; position: relative; }
.item-line img {
  object-fit: contain !important; object-position: 50% 0 !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--ymui, #222) 72%, hsl(240 19% 5%)) 0 50%, color-mix(in srgb, var(--ymui, #222) 38%, hsl(240 19% 5%))) !important;
}
.item-line::before { content: ""; position: absolute; left: 0; right: 0; top: 49%; height: 24%; z-index: 1; pointer-events: none; background: linear-gradient(rgba(0, 0, 0, 0.28), transparent); }
.hero-live { position: absolute; color: #fff; text-shadow: 0 1px 6px rgba(0, 0, 0, 0.45); bottom: 0.75rem; left: 0.625rem; display: grid; right: 0.625rem; z-index: 2; gap: 2px; pointer-events: none; }
.club-view { -webkit-line-clamp: 2; font-family: "Kanit", "Arial Black", sans-serif; text-transform: uppercase; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.05; font-weight: 800; letter-spacing: -0.01em; font-size: 1.0625rem; }
.club-front { font-size: 0.6875rem; opacity: 0.78; }
.race-dock.item-line + .jackpot-win, .race-dock.item-line + .dot-page { display: none; }
img.crown-spin {
  background: none !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important;
  box-shadow: none !important; mask-image: none !important;
}
.strip-deck {
  position: relative; align-self: stretch; justify-self: center; min-height: var(--wyo, 340px);
  width: 100%;
  pointer-events: none;
}
.strip-deck [data-label-row] { top: 50%;
  object-fit: contain; transform: translate(-50%, -50%); max-height: 100%; height: auto;
  filter: drop-shadow(0 18px 26px rgba(0, 0, 0, 0.35)); max-width: 116%;
  position: absolute; object-position: 50% 100%; left: 50%;
  width: auto;
}
@media (max-width: 820px) {
  .strip-deck { align-self: auto; min-height: var(--gfp, 260px); }
  .strip-deck [data-label-row] { object-position: 50% 100%; }
}
img.slot-chip2 { border-radius: 0; filter: var(--iizc, none); object-fit: contain; }
[data-spin-dot] { vertical-align: middle; display: inline-flex; align-items: center; gap: 0.5em; line-height: 1; }
[data-spin-dot] svg { max-width: 3em; height: 1.6em; width: auto; flex: none; }
.nav-star { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
[data-deck-list] { gap: 0.75rem; display: inline-flex; align-items: center; letter-spacing: 0.04em; text-transform: uppercase; font-size: 0.75rem; }
[data-deck-list] a { color: hsl(261 46% 80%); text-decoration: none; }
[data-deck-list] a:hover { color: var(--xsz7); }
[data-deck-list] a.side-inner { color: var(--lxa); font-weight: 600; }

[data-tray-deal] { display: block; }
.tile-chip2 { color: var(--xsz7); }
.nav-view {
  display: block; text-transform: uppercase; color: inherit; margin-top: 0.5em; line-height: 1.2;
  font-family: var(--wyi); font-weight: 600; font-size: clamp(12px, 0.22em, 17px);
  letter-spacing: var(--s98u); opacity: 0.72;
}
.top-line {
  font-family: "Kanit", "Arial Black", sans-serif; font-weight: 800; font-size: clamp(22px, 2.4vw, 38px);
  letter-spacing: -0.01em; display: block; text-transform: uppercase;
  margin: 0; line-height: 1.05;
}
.top-mark { font-style: normal; color: var(--xsz7); }
.jackpot-media { display: inline-flex; line-height: 1.3; align-items: baseline; flex-wrap: wrap; gap: 0.375rem; font-size: var(--dvj); color: var(--ncq8); }
.deck-bar { letter-spacing: var(--s98u); text-transform: uppercase; }
[data-area-panel] { font-weight: 600; color: var(--lxa); }
.win-set { color: rgba(255, 255, 255, 0.72); }
.win-set [data-area-panel] { color: #fff; }
[data-dot-tile] { gap: 0.5rem; flex-wrap: wrap; display: flex; align-items: center; }
.seal-ace { padding: 0 0.625rem; align-items: center; display: inline-flex; gap: 0.375rem; height: 1.75rem; font-size: var(--dvj); border-radius: var(--a6d); color: var(--ncq8); transition: color .15s, border-color .15s, background-color .15s; }
.seal-ace:hover { color: var(--lxa); }
.seal-ace .crown-crown { font-size: 1.25em; }
.mark-copy .seal-ace { background: var(--gk61); border-radius: var(--eopb); }
[data-edge-strip] .seal-ace { border: var(--et14) solid var(--hsq); }
[data-edge-strip] .seal-ace:hover { border-color: rgba(61, 224, 255, 0.6); }
.list-base .seal-ace { background: var(--sib); border: var(--et14) solid rgba(255, 138, 61, 0.14); font-weight: 600; }
.stage-view { gap: 0.25rem 1.125rem; }
.stage-view .seal-ace { text-decoration-color: rgba(61, 224, 255, 0.6); text-underline-offset: 3px; text-decoration: underline; height: auto; padding: 0; }
.pill-nav .seal-ace { font: 500 11px/1 var(--zdiz); letter-spacing: 0.08em; text-transform: uppercase; padding: 0 0.5rem; border-left: 2px solid var(--xsz7); border-radius: 0; }
a[role="button"] { cursor: pointer; }
.slab-strip { display: none; }
@media (max-width: 640px) {
  .bar-front { overflow: visible; border: 0; border-radius: 0; }
  .bar-front thead { display: none; }
  .bar-front table, .bar-front tbody, .bar-front tr { display: block; width: 100%; }
  .bar-front caption { display: block; padding: 0 0 0.5rem; }
  .bar-front tr { margin: 0 0 0.625rem; border: var(--et14) solid rgba(255, 138, 61, 0.14); border-radius: var(--a6d); overflow: hidden; }
  .bar-front tbody tr > * { background: none; }
  .bar-front tbody th { display: block; white-space: normal; border-bottom: var(--et14) solid rgba(255, 138, 61, 0.14); background: color-mix(in srgb, hsl(248 55% 18%) 70%, transparent); }
  .bar-front td { display: flex; align-items: baseline; justify-content: space-between; gap: 0.875rem; white-space: normal; text-align: right; }
  .bar-front tbody tr > td:last-child { border-bottom: 0; }
  .bar-front tbody tr:last-child > th { border-bottom: var(--et14) solid rgba(255, 138, 61, 0.14); }
  .bar-front .slab-strip { font-weight: 600; max-width: 48%; text-transform: uppercase; text-align: left; flex: none; color: var(--ncq8); font-size: var(--dvj); display: block; letter-spacing: var(--s98u); }
}
.deal-strip { padding: clamp(28px, 5vw, 64px) 0; }
.front-copy { margin: 0 auto; max-width: 48.75rem; gap: 0.875rem; display: grid; }
.area-menu { font-size: clamp(32px, 4.4vw, 52px); line-height: 1.05; }
.slot-body { font-size: var(--uiu); color: var(--ncq8); }
.page-hero { font-size: var(--tvoi); color: hsl(261 46% 80%); }
.nav-top { display: grid; gap: 0.75rem; margin-top: 0.5rem; }
.nav-top h2 { font-size: var(--jvc); margin-top: 1.125rem; color: var(--lxa); }
.vip-zone { list-style: none; margin: 0.5rem 0; padding: 0; display: grid; gap: 0.625rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.vip-zone li { display: grid; gap: 0.25rem; padding: 1rem 1.125rem; border: var(--et14) solid rgba(255, 138, 61, 0.14); border-radius: var(--aj7); background: var(--sib); }
.deal-wrap { font-size: var(--dvj); text-transform: uppercase; letter-spacing: var(--s98u); color: var(--ncq8); }
.game-head { word-break: break-word; color: var(--lxa); font-weight: 600; }
.media-grid { font-size: var(--uiu); color: hsl(261 46% 80%); }
.group-lobby { gap: 0.5rem 1.125rem; margin: 0.875rem 0 0.25rem; display: flex; flex-wrap: wrap; font-size: var(--uiu); }
.group-lobby a { color: hsl(261 46% 80%); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); }
.group-lobby a:hover { color: var(--lxa); }
/*  responsive  */
[data-dot-dice] { flex-wrap: wrap; gap: 0.25rem; display: flex; }
[data-deal-box] { display: grid; place-items: center; min-width: 1.375rem; font: 700 10px/1 var(--zdiz); color: #fff; border-radius: 62.4375rem; height: 1.375rem; padding: 0 0.3125rem; }
.box-media { background: hsl(355 61% 49%); }
[data-stack-crest] { background: hsl(240 10% 12%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2); }
.grid-promo { background: hsl(145 63% 33%); }
.list-area { background: hsl(250 52% 25%); color: var(--lxa); }
.field-side { display: flex; flex-wrap: wrap; gap: 0.625rem; }
.base-club { display: inline-flex; align-items: center; gap: 0.625rem; height: 3.125rem; padding: 0 1.125rem 0 0.875rem; border-radius: 0.75rem; background: hsl(240 8% 5%); color: #fff; border: 1px solid rgba(255, 255, 255, 0.18); transition: transform var(--e9z9) cubic-bezier(0.2, 0.9, 0.3, 1); }
.base-club:hover { transform: translateY(-2px); }
.base-club .crown-crown { font-size: 1.625rem; }
.base-club span { line-height: 1.1; font-weight: 600; font-size: 0.9375rem; display: grid; }
.base-club small { font-size: 0.625rem; font-weight: 400; opacity: 0.75; }
.step-race { position: relative; display: block; flex: none; width: 14.375rem; height: 28.75rem; padding: 0.75rem; border-radius: 2.375rem; background: hsl(240 14% 5%); box-shadow: inset 0 0 0 2px hsl(240 10% 18%), 0 30px 60px -20px rgba(0, 0, 0, 0.6); }
.bonus-spin { position: absolute; top: 1.125rem; left: 50%; z-index: 2; background: hsl(240 14% 5%); transform: translateX(-50%); border-radius: 62.4375rem; width: 4.375rem; height: 1.125rem; }
.dock-dot { flex-direction: column; display: flex; background: hsl(245 62% 8%); height: 100%; padding: 2.25rem 0.625rem 0.625rem; border-radius: 1.75rem; gap: 0.5rem; overflow: hidden; }
.tile-seal { display: flex; justify-content: center; }
.tile-seal .wrap-inner { --biw: 18px; pointer-events: none; }
.nav-label { font-size: 0.5625rem; display: grid; gap: 2px; padding: 0.75rem; color: hsl(261 46% 80%); background: var(--oxj8), hsl(248 55% 18%); border-radius: 0.75rem; }
.nav-label .menu-field { font-size: 1.125rem; color: var(--xsz7); }
.meta-crown { display: grid; gap: 0.3125rem; grid-template-columns: repeat(2, 1fr); }
.meta-crown img { width: 100%; aspect-ratio: 3 / 2; border-radius: 0.375rem; object-fit: cover; }
.chip2-bonus { justify-content: space-around; border-top: 1px solid rgba(255, 138, 61, 0.14); color: var(--ncq8); font-size: 1rem; margin-top: auto; display: flex; padding: 0.5rem 0 2px; }
.chip2-bonus .crown-crown:first-child { color: var(--xsz7); }
.bar-offer { background: rgba(10, 8, 34, 0.78); border-bottom: 1px solid transparent; border-image: linear-gradient(90deg, hsl(36 100% 62%), hsl(336 100% 62%) 50%, hsl(190 100% 62%)) 1; }
[data-unit-race], .group-game { background: rgba(12, 9, 38, 0.82); border-right-color: rgba(255, 79, 139, 0.2); }
.row-deck { border-radius: 62.4375rem; font-weight: 500; padding: 0 0.875rem; }
.row-deck.side-inner { box-shadow: inset 0 0 0 1px rgba(255, 79, 139, 0.35); color: #fff; background: linear-gradient(90deg, rgba(255, 138, 61, 0.22), rgba(255, 61, 139, 0.14)); }
.row-deck.side-inner .crown-crown { color: var(--ogv); }
/*  keep in sync with the build  */
.spin-unit { font-style: italic; font-weight: 600; background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cell-feature { border-radius: 1rem; font-weight: 600; font-style: italic; }
.lead-bonus { font-weight: 600; font-style: italic; border-color: rgba(255, 79, 139, 0.3); }
.lead-bonus.side-inner { background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); border-color: transparent; color: #fff; }
.item-band.side-inner { background: rgba(255, 79, 139, 0.14); box-shadow: inset 0 -2px 0 var(--xsz7); }
.tile-line { font-style: italic; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
.tile-line.side-inner::after { background: linear-gradient(90deg, hsl(36 100% 62%), hsl(10 100% 65%) 40%, hsl(336 100% 62%) 75%, hsl(281 100% 62%)); }
[data-chip2-inner] { display: grid; gap: 0.875rem; }
[data-foot-band] {
  display: grid;
  overflow-x: auto;
  margin: 0 calc(var(--y6t) * -1); grid-auto-flow: column; scroll-padding: 0 11%; scrollbar-width: none; padding: 4px var(--y6t) 10px; grid-auto-columns: min(78%, 1000px); gap: 1rem; scroll-snap-type: x mandatory; list-style: none;
}
[data-foot-band]::-webkit-scrollbar { display: none; }
.dice-win { scroll-snap-align: center; }
[data-dice-grid] {
  position: relative; isolation: isolate; display: block; height: 26.25rem; overflow: hidden;
  border-radius: var(--aj7); border: var(--et14) solid rgba(255, 138, 61, 0.14); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04), 0 20px 40px -24px rgba(255, 79, 139, 0.45); background: hsl(248 55% 18%);
}
.head-copy { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 60% 35%; }
.edge-label { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.1) 70%); }
.head-block { gap: 0.625rem; bottom: 1.875rem; position: absolute; right: 2rem; color: #fff; justify-items: start; left: 2rem; display: grid; }
.head-block .unit-box { color: var(--ogv); }
.page-grid { position: absolute; right: 0; bottom: -0.375rem; font-size: 6rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.35); }
.dot-strip { display: block; font-size: clamp(30px, 3.6vw, 54px); max-width: 16ch; }
.block-group { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
[data-note-gold] { margin: 0; gap: 0.375rem; overflow-x: auto; list-style: none; padding: 0; scrollbar-width: none; display: flex; }
.field-group {
  display: inline-flex; align-items: center; gap: 0.5rem; height: 2.25rem; padding: 0 0.875rem; white-space: nowrap;
  border-radius: var(--eopb); border: var(--et14) solid rgba(255, 138, 61, 0.14); font-size: var(--uiu); color: var(--ncq8);
  transition: color var(--e9z9), border-color var(--e9z9), background var(--e9z9);
}
.field-group .edge-seal { font-size: 0.6875rem; color: var(--xsz7); }
.field-group.side-inner { color: var(--lxa); border-color: var(--xsz7); background: var(--v3y); }
.live-cell { display: flex; gap: 0.375rem; }
@media (max-width: 720px) {
  [data-foot-band] { grid-auto-columns: 88%; }
  [data-dice-grid] { height: 22.5rem; }
  .head-block { left: 1.25rem; right: 1.25rem; }
  [data-note-gold] { display: none; }
  .block-group { justify-content: flex-end; }
}
[data-dice-grid]:has(.strip-deck) { background: var(--oxj8), var(--k47), hsl(248 55% 18%); }
[data-dice-grid]:has(.strip-deck) .head-copy { display: none; }
[data-dice-grid]:has(.strip-deck) .head-block { top: 50%; right: 42%; bottom: auto; transform: translateY(-50%); }
[data-dice-grid]:has(.strip-deck) .page-grid { font-size: 4.5rem; right: auto; bottom: calc(100% + 6px); left: -0.25rem; }
.stage-vip { position: absolute; right: 0; width: 44%; min-height: 0; bottom: 0; z-index: 1; top: 10%; }
@media (max-width: 760px) {
  [data-dice-grid]:has(.strip-deck) .head-block { right: 1rem; top: auto; transform: none; bottom: 1.875rem; }
  [data-dice-grid]:has(.strip-deck) .page-grid { display: none; }
  .stage-vip { top: 0.625rem; width: 70%; bottom: auto; height: min(54vw, 240px); right: 0; }
}
.slab-box { display: grid; gap: 0.875rem; }
.star-foot { display: flex; border-bottom: var(--et14) solid var(--hsq); gap: clamp(16px, 2.6vw, 36px); scrollbar-width: none; overflow-x: auto; }
.star-foot::-webkit-scrollbar { display: none; }
.block-star {
  position: relative; flex: none; padding: 0.375rem 0 0.875rem; font-size: clamp(22px, 2.4vw, 34px);
  transition: color var(--e9z9); color: var(--ncq8); white-space: nowrap;
}
.block-star sup { margin-left: 0.25rem; font-size: 0.6875rem; letter-spacing: 0; vertical-align: super; font-weight: 400; color: var(--ncq8); text-transform: none; }
.block-star:hover { color: hsl(261 46% 80%); }
.block-star.side-inner { color: var(--lxa); }
.block-star.side-inner sup { color: var(--xsz7); }
.block-star.side-inner::after { right: 0; background: var(--xsz7); height: 3px; left: 0; bottom: calc(var(--et14) * -1); content: ""; position: absolute; }
.foot-frame { overflow-x: auto; display: flex; align-items: center; scrollbar-width: none; gap: 0.375rem; }
.foot-frame::-webkit-scrollbar { display: none; }
.band-gold { display: inline-flex; align-items: center; gap: 0.375rem; flex: none; margin-right: 0.25rem; font-size: var(--dvj); font-weight: 600; letter-spacing: var(--s98u); text-transform: uppercase; color: var(--ncq8); }
.band-gold .crown-crown { color: var(--xsz7); }
[data-seal-outer] { flex: none; height: 1.875rem; display: inline-flex; align-items: center; padding: 0 0.75rem; border-radius: var(--eopb); background: var(--sib); border: var(--et14) solid rgba(255, 138, 61, 0.14); font-size: 0.8125rem; color: hsl(261 46% 80%); white-space: nowrap; transition: border-color var(--e9z9), color var(--e9z9); }
[data-seal-outer]:hover { border-color: var(--xsz7); color: var(--lxa); }
.chip-meta { flex: none; width: var(--et14); height: 1.25rem; margin: 0 0.625rem; background: var(--hsq); }
.edge-win { margin: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; padding: 0; gap: 1.125rem 0.875rem; display: grid; }
@media (max-width: 900px) { .edge-win { grid-template-columns: repeat(2, minmax(0, 1fr)); } .edge-win > li:nth-child(n + 7) { display: none; } }
@media (max-width: 480px) { .edge-win { grid-template-columns: 1fr; } .edge-win > li:nth-child(n + 5) { display: none; } }
.panel-area { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 72px); padding: clamp(24px, 4vw, 52px); display: grid; }
[data-core-feature] { display: grid; align-content: center; justify-items: start; gap: 1rem; }
.race-race { font-size: clamp(30px, 3.2vw, 48px); }
.chip-chip { color: hsl(261 46% 80%); max-width: 42ch; }
.core-copy { display: grid; margin: 0; padding: 0; list-style: none; }
.page-chip2 { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 1.125rem; padding-bottom: 1.625rem; }
.page-chip2:not(:last-child)::before { bottom: 0; position: absolute; content: ""; top: 3.25rem; left: 1.5625rem; background: linear-gradient(var(--xsz7), rgba(255, 138, 61, 0.14)); width: calc(var(--et14) * 2); }
.mark-crown { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: var(--a6d); background: var(--v3y); color: var(--xsz7); font-size: var(--tvoi); border: var(--et14) solid var(--hsq); }
[data-field-set] { display: grid; gap: 0.25rem; padding-top: 0.25rem; }
[data-field-set] :is(strong, b) { font-size: var(--tvoi); }
[data-field-set] span { font-size: var(--uiu); color: hsl(261 46% 80%); }
@media (max-width: 860px) { .panel-area { grid-template-columns: 1fr; } }
[data-club-tray] { position: relative; isolation: isolate; margin: 0 calc(50% - 50vw); padding: clamp(40px, 5vw, 70px) 0; }
[data-club-tray]::before { content: ""; inset: 0; background: linear-gradient(135deg, hsl(240 18% 3%), hsl(264 22% 9%)); z-index: -1; position: absolute; }
[data-club-tray]::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--oxj8); opacity: 0.8; }
.bonus-link { margin: 0 auto; gap: 2rem; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); display: grid; align-items: center; padding-left: var(--y6t); max-width: 82.5rem; }
.chip-menu { display: grid; justify-items: start; gap: 0.875rem; color: hsl(36 17% 94%); }
.crown-item { font-size: clamp(32px, 3.4vw, 50px); }
.crown-item em { display: block; color: var(--xsz7); }
.link-copy { color: rgba(255, 255, 255, 0.66); }
.rear-tile { display: inline-flex; align-items: center; gap: 0.5rem; font-size: var(--uiu); color: rgba(255, 255, 255, 0.8); }
.frame-meta { display: flex; align-items: center; gap: 0.375rem; margin-top: 0.375rem; }
.frame-meta [data-ring-offer] { margin-left: 0.625rem; color: #fff; }
.crown-tab { display: grid; list-style: none; grid-auto-flow: column; grid-auto-columns: 230px; gap: 0.875rem; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0; padding: 4px var(--y6t) 4px 2px; overflow-x: auto; }
.crown-tab::-webkit-scrollbar { display: none; }
.crown-tab > li { scroll-snap-align: start; }
.club-tab { position: relative; display: block; aspect-ratio: 3 / 4; overflow: hidden; border-radius: var(--aj7); border: 1px solid rgba(255, 255, 255, 0.1); }
.club-tab img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; transition: transform 700ms cubic-bezier(0.2, 0.9, 0.3, 1); }
.club-tab:hover img { transform: scale(1.05); }
.club-tab::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 55%, rgba(0, 0, 0, 0.6)); }
.item-rear { position: absolute; display: grid; bottom: 0.875rem; left: 0.875rem; right: 0.875rem; color: #fff; gap: 3px; z-index: 1; }
.deck-spin { color: var(--ogv); text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.6875rem; }
.vip-inner { font-weight: 700; }
.side-feature { font-size: var(--dvj); display: inline-flex; gap: 0.3125rem; color: rgba(255, 255, 255, 0.7); align-items: center; }
[data-club-tray] .star-crown { color: #fff; }
@media (max-width: 860px) { .bonus-link { grid-template-columns: 1fr; padding-right: 0; } .chip-menu { padding-right: var(--y6t); } .crown-tab { grid-auto-columns: 180px; } }
.step-body { padding: clamp(32px, 5vw, 60px) 24px; gap: 0.75rem; overflow: hidden; justify-items: center; text-align: center; isolation: isolate; display: grid; }
.win-panel { background: radial-gradient(50% 70% at 50% 40%, var(--v3y), transparent 70%), repeating-linear-gradient(0deg, rgba(255, 138, 61, 0.1) 0 3px, transparent 3px 14px); position: absolute; inset: 0; z-index: -1; }
.zone-field { font-size: var(--jvc); color: hsl(261 46% 80%); }
[data-main-shape] { font-size: clamp(30px, 8.4vw, 108px); white-space: nowrap; line-height: 1; color: var(--xsz7); letter-spacing: -0.03em; text-shadow: 0 0 40px color-mix(in srgb, var(--xsz7) 35%, transparent); }
.ring-shape { gap: 0.375rem; display: inline-flex; font-size: var(--uiu); color: var(--ncq8); align-items: center; }
.stage-chip { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; margin: 0.625rem 0 0.875rem; padding: 0; list-style: none; }
.stage-chip li { display: grid; gap: 0.375rem; padding: 8px clamp(18px, 3vw, 40px); }
.stage-chip li + li { border-left: var(--et14) solid var(--hsq); }
.seal-band { font-size: clamp(20px, 2.2vw, 30px); color: var(--lxa); }
@media (max-width: 560px) { .stage-chip li + li { border-left: 0; } }
.crown-mark { margin: 0; overflow: hidden; padding: 0.375rem; list-style: none; }
.core-strip { padding: 0.75rem 1rem 0.75rem 0.75rem; display: grid; grid-template-columns: 76px minmax(0, 1fr) 150px 150px auto; gap: 1.25rem; align-items: center; border-radius: var(--a6d); }
.core-strip:nth-child(odd) { background: hsl(248 55% 18%); }
.core-strip img { border-radius: var(--a6d); object-fit: cover; height: 4.75rem; width: 4.75rem; }
.menu-offer { display: grid; gap: 0.25rem; min-width: 0; }
.game-offer { font-size: var(--tvoi); }
.deck-club { font-size: var(--uiu); color: hsl(261 46% 80%); }
.cell-edge .body-crown { font-size: var(--tvoi); }
.frame-band { align-items: center; color: var(--ncq8); gap: 0.375rem; font-size: var(--dvj); display: inline-flex; }
@media (max-width: 1000px) { .core-strip { grid-template-columns: 64px minmax(0, 1fr) auto; } .cell-edge, .frame-band { display: none; } .core-strip img { width: 4rem; height: 4rem; } }
.set-tray { margin: 0; gap: 1rem 0.875rem; list-style: none; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 0; display: grid; }
.body-unit { display: grid; gap: 0.625rem; }
.win-rear {
  position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden;
  border-radius: var(--g9vy); border: var(--et14) solid rgba(255, 138, 61, 0.14); background: hsl(248 55% 18%); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04), 0 20px 40px -24px rgba(255, 79, 139, 0.45);
}
.win-rear img { width: 100%; object-fit: cover; transition: transform 700ms cubic-bezier(0.2, 0.9, 0.3, 1), filter var(--e9z9); object-position: 50% 30%; height: 100%; }
.vip-label { position: absolute; top: 0.625rem; left: 0.625rem; }
.step-cell {
  background: var(--xsz7);
  transition: opacity var(--e9z9), transform var(--e9z9) cubic-bezier(0.2, 0.9, 0.3, 1); left: 50%;
  position: absolute; display: grid; place-items: center; width: 3.375rem; top: 50%; color: var(--et4); border-radius: 50%; transform: translate(-50%, -50%) scale(0.7); opacity: 0; height: 3.375rem; font-size: 1.375rem;
}
.body-unit:hover .win-rear img { transform: scale(1.06); filter: brightness(0.7); }
.body-unit:hover .step-cell { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.core-card { display: grid; gap: 2px; }
.slot-panel { font-weight: 600; font-size: var(--vl17); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zone-hero { display: flex; font-size: var(--dvj); justify-content: space-between; color: var(--ncq8); gap: 0.5rem; }
.unit-page { color: hsl(190 100% 62%); }
@media (max-width: 1080px) { .set-tray { grid-template-columns: repeat(3, minmax(0, 1fr)); } .set-tray > li:nth-child(n + 7) { display: none; } }
@media (max-width: 640px) { .set-tray { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.chip2-zone { grid-template-columns: minmax(240px, 0.8fr) minmax(0, 2fr); display: grid; gap: clamp(28px, 5vw, 72px); }
.race-band { position: sticky; top: calc(70px + 28px); align-self: start; display: grid; gap: 1rem; }
.copy-top { font-size: clamp(28px, 2.6vw, 40px); }
.stack-bar { font-size: var(--dvj); color: var(--ncq8); letter-spacing: 0.04em; }
.pane-edge { display: grid; min-width: 0; gap: 1.5rem; justify-items: start; }
.pane-edge > * { max-width: 100%; }
.base-page { font-size: var(--tvoi); line-height: 1.6; color: var(--lxa); }
.item-jackpot {
  mask-image: linear-gradient(#000 60%, transparent); max-height: 35rem;
  justify-self: stretch; width: 100%; overflow: hidden; min-width: 0;
}
.copy-dice:checked ~ .item-jackpot { max-height: none; mask-image: none; }
.page-strip { border-top: var(--et14) solid rgba(255, 138, 61, 0.14);
  padding: 1.625rem 0; gap: 0.75rem 2.5rem; line-height: 1.7; grid-template-columns: minmax(160px, 0.7fr) minmax(0, 2fr);
  display: grid;
  font-size: var(--uiu);
}
.note-wrap { font-size: var(--vl17); font-weight: 600; line-height: 1.35; color: var(--lxa); }
.row-chip2, .copy-dice:checked ~ .win-core .crest-chip2 { display: none; }
.copy-dice:checked ~ .win-core .row-chip2 { display: inline; }
.copy-dice:focus-visible ~ .win-core { outline: 2px solid var(--xsz7); outline-offset: 3px; }
@media (max-width: 1080px) {
  .chip2-zone { grid-template-columns: 1fr; }
  .race-band { position: static; }
}
@media (max-width: 640px) { .page-strip { grid-template-columns: 1fr; } }
.crown-group { display: grid; grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.4fr); gap: clamp(28px, 5vw, 72px); }
.feature-edge { position: sticky; top: calc(70px + 28px); align-self: start; display: grid; justify-items: start; gap: 0.875rem; }
.menu-line { font-size: clamp(30px, 3vw, 46px); }
.lead-hero { color: hsl(261 46% 80%); }
.line-menu { grid-template-columns: 44px minmax(0, 1fr); align-items: center; padding: 1rem; display: grid; width: 100%; margin-top: 0.5rem; gap: 0.75rem; }
.line-menu .box-vip { grid-column: 1 / -1; }
.line-menu :is(strong, b) { display: block; font-size: var(--uiu); }
.race-reel { place-items: center; color: var(--et4); font-size: 1.25rem; display: grid; border-radius: 50%; width: 2.75rem; height: 2.75rem; background: var(--xsz7); }
.unit-flag { display: inline-flex; align-items: center; gap: 0.375rem; font-size: var(--dvj); color: var(--ncq8); }
.chip2-card { display: grid; gap: 0.625rem; }
.seal-page { overflow: hidden; }
.seal-page summary { gap: 0.75rem; grid-template-columns: 44px minmax(0, 1fr) 32px; cursor: pointer; align-items: center; list-style: none;
  display: grid;
  padding: 1.125rem 1.25rem;
}
.seal-page summary::-webkit-details-marker { display: none; }
[data-mark-field] { font-size: var(--uiu); color: var(--xsz7); }
[data-stage-dice] { font-size: var(--tvoi); font-weight: 600; }
.field-grid { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: hsl(248 55% 18%); transition: transform var(--e9z9) cubic-bezier(0.2, 0.9, 0.3, 1), background var(--e9z9); }
.seal-page[open] .field-grid { transform: rotate(45deg); background: var(--xsz7); color: var(--et4); }
.seal-page p { padding: 0 4rem 1.375rem 4.75rem; color: hsl(261 46% 80%); }
@media (max-width: 900px) {
  .crown-group { grid-template-columns: 1fr; }
  .feature-edge { position: static; }
  .seal-page p { padding: 0 1.25rem 1.25rem; }
}
.lobby-copy { overflow: hidden; border-top: var(--et14) solid rgba(255, 138, 61, 0.14); }
.chip-win { gap: 2rem; display: grid; padding: 48px var(--y6t) 24px; margin: 0 auto; max-width: 90rem; }
.zone-bar { display: grid; grid-template-columns: minmax(0, 1.7fr) repeat(4, minmax(0, 1fr)); gap: 2rem; }
/*  temp  */
.view-club { min-width: 0; display: grid; align-content: start; gap: 0.625rem; padding: 1.375rem; font-size: var(--uiu); color: hsl(261 46% 80%); }
.cell-rear { font-size: 1.625rem; color: var(--lxa); }
[data-body-nav] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.375rem; }
[data-label-outer] { flex: 1 1 180px; min-width: 0; }
[data-body-nav] .box-vip { flex: 0 0 auto; }
.field-hero { font-size: var(--dvj); text-transform: uppercase; letter-spacing: var(--s98u); margin-bottom: 0.75rem; color: var(--ncq8); font-weight: 600; }
.star-rear ul { display: grid; gap: 0.5625rem; font-size: var(--uiu); color: hsl(261 46% 80%); }
.star-rear a:hover { color: var(--xsz7); }
.mark-label { display: flex; flex-wrap: wrap; align-items: center; gap: 1.125rem 1.75rem; padding: 1.25rem 0; border-top: var(--et14) solid rgba(255, 138, 61, 0.14); border-bottom: var(--et14) solid rgba(255, 138, 61, 0.14); }
.deck-slab [data-spin-dot] svg { height: 1.25rem; }
.deck-slab { color: var(--ncq8); text-transform: uppercase; letter-spacing: 0.08em; font: 500 var(--dvj)/1 var(--zdiz); margin-right: auto; gap: 0.625rem 1.125rem; align-items: center; flex-wrap: wrap; display: flex; }
.row-win { display: grid; place-items: center; width: 2.625rem; height: 2.625rem; border-radius: 50%; border: calc(var(--et14) * 2) solid var(--hp2c); color: var(--hp2c); font-size: 0.8125rem; }
.deck-tab { font-size: var(--dvj); line-height: 1.7; color: var(--ncq8); max-width: 110ch; }
@media (max-width: 1320px) { .zone-bar { grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); } .view-club { grid-row: span 2; } }
@media (max-width: 1180px) { .zone-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .view-club { grid-column: 1 / -1; grid-row: auto; } }
@media (max-width: 520px) { [data-body-nav] { flex-direction: column; } }
.mark-label [data-dot-tile] { flex-basis: 100%; }
:root { --ogv: hsl(0 44% 52%); --xsz7: hsl(0 64% 41%); --et4: hsl(0 0% 100%); --v3y: rgba(171, 38, 38, 0.14); }
:root { --ogv: hsl(0 44% 52%); --xsz7: hsl(0 64% 41%); --et4: hsl(0 0% 100%); --v3y: rgba(171, 38, 38, 0.14); }
:root { --tvoi: 17.9px; --vl17: 15.0px; --uiu: 13.2px; --dvj: 11.3px; --et14: 2px; --umua: 0px; }

svg.crown-crown{width:1em;fill:currentColor;height:1em;vertical-align:-0.125em;display:inline-block}