:root {
  color-scheme: dark;
  font-family: Arial, Helvetica, sans-serif;
  background: #181818;
  --site-max-width: 640px;
  --gold: #ffe429;
  --gold-deep: #b68b00;
  --surface: #171813;
  --muted: #a1a1a1;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #181818; }
body { margin: 0; min-width: 320px; color: #fff; background: #181818; }
button, input { font: inherit; }
a, button { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
[hidden] { display: none !important; }
body.modal-open { overflow: hidden; }

.site-shell {
  width: 100%;
  max-width: var(--site-max-width);
  min-height: 100vh;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  container-type: inline-size;
  color: #fff;
  background: #050505;
  box-shadow: 0 0 32px rgba(0, 0, 0, 0.75);
}

main {
  padding-bottom: calc(16.1cqw + env(safe-area-inset-bottom));
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.site-header {
  height: 15.6cqw;
  display: flex;
  align-items: center;
  gap: 2cqw;
  padding: 0 3.2cqw;
  background: #080909;
}

.site-logo-link { min-width: 0; display: block; margin-right: auto; }
.site-logo { display: block; width: 36.4cqw; max-height: 8cqw; object-fit: contain; object-position: left center; }
.header-actions { display: flex; gap: 1cqw; }

.header-button {
  width: 18.6cqw;
  aspect-ratio: 167 / 58;
  height: auto;
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  color: transparent;
  border: 0;
  border-radius: 4cqw;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  font-size: 0;
  font-weight: 900;
  text-decoration: none;
  text-shadow: none;
}

.header-button::before {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  transform: translateX(-100%) skew(-20deg);
  background: linear-gradient(90deg, rgba(255,255,255,0) 12%, rgba(255,255,255,0.96) 48%, rgba(255,255,255,0.55) 52%, rgba(255,255,255,0) 88%);
  filter: blur(0.45px);
  backdrop-filter: brightness(1.25) saturate(1.08);
  animation: header-button-light 3s linear infinite;
  pointer-events: none;
  z-index: 1;
}

.login-button { background-image: url('/assets/头部按钮01.png'); }
.register-button { width: 19.4cqw; background-image: url('/assets/头部按钮02.png'); }

@keyframes header-button-light {
  0% { transform: translateX(-100%) skew(-20deg); }
  75%, 100% { transform: translateX(100%) skew(-20deg); }
}

.hero { position: relative; height: 74cqw; overflow: hidden; isolation: isolate; }
.hero-background { position: absolute; inset: 0; width: 100%; height: 90.8cqw; object-fit: cover; object-position: top center; z-index: -2; }
.hero::after { content: ""; position: absolute; inset: auto 0 0; height: 9cqw; background: rgba(0,0,0,0.18); z-index: -1; }

.hero-heading { position: absolute; inset: 2cqw 8cqw auto; text-align: center; z-index: 3; }
.hero-heading h1 { height: 5.8cqw; margin: 0; color: var(--gold); font-size: 5.5cqw; line-height: 1; letter-spacing: 0; text-shadow: 0 0.3cqw 0.2cqw #6b4b00, 0 0 1cqw #ffb800; }
.hero-heading p { height: 3.2cqw; margin: 1.1cqw 0 0; font-size: 2.45cqw; font-weight: 900; text-shadow: 0 0.3cqw 0.5cqw #000; }

.slot-scene { position: absolute; left: 5.1cqw; top: 13.1cqw; width: 89.8cqw; height: 57.2cqw; transform: translateX(2.4cqw); }
.slot-cabinet { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.slot-brand-logo { position: absolute; top: 7.6%; left: calc(50% - 3.1cqw); width: 34%; height: 10%; display: block; object-fit: contain; object-position: center; transform: translateX(-50%); z-index: 3; pointer-events: none; }
.slot-lights { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; pointer-events: none; }
.light-one { animation: blink-one 1.2s steps(1) infinite; }
.light-two { animation: blink-two 1.2s steps(1) infinite; }
.light-three { animation: blink-three 1.2s steps(1) infinite; }
@keyframes blink-one { 0%, 33.32% { opacity: 1; } 33.33%, 100% { opacity: 0; } }
@keyframes blink-two { 0%, 33.32%, 66.67%, 100% { opacity: 0; } 33.33%, 66.66% { opacity: 1; } }
@keyframes blink-three { 0%, 66.66% { opacity: 0; } 66.67%, 100% { opacity: 1; } }

.slot-reels {
  position: absolute;
  /* Match the three reel bays in the cabinet artwork, not the full window. */
  left: 9.6%;
  top: 14.4cqw;
  width: 73.1%;
  height: calc(25.7cqw - 2px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  justify-items: center;
  overflow: hidden;
  z-index: 3;
}

.slot-reel { position: relative; width: 18.4cqw; height: 21cqw; overflow: hidden; }
.slot-reel-track { position: absolute; top: 0; left: 0; width: 100%; }
.slot-reel.is-spinning .slot-reel-track, .slot-reel.is-settling .slot-reel-track { will-change: transform; }
.slot-symbol { width: 100%; height: 21cqw; display: grid; place-items: center; }
.slot-symbol:focus-visible { outline-offset: -3px; }
.slot-symbol img { width: 15.5cqw; height: 15.5cqw; object-fit: contain; filter: drop-shadow(0 0.4cqw 0.25cqw rgba(0,0,0,0.35)); }
.slot-reel.is-spinning .slot-symbol img { filter: blur(1.2px); }
.slot-reel.is-landed .slot-symbol img { animation: reel-land 0.32s ease-out; }
.slot-scene.is-spinning .slot-lights { animation-duration: 0.6s; }
.slot-scene.is-winning .slot-lights { animation-duration: 0.9s; }
.slot-scene.is-winning .slot-symbol img { animation: reel-win 0.65s ease-in-out; }
@keyframes reel-land { 0% { transform: scale(1.06); } 100% { transform: scale(1); } }
@keyframes reel-win { 0%, 100% { transform: scale(1); } 45% { transform: scale(1.08); filter: drop-shadow(0 0 7px #ffe429); } }

.slot-handle { position: absolute; right: -2cqw; top: 14.5cqw; width: 15.6cqw; height: 28.4cqw; object-fit: contain; object-position: left center; z-index: 1; }
.hero-cta { position: absolute; left: 10cqw; right: 10cqw; bottom: 2.2cqw; height: auto; aspect-ratio: 556 / 94; display: block; padding: 0; border: 0; background: transparent; cursor: pointer; isolation: isolate; z-index: 5; transform: translateX(-3.6cqw); }
.hero-cta img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: fill; animation: hero-cta-pulse 1.05s ease-in-out infinite; will-change: transform; }
.hero-cta-label { position: absolute; inset: 0; display: grid; place-items: center; padding: 0 5cqw; color: #010802; font-size: 4.2cqw; font-weight: 950; line-height: 1; letter-spacing: 0; text-align: center; text-shadow: 0 0.12cqw 0 rgba(255,255,255,0.2); pointer-events: none; z-index: 1; }
.hero-cta-label { animation: hero-cta-pulse 1.05s ease-in-out infinite; }
.hero-cta.is-spinning { cursor: progress; }
.hero-cta.is-spinning img, .hero-cta.is-spinning .hero-cta-label { animation: hero-cta-press 0.24s ease-out both; }
.hero-cta.is-spinning img { filter: brightness(0.92); }
@keyframes hero-cta-press { 0%, 100% { transform: scale(1); } 45% { transform: translateY(3px) scale(0.95); } }
.hero-cta:disabled { cursor: default; }
@keyframes hero-cta-pulse { 0%, 100% { transform: scale(0.96); } 50% { transform: scale(1.035); } }

.coin-rain { position: fixed; top: 0; left: 50%; width: min(100%, var(--site-max-width)); height: 100vh; height: 100dvh; transform: translateX(-50%); overflow: hidden; pointer-events: none; contain: strict; z-index: 80; }
.coin-rain-piece { position: absolute; top: -60px; left: var(--coin-left); width: var(--coin-size); height: var(--coin-size); opacity: 0; animation: coin-rain-fall var(--coin-duration) cubic-bezier(.32,.12,.68,.65) var(--coin-delay) both; }
.coin-rain-piece img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 3px 2px rgba(0,0,0,0.3)); animation: coin-turn var(--coin-turn) ease-in-out var(--coin-delay) infinite; }
@keyframes coin-rain-fall {
  0% { opacity: 0; transform: translate3d(-50%, 0, 0) rotate(0deg); }
  4%, 92% { opacity: 1; }
  100% { opacity: 0; transform: translate3d(calc(-50% + var(--coin-drift)), calc(100vh + 120px), 0) rotate(var(--coin-rotation)); transform: translate3d(calc(-50% + var(--coin-drift)), calc(100dvh + 120px), 0) rotate(var(--coin-rotation)); }
}
@keyframes coin-turn { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(0.3); filter: brightness(1.16) drop-shadow(0 3px 2px rgba(0,0,0,0.3)); } }

.partners {
  position: relative;
  width: calc(100% - 6cqw);
  min-height: 51cqw;
  margin: -1.5cqw auto 2.6cqw;
  padding: 3cqw 3.3cqw 2.4cqw;
  border: 0.45cqw solid #e9c416;
  border-radius: 3.3cqw;
  background: #0c0d0a;
  box-shadow: inset 0 0 2.2cqw rgba(255, 196, 0, 0.1), 0 0 1.3cqw rgba(255,190,0,0.18);
  z-index: 6;
}

.partners-heading { display: flex; align-items: center; gap: 1.5cqw; margin-bottom: 2.2cqw; text-align: center; }
.partners-heading > div { flex: 0 1 auto; min-width: 0; max-width: 100%; }
.partners-heading h2 { margin: 0; color: var(--gold); font-size: 3.5cqw; line-height: 1; letter-spacing: 0; }
.partners-heading p { margin: 0.8cqw 0 0; font-size: 2.15cqw; font-weight: 800; }
.gold-rule { flex: 1; height: 0.2cqw; background: #e0b80d; }

.partner-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 2.1cqw; row-gap: 1.3cqw; min-height: 38.5cqw; }
#featured-brands.partner-grid { --featured-transition-duration: 460ms; position: relative; display: block; min-height: 38.5cqw; overflow: hidden; }
.featured-carousel-track { display: flex; min-width: 100%; transform: translate3d(0, 0, 0); will-change: transform; }
.featured-carousel-track.is-offset, .featured-carousel-track.is-moving-next { transform: translate3d(-100%, 0, 0); }
.featured-carousel-track.is-moving { transition: transform var(--featured-transition-duration, 460ms) cubic-bezier(.22, .61, .36, 1); }
.featured-carousel-track.is-moving-previous { transform: translate3d(0, 0, 0); }
.featured-carousel-page { flex: 0 0 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 2.1cqw; row-gap: 1.3cqw; min-width: 0; }
.featured-carousel-page[aria-hidden="true"] { pointer-events: none; }
.partner-card { display: grid; min-width: 0; justify-items: center; align-content: start; gap: 1cqw; color: #fff; text-decoration: none; }
.partner-card img { width: 16.3cqw; height: 16.3cqw; display: block; object-fit: contain; border-radius: 2.7cqw; }
.enter-pill { width: 11.4cqw; min-height: 4cqw; display: grid; place-items: center; padding: 0 0.6cqw; color: #1b1200; border: 0.25cqw solid #ffda42; border-radius: 3cqw; background: #efa826; font-size: 1.65cqw; font-weight: 800; }
.partner-card:hover .enter-pill { background: #ffd052; }
.enter-pill { height: 4cqw; max-width: 100%; }
.fit-copy { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.button-copy { display: block; width: 100%; min-width: 0; text-align: center; line-height: 1.2; }

.carousel-arrow { position: absolute; top: 26.4cqw; width: 5.2cqw; height: 5.2cqw; display: grid; place-items: center; padding: 0; color: #ffe033; border: 0.3cqw solid #b69816; border-radius: 50%; background: #151610; font-size: 4cqw; line-height: 1; z-index: 8; }
.carousel-arrow.previous { left: -3.3cqw; }
.carousel-arrow.next { right: -3.3cqw; }

.search-section { padding: 0 3.8cqw 2.3cqw; }
.search-section:focus-within { position: relative; z-index: 60; }
.brand-search { position: relative; display: block; }
.brand-search input { width: 100%; height: 9.3cqw; padding: 0 10cqw 0 3.3cqw; color: #292929; border: 0.3cqw solid #a6a6a6; border-radius: 6cqw; background: #f8f8f8; font-size: max(16px, 2.8cqw); box-shadow: inset 0 0.4cqw 0.7cqw rgba(0,0,0,0.12); }
.brand-search img { position: absolute; right: 2.4cqw; top: 1.6cqw; width: 6.1cqw; height: 6cqw; object-fit: contain; pointer-events: none; }
.search-status { min-height: 0; margin: 1.2cqw 1cqw 0; color: #d7c75b; font-size: 2cqw; }
.search-status:empty { display: none; }

.category-list { display: grid; gap: 1.8cqw; padding: 0 3.8cqw; }
.category-panel { overflow: hidden; border: 0.3cqw solid #aa8e18; border-radius: 2cqw; background: #171813; }
.category-header { width: 100%; min-height: 9.5cqw; display: flex; align-items: center; gap: 1.7cqw; padding: 1.3cqw 2.2cqw; color: #fff; border: 0; background: #202118; text-align: left; }
.category-header > img:first-child { width: 7.4cqw; height: 7.4cqw; object-fit: contain; flex: none; }
.category-title { min-width: 0; flex: 1; }
.category-title strong { display: block; overflow: hidden; font-size: 2.9cqw; text-overflow: ellipsis; white-space: nowrap; }
.category-title small { display: block; overflow: hidden; margin-top: 0.5cqw; color: #8f8f8f; font-size: 1.65cqw; text-overflow: ellipsis; white-space: nowrap; }
.category-count { color: #b9b9b9; font-size: 2.15cqw; white-space: nowrap; }
.category-chevron { width: 3.6cqw; height: 2.1cqw; object-fit: contain; transition: transform 0.2s; }
.category-panel.collapsed .category-chevron { transform: rotate(180deg); }
.category-content { padding: 1.9cqw 2.2cqw 1.4cqw; }
.category-panel.collapsed .category-content { display: none; }
.category-brands { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6cqw 2.1cqw; }
.brand-card { min-width: 0; color: #fff; text-align: center; text-decoration: none; }
.brand-card img { width: 16.5cqw; height: 16.5cqw; max-width: 100%; object-fit: contain; border-radius: 2.7cqw; transition: transform 0.15s; }
.brand-card:hover img { transform: translateY(-0.6cqw); }
.brand-card span { display: block; overflow: hidden; margin-top: 0.7cqw; font-size: 1.7cqw; text-overflow: ellipsis; white-space: nowrap; }
.category-more, .category-summary { width: 100%; display: grid; place-items: center; margin: 12px 0 8px; padding: 12px 8px; color: #e8d65b; font-size: 16px; line-height: 1.5; letter-spacing: 0; text-align: center; overflow-wrap: anywhere; }
.category-more { min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 0; background: transparent; text-decoration: none; cursor: pointer; touch-action: manipulation; overflow-anchor: none; scroll-margin-top: 8px; scroll-margin-bottom: calc(16.1cqw + env(safe-area-inset-bottom)); }
.category-more::after { content: ""; width: 14px; height: 12px; flex: 0 0 14px; background: url('/assets/箭头.png') center 0 / 10px 5px no-repeat, url('/assets/箭头.png') center 3.5px / 10px 5px no-repeat, url('/assets/箭头.png') center 7px / 10px 5px no-repeat; transform: rotate(180deg); }
.category-more[aria-expanded="true"]::after { transform: rotate(0deg); }
.category-more:hover { color: #fff08a; }
.category-more:focus-visible { outline-offset: -3px; }

.about-section, .team-section { position: relative; margin: 2.4cqw 3.8cqw; overflow: hidden; background: #050505; }
.section-art { display: block; width: 100%; height: auto; }

.trust-section { padding: 0 3cqw 2cqw; text-align: center; }
.trust-section > img:first-child { width: 100%; height: auto; display: block; }
.tagline-image { width: 76%; margin-top: 2.2cqw; }

.floating-action {
  --floating-action-radius: clamp(10px, 2.5cqw, 16px);
  position: fixed;
  left: max(12px, calc((100vw - var(--site-max-width)) / 2 + 14px));
  bottom: calc(16.1cqw + env(safe-area-inset-bottom) + 14px);
  z-index: 55;
  width: clamp(59px, 15.6cqw, 96px);
  aspect-ratio: 1;
  display: block;
  padding: 0;
  border: 1px solid rgba(255, 228, 41, 0.82);
  border-radius: var(--floating-action-radius);
  background: rgba(8, 8, 8, 0.9);
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.52), 0 0 0 4px rgba(255, 228, 41, 0.1);
  transition: transform 160ms ease, filter 160ms ease;
}

.floating-action:hover { filter: brightness(1.12); transform: translateY(-2px); }
.floating-action:active { transform: translateY(1px) scale(0.97); }
.floating-action-link { display: block; width: 100%; height: 100%; border-radius: calc(var(--floating-action-radius) - 1px); }
.floating-action img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: calc(var(--floating-action-radius) - 1px); }
.floating-action-close {
  position: absolute;
  top: -5px;
  right: -5px;
  width: 14px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  padding: 0;
  color: #fff;
  border: 1px solid #ffe429;
  border-radius: 50%;
  background: #17191a;
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
}
.floating-action-close:hover { color: #ffe429; }

.bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 0;
  width: min(100%, var(--site-max-width));
  min-height: calc(16.1cqw + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  padding: 1.7cqw 3.5cqw calc(1.3cqw + env(safe-area-inset-bottom));
  background: #17191a url('/assets/底部tab 背景.webp') center / 100% 100% no-repeat;
  transform: translateX(-50%);
  z-index: 50;
}

.bottom-nav-item { position: relative; display: grid; justify-items: center; gap: 0.5cqw; color: #dedede; font-size: 2.4cqw; font-weight: 700; text-decoration: none; }
.bottom-nav-item img { width: 7cqw; height: 7cqw; object-fit: contain; }
.bottom-nav-item.active { color: var(--gold); }
.bottom-nav-item.active::after { content: ""; position: absolute; bottom: -1.1cqw; width: 9.5cqw; height: 0.6cqw; border-radius: 1cqw; background: var(--gold); }

body.virtual-keyboard-open .bottom-nav,
body.virtual-keyboard-open .floating-action { display: none; }

.recommendation { position: fixed; inset: 0; display: grid; place-items: center; padding: 16px; z-index: 100; }
.recommendation-backdrop { position: absolute; inset: 0; border: 0; background: rgba(0,0,0,0.76); }
.recommendation:not([hidden]) .recommendation-backdrop { animation: recommendation-dim 0.25s ease-out both; }
.recommendation:not([hidden]) .recommendation-card { animation: recommendation-reveal 0.32s cubic-bezier(.2,.7,.25,1) both; }
@keyframes recommendation-dim { from { opacity: 0; } to { opacity: 1; } }
@keyframes recommendation-reveal { from { opacity: 0; transform: translateY(16px) scale(0.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
.recommendation-card { position: relative; width: min(540px, 72vw); aspect-ratio: 540 / 770; display: flex; flex-direction: column; align-items: center; padding: clamp(18px, 5.8vw, 32px) clamp(18px, 6.3vw, 34px) clamp(14px, 4.5vw, 24px); color: #fff; background: url('/assets/弹窗/弹窗背景 2.webp') center / 100% 100% no-repeat; filter: drop-shadow(0 10px 32px rgba(0,0,0,0.72)); }
.popup-brand-image { width: 58%; aspect-ratio: 1; flex: 0 0 auto; margin-top: 0; object-fit: contain; border-radius: 15%; }
.recommendation-card > p { width: 92%; min-height: 0; margin: 5.5% 0 2.5%; color: #fff; font-size: clamp(11px, 3.2vw, 18px); line-height: 1.55; text-align: center; white-space: pre-line; }
.rating { display: flex; justify-content: center; gap: 2.5%; width: 66%; margin-top: 0; }
.rating img { width: 17%; aspect-ratio: 1; object-fit: contain; }
.popup-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 4%; margin-top: 6%; }
.popup-actions a, .popup-actions button { aspect-ratio: 210 / 78; min-height: 0; display: grid; place-items: center; padding: 0; color: #fff; border: 0; border-radius: 0; background: transparent url('/assets/弹窗/Vector-1.png') center / 100% 100% no-repeat; font-size: clamp(12px, 3.5vw, 18px); text-decoration: none; }
.popup-actions a:hover, .popup-actions button:hover, .popup-all:hover { filter: brightness(1.1); }
.popup-all { width: 100%; aspect-ratio: 452 / 78; min-height: 0; display: grid; place-items: center; margin-top: 4%; padding: 0; color: #080706; border: 0; border-radius: 0; background: transparent url('/assets/弹窗/Vector.png') center / 100% 100% no-repeat; font-size: clamp(12px, 3.5vw, 18px); text-decoration: none; box-shadow: none; }
.recommendation-card { max-height: calc(100dvh - 32px); overflow-y: auto; scrollbar-width: thin; }
.recommendation-card > p { flex: 0 1 auto; max-height: 7.75em; overflow-y: auto; overflow-wrap: anywhere; overscroll-behavior: contain; scrollbar-width: thin; }
.rating, .popup-actions, .popup-all { flex-shrink: 0; }
.popup-actions > *, .popup-all { min-width: 0; padding-inline: 8%; }

.platform-directory { position: fixed; inset: 0; display: flex; align-items: flex-end; justify-content: center; z-index: 110; }
.platform-directory-backdrop { position: absolute; inset: 0; width: 100%; padding: 0; border: 0; background: rgba(0,0,0,0.76); }
.platform-directory-card { position: relative; width: min(640px, 100%); height: min(88vh, 760px); display: flex; flex-direction: column; gap: 14px; padding: 18px 18px calc(22px + env(safe-area-inset-bottom)); color: #fff; border: 1px solid rgba(255,255,255,0.16); border-bottom: 0; border-radius: 20px 20px 0 0; background: #161718; box-shadow: 0 -16px 40px rgba(0,0,0,0.55); animation: directory-in 0.24s ease-out; }
.platform-directory-card.partners { width: min(640px, 100%); min-height: 0; margin: 0; padding: 18px 18px calc(22px + env(safe-area-inset-bottom)); border: 3px solid #e9c416; border-bottom: 0; border-radius: 20px 20px 0 0; background: #0c0d0a; box-shadow: inset 0 0 14px rgba(255, 196, 0, 0.1), 0 -16px 40px rgba(0,0,0,0.55); }
.platform-directory-heading { gap: 12px; margin-bottom: 0; }
.platform-directory-heading > div { min-width: 0; flex: 1 1 auto; }
.platform-directory-heading h2 { margin: 0; color: var(--gold); font-size: clamp(19px, 5.1vw, 28px); line-height: 1.15; }
.platform-directory-heading .platform-directory-eyebrow { margin: 6px 0 0; color: #a9a9a9; font-size: clamp(9px, 2.15vw, 14px); font-weight: 800; letter-spacing: 0.12em; line-height: 1.2; }
.platform-directory-heading .gold-rule { height: 2px; min-width: 18px; }
.platform-directory-close { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; margin-left: 0; padding: 0; color: #fff; border: 1px solid rgba(255,255,255,0.2); border-radius: 50%; background: rgba(255,255,255,0.08); font-size: 26px; line-height: 1; }
.platform-directory-search { position: relative; display: block; flex: 0 0 auto; }
.platform-directory-search input { width: 100%; height: 46px; padding: 0 42px 0 15px; color: #1e1e1e; border: 1px solid #8f8f8f; border-radius: 9px; background: #fafafa; font-size: 16px; }
.platform-directory-search img { position: absolute; top: 11px; right: 13px; width: 24px; height: 24px; object-fit: contain; pointer-events: none; }
.platform-directory-list.partner-grid { flex: 1 1 auto; min-height: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 12px; row-gap: 14px; overflow-y: auto; padding: 1px 2px 4px; overscroll-behavior: contain; }
.platform-directory-list.partner-grid .partner-card { gap: 8px; }
.platform-directory-list.partner-grid .partner-card img { width: clamp(54px, 16vw, 94px); height: clamp(54px, 16vw, 94px); border-radius: 12px; }
.platform-directory-list.partner-grid .enter-pill { width: clamp(60px, 11.4vw, 74px); min-height: clamp(22px, 4vw, 29px); padding: 0 5px; border-width: 2px; border-radius: 20px; font-size: clamp(10px, 1.65vw, 13px); white-space: nowrap; }
.platform-directory-list.partner-grid .enter-pill { height: clamp(22px, 4vw, 29px); }
.platform-directory-empty { grid-column: 1 / -1; margin: 0; padding: 34px 12px; color: #a9a9a9; text-align: center; }
@keyframes directory-in { from { transform: translateY(100%); opacity: 0.6; } to { transform: translateY(0); opacity: 1; } }

.page-loading { position: fixed; inset: 0; display: grid; place-content: center; justify-items: center; gap: 12px; color: #dfc845; background: #050505; z-index: 200; }
.page-loading span { width: 40px; height: 40px; border: 4px solid #332d12; border-top-color: #ffe033; border-radius: 50%; animation: loading-spin 0.75s linear infinite; }
.page-loading p { margin: 0; font-size: 14px; }
@keyframes loading-spin { to { transform: rotate(360deg); } }
.noscript { position: fixed; inset: auto 0 0; margin: 0; padding: 12px; color: #fff; background: #a51616; text-align: center; z-index: 300; }

@media (min-width: 751px) {
  .recommendation-card { width: 430px; }
  .recommendation-card > p { font-size: 15px; }
  .popup-actions a, .popup-actions button, .popup-all { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .featured-carousel-track { transition: none !important; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .slot-lights { animation: none !important; }
  .light-one { opacity: 1; }
  .light-two, .light-three { opacity: 0; }
  .hero-cta[aria-busy="true"] img, .hero-cta[aria-busy="true"] .hero-cta-label { animation: none !important; transform: translateY(2px) scale(0.96); }
  .hero-cta[aria-busy="true"] img { filter: brightness(0.92); }
}

/* The slot is a primary interaction. Keep its feedback visible even when the
   operating system requests reduced motion; it can be disabled with
   ?slotMotion=off or localStorage key 777clube:slot-motion=off. */
html.slot-motion-active .slot-scene .slot-lights {
  animation-iteration-count: infinite !important;
  animation-duration: 1.2s !important;
}
html.slot-motion-active .slot-scene .slot-lights.light-one { animation-name: blink-one !important; }
html.slot-motion-active .slot-scene .slot-lights.light-two { animation-name: blink-two !important; }
html.slot-motion-active .slot-scene .slot-lights.light-three { animation-name: blink-three !important; }
html.slot-motion-active .slot-scene .hero-cta img,
html.slot-motion-active .slot-scene .hero-cta-label {
  animation-iteration-count: infinite !important;
  animation-duration: 1.05s !important;
}
html.slot-motion-active .slot-scene.is-spinning .slot-lights { animation-duration: 0.6s !important; }
html.slot-motion-active .slot-scene .hero-cta[aria-busy="true"] img,
html.slot-motion-active .slot-scene .hero-cta[aria-busy="true"] .hero-cta-label {
  animation-name: hero-cta-press !important;
  animation-duration: 0.24s !important;
  animation-iteration-count: 1 !important;
}
