.raundo-reference {
  --side: 0px;
  --header: 82px;
  --reference-gutter: clamp(16px, 2.08vw, 38px);
  --reference-bg: #10141a;
  --reference-purple: #8b1dea;
  --reference-green: #d2fa48;
  --bg: var(--reference-bg);
  --ink: #f8f9fb;
  background: var(--reference-bg);
}
.raundo-reference:not(.game-mode) .main-area {
  margin: 0 auto;
  max-width: 1800px;
  padding: 0 var(--reference-gutter);
}
.raundo-reference:not(.game-mode) .site-header {
  position: relative;
  inset: auto;
  display: grid;
  grid-template-columns: minmax(245px, 1fr) minmax(210px, 1.7fr) auto;
  grid-template-rows: 62px;
  height: auto;
  min-height: 82px;
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
  gap: clamp(16px, 3vw, 45px);
  padding: 8px calc(var(--reference-gutter) + 16px) 5px;
  border: 0;
  border-radius: 0;
  background: var(--reference-bg) !important;
  box-shadow: none;
}
.raundo-reference .site-header .logo .wordmark { gap: 15px; }
.raundo-reference .site-header .logo .wordmark img { width: 56px; height: 56px; }
.raundo-reference .site-header .logo .wordmark > span {
  display: block;
  width: clamp(141px, 13.55vw, 210px);
  aspect-ratio: 201 / 45;
  color: transparent;
  font-size: 0;
  background: var(--wordmark-ink, white);
  -webkit-mask: url(wordmark.png) center / contain no-repeat;
  mask: url(wordmark.png) center / contain no-repeat;
}
.raundo-reference .site-header .wordmark-dot { display: none; }
.raundo-reference:not(.game-mode) .header-search {
  grid-column: auto;
  grid-row: auto;
  height: 56px;
  max-width: none;
  border-radius: 16px;
  border-color: #babac0;
  background: transparent;
  padding-inline: 17px;
  gap: 18px;
}
.raundo-reference:not(.game-mode) .header-search input { font-size: clamp(17px, 1.6vw, 24px); }
.raundo-reference:not(.game-mode) .header-search > svg { width: 26px; height: 26px; color: white; }
.raundo-reference:not(.game-mode) .profile-trigger {
  height: 64px;
  min-width: 0;
  max-width: 202px;
  border: 0;
  background: transparent;
  gap: 14px;
  color: #fff;
  border-radius: 10px;
  font-size: clamp(16px, 1.65vw, 25px);
  padding: 4px 6px;
}
.raundo-reference:not(.game-mode) .profile-trigger .player-avatar {
  width: 59px;
  height: 59px;
  border-radius: 50%;
}
.raundo-reference:not(.game-mode) .sidebar:not(.is-open) { display: none; }
.raundo-reference:not(.game-mode) .sidebar.is-open { --side: 270px; }
.raundo-reference .main-area > .library-tabs {
  display: flex;
  align-items: center;
  gap: clamp(18px, 4.35vw, 64px);
  min-width: 0;
  margin: 0 0 clamp(12px, 1.4vw, 22px);
  padding: 0 19px;
  border: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.raundo-reference .library-tabs > :is(button,a) {
  display: grid;
  place-items: center;
  flex: none;
  min-height: 48px;
  padding: 2px 4px 7px;
  border: 0;
  border-bottom: 6px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #f8f8fa;
  font-size: clamp(15px, 1.63vw, 24px);
  line-height: 1.2;
  white-space: nowrap;
  text-decoration: none;
}
.raundo-reference .library-tabs > button.selected {
  border-bottom-color: var(--reference-green);
  color: #fff;
  font-weight: 800;
  background: transparent;
}
.raundo-reference .library-tabs > :is(button,a):focus-visible,
.raundo-reference .raundo-genre-nav button:focus-visible {
  outline: 2px solid var(--reference-green);
  outline-offset: -2px;
}
.raundo-reference .raundo-showcase { margin: 0; }
.raundo-reference .raundo-showcase .raundo-promos {
  grid-template-columns: minmax(0, 1.41fr) minmax(0, 1fr);
  gap: clamp(8px, 1vw, 16px);
  margin: 0;
}
.raundo-reference .raundo-promo {
  height: clamp(143px, 16.92vw, 300px);
  min-height: 0;
  border-radius: 4px;
  padding: clamp(12px, 2.2vw, 36px);
}
.raundo-reference .promo-reference-image,
.raundo-reference .promo-color-cutout {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}
.raundo-reference .promo-reference-image { object-fit: fill; }
.raundo-reference .promo-color-cutout {
  opacity: 0;
  background: center / 100% 100% no-repeat var(--reference-image);
  filter: var(--art-color);
}
.raundo-promo--round {
  --reference-image: url(round.webp);
  --art-color: grayscale(1) sepia(1) saturate(3.4) hue-rotate(226deg);
  --promo-background: #d0fa44;
}
.raundo-promo--racing {
  --reference-image: url(racing.webp);
  --art-color: grayscale(1) sepia(1) saturate(3) hue-rotate(35deg);
}
.raundo-promo--round .promo-color-cutout {
  clip-path: polygon(69% 47%,71% 34%,73% 28%,76.5% 14%,76.2% 5%,78.2% 10%,77.8% 0,80.1% 5%,85% 5%,90% 10%,94% 24%,96% 43%,96% 65%,95.8% 81%,94.8% 87%,96.7% 91%,98% 100%,70% 100%,70.5% 93%,73% 90%,76% 85%,74.5% 82%,74% 77%,75% 69%,78.3% 55%,81% 45%,81.2% 40%,77.6% 44%,75.5% 47%,74% 54%,71% 58%,70.1% 56%,69% 54%);
}
.raundo-promo--racing .promo-color-cutout {
  clip-path: polygon(80% 0,100% 0,100% 100%,58% 100%,57% 91%,56.5% 84%,57% 79%,56.5% 75%,58% 62%,60% 46%,62% 33%,66% 20%,71% 10%,76% 4%);
}
.raundo-reference :is(.raundo-promo--round,.raundo-promo--racing) .raundo-promo__title,
.raundo-reference .raundo-promo--racing .raundo-promo__cta {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.raundo-reference .raundo-promo--round .raundo-promo__cta {
  position: absolute;
  left: 4.55%;
  top: 65.7%;
  display: grid;
  place-items: center;
  width: 27.7%;
  height: 22.1%;
  min-height: 0;
  padding: 0;
  background: #0c0e12;
  border-radius: 3px;
  color: #fff;
  font: 900 clamp(15px, 2.23vw, 38px)/1 Arial, sans-serif;
}
.raundo-reference .raundo-promo--round:focus-visible .raundo-promo__cta {
  color: #141018;
  background: var(--reference-green);
}
.raundo-reference .raundo-promo:focus-visible .promo-reference-image { filter: grayscale(1); }
.raundo-reference .raundo-promo:focus-visible .promo-color-cutout { opacity: 1; }
@media (hover: hover) and (pointer: fine) {
  .raundo-reference .raundo-promo:hover .promo-reference-image { filter: grayscale(1); }
  .raundo-reference .raundo-promo:hover .promo-color-cutout { opacity: 1; }
  .raundo-reference .raundo-promo--round:hover .raundo-promo__cta { color:#141018; background:var(--reference-green); }
}
.raundo-reference .raundo-promo--round:active .raundo-promo__cta { color: #fff; background: #6728c6; }
.raundo-reference .raundo-promo--logic,
.raundo-reference .raundo-promo--sport { --promo-background: linear-gradient(117deg,#7e12ee,#a020fa); }
.raundo-reference :is(.raundo-promo--logic,.raundo-promo--sport) .raundo-promo__title {
  font: 900 italic clamp(23px, 4vw, 68px)/.9 Arial, sans-serif;
  letter-spacing: -.055em;
  text-wrap: initial;
}
.raundo-reference .raundo-promo-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 54px;
}
.raundo-reference .raundo-promo-controls button { display: grid; place-items: center; color: white; }
.raundo-reference .promo-dot { width: 16px; height: 26px; }
.raundo-reference .promo-dot::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: #696c72; }
.raundo-reference .promo-dot[aria-pressed=true]::before { background: #fff; }
.raundo-reference .promo-pause {
  width: 35px; height: 35px; margin-left: 21px; border: 1.5px solid #fff; border-radius: 50%; font: bold 15px Arial,sans-serif;
}
.raundo-reference .raundo-genre-nav {
  display: grid;
  grid-template-columns: 33px minmax(0,1fr) 33px;
  align-items: center;
  gap: 16px;
  margin: 0 17px 23px;
  border-bottom: 2px solid #6e637a;
}
.raundo-reference .raundo-genre-rail {
  display: flex;
  align-items: center;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
  min-width: 0;
  padding: 3px 0 11px;
}
.raundo-reference .raundo-genre-rail button {
  position: relative;
  flex: 0 0 calc(100% / 7);
  min-height: 45px;
  padding: 5px 10px;
  border-radius: 40px;
  color: #fff;
  font-size: clamp(15px, 1.62vw, 24px);
  white-space: nowrap;
}
.raundo-reference .raundo-genre-rail button[aria-pressed=true] {
  background: var(--reference-purple);
  font-weight: 800;
}
.raundo-reference .raundo-genre-rail button[aria-pressed=true]::after {
  content: ""; position: absolute; bottom: -11px; inset-inline: 7px; height: 6px;
  border-radius: 6px; background: #a247ff;
}
.raundo-reference .genre-arrow { min-height: 44px; font: 46px/.8 Arial,sans-serif; color: #c0bbc5; }
@media (hover:hover) {
  .raundo-reference .raundo-genre-rail button:not([aria-pressed=true]):hover,
  .raundo-reference .library-tabs > :is(button,a):not(.selected):hover {
    background: var(--reference-green);
    color: #11141a;
  }
}
.raundo-reference .raundo-genre-rail button:active,
.raundo-reference .library-tabs > :is(button,a):active { background: #6728c6; color: #fff; }
.raundo-reference .genre-toolbar .genre-select { display: none; }
.raundo-reference .genre-toolbar { justify-content: flex-end; }
.raundo-reference .raundo-showcase + .collection > .genre-toolbar { display: none; }
.raundo-reference .collection-heading { margin: 0 0 clamp(13px, 1.35vw, 22px); }
.raundo-reference .collection-heading .section-index,
.raundo-reference .collection-heading .heading-counter { display: none; }
.raundo-reference .collection-heading h2 {
  color: #fff;
  font: 900 clamp(29px, 3vw, 49px)/1.05 Arial, sans-serif;
  letter-spacing: -.036em;
}
.raundo-reference .collection > .catalog-grid {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: clamp(15px,1.2vw,22px);
}
.raundo-reference .collection .game-card .card-art { aspect-ratio: 4/3; border-radius: 15px; }
.raundo-reference .collection .game-card:nth-child(n+7) .card-art { aspect-ratio: 1.49; }
.raundo-reference .collection .card-caption { padding: 4px 8px 0; }
.raundo-reference .collection .card-caption h3 {
  font: 750 clamp(13px,1.37vw,21px)/1.06 Arial,sans-serif;
  color: #fff;
  letter-spacing: -.025em;
}
.raundo-reference .collection .save-card {
  inset: 7px 7px auto auto;
  width: 34px; height: 34px; min-width: 0; min-height: 0;
  border: 1px solid #77727b; border-radius: 9px;
  color: #fff; background: #08090b; box-shadow: none;
}
.raundo-reference .collection .save-card svg { width: 19px; height: 19px; }
.raundo-reference .collection .save-card[aria-pressed=true] { background: #6728c6; }
.raundo-reference .collection .card-device { font-size: 9px; }
.raundo-reference .home-extras { margin-top: 28px; }
@media (min-width: 1025px) {
  .raundo-reference:not(.game-mode) .mobile-menu { display: none; }
}
@media (min-width: 701px) and (max-width: 1024px) {
  .raundo-reference:not(.game-mode) .site-header { grid-template-columns: minmax(200px,1fr) minmax(140px,1.6fr) auto 44px; gap: 12px; }
  .raundo-reference:not(.game-mode) .profile-trigger { width: 44px; max-width: 44px; padding: 5px; }
  .raundo-reference .raundo-genre-rail button { flex-basis: 20%; }
  .raundo-reference .collection > .catalog-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .raundo-reference { --header: 110px; }
  .raundo-reference:not(.game-mode) .site-header {
    grid-template-columns: minmax(0,1fr) 44px 44px; grid-template-rows: 40px 42px;
    gap: 8px; padding: 8px var(--reference-gutter) 10px;
  }
  .raundo-reference .site-header .logo .wordmark img { width: 38px; height: 38px; }
  .raundo-reference .site-header .logo .wordmark { gap: 9px; }
  .raundo-reference:not(.game-mode) .header-search { grid-column: 1/-1; grid-row: 2; height: 42px; gap: 10px; border-radius: 12px; }
  .raundo-reference:not(.game-mode) .profile-trigger { grid-column: 2; grid-row: 1; width: 44px; max-width: 44px; height: 42px; padding: 4px; }
  .raundo-reference .main-area > .library-tabs { padding: 0 1px; gap: 18px; margin-bottom: 12px; }
  .raundo-reference .library-tabs > :is(button,a) { min-height: 36px; padding-bottom: 4px; border-bottom-width: 3px; font-size: 15px; }
  .raundo-reference .raundo-showcase .raundo-promos { grid-template-columns: 1fr; }
  .raundo-reference .raundo-promo { height: clamp(108px,31vw,195px); }
  .raundo-reference .raundo-genre-nav { margin: 0 0 16px; gap: 2px; grid-template-columns: 21px minmax(0,1fr) 21px; }
  .raundo-reference .raundo-genre-rail button { flex-basis: auto; min-height: 37px; padding-inline: 13px; }
  .raundo-reference .collection > .catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px 12px; }
  .raundo-reference .collection .card-caption { padding-inline: 2px; }
  .raundo-reference .collection .card-caption h3 { font-size: 15px; }
  .raundo-reference .collection .game-card:nth-child(n+7) .card-art { aspect-ratio: 4/3; }
}

.admin-shell {
  --admin-accent: #d2fa48;
  background: #10141a;
  color: #f8f9fb;
}
.admin-shell .admin-header {
  background: #10141a;
  border-color: #35313f;
}
.admin-shell .admin-heading {
  border: 1px solid #3e3450;
  border-radius: 15px;
  background: linear-gradient(116deg,#21162e,#171923 70%);
  padding: clamp(16px,3vw,42px);
}
.admin-shell .admin-heading h1 { letter-spacing: -.05em; }
.admin-shell .admin-heading .eyebrow { color: var(--admin-accent); }
.admin-shell .admin-site-status,
.admin-shell .admin-panel,
.admin-shell .stat-card { background: #191a24; border-color: #3c3447; }
.admin-shell .admin-tabs { margin-top: 22px; }
.admin-shell .admin-tabs > button.active,
.admin-shell .admin-access-shortcut { background: #7820d2; color: #fff; }
@media (hover:hover) {
  .admin-shell .admin-tabs > button:hover,
  .admin-shell .admin-access-shortcut:hover { background: var(--admin-accent); color: #16111e; }
}
.admin-shell .admin-tabs > button:active,
.admin-shell .admin-access-shortcut:active { background: #6728c6; color: #fff; }
.raundo-access { background: #10141a; }

/* Reset native controls and retain the reference's clean navigation treatments. */
.raundo-reference:not(.game-mode) .site-header { min-height: 86px; }
.raundo-reference .library-tabs > :is(button,a) { font-weight: 400; }
.raundo-reference .main-area > .library-tabs > button.selected:not(:active) {
  background: transparent !important;
  border-bottom-color: var(--reference-green) !important;
  color: #fff;
  font-weight: 800;
}
.raundo-reference .raundo-genre-rail > button,
.raundo-reference .raundo-promo-controls > button,
.raundo-reference .raundo-genre-nav > button { background: transparent; font-weight: 400; }
.raundo-reference .raundo-genre-rail > button[aria-pressed=true] { background: var(--reference-purple); font-weight: 800; }
.raundo-reference .raundo-genre-rail > button:active,
.raundo-reference .raundo-genre-nav > button:active,
.raundo-reference .raundo-promo-controls > button:active { background: #6728c6; }
.raundo-reference .raundo-promo-controls { min-height: 57px; }
.raundo-reference .raundo-genre-nav { margin-bottom: 27px; }
.raundo-reference .collection .card-caption h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  line-height: 1.08;
}
.raundo-reference .collection > .catalog-grid { row-gap: clamp(16px,1.35vw,23px); }
.raundo-reference:not(.game-mode) .profile-trigger .member-avatar {
  width: 62px; height: 62px; flex: 0 0 62px;
  border-radius: 50%; border: 2px solid #8b1dea;
}
.raundo-reference .raundo-promo--round .promo-color-cutout { mask: url(round-mask.png) center / 100% 100% no-repeat; }
.raundo-reference .raundo-promo--racing .promo-color-cutout { mask: url(racing-mask.png) center / 100% 100% no-repeat; }
.raundo-reference .raundo-showcase + .collection { display: flex; flex-direction: column; }
.raundo-reference .raundo-showcase + .collection > .genre-toolbar { display: flex; order: 5; margin: 10px 0 0; }
@media (max-width: 1024px) {
  .raundo-reference:not(.game-mode) .profile-trigger .member-avatar { width: 34px; height: 34px; flex-basis: 34px; }
}
@media (max-width: 700px) {
  .raundo-reference .main-area > .library-tabs { gap: 10px; }
  .raundo-reference .library-tabs > :is(button,a) { font-size: clamp(12px,3.55vw,15px); padding-inline: 2px; }
  .raundo-reference .raundo-genre-nav { margin-bottom: 17px; }
  .raundo-reference .raundo-promo-controls { min-height: 48px; }
}
.admin-shell .admin-heading {
  padding: clamp(16px,2.5vw,35px);
}
.admin-shell .admin-heading h1 { margin-block: 13px; }
.admin-shell .admin-heading h1 span { margin-right: .16em; }
.admin-shell .admin-tabs > button,
.admin-shell .admin-heading p,
.admin-shell .admin-header { font-size: 14px; }
.admin-shell .admin-tabs > button { min-height: 44px; }
@media (min-width: 850px) {
  .admin-shell .admin-heading h1 br { display: none; }
  .admin-shell .admin-heading h1 span { margin-left: .22em; }
}
.raundo-reference .collection .card-caption h3 {
  display: block;
  overflow: visible;
  text-overflow: clip;
  max-height: none;
  -webkit-line-clamp: unset;
  font-size: clamp(13px,1.29vw,20px);
}
.raundo-reference .collection [data-game-id="115717"] .card-caption h3 {
  font-size: clamp(12px,1.18vw,18px);
}
@media (max-width: 700px) {
  .raundo-reference .collection .card-caption h3 { font-size: 15px; }
  .raundo-reference .collection [data-game-id="115717"] .card-caption h3 { font-size: 13px; }
}