.stepPanel {
  position: absolute; height: 210px; width: 210px; z-index: -1; object-fit: cover;
  border-radius: var(--th-wrap-bq); box-shadow: 6px 6px 0 0 #3A1648;
}
.paneFront { left: 5%; top: 18%; transform: rotate(calc(-4deg - var(--th-list-84) * 2)); }
.offerList { transform: rotate(calc(5deg + var(--th-list-84) * 2)); bottom: 6%; right: 2%; }
.menuBox { margin: 0 auto; justify-items: center; display: grid; max-width: 720px; text-align: center; z-index: 1; position: relative; gap: 20px; }
.gridZone { font-size: clamp(44px, 6vw, 96px); }
.chipDeal { max-width: 48ch; color: var(--th-row-kk); font-size: 19px; }
.markCard { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.itemFrameTop { margin: 14px 0 0;
  width: 100%; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none;
  display: grid; padding: 0;
}
.itemFrameTop li {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border-radius: var(--th-crest-kc); border: var(--th-feature) solid var(--th-seal);
  background: var(--th-side-1h);
  font-size: 14px; text-align: left;
}
.ringHero { display: grid; place-items: center; flex: none; font-size: 12px; width: 26px; height: 26px; border-radius: 50%; color: var(--th-cell-v2); background: var(--th-slot); }
.shapeWrapCopy { font-size: 12px; color: var(--th-rear-r1); }
@media (max-width: 1400px) { .stepPanel { width: 175px; height: 175px; } }
@media (max-width: 1100px) { .stepPanel { width: 130px; height: 130px; opacity: 0.6; } .paneFront { left: -30px; } .offerList { right: -30px; } }
@media (max-width: 700px) {
  .stepPanel { display: none; }
  .itemFrameTop { grid-template-columns: 1fr; }
}
.crestLabelDice { padding: clamp(24px, 3vw, 40px) clamp(20px, 3vw, 40px) 0;
  gap: clamp(12px, 2vw, 32px); align-items: center; grid-template-columns: minmax(320px, 46%) minmax(0, 1fr);
  display: grid;
}
.crestLabelDice .stepPanel { display: none; }
.crestLabelDice .menuBox { align-content: center;
  margin: 0;
  justify-items: start; padding: 0 0 clamp(24px, 3vw, 40px); max-width: none; text-align: left; gap: 16px;
}
.crestLabelDice .gridZone { font-size: clamp(34px, 3.1vw, 56px); }
.crestLabelDice .chipDeal { font-size: var(--th-hero); max-width: 44ch; }
.crestLabelDice .markCard { justify-content: flex-start; }
.crestLabelDice .itemFrameTop { margin-top: 4px; }
.crestLabelDice .itemFrameTop li { padding: 10px 12px; }
.coreBandLabel { --th-win-kn: 440px; align-self: stretch; }
@media (max-width: 820px) {
  .crestLabelDice { grid-template-columns: minmax(0, 1fr); justify-items: center; min-height: 0; padding-bottom: 0; }
  .crestLabelDice .menuBox { justify-items: center; text-align: center; }
  .crestLabelDice .markCard { justify-content: center; }
  .coreBandLabel { margin-bottom: 18px; --th-bonus-ak: min(62vw, 270px); width: min(74vw, 320px); }
}
.dealSeal {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px 14px;
}
.liveSet {
  position: relative; grid-column: span 2; grid-row: span 2;
  overflow: hidden; border-radius: var(--th-label-3z);
  border: var(--th-feature) solid var(--th-seal);
  box-shadow: var(--th-slab);
}
.liveSet img { height: 100%; width: 100%; transition: transform 700ms cubic-bezier(0.34, 1.56, 0.64, 1); object-fit: cover; inset: 0; position: absolute; }
.liveSet:hover img { transform: scale(1.04); }
.liveSet::after { background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, 0.6)); inset: 0; position: absolute; content: ""; }
.dockTableBlock { right: 20px; bottom: 20px; z-index: 1; left: 20px;
  position: absolute;
  display: grid; gap: 10px; justify-items: start;
}
.sealUnit { font-size: clamp(26px, 2.4vw, 38px); color: #fff; }
.winFoot { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: rgba(255, 255, 255, 0.75); }
.areaInnerRear{justify-items:center;display:grid;gap:12px;margin:28px auto 0;width:min(320px,100%)}
.stripPane{font-size:12px;color:var(--th-rear-r1)}
.stripPane .frontLobby{color:#3A1648}
.fieldCell{width:100%;overflow:hidden;height:4px;background:var(--th-seal);border-radius:var(--th-crest-kc)}
.fieldCell span{background:var(--th-slot);height:100%;display:block}
@media (max-width: 1180px) {
  .dealSeal { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dealSeal > .dice:nth-of-type(n + 6) { display: none; }
}
@media (max-width: 720px) {
  .dealSeal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .liveSet { grid-row: auto; aspect-ratio: 3 / 4; }
  .dealSeal > .dice:nth-of-type(n + 6) { display: grid; }
}
.crownGrid {
  --th-box-lm: 14px;
  position: relative;
  display: grid; grid-template-columns: 120px minmax(0, 1fr) auto 220px; align-items: center; gap: 28px;
  padding: 18px 0 18px 18px;
  background: var(--th-side-1h);
  border: var(--th-feature) solid #3A1648;
  border-radius: var(--th-label-3z);
}
.cellBox { object-fit: cover; height: 120px; width: 120px; border-radius: var(--th-wrap-bq); }
.noteUnit { display: grid; gap: 6px; min-width: 0; }
.itemNav { font-size: clamp(22px, 2vw, 30px); }
.areaBlockSlab { font-size: 14px; color: var(--th-row-kk); }
.navLead { display: flex; gap: 6px; margin: 0; }
.navLead dd { background: #fff1f6;
  border-radius: var(--th-crest-kc);
  display: grid; justify-items: center; margin: 0; min-width: 58px; padding: 10px 6px;
}
.navLead .frontLobby { font-size: 26px; line-height: 1; color: var(--th-club); }
.navLead small { font-size: 10px; color: var(--th-rear-r1); text-transform: uppercase; letter-spacing: 0.1em; }
.winTray { gap: 6px;
  margin: -18px 0; padding: 18px;
  display: grid; justify-items: center;
  background: var(--th-nav-1s); align-content: center;
  border-radius: 0 var(--th-label-3z) var(--th-label-3z) 0; align-self: stretch;
  position: relative;
  border-left: 2px dashed #3A1648;
}
.winTray::before, .winTray::after { left: calc(var(--th-box-lm) * -1 - 1px); position: absolute;
  width: calc(var(--th-box-lm) * 2);
  content: ""; height: calc(var(--th-box-lm) * 2);
  background: #fff1f6; border-radius: 50%;
}
.winTray::before { top: calc(var(--th-box-lm) * -1 - var(--th-feature)); }
.winTray::after { bottom: calc(var(--th-box-lm) * -1 - var(--th-feature)); }
.crestSlabDot { font-size: 24px; }
@media (max-width: 1180px) {
  .crownGrid { grid-template-columns: 100px minmax(0, 1fr) 200px; }
  .cellBox { width: 100px; height: 100px; }
  .navLead { grid-column: 2; }
  .winTray { grid-column: 3; grid-row: 1 / span 2; }
}
@media (max-width: 700px) {
  .crownGrid { gap: 16px; padding: 18px; grid-template-columns: 1fr; }
  .cellBox, .navLead, .winTray { grid-column: auto; grid-row: auto; }
  .winTray { border-top: 2px dashed #3A1648; margin: 0 -18px -18px; border-left: 0; border-radius: 0 0 var(--th-label-3z) var(--th-label-3z); }
  .winTray::before, .winTray::after { display: none; }
}
.cellFront .zoneStep { --th-tab-31: clamp(200px, calc((100% - 14px * 4) / 5), 300px); }
@media (max-width: 720px) { .cellFront .zoneStep { --th-tab-31: 64vw; } }
.navBody { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mediaLeadRing { display: grid; align-items: center; overflow: hidden; isolation: isolate; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); min-height: 280px; }
.mediaLeadRing::before { content: ""; background: radial-gradient(50% 70% at 80% 50%, rgba(255, 207, 63, 0.45), transparent 70%); inset: 0; z-index: -1; position: absolute; }
.raceStripHead::before { background: repeating-linear-gradient(-45deg, rgba(255, 207, 63, 0.25) 0 14px, transparent 14px 28px); opacity: 0.8; }
.paneCrest { display: grid; justify-items: start; gap: 10px; padding: 28px 0 28px 28px; }
.dockUnitInner { font-size: clamp(24px, 2.2vw, 34px); }
.promoFootPane { font-size: 14px; color: var(--th-row-kk); }
.jackpotLineOuter { gap: 6px; display: inline-flex; align-items: center; color: var(--th-rear-r1); font-size: 12px; }
.railGrid {
  justify-self: end; width: 118%; max-width: none; aspect-ratio: 1; object-fit: cover;
  margin-right: -18%;
  border-radius: 50% 0 0 50%;
  box-shadow: 6px 6px 0 0 #3A1648;
}
@media (max-width: 1080px) { .navBody { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .mediaLeadRing { grid-template-columns: 1fr; }
  .railGrid { order: -1; margin: 0; border-radius: 0; aspect-ratio: 16 / 9; justify-self: stretch; width: 100%; }
  .paneCrest { padding: 20px; }
}
.bonusAreaGame { gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); display: grid; padding: 0; margin: 0; list-style: none; }
.liveZoneFrame { display: grid; gap: 12px; padding: 16px; transition: transform var(--th-lobby-lp) cubic-bezier(0.34, 1.56, 0.64, 1), border-color var(--th-lobby-lp); }
.liveZoneFrame:hover { transform: translateY(calc(var(--th-spin) * -1)); border-color: var(--th-strip); }
.linkNavBar { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.clubZone { width: 130px; height: 40px; object-position: left center; }
.boxMeta { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--th-rear-r1); border: var(--th-feature) solid var(--th-seal); transition: background var(--th-lobby-lp), color var(--th-lobby-lp); }
.liveZoneFrame:hover .boxMeta { border-color: var(--th-slot); color: var(--th-cell-v2); background: var(--th-slot); }
.fieldDeal { font-size: 14px; color: var(--th-row-kk); }
.fieldDeal .frontLobby { color: #3A1648; }
.starMainCell { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.starMainCell img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: calc(var(--th-crest-kc) * 0.6); }
@media (max-width: 1180px) { .bonusAreaGame { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .bonusAreaGame { grid-template-columns: 1fr; } }
.tileWrap { list-style: none; padding: 0; margin: 0; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); display: grid; }
.cardLobby { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 16px; padding: 12px; overflow: hidden; }
.cardLobby.tileJackpot { background: radial-gradient(50% 70% at 80% 50%, rgba(255, 207, 63, 0.45), transparent 70%), var(--th-side-1h); border-color: var(--th-slot); }
.wrapStageHead { width: 96px; height: 96px; object-fit: cover; border-radius: var(--th-crest-kc); }
.topTop { min-width: 0; gap: 4px; align-content: center; display: grid; }
.paneMain { font-size: 12px; color: var(--th-rear-r1); }
/*  tokens  */
.ringBase { font-size: 34px; color: var(--th-slot); }
.areaSlabStrip { font-size: var(--th-hero); color: #3A1648; }
.stripZone { color: var(--th-rear-r1); font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 1280px) { .tileWrap { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .tileWrap { grid-template-columns: 1fr; } }
.stepHead { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); display: grid; gap: 14px; }
.chip2Bar {
  padding: 32px; gap: 20px; align-items: center; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  display: grid; overflow: hidden;
}
.slotBar { gap: 14px; justify-items: start; display: grid; }
.tableStack { font-size: clamp(32px, 3vw, 48px); }
.chip2Frame { border-radius: var(--th-wrap-bq); aspect-ratio: 1; width: 100%; object-fit: cover; transform: rotate(var(--th-list-84)); }
.outerOuterPill { font-size: 14px; color: var(--th-row-kk); }
.panelList{display:grid;gap:14px}
.baseCrownLobby{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;gap:18px;padding:12px 18px 12px 12px;transition:transform var(--th-lobby-lp) cubic-bezier(0.34, 1.56, 0.64, 1),box-shadow var(--th-lobby-lp),border-color var(--th-lobby-lp)}
.baseCrownLobby:hover{transform:translateX(4px);border-color:var(--th-strip)}
.baseCrownLobby img{width:110px;height:110px;border-radius:var(--th-crest-kc);object-fit:cover}
.menuChip2{display:grid;gap:6px}
.featureRing{font-size:var(--th-lobby)}
.bodyWrapLine{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--th-slot)}
@media (max-width: 1180px) { .stepHead { grid-template-columns: 1fr; } }