.winPromo { max-width: 44ch; color: var(--tray-ring); font-size: var(--club-win); }
.headCrestHero { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 6px; }
.boxOuterUnit { font-size: var(--media-zone); color: var(--lead-cell); }
.markBase { justify-self: center; width: min(100%, 340px); aspect-ratio: 1; object-fit: cover; border-radius: var(--dot-seal); box-shadow: var(--side-deal); transform: rotate(calc(var(--promo-table) * -1)); }
.itemNote { bottom: 22px; gap: 14px; align-items: center; left: 50%; display: flex; position: absolute; transform: translateX(-50%); }
.blockSlab { display: flex; gap: 8px; }
.deckCard { width: 10px; height: 10px; border-radius: 999px; background: var(--tab-seal); transition: width var(--frame-set) var(--link-spin), background var(--frame-set); }
.deckCard.dealCard { width: 34px; background: var(--chip2-promo); }
@media (max-width: 800px) { .sideMedia { grid-template-columns: 1fr; min-height: 0; padding: 28px 22px 80px; }
  .markBase { order: -1; width: 170px; }
  .sideMedia::before { background: color-mix(in srgb, var(--unit-main) 70%, transparent); } }
.clubMainField { --gold-base: 330px; width: min(100%, 400px); }
@media (max-width: 800px) { .clubMainField { order: -1; justify-self: start; width: min(78vw, 330px); --deck-top: min(66vw, 290px); } }
/*  header  */
.sideGroup { display: grid; gap: 14px; }
.setNav { display: flex; border-bottom: var(--set-media) solid var(--tab-seal); scrollbar-width: none; gap: clamp(16px, 2.6vw, 36px); overflow-x: auto; }
.setNav::-webkit-scrollbar { display: none; }
/*  utilities  */
.zoneLink { transition: color var(--frame-set); white-space: nowrap; position: relative; font-size: clamp(22px, 2.4vw, 34px); flex: none; color: var(--lead-cell); padding: 6px 0 14px }
.zoneLink sup { font-size: 11px; vertical-align: super; margin-left: 4px; color: var(--lead-cell); text-transform: none; letter-spacing: 0; font-weight: 400; }
.zoneLink:hover { color: var(--tray-ring); }
.zoneLink.dealCard { color: var(--pane-side); }
.zoneLink.dealCard sup { color: var(--chip2-promo); }
.zoneLink.dealCard::after { content: ""; right: 0; background: var(--chip2-promo); height: 3px; bottom: calc(var(--set-media) * -1); position: absolute; left: 0; }
.dotLabelLobby { display: flex; overflow-x: auto; align-items: center; scrollbar-width: none; gap: 6px; }
.dotLabelLobby::-webkit-scrollbar { display: none; }
.outerPillGold { flex: none; gap: 6px; letter-spacing: var(--list-stage); font-weight: 600; align-items: center; color: var(--lead-cell); margin-right: 4px; font-size: var(--media-zone); text-transform: uppercase; display: inline-flex; }
.outerPillGold .unitTab { color: var(--chip2-promo); }
.bonusOffer { flex: none; height: 30px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: var(--item-box); background: var(--unit-main); border: var(--set-media) solid var(--bar-link); font-size: 13px; color: var(--tray-ring); white-space: nowrap; transition: border-color var(--frame-set), color var(--frame-set); }
.bonusOffer:hover { border-color: var(--chip2-promo); color: var(--pane-side); }
.liveAce { margin: 0 10px; height: 20px; background: var(--tab-seal); width: var(--set-media); flex: none; }
.gameSpin { gap: clamp(24px, 4vw, 60px); align-items: center; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); overflow: hidden; display: grid; padding: clamp(24px, 4vw, 48px) clamp(24px, 4vw, 60px) 0; isolation: isolate; }
.gameSpin::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--shape-main); }
.sideBar { align-self: end; display: flex; justify-content: center; }
.sideBar .stackRear { margin-bottom: -60px; transform: rotate(calc(var(--promo-table) * -2)); }
.liveStarDeal { padding-bottom: clamp(24px, 4vw, 48px); gap: 14px; justify-items: start; display: grid; }
.linkJackpot { font-size: clamp(30px, 3.2vw, 48px); }
.menuCopy { color: var(--tray-ring); max-width: 46ch; }
.coreGame { display: grid; gap: 8px; margin: 4px 0 8px; }
.coreGame li { display: flex; align-items: center; gap: 10px; font-size: var(--area-tab); }
.coreGame .unitTab { color: var(--chip2-promo); }
@media (max-width: 860px) { .gameSpin { grid-template-columns: 1fr; padding-top: 32px; } .sideBar { order: 2; } .liveStarDeal { padding-bottom: 0; } }
.cardCell { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; }
.dealFeature { padding: 0; filter: drop-shadow(0 12px 18px rgba(0, 0, 0, 0.18)); display: grid; margin: 0; list-style: none; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.crestGridDeal { gap: 12px; margin-left: calc(var(--win-flag) * -1 + 4px); align-items: center; clip-path: polygon(0 0, calc(100% - var(--win-flag)) 0, 100% 50%, calc(100% - var(--win-flag)) 100%, 0 100%, var(--win-flag) 50%); grid-template-columns: 40px minmax(0, 1fr); padding: 16px 18px 16px calc(var(--win-flag) + 20px); min-height: 116px; display: grid; background: var(--slot-side); --win-flag: 26px }
.frameZoneDeck { clip-path: polygon(0 0, calc(100% - var(--win-flag)) 0, 100% 50%, calc(100% - var(--win-flag)) 100%, 0 100%); border-radius: var(--step-hero) 0 0 var(--step-hero); padding-left: 20px; margin-left: 0; }
.unitBonus { background: var(--frame-note); }
.tablePageRow { background: color-mix(in srgb, var(--chip2-promo) 22%, var(--slot-side)); }
.tablePageRow .frontFront, .tablePageRow .zoneJackpot { color: var(--pane-side); opacity: 0.85; }
.stripRow { background: var(--chip2-promo); color: var(--deck-ace); }
.stripRow .frontFront, .stripRow .zoneJackpot { color: inherit; opacity: 0.8; }
.areaDock { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--line-row); color: var(--chip2-promo); font-size: 20px; }
.bonusHead { display: grid; gap: 2px; min-width: 0; }
.zoneJackpot { font-size: 11px; letter-spacing: var(--list-stage); text-transform: uppercase; color: var(--lead-cell); }
.frontFront { font-size: 12px; color: var(--tray-ring); }
@media (max-width: 1100px) { .cardCell { grid-template-columns: 1fr; } .liveTab { justify-self: center; } }
@media (max-width: 760px) { .dealFeature { gap: 6px; filter: none; grid-template-columns: 1fr; }
  .crestGridDeal, .frameZoneDeck { border-radius: var(--seal-front); padding: 14px 18px; margin-left: 0; min-height: 0; clip-path: none; } }
.itemCrown { grid-template-rows: repeat(3, auto); display: grid; margin: 0; padding: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; column-gap: 0; grid-auto-flow: column; }
.stackBlockMeta { display: grid; grid-template-columns: 30px 56px minmax(0, 1fr) auto 36px; align-items: center; gap: 12px; padding: 10px 14px; border-radius: var(--seal-front); transition: background var(--frame-set); }
.stackBlockMeta:hover { background: var(--slot-side); }
.railMarkLabel { font-size: var(--club-win); color: var(--lead-cell); }
.stackBlockMeta:nth-child(-n + 3) .railMarkLabel { color: var(--chip2-promo); }
.stackBlockMeta img { width: 60px; height: 60px; object-fit: cover; border-radius: calc(var(--seal-front) * 0.6); }
.dotFrameStack { display: grid; gap: 2px; min-width: 0; }
.labelWin { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.promoMark { font-size: var(--media-zone); color: var(--lead-cell); }
.viewClubPill { display: grid; color: var(--lead-cell); justify-items: end; gap: 2px; font-size: 11px; }
.viewClubPill .shapeUnit { font-size: var(--area-tab); color: var(--copy-hero); }
.reelSideTray { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: var(--set-media) solid var(--tab-seal); color: var(--tray-ring); transition: background var(--frame-set), color var(--frame-set), border-color var(--frame-set); }
.stackBlockMeta:hover .reelSideTray { color: var(--deck-ace); border-color: var(--chip2-promo); background: var(--chip2-promo); }
@media (max-width: 1180px) { .itemCrown { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; grid-auto-flow: row; } }
@media (max-width: 700px) { .itemCrown { grid-template-columns: 1fr; } .viewClubPill { display: none; } .stackBlockMeta { grid-template-columns: 26px 52px minmax(0, 1fr) 36px; } .stackBlockMeta img { width: 52px; height: 52px; } }
.boxChip { display: grid; grid-template-columns: minmax(0, 3fr) minmax(220px, 1fr); gap: 14px; }
.tabList { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.stepSlot { display: grid; gap: 8px; padding: 14px 16px; }
.labelVip .chipInner svg { height: 26px; color: var(--pane-side); }
.labelVip { border-bottom: var(--set-media) solid var(--bar-link); padding-bottom: 8px; text-transform: var(--body-set); font: 700 var(--copy-reel)/1.2 var(--front-list); gap: 10px; align-items: center; display: flex; }
.clubFoot { font-size: var(--area-tab); gap: 8px; display: flex; justify-content: space-between; align-items: baseline; }
.bonusSlotPane { display: grid; padding: 22px; align-content: center; gap: 10px; background: var(--shape-main), var(--unit-main); }
.lineCell { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--chip2-promo); color: var(--deck-ace); font-size: 22px; }
.bonusSlotPane strong { font-size: var(--pill-nav); }
.bonusSlotPane p { font-size: var(--area-tab); color: var(--tray-ring); }
@media (max-width: 1080px) { .boxChip { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .tabList { grid-template-columns: 1fr 1fr; } }
.lobbySide { justify-items: center; padding: clamp(32px, 5vw, 60px) 24px; isolation: isolate; text-align: center; display: grid; overflow: hidden; gap: 12px; }
.topTile { position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 70% at 50% 40%, var(--nav-line), transparent 70%), var(--stack-reel); }
.bandRaceFront { font-size: var(--pill-nav); color: var(--tray-ring); }
.raceStarRow { letter-spacing: -0.03em; line-height: 1; text-shadow: 0 0 40px color-mix(in srgb, var(--chip2-promo) 35%, transparent); color: var(--chip2-promo); white-space: nowrap; font-size: clamp(30px, 8.4vw, 108px); }
.mainMain { display: inline-flex; align-items: center; gap: 6px; font-size: var(--area-tab); color: var(--lead-cell); }
.slotLine { gap: 0; justify-content: center; flex-wrap: wrap; padding: 0; display: flex; list-style: none; margin: 10px 0 14px; }
.slotLine li { display: grid; gap: 6px; padding: 8px clamp(18px, 3vw, 40px); }
.slotLine li + li { border-left: var(--set-media) solid var(--tab-seal); }
.clubSlab { font-size: clamp(20px, 2.2vw, 30px); color: var(--pane-side); }
@media (max-width: 560px) { .slotLine li + li { border-left: 0; } }
.sealFeature { margin: 0; overflow: hidden; padding: 6px; list-style: none; }
.mainStack { display: grid; grid-template-columns: 76px minmax(0, 1fr) 150px 150px auto; padding: 12px 16px 12px 12px; align-items: center; border-radius: var(--seal-front); gap: 20px; }
.mainStack:nth-child(odd) { background: var(--slot-side); }
.mainStack img { border-radius: var(--seal-front); object-fit: cover; height: 76px; width: 76px; }
.lobbyTop { display: grid; gap: 4px; min-width: 0; }
.areaFrameSlot { font-size: var(--club-win); }
.slotStageWin { font-size: var(--area-tab); color: var(--tray-ring); }
.slotStage .markFoot { font-size: var(--club-win); }
.stepPage { display: inline-flex; align-items: center; gap: 6px; font-size: var(--media-zone); color: var(--lead-cell); }
@media (max-width: 1000px) { .mainStack { grid-template-columns: 64px minmax(0, 1fr) auto; } .slotStage, .stepPage { display: none; } .mainStack img { width: 64px; height: 64px; } }
.trayItem { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.mainDotCell { display: grid; overflow: hidden; transition: transform var(--frame-set) var(--link-spin), box-shadow var(--frame-set); }
.mainDotCell:hover { transform: translateY(calc(var(--note-race) * -1)); box-shadow: var(--race-offer); }
.dealTopVip { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.dealTopVip img { width: 100%; object-position: 50% 12%; transition: transform 700ms var(--link-spin); height: 100%; object-fit: cover; }
.mainDotCell:hover .dealTopVip img { transform: scale(1.05); }
.outerDiceView, .stageLobby { height: 24px; gap: 6px; font-weight: 600; padding: 0 9px; align-items: center; display: inline-flex; top: 10px; backdrop-filter: blur(6px); font-size: 11px; border-radius: 999px; background: rgba(0, 0, 0, 0.6); color: #fff; position: absolute; }
.outerDiceView { left: 10px; text-transform: uppercase; letter-spacing: 0.08em; }
.stageLobby { right: 10px; }
.topGame { display: grid; gap: 10px; padding: 14px 16px 16px; }
.cardWin { font-weight: 700; font-size: var(--copy-reel); }
.leadHero { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: var(--area-tab); }
@media (max-width: 1080px) { .trayItem { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .trayItem { grid-template-columns: 1fr; } }
.blockBox { list-style: none; grid-template-columns: repeat(4, minmax(0, 1fr)); display: grid; margin: 0; gap: 16px 14px; padding: 0; }
.goldPromo { display: grid; gap: 10px; }
.slabReel { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--dot-seal); border: var(--set-media) solid var(--bar-link); background: var(--slot-side); box-shadow: var(--jackpot-item) }
.slabReel img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; transition: transform 700ms var(--link-spin), filter var(--frame-set); }
.rowMediaView { left: 10px; top: 10px; position: absolute; }
.zoneCrestCell { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--chip2-promo); color: var(--deck-ace); font-size: 22px; opacity: 0; transform: translate(-50%, -50%) scale(0.7); transition: opacity var(--frame-set), transform var(--frame-set) var(--link-spin) }
.goldPromo:hover .slabReel img { transform: scale(1.06); filter: brightness(0.7); }
.goldPromo:hover .zoneCrestCell { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.crownBoxFrame { display: grid; gap: 2px; }
.metaAce { font-weight: 600; font-size: var(--copy-reel); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rearCrestTray { display: flex; font-size: var(--media-zone); gap: 8px; color: var(--lead-cell); justify-content: space-between; }
.vipMarkRing { color: var(--copy-hero); }
@media (max-width: 1080px) { .blockBox { grid-template-columns: repeat(3, minmax(0, 1fr)); } .blockBox > li:nth-child(n + 7) { display: none; } }
@media (max-width: 640px) { .blockBox { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.footMenuPanel { grid-template-columns: minmax(240px, 0.8fr) minmax(0, 2fr); display: grid; gap: clamp(28px, 5vw, 72px); }
.bonusDotTop { display: grid; position: sticky; top: calc(var(--card-box) + 28px); align-self: start; gap: 16px; }
.unitBox { font-size: clamp(28px, 2.6vw, 40px); }
.linkInner { font-size: var(--media-zone); letter-spacing: 0.04em; color: var(--lead-cell); }
.jackpotRear { display: grid; gap: 24px; justify-items: start; min-width: 0; }
.jackpotRear > * { max-width: 100%; }
.jackpotStackCell { font-size: var(--club-win); line-height: 1.6; color: var(--pane-side); }
.barRear { justify-self: stretch; width: 100%; min-width: 0; max-height: 560px; overflow: hidden; mask-image: linear-gradient(#000 60%, transparent) }
.sealTray:checked ~ .barRear { max-height: none; mask-image: none; }
.pillBar { display: grid; grid-template-columns: minmax(160px, 0.7fr) minmax(0, 2fr); gap: 12px 40px; padding: 26px 0; border-top: var(--set-media) solid var(--bar-link); font-size: var(--area-tab); line-height: 1.7 }
.raceUnit { font-size: var(--copy-reel); font-weight: 600; line-height: 1.35; color: var(--pane-side); }
.aceRail, .sealTray:checked ~ .railPanel .vipSetMeta { display: none; }
.sealTray:checked ~ .railPanel .aceRail { display: inline; }
.sealTray:focus-visible ~ .railPanel { outline: 2px solid var(--chip2-promo); outline-offset: 3px; }
@media (max-width: 1080px) { .footMenuPanel { grid-template-columns: 1fr; }
  .bonusDotTop { position: static; } }
@media (max-width: 640px) { .pillBar { grid-template-columns: 1fr; } }
.aceVip { display: grid; justify-items: center; gap: 22px; }
.rowCrestTable { display: grid; justify-items: center; gap: 10px; text-align: center; }
.zoneLobbyTab { font-size: clamp(30px, 3.4vw, 50px); }
.setFeatureCell { width: min(860px, 100%); overflow: hidden; }
.coreFootMenu { padding: 14px 20px; display: flex; align-items: center; border-bottom: var(--set-media) solid var(--bar-link); gap: 12px; }
.coreFootMenu strong { display: block; font-size: var(--area-tab); }
.chipStepBonus { display: inline-flex; align-items: center; font-size: var(--media-zone); gap: 6px; color: var(--lead-cell); }
.topBlock { display: grid; height: 40px; background: var(--chip2-promo); place-items: center; flex: none; font: 700 16px/1 var(--front-list); border-radius: 50%; color: var(--deck-ace); width: 40px }
.tabSet { width: 30px; height: 30px; font-size: 13px; }
.boxLineTray { display: grid; gap: 22px; padding: 24px 20px; background: var(--stack-reel); }
.bodyChip { display: grid; gap: 10px; }
.navTopLobby { display: flex; align-items: flex-end; gap: 10px; }
.pillFoot { justify-content: flex-end; }
.tableFront { max-width: 72%; margin: 0; padding: 12px 16px; font-size: var(--area-tab); line-height: 1.55; }
.pillFoot .tableFront { color: var(--deck-ace); background: var(--chip2-promo); font-weight: 600; border-radius: calc(var(--seal-front) + 10px) calc(var(--seal-front) + 10px) 4px calc(var(--seal-front) + 10px) }
.gridMedia .tableFront { background: var(--slot-side); color: var(--tray-ring); border: var(--set-media) solid var(--bar-link); border-radius: calc(var(--seal-front) + 10px) calc(var(--seal-front) + 10px) calc(var(--seal-front) + 10px) 4px }
.sideTabMark { display: flex; padding: 12px 14px; gap: 10px; border-top: var(--set-media) solid var(--bar-link); align-items: center; }
.dockLine { flex: 1; padding: 10px 14px; color: var(--lead-cell); border-radius: var(--item-box); font-size: var(--area-tab); background: var(--mark-note); }
@media (max-width: 600px) { .tableFront { max-width: 86%; } }
.barCore { background: var(--mark-note); border-top: var(--set-media) solid var(--bar-link); }
.slabSpin { max-width: 1440px; margin: 0 auto; padding: 28px var(--tab-reel) 20px; display: grid; gap: 20px; }
.navEdge { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; }
.headChip2 { flex: 1; min-width: 280px; }
/*  v2  */
.headChip2 ul { display: flex; gap: 6px 20px; color: var(--tray-ring); font-size: var(--area-tab); flex-wrap: wrap; }
.headChip2 a:hover { color: var(--chip2-promo); }
.panelMeta { display: flex; gap: 8px; }
.reelGold { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 10px; border-radius: var(--seal-front); border: var(--set-media) solid var(--tab-seal); color: var(--lead-cell) }
.reelGold select { background: transparent; border: 0; outline: 0; color: var(--pane-side); font: inherit; font-size: var(--area-tab); cursor: pointer; }
.reelGold option { color: #111; }
.topGroupTab { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px 24px; padding: 16px 20px; border-radius: var(--step-hero); background: var(--unit-main); border: var(--set-media) solid var(--bar-link); font-size: var(--area-tab); color: var(--tray-ring) }
.topGroupTab strong { color: var(--pane-side); }
.crestWinBonus { font-size: 13px; display: grid; place-items: center; color: #fff; background: var(--base-group); width: 42px; height: 42px; border-radius: 50%; }
.blockShape { display: flex; gap: 6px; flex-wrap: wrap; }
.blockShape .chipInner svg { height: 16px; }
.blockShape li { border-radius: var(--seal-front); display: inline-flex; background: var(--mark-note); font: 500 11px/1 var(--tab-block); align-items: center; padding: 6px 10px; color: var(--lead-cell); }
.bandChip2Crown { font-size: var(--media-zone); line-height: 1.7; color: var(--lead-cell); }
.blockPaneView { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 14px; border-top: var(--set-media) solid var(--bar-link); font-size: var(--media-zone); color: var(--lead-cell); }
@media (max-width: 900px) { .topGroupTab { grid-template-columns: auto minmax(0, 1fr); } .blockShape { grid-column: 1 / -1; } }
:root { --chip2-promo: rgb(178, 19, 22); --label-chip: hsl(359 52% 50%); --nav-line: rgba(178, 19, 22, 0.14); --deck-ace: #FFFFFF; }
:root { --chip2-promo: #b21316; --label-chip: hsl(359 52% 50%); --nav-line: rgba(178, 19, 22, 0.14); --deck-ace: rgb(255, 255, 255); }
:root { --club-win: 17.0px; --area-tab: 13.8px; --media-zone: 11.7px; --mark-win: 1440px; --copy-reel: 14.8px; --tab-reel: calc(clamp(14px, 2.2vw, 32px) * 1.22); --note-race: 2px; --vip-mark: calc(clamp(40px, 4.2vw, 64px) * 1.22); }
svg.unitTab{width:1em;display:inline-block;vertical-align:-0.125em;fill:currentColor;height:1em}