.raundo-app .raundo-promos {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  grid-column: 1 / -1;
  gap: 12px;
  margin: 6px 0 0;
}

.raundo-promo {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  overflow: hidden;
  min-height: clamp(148px, 16vw, 244px);
  padding: clamp(14px, 2.1vw, 32px);
  border-radius: 10px;
  text-decoration: none;
}

.raundo-promo::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: var(--promo-background);
  content: "";
}

.raundo-promo--round {
  --promo-background: linear-gradient(155deg, #d5fa48 0 74%, #7424d5 74.2%);
  --promo-color: #141018;
}

.raundo-promo--racing {
  --promo-background: linear-gradient(128deg, #7927d9, #561bc6 76%, #44168d);
  --promo-color: #fff;
}

.raundo-app a.raundo-promo { color: var(--promo-color); }

.raundo-promo .raundo-promo__art {
  position: absolute;
  z-index: -1;
  right: -2%;
  bottom: -7%;
  display: block;
  width: 48%;
  height: 108%;
  object-fit: contain;
  object-position: right bottom;
  filter: grayscale(1);
  pointer-events: none;
}

.raundo-promo--racing .raundo-promo__art {
  right: -5%;
  width: 51%;
  bottom: -2%;
}

.raundo-promo .raundo-promo__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(9px, 1.3vw, 18px);
  max-width: 68%;
}

.raundo-promo__title {
  font-family: "Russo One", Arial, sans-serif;
  font-size: clamp(20px, 2.65vw, 43px);
  font-weight: 400;
  font-style: italic;
  line-height: 1.05;
  text-transform: uppercase;
  text-wrap: balance;
}

.raundo-promo .raundo-promo__cta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 6px 11px;
  border-radius: 5px;
  background: #18141e;
  color: #fff;
  font-size: clamp(12px, 1vw, 15px);
  font-weight: 700;
  line-height: 1.25;
}

.raundo-promo:focus-visible {
  outline: 2px solid #d5fa48;
  outline-offset: 3px;
}

.raundo-promo:focus-visible::before { filter: grayscale(1); }
.raundo-promo:focus-visible .raundo-promo__art { filter: none; }
.raundo-promo:focus-visible .raundo-promo__cta { background: #d5fa48; color: #141018; }

@media (hover: hover) and (pointer: fine) {
  .raundo-promo:hover::before { filter: grayscale(1); }
  .raundo-promo:hover .raundo-promo__art { filter: none; }
  .raundo-promo:hover .raundo-promo__cta,
  .raundo-app :is(.sidebar nav button, .library-tabs button, .primary-button, .acid-button, .outline-button,
    .icon-button, .profile-trigger, .save-card, .action-save, .reaction-button,
    .screen-launch, .back-button, .rail-random, .side-round-link, .continue-link):not(:disabled):not([aria-disabled="true"]):hover {
    background: #d5fa48;
    border-color: #d5fa48;
    color: #141018;
  }
}

.raundo-promo:active .raundo-promo__cta,
.raundo-app :is(.sidebar nav button, .library-tabs button, .primary-button, .acid-button, .outline-button,
  .icon-button, .profile-trigger, .save-card, .action-save, .reaction-button,
  .screen-launch, .back-button, .rail-random, .side-round-link, .continue-link):not(:disabled):not([aria-disabled="true"]):is(:active, .active, .selected, [aria-current="page"], [aria-pressed="true"]) {
  background: #6728c6;
  border-color: #9253e9;
  color: #fff;
}

@media (min-width: 681px) and (max-width: 950px) {
  .raundo-promo .raundo-promo__copy { max-width: 74%; }
}

@media (max-width: 680px) {
  .raundo-app .raundo-promos { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .raundo-promo { min-height: 108px; padding: 12px 14px; }
  .raundo-promo .raundo-promo__copy { max-width: 63%; }
  .raundo-promo .raundo-promo__art { right: 0; }
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  .raundo-promo::before,
  .raundo-promo .raundo-promo__art { transition: filter 150ms ease-out; }
}

.raundo-promo--logic {
  --promo-background: linear-gradient(125deg, #6d32b5, #412477);
  --promo-color: #fff;
}

.raundo-promo--sport {
  --promo-background: linear-gradient(130deg, #5129be, #331782);
  --promo-color: #fff;
}

.raundo-promo--logic .raundo-promo__art,
.raundo-promo--sport .raundo-promo__art { width: 50%; right: -2%; bottom: -5%; }

.raundo-app .logo .wordmark > span,
.round-brand .raundo-logo-text {
  --wordmark-ink: #fff;
  color: var(--wordmark-ink);
}

@supports (background-clip: text) {
  .raundo-app .logo .wordmark > span,
  .round-brand .raundo-logo-text {
    background: radial-gradient(circle, #15111d 23%, transparent 26%) left 91% / 5px 5px repeat-x,
                linear-gradient(var(--wordmark-ink), var(--wordmark-ink));
    background-clip: text;
    color: transparent;
  }
}

.raundo-app .logo:focus-visible .wordmark > span,
.round-brand:focus-visible .raundo-logo-text { --wordmark-ink: #d5fa48; }

@media (hover: hover) and (pointer: fine) {
  .raundo-app .logo:hover .wordmark > span,
  .round-brand:hover .raundo-logo-text { --wordmark-ink: #d5fa48; }
}

.raundo-app .logo:active .wordmark > span,
.round-brand:active .raundo-logo-text { --wordmark-ink: #c28dff; }

.round-app .round-page-heading {
  padding: clamp(14px, 2.4vw, 28px);
  border: 1px solid #684391;
  border-radius: 14px;
  background: linear-gradient(118deg, #25163b, #36204f 62%, #24182f);
}

.round-app .round-page-heading .eyebrow { color: #d5fa48; }
.round-app .round-page-heading h1 { color: #f7efff; }
.round-app .round-page-heading h1 > span { color: #d5fa48; }
.round-app .round-page-heading p { color: #e2d6ee; }
.round-app .round-date { border-color: #a67dd44f; background: #160d23a6; }
.round-app .round-date svg { color: #d5fa48; }
.round-app .round-date small { color: #d2c1e6; }

.round-app .light-game {
  border-color: #704c96;
  border-radius: 16px;
  background: radial-gradient(ellipse at 50% 8%, #492b6e, transparent 73%), #1b1427;
}

.round-app .light-tile { border-color: #bb9be74f; background: linear-gradient(145deg, #3c2c56, #281d39); }
.round-app .light-tile.lit {
  border-color: #e8ff9f;
  color: #3e5b00;
  background: linear-gradient(145deg, #ebff9b, #bbeb2c);
  box-shadow: inset 0 1px 0 #fff9, 0 0 12px #d5fa482e;
}
.round-app .light-tile.affected { outline-color: #b57cff; }

.round-app :is(.acid-button, .outline-button):not(:disabled):active {
  background: #6728c6;
  border-color: #9253e9;
  color: #fff;
}

@media (hover: hover) and (pointer: fine) {
  .round-app :is(.acid-button, .outline-button):not(:disabled):not(:active):hover {
    background: #d5fa48;
    border-color: #d5fa48;
    color: #141018;
  }
}

.admin-shell .admin-heading h1 { font-size: clamp(30px, 5vw, 62px); line-height: 1.1; }
.admin-shell .admin-heading h1 > span { color: #d0abff; }
.admin-shell .admin-heading .eyebrow { color: #d5fa48; }
.admin-shell .admin-tabs { gap: 8px; }
.admin-shell .admin-tabs > button { border-radius: 9px; }
.admin-shell .admin-tabs > button.active {
  background: #6427ba;
  border-color: #a775ec;
  color: #fff;
}

.admin-access-shortcut {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  margin-top: 12px;
  padding: 9px 14px;
  border: 1px solid #a775ec;
  border-radius: 9px;
  color: #f4e7ff;
  background: #432568;
  text-decoration: none;
  font-weight: 700;
}

.admin-access-shortcut:hover,
.admin-access-shortcut:focus-visible { background: #d5fa48; color: #141018; }
.admin-access-shortcut:active { background: #6427ba; color: #fff; }

.raundo-profile-id {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 12px;
  padding: 10px 12px;
  border: 1px solid #8656b870;
  border-radius: 8px;
  background: #2a1a3e;
  color: #ebdfff;
  font-size: 12px;
}

.raundo-profile-id code { overflow-wrap: anywhere; user-select: all; }
.raundo-profile-id a { color: #d5fa48; }

.raundo-access {
  margin: 0;
  background: #16111f;
  color: #f7f0ff;
  font: 16px/1.5 system-ui, sans-serif;
  color-scheme: dark;
}

.raundo-access main { width: min(1060px, calc(100% - 28px)); margin: auto; padding: 22px 0 48px; }
.raundo-access header { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; }
.raundo-access a { color: #dfc6ff; }
.raundo-access .access-brand { display: inline-flex; gap: 8px; align-items: center; color: #fff; font-size: 24px; font-weight: 900; text-decoration: none; }
.raundo-access .access-brand img { width: 34px; height: 34px; }
.raundo-access h1 { margin-bottom: 0; font-size: clamp(30px, 5vw, 52px); }
.raundo-access h2 { margin: 0 0 8px; font-size: 22px; }
.raundo-access p, .raundo-access li span { color: #d4c4e5; }
.raundo-access .access-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.raundo-access section { padding: 18px; border: 1px solid #604580; border-radius: 12px; background: #21172d; }
.raundo-access .access-audit { margin-top: 14px; }
.raundo-access label { display: block; margin: 14px 0 6px; font-weight: 650; }
.raundo-access .access-controls, .raundo-access li { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 10px; }
.raundo-access :is(input,select) {
  flex: 1 1 185px;
  min-width: 0;
  border: 1px solid #9070b0;
  border-radius: 7px;
  padding: 10px;
  background: #140e1d;
  color: #fff;
  font: inherit;
}

.raundo-access button {
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid #a276d9;
  border-radius: 7px;
  background: #6427ba;
  color: #fff;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}

.raundo-access button.access-secondary { background: #342149; }
.raundo-access button:hover, .raundo-access button.access-secondary:hover { background: #d5fa48; color: #141018; }
.raundo-access button:active, .raundo-access button.access-secondary:active { background: #6728c6; color: #fff; }
.raundo-access :is(button,input,select,a):focus-visible { outline: 2px solid #d5fa48; outline-offset: 3px; }
.raundo-access ul { padding: 0; list-style: none; }
.raundo-access li { justify-content: flex-start; padding: 9px 0; border-top: 1px solid #49345d; }
.raundo-access li form { margin-left: auto; }
.raundo-access code { color: #ead8ff; overflow-wrap: anywhere; }
.raundo-access .access-notice { padding: 10px 12px; border: 1px solid #a5c53a; border-radius: 8px; color: #e8ff99; }

@media (max-width: 680px) {
  .raundo-access .access-grid { grid-template-columns: minmax(0, 1fr); }
}
