:root {
  --dr88-font-ui: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --dr88-wine: #470306;
  --dr88-wine-deep: #260104;
  --dr88-red: #b70d16;
  --dr88-red-bright: #df252a;
  --dr88-gold: #ffe34c;
  --dr88-gold-deep: #bd7b0c;
  --dr88-ivory: #fffdf5;
  --dr88-paper: #fff8f2;
  --dr88-white: #ffffff;
  --dr88-ink: #20283a;
  --dr88-muted: #667085;
  --dr88-line: #e8ded8;
  --dr88-green: #087852;
  --dr88-radius: 16px;
  --dr88-shadow: 0 24px 60px rgba(31, 3, 7, 0.24);
}

/* Customer support: persistent, quiet and clear of route navigation. */
.dr88aph-support-fab {
  position: fixed;
  left: auto;
  right: max(18px, env(safe-area-inset-right));
  top: 50%;
  bottom: auto;
  z-index: 42;
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 66px;
  padding: 4px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  box-shadow: none;
  transform: translateY(-50%);
  transition: transform 180ms ease-out, box-shadow 180ms ease-out, opacity 160ms ease-out;
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-drag: none;
}

.dr88aph-support-fab.is-user-positioned {
  left: var(--dr88-support-x);
  right: auto;
  top: var(--dr88-support-y);
  bottom: auto;
  transform: none;
}

.dr88aph-support-fab__link {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  min-width: 0;
  min-height: inherit;
  gap: 9px;
  border-radius: inherit;
  color: #fff8e7;
  text-decoration: none;
}

.dr88aph-support-fab.is-snap-left .dr88aph-support-fab__link { flex-direction: row; }

.dr88aph-support-fab__dismiss {
  position: absolute;
  z-index: 2;
  top: -17px;
  left: -17px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0 !important;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  color: #fff8e7;
  cursor: pointer;
}

.dr88aph-support-fab__dismiss::before {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255, 227, 76, 0.86);
  border-radius: 50%;
  background: #5b0408;
  box-shadow: 0 6px 16px rgba(31, 1, 4, 0.3);
}

.dr88aph-support-fab__dismiss svg {
  position: relative;
  z-index: 1;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}

.dr88aph-support-fab.is-snap-left .dr88aph-support-fab__dismiss {
  right: -17px;
  left: auto;
}

.dr88aph-support-fab.is-dismissed { display: none; }

.dr88aph-support-fab.is-dragging {
  cursor: grabbing;
  transform: translate3d(0, var(--dr88-support-drag-y, 0px), 0);
  transition: none;
  will-change: transform;
}

.dr88aph-support-fab.is-dragging .dr88aph-support-fab__icon {
  animation-play-state: paused;
}

.dr88aph-support-fab__icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  border: 3px solid #ffe34c;
  border-radius: 50%;
  background: linear-gradient(145deg, #46b8eb, #229ed9 56%, #147fba);
  color: #ffffff;
  box-shadow:
    0 0 0 4px #76070c,
    0 13px 24px rgba(27, 1, 4, 0.38),
    inset 0 2px 0 rgba(255, 255, 255, 0.4);
  transform-origin: center;
  animation: dr88aph-support-breathe 2.15s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

@keyframes dr88aph-support-breathe {
  0%, 100% {
    transform: scale(1);
    box-shadow:
      0 0 0 4px #76070c,
      0 13px 24px rgba(27, 1, 4, 0.38),
      inset 0 2px 0 rgba(255, 255, 255, 0.4);
  }
  50% {
    transform: scale(1.09);
    box-shadow:
      0 0 0 6px rgba(255, 227, 76, 0.32),
      0 17px 30px rgba(27, 1, 4, 0.48),
      inset 0 2px 0 rgba(255, 255, 255, 0.48);
  }
}

.dr88aph-support-fab__icon svg {
  width: 31px;
  height: 31px;
  transform: translate(-1px, 1px);
}

.dr88aph-support-fab__copy {
  display: grid;
  gap: 2px;
  min-width: max-content;
  padding: 9px 13px;
  border: 1px solid rgba(255, 227, 76, 0.78);
  border-radius: 12px;
  background: linear-gradient(135deg, #78070d, #430105);
  box-shadow: 0 10px 24px rgba(38, 1, 4, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.dr88aph-support-fab__copy strong {
  color: #fff8e7;
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
  white-space: nowrap;
}

.dr88aph-support-fab__copy small {
  color: #f0cf78;
  font-size: 10px;
  font-weight: 600;
  line-height: 14px;
  white-space: nowrap;
}

@media (hover: hover) and (pointer: fine) {
  .dr88aph-support-fab:hover {
    transform: translateY(-50%) translateY(-4px) scale(1.02);
    box-shadow: none;
    color: #fff8e7;
  }

  .dr88aph-support-fab.is-user-positioned:hover,
  .dr88aph-support-fab.is-user-positioned.is-dragging {
    transform: none;
  }

  .dr88aph-support-fab:hover .dr88aph-support-fab__icon {
    animation-play-state: paused;
    box-shadow:
      0 0 0 4px #8f0911,
      0 17px 30px rgba(27, 1, 4, 0.46),
      inset 0 2px 0 rgba(255, 255, 255, 0.46);
  }
}

.dr88aph-support-fab__link:focus-visible,
.dr88aph-support-fab__dismiss:focus-visible {
  outline: 3px solid #fff8e7;
  outline-offset: 3px;
}

.dr88aph-support-fab__dismiss:hover,
.dr88aph-support-fab__dismiss:active {
  transform: none;
  background: transparent;
  box-shadow: none;
}

.dr88aph:has(.dr88aph-dialog[open]) .dr88aph-support-fab {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 1100px) {
  .dr88aph-support-fab {
    left: auto;
    right: max(10px, env(safe-area-inset-right));
    top: 50%;
    bottom: auto;
    min-width: 0;
    min-height: 58px;
    width: 58px;
    height: 58px;
    padding: 4px;
    border-radius: 50%;
  }

  .dr88aph-support-fab.is-user-positioned {
    left: var(--dr88-support-x);
    right: auto;
    top: var(--dr88-support-y);
    transform: none;
  }

  .dr88aph-support-fab__icon {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
    border-radius: 50%;
  }

  .dr88aph-support-fab__icon svg {
    width: 27px;
    height: 27px;
  }

  .dr88aph-support-fab__copy {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  .dr88aph-support-fab__dismiss {
    top: -14px;
    left: -14px;
  }

  .dr88aph-support-fab.is-snap-left .dr88aph-support-fab__dismiss {
    right: -14px;
    left: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph-support-fab { transition: none; }
  .dr88aph-support-fab__icon { animation: none; }
}

body.dr88aph-page {
  margin: 0 !important;
  padding: 0 !important;
  background: var(--dr88-wine-deep) !important;
  color: var(--dr88-ink) !important;
}

body.dr88aph-page #header,
body.dr88aph-page #masthead,
body.dr88aph-page .header-wrapper,
body.dr88aph-page #footer,
body.dr88aph-page .footer-wrapper,
body.dr88aph-page .page-title,
body.dr88aph-page .entry-header,
body.dr88aph-page .page-header,
body.dr88aph-page .entry-title,
body.dr88aph-page .wp-block-post-title,
body.dr88aph-page header.wp-block-template-part,
body.dr88aph-page footer.wp-block-template-part {
  display: none !important;
}

body.dr88aph-page #wrapper,
body.dr88aph-page #main,
body.dr88aph-page #content,
body.dr88aph-page .site-main,
body.dr88aph-page .site-content,
body.dr88aph-page .content-area,
body.dr88aph-page .entry-content,
body.dr88aph-page .row-main,
body.dr88aph-page .row-main > .col,
body.dr88aph-page .col-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.dr88aph-page .wp-site-blocks {
  padding: 0 !important;
}

body.dr88aph-page .wp-site-blocks > main,
body.dr88aph-page main#wp--skip-link--target,
body.dr88aph-page .wp-block-group.alignfull,
body.dr88aph-page .wp-site-blocks > main > .wp-block-group,
body.dr88aph-page .page-wrapper,
body.dr88aph-page .page-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dr88aph,
.dr88aph * {
  box-sizing: border-box;
}

.dr88aph button,
.dr88aph input,
.dr88aph textarea,
.dr88aph select {
  text-transform: none;
}

.dr88aph {
  position: relative;
  isolation: isolate;
  width: 100%;
  min-height: 100vh;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  overflow: clip;
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 227, 76, 0.18), transparent 24rem),
    radial-gradient(circle at 88% 38%, rgba(223, 37, 42, 0.3), transparent 32rem),
    linear-gradient(145deg, #2a0104 0%, #65070c 46%, #2e0104 100%);
  color: var(--dr88-ink);
  font-family: var(--dr88-font-ui);
  font-size: 16px;
  line-height: 1.5;
}

.dr88aph::before {
  content: "";
  position: fixed;
  z-index: -1;
  right: -11rem;
  bottom: -16rem;
  width: min(56vw, 760px);
  aspect-ratio: 1;
  background: url("../images/dong-son-drum-800.webp") center / contain no-repeat;
  opacity: 0.12;
  pointer-events: none;
}

.dr88aph img {
  display: block;
  max-width: 100%;
  height: auto;
}

.dr88aph a {
  color: inherit;
  text-decoration: none;
}

.dr88aph svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dr88aph [hidden] {
  display: none !important;
}

.dr88aph-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.dr88aph-shell {
  width: min(1180px, calc(100% - 40px));
  margin-inline: auto;
}

.dr88aph-skip {
  position: fixed;
  z-index: 9999;
  top: -90px;
  left: 20px;
  padding: 12px 18px;
  border-radius: 10px;
  background: var(--dr88-gold);
  color: #311900;
  font-weight: 800;
}

.dr88aph-skip:focus {
  top: 12px;
}

body.admin-bar .dr88aph-skip:focus {
  top: 44px;
}

.dr88aph-header {
  top: 0;
  padding: 14px 0 0;
}

body.admin-bar .dr88aph-header {
  top: 32px;
}

.dr88aph-header__inner {
  display: flex;
  align-items: center;
  gap: clamp(12px, 1.2vw, 22px);
  min-height: 72px;
  padding: 9px 14px 9px 18px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 16px 38px rgba(18, 1, 4, 0.25);
}

.dr88aph-brand {
  display: flex;
  align-items: center;
  flex: none;
  gap: 10px;
  min-height: 44px;
}

.dr88aph-brand > img {
  width: 91px;
  height: 44px;
  padding: 7px 10px;
  border-radius: 10px;
  background: linear-gradient(145deg, #6d0509, #b70d16 55%, #470306);
  object-fit: contain;
}

.dr88aph-brand > span {
  display: grid;
  gap: 1px;
}

.dr88aph-brand b {
  color: #8d0910;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.02em;
}

.dr88aph-brand small {
  color: var(--dr88-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

.dr88aph-main-nav {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  gap: 4px;
}

.dr88aph-nav-overflow { display: contents; }
.dr88aph-nav-link.is-home { order: 1; }
.dr88aph-nav-link.is-matches { order: 2; }
.dr88aph-nav-link.is-wheel { order: 3; }
.dr88aph-nav-link.is-rules { order: 4; }
.dr88aph-nav-link.is-results { order: 5; }
.dr88aph-nav-link.is-mine { order: 6; }

.dr88aph-nav-more {
  position: relative;
  display: none;
  order: 7;
  min-width: 0;
  min-height: 44px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #596273;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  cursor: pointer;
}

.dr88aph-nav-more svg { width: 18px; height: 18px; }
.dr88aph-nav-more:hover,
.dr88aph-nav-more.is-active,
.dr88aph-nav-more[aria-expanded="true"] { background: #fff0ed; color: #a30a12; }

.dr88aph-main-nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 clamp(8px, 0.65vw, 13px);
  border-radius: 10px;
  color: #596273;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  transition: background 0.18s ease-out, color 0.18s ease-out;
}

.dr88aph-main-nav a svg {
  display: none;
}

.dr88aph-main-nav a:hover,
.dr88aph-main-nav a.is-active {
  background: #fff0ed;
  color: #a30a12;
}

.dr88aph-main-nav a.is-active::after {
  content: "";
  position: absolute;
  right: 14px;
  bottom: 5px;
  left: 14px;
  height: 2px;
  border-radius: 2px;
  background: var(--dr88-red);
}

.dr88aph-nav-more:focus-visible { outline: 3px solid #7a060b; outline-offset: 3px; }

.dr88aph-primary,
.dr88aph-secondary {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 48px;
  gap: 10px;
  padding: 12px 20px;
  overflow: hidden;
  border: 1px solid rgba(255, 226, 74, 0.82);
  border-radius: 12px;
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0.2) 0 8%, transparent 23% 56%, rgba(255, 213, 89, 0.16) 74%, transparent 88%),
    linear-gradient(145deg, #6d0509 0%, #c8181e 46%, #95090f 72%, #520306 100%);
  box-shadow: 0 13px 28px rgba(4, 11, 22, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 -2px 0 rgba(77, 0, 4, 0.55);
  color: #fffdf1 !important;
  font-size: 15px;
  font-weight: 800;
  line-height: 22px;
  letter-spacing: 0.015em;
  text-shadow: 0 1px 2px rgba(44, 0, 2, 0.58);
  cursor: pointer;
  transition: transform 0.18s ease-out, box-shadow 0.18s ease-out, filter 0.18s ease-out;
}

.dr88aph-secondary {
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0.12), transparent 30% 72%, rgba(255, 210, 76, 0.1)),
    linear-gradient(145deg, #470306, #89080d 52%, #300205);
}

.dr88aph-primary::before,
.dr88aph-secondary::before {
  content: "";
  width: 17px;
  aspect-ratio: 1;
  flex: 0 0 17px;
  background: var(--dr88-gold);
  clip-path: polygon(50% 0%, 61% 35%, 98% 36%, 68% 57%, 79% 94%, 50% 72%, 21% 94%, 32% 57%, 2% 36%, 39% 35%);
  filter: drop-shadow(0 2px 2px rgba(65, 15, 0, 0.42));
}

.dr88aph-primary.has-vietnam-flag::before {
  display: none;
}

.dr88aph-primary:hover,
.dr88aph-secondary:hover {
  transform: translateY(-2px);
  border-color: #ffed76;
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0.25) 0 10%, transparent 26% 54%, rgba(255, 219, 94, 0.2) 76%, transparent 90%),
    linear-gradient(145deg, #81070b 0%, #df252a 46%, #a10c12 72%, #5a0407 100%);
  box-shadow: 0 17px 34px rgba(4, 11, 22, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  filter: saturate(1.06);
}

.dr88aph-primary:active,
.dr88aph-secondary:active {
  transform: translateY(1px);
  box-shadow: 0 7px 16px rgba(4, 11, 22, 0.24), inset 0 2px 4px rgba(38, 0, 3, 0.32);
}

.dr88aph-primary:disabled,
.dr88aph-secondary:disabled {
  opacity: 0.52;
  filter: grayscale(0.55);
  transform: none;
  cursor: not-allowed;
}

.dr88aph-header-cta {
  min-height: 44px;
  padding: 9px 16px;
  font-size: 13px;
}

.dr88aph-header__actions {
  display: flex;
  align-items: center;
  flex: none;
  gap: 8px;
  min-width: 0;
}

.dr88aph-site-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid rgba(185, 132, 21, 0.72);
  border-radius: 12px;
  background: linear-gradient(145deg, #fffdf7, #fff0d5);
  box-shadow: 0 5px 13px rgba(94, 0, 12, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.86);
  color: #70060b;
  font-size: 13px;
  font-weight: 800;
  line-height: 20px;
  white-space: nowrap;
  transition: transform 180ms ease-out, box-shadow 180ms ease-out, background-color 180ms ease-out, border-color 180ms ease-out;
}

.dr88aph-site-link .dr88aph-nav-icon {
  display: block;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

.dr88aph-site-link__short {
  display: none;
}

.dr88aph-site-link:hover {
  border-color: #d9a62e;
  background: #fff;
  box-shadow: 0 9px 20px rgba(94, 0, 12, 0.17);
  color: #940b13;
  transform: translateY(-2px);
}

.dr88aph-site-link:active {
  box-shadow: 0 4px 10px rgba(94, 0, 12, 0.12);
  transform: translateY(0) scale(0.98);
}

.dr88aph-site-link:focus-visible {
  outline: 3px solid rgba(217, 166, 46, 0.42);
  outline-offset: 2px;
}

@media (max-width: 1500px) {
  .dr88aph-site-link__full {
    display: none;
  }

  .dr88aph-site-link__short {
    display: inline;
  }
}

@media (max-width: 1100px) {
  .dr88aph-header__actions {
    flex: 1 1 auto;
    justify-content: flex-end;
  }

  .dr88aph-site-link {
    width: 44px;
    min-width: 44px;
    padding: 0;
  }

  .dr88aph-site-link__label {
    display: none;
  }
}

@media (max-width: 620px) {
  .dr88aph-header__actions {
    gap: 6px;
  }

  .dr88aph-site-link {
    width: 40px;
    min-width: 40px;
    min-height: 44px;
  }
}

.dr88aph .dr88aph-inline-icon {
  width: 18px;
  height: 18px;
}

.dr88aph-button-flag {
  display: grid;
  place-items: center;
  width: 30px;
  height: 21px;
  flex: 0 0 30px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 4px;
  box-shadow: 0 2px 0 rgba(61, 0, 3, 0.48);
}

.dr88aph-button-flag svg {
  width: 100%;
  height: 100%;
  stroke: none;
}

.dr88aph-button-flag svg path:first-child {
  fill: #da251d;
}

.dr88aph-button-flag svg path:last-child {
  fill: #ffeb00;
}

.dr88aph-main {
  min-height: calc(100vh - 154px);
  padding: 28px 0 52px;
}

.dr88aph-demo {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 227, 76, 0.52);
  border-radius: 12px;
  background: rgba(50, 1, 5, 0.78);
  color: #fff6d0;
  font-size: 13px;
  line-height: 18px;
}

.dr88aph-demo strong {
  flex: none;
  color: var(--dr88-gold);
  font-size: 12px;
  font-weight: 800;
}

.dr88aph-panel {
  overflow: hidden;
  border-radius: var(--dr88-radius);
  background: var(--dr88-white);
  box-shadow: var(--dr88-shadow);
}

.dr88aph-home {
  display: grid;
  grid-template-columns: minmax(390px, 0.9fr) minmax(0, 1.1fr);
  min-height: 690px;
}

.dr88aph-home__poster {
  position: relative;
  grid-row: 1 / span 2;
  min-height: 690px;
  margin: 0;
  overflow: hidden;
  background: var(--dr88-wine);
}

.dr88aph-home__poster::after {
  content: "";
  position: absolute;
  inset: 0;
  border-right: 1px solid rgba(255, 227, 76, 0.72);
  box-shadow: inset -34px 0 54px rgba(37, 0, 3, 0.2);
  pointer-events: none;
}

.dr88aph-home__poster picture {
  display: block;
  width: 100%;
  height: 100%;
}

.dr88aph-home__poster img {
  width: 100%;
  height: 100%;
  min-height: 690px;
  object-fit: cover;
  object-position: center top;
}

.dr88aph-home__content {
  align-self: start;
  padding: 42px 48px 26px;
}

.dr88aph-campaign-mark {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--dr88-line);
  color: var(--dr88-red);
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
}

.dr88aph-home h1 {
  max-width: 620px;
  margin: 28px 0 0;
  padding-block: 0.08em;
  color: var(--dr88-ink);
  font-size: clamp(38px, 4.6vw, 56px);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.dr88aph-home h1 strong {
  color: var(--dr88-red);
  font-weight: 800;
}

.dr88aph-home__content > p {
  max-width: 60ch;
  margin: 16px 0 0;
  color: var(--dr88-muted);
  font-size: 16px;
  line-height: 24px;
}

.dr88aph-next-match {
  display: grid;
  grid-template-columns: minmax(130px, 0.7fr) minmax(260px, 1.3fr);
  align-items: center;
  gap: 22px;
  margin-top: 24px;
  padding: 16px 18px;
  border-radius: 14px;
  background: linear-gradient(145deg, #3b0306, #70070c);
  color: var(--dr88-white);
  box-shadow: 0 14px 28px rgba(40, 0, 4, 0.2);
}

.dr88aph-next-match > div:first-child {
  display: grid;
  gap: 4px;
}

.dr88aph-next-match > div:first-child span {
  color: #ffd966;
  font-size: 12px;
  font-weight: 800;
}

.dr88aph-next-match time {
  color: #fff5f0;
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.dr88aph-next-match__teams {
  display: grid;
  grid-template-columns: 1fr 32px 1fr;
  align-items: center;
  gap: 8px;
}

.dr88aph-next-match__teams > b {
  color: #ffdb62;
  font-size: 12px;
  text-align: center;
}

.dr88aph-next-match .dr88aph-team strong {
  color: var(--dr88-white);
}

.dr88aph-home__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.dr88aph-trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin: 26px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--dr88-line);
  list-style: none;
}

.dr88aph-trust li {
  display: grid;
  gap: 2px;
  padding-right: 12px;
}

.dr88aph-trust li + li {
  padding-left: 16px;
  border-left: 1px solid var(--dr88-line);
}

.dr88aph-trust b {
  color: var(--dr88-red);
  font-size: 20px;
  font-weight: 800;
  line-height: 26px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-trust span {
  color: var(--dr88-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}

.dr88aph-home__schedule {
  align-self: end;
  min-width: 0;
  padding: 0 48px 36px;
}

.dr88aph-home__schedule > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
}

.dr88aph-home__schedule > header > div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dr88aph-home__schedule > header > div > svg {
  color: var(--dr88-red);
}

.dr88aph-home__schedule > header span {
  display: grid;
}

.dr88aph-home__schedule > header b {
  color: var(--dr88-ink);
  font-size: 14px;
}

.dr88aph-home__schedule > header small {
  color: var(--dr88-muted);
  font-size: 12px;
}

.dr88aph-home__schedule > header a,
.dr88aph-text-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding-inline: 4px;
  color: var(--dr88-red);
  font-size: 13px;
  font-weight: 800;
}

.dr88aph-home__schedule > header a:hover,
.dr88aph-text-link:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.dr88aph-fixture-rail {
  display: flex;
  gap: 9px;
  min-width: 0;
  padding: 2px 2px 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  scrollbar-color: #ba8a63 transparent;
  scrollbar-width: thin;
}

.dr88aph-fixture-tab {
  display: grid;
  flex: 0 0 118px;
  justify-items: center;
  gap: 7px;
  min-height: 78px;
  padding: 9px 10px;
  border: 1px solid var(--dr88-line);
  border-radius: 12px;
  background: var(--dr88-white);
  color: #505969;
  scroll-snap-align: start;
  transition: border-color 0.18s ease-out, background 0.18s ease-out, color 0.18s ease-out, transform 0.18s ease-out;
}

.dr88aph-fixture-tab:hover {
  transform: translateY(-2px);
  border-color: #d9a40d;
}

.dr88aph-fixture-tab.is-active {
  border-color: var(--dr88-red);
  background: #fff0ed;
  color: #8c0910;
}

.dr88aph-fixture-tab time {
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-fixture-tab > span {
  display: flex;
  align-items: center;
  gap: 7px;
}

.dr88aph-fixture-tab img {
  width: 34px;
  height: 23px;
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
}

.dr88aph-fixture-tab i {
  color: #9a8178;
  font-size: 12px;
  font-style: normal;
}

.dr88aph-workspace,
.dr88aph-rules-page,
.dr88aph-results-page,
.dr88aph-history-page {
  min-height: 610px;
  padding: 32px;
}

.dr88aph-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--dr88-line);
}

.dr88aph-page-head h1 {
  margin: 0;
  padding-block: 0.05em;
  color: var(--dr88-ink);
  font-size: clamp(30px, 4vw, 40px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.dr88aph-page-head p {
  max-width: 68ch;
  margin: 8px 0 0;
  color: var(--dr88-muted);
  font-size: 15px;
  line-height: 23px;
}

.dr88aph-page-head__cta {
  white-space: nowrap;
}

.dr88aph-filters,
.dr88aph-segmented {
  display: flex;
  gap: 8px;
  margin: 22px 0 18px;
  overflow-x: auto;
  scrollbar-width: none;
}

.dr88aph-filters::-webkit-scrollbar,
.dr88aph-segmented::-webkit-scrollbar {
  display: none;
}

.dr88aph-filters a,
.dr88aph-segmented a {
  display: grid;
  place-items: center;
  flex: none;
  min-width: 92px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--dr88-line);
  border-radius: 999px;
  background: var(--dr88-white);
  color: #596273;
  font-size: 13px;
  font-weight: 800;
}

.dr88aph-filters a.is-active,
.dr88aph-segmented a.is-active {
  border-color: #a60a12;
  background: linear-gradient(145deg, #7a060b, #c91820 58%, #67050a);
  box-shadow: 0 7px 15px rgba(102, 3, 9, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.28);
  color: var(--dr88-white);
}

.dr88aph-fixture-rail.is-workspace {
  margin: 0 -2px 22px;
  padding-bottom: 12px;
}

.dr88aph-selected-match {
  width: min(760px, 100%);
  margin: 0 auto;
}

.dr88aph-match {
  padding: 24px;
  border: 1px solid var(--dr88-line);
  border-radius: 16px;
  background: var(--dr88-white);
  box-shadow: 0 18px 42px rgba(48, 12, 10, 0.12);
}

.dr88aph-match__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--dr88-line);
}

.dr88aph-match__meta > span:first-child {
  color: #8c0910;
  font-size: 13px;
  font-weight: 800;
  line-height: 18px;
}

.dr88aph-status {
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: 7px;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #edfdf5;
  color: var(--dr88-green);
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
}

.dr88aph-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #12b981;
  box-shadow: 0 0 0 4px rgba(18, 185, 129, 0.12);
}

.dr88aph-status.is-closing {
  background: #fff6de;
  color: #8b5600;
}

.dr88aph-status.is-closing i {
  background: #e39808;
}

.dr88aph-status.is-locked {
  background: #eef0f3;
  color: #596273;
}

.dr88aph-status.is-locked i {
  background: #7b8493;
}

.dr88aph-status.is-result_published {
  background: #eef4ff;
  color: #315da8;
}

.dr88aph-status.is-result_published i {
  background: #4d7fd2;
}

.dr88aph-match__time {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 13px;
}

.dr88aph-match__time > span:first-child {
  display: grid;
  gap: 2px;
}

.dr88aph-match__time small {
  color: var(--dr88-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}

.dr88aph-match__time time {
  color: #283144;
  font-size: 14px;
  font-weight: 800;
  line-height: 20px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-countdown {
  padding: 7px 10px;
  border: 1px solid #efb3b6;
  border-radius: 9px;
  background: #fff1f1;
  color: #9e0a12;
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-task-label {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 19px;
  color: var(--dr88-ink);
}

.dr88aph-task-label span,
.dr88aph-corners legend > span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border-radius: 8px;
  background: var(--dr88-red);
  color: var(--dr88-white);
  font-size: 12px;
  font-weight: 800;
}

.dr88aph-task-label b {
  font-size: 14px;
  line-height: 20px;
}

.dr88aph-score-builder {
  display: grid;
  grid-template-columns: 1fr 44px 1fr;
  align-items: center;
  gap: 12px;
  margin: 17px 0 24px;
}

.dr88aph-score-side {
  display: grid;
  justify-items: center;
  gap: 15px;
  min-width: 0;
}

.dr88aph-score-builder__vs {
  display: grid;
  justify-items: center;
  color: #8d96a4;
}

.dr88aph-score-builder__vs b {
  color: var(--dr88-red);
  font-size: 34px;
  font-weight: 800;
  line-height: 38px;
}

.dr88aph-score-builder__vs small {
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
}

.dr88aph-team {
  display: grid;
  justify-items: center;
  gap: 8px;
  min-width: 0;
  text-align: center;
}

.dr88aph-team__flag {
  display: grid;
  place-items: center;
  width: 66px;
  height: 48px;
  padding: 6px;
  border: 1px solid #e5d5ad;
  border-radius: 12px;
  background: #fffaf0;
  box-shadow: 0 5px 11px rgba(68, 40, 7, 0.13), inset 0 1px 0 var(--dr88-white);
}

.dr88aph-team__flag img {
  width: 50px;
  height: 33px;
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
}

.dr88aph-team strong {
  max-width: 150px;
  overflow: hidden;
  color: var(--dr88-ink);
  font-size: 13px;
  font-weight: 800;
  line-height: 19px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-team.is-large .dr88aph-team__flag {
  width: 76px;
  height: 54px;
}

.dr88aph-team.is-large .dr88aph-team__flag img {
  width: 58px;
  height: 38px;
}

.dr88aph-team.is-large strong {
  font-size: 14px;
  line-height: 20px;
}

.dr88aph-score-input {
  display: grid;
  place-items: center;
}

.dr88aph-score-input input {
  width: 62px;
  height: 56px;
  padding: 0 6px;
  border: 1px solid #473e26;
  border-radius: 11px;
  outline: 0;
  appearance: textfield;
  background: linear-gradient(155deg, #211d18, #080707);
  box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.46), 0 4px 0 #c88a13, 0 9px 18px rgba(23, 12, 5, 0.2);
  color: #fff0b3;
  font-size: 36px;
  font-weight: 800;
  line-height: 40px;
  text-align: center;
  caret-color: var(--dr88-gold);
  font-variant-numeric: tabular-nums;
}

.dr88aph-score-input input::-webkit-inner-spin-button,
.dr88aph-score-input input::-webkit-outer-spin-button { margin: 0; appearance: none; }

.dr88aph-score-input input:hover { border-color: #d39b24; }
.dr88aph-score-input input:focus-visible { box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.46), 0 4px 0 #c88a13, 0 0 0 4px rgba(255, 227, 76, 0.34); }
.dr88aph-score-input input[aria-invalid="true"] { border-color: #ff7075; box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.46), 0 4px 0 #a30a12, 0 0 0 4px rgba(200, 24, 30, 0.18); }
.dr88aph-score-input input:disabled { opacity: 0.45; box-shadow: none; cursor: not-allowed; }

.dr88aph-corners {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0;
  padding: 18px 0 0;
  border: 0;
  border-top: 1px solid var(--dr88-line);
}

.dr88aph-corners legend {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 26px auto 1fr;
  align-items: center;
  gap: 9px;
  width: 100%;
  margin-bottom: 8px;
}

.dr88aph-corners legend b {
  color: var(--dr88-ink);
  font-size: 14px;
  line-height: 20px;
}

.dr88aph-corners legend small {
  justify-self: end;
  color: var(--dr88-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}

.dr88aph-corners label {
  position: relative;
  cursor: pointer;
}

.dr88aph-corners input {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.dr88aph-corners input:disabled {
  cursor: not-allowed;
}

.dr88aph-corners input:disabled + span {
  background: #f4f1ee;
  color: var(--dr88-muted);
  opacity: 0.64;
}

.dr88aph-corners label > span {
  position: relative;
  display: grid;
  min-height: 68px;
  align-content: center;
  gap: 3px;
  padding: 12px 44px 12px 16px;
  border: 1px solid #dcd6d1;
  border-radius: 12px;
  background: #fffaf6;
  transition: border-color 0.18s ease-out, background 0.18s ease-out, box-shadow 0.18s ease-out;
}

.dr88aph-corners label b {
  color: #323b4d;
  font-size: 15px;
  line-height: 20px;
}

.dr88aph-corners label em {
  color: var(--dr88-muted);
  font-size: 12px;
  font-style: normal;
  line-height: 18px;
}

.dr88aph-corners label > span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 15px;
  width: 23px;
  height: 23px;
  border: 1px solid #c9c1bb;
  border-radius: 50%;
  background: var(--dr88-white);
  transform: translateY(-50%);
}

.dr88aph-corners input:checked + span {
  border-color: var(--dr88-red);
  background: #fff0ed;
  box-shadow: 0 0 0 3px rgba(183, 13, 22, 0.1);
}

.dr88aph-corners input:focus-visible + span {
  outline: 3px solid #7a060b;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(255, 227, 76, 0.72);
}

.dr88aph-corners input:checked + span::after {
  border-color: #b77a0a;
  background: var(--dr88-gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 10 3 3 7-7' fill='none' stroke='%235d3200' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.dr88aph-field-error,
.dr88aph-card-status {
  min-height: 0;
  margin: 9px 0 0;
  color: #a30a12;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}

.dr88aph-field-error:empty,
.dr88aph-card-status:empty {
  display: none;
}

.dr88aph-card-status {
  color: var(--dr88-green);
}

.dr88aph-submit-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 16px 0 11px;
  color: var(--dr88-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}

.dr88aph-submit-meta b {
  color: var(--dr88-red);
}

.dr88aph-match > .dr88aph-primary {
  width: 100%;
}

.dr88aph-result-score {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  margin: 30px 0 22px;
}

.dr88aph-result-score > strong {
  display: flex;
  align-items: center;
  gap: 11px;
  color: var(--dr88-ink);
  font-size: 36px;
  line-height: 40px;
}

.dr88aph-result-score > strong span {
  color: #9b8e86;
}

.dr88aph-corners-result {
  margin: 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fff4df;
  color: #5c4719;
  font-size: 14px;
  line-height: 21px;
  text-align: center;
}

.dr88aph-rule-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin: 24px 0 30px;
  overflow: hidden;
  border-radius: 14px;
  background: #e6d9d2;
}

.dr88aph-rule-summary > div {
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: 12px;
  min-height: 92px;
  padding: 16px;
  background: #fffaf6;
}

.dr88aph-rule-summary > div > b {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--dr88-red);
  color: var(--dr88-white);
  font-size: 15px;
}

.dr88aph-rule-summary span {
  display: grid;
  gap: 3px;
}

.dr88aph-rule-summary strong {
  color: var(--dr88-ink);
  font-size: 14px;
  line-height: 20px;
}

.dr88aph-rule-summary small {
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-prize-sample {
  overflow: hidden;
  border-radius: 16px;
  background: var(--dr88-paper);
  box-shadow: 0 16px 34px rgba(58, 16, 10, 0.1);
}

.dr88aph-sample-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 16px;
  background: #3f0306;
  color: #fff6d0;
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-sample-label strong {
  color: var(--dr88-gold);
}

.dr88aph-prize-sample > header {
  padding: 25px 26px 22px;
  background: linear-gradient(145deg, #71070c, #c91820 62%, #75070c);
  color: var(--dr88-white);
}

.dr88aph-prize-sample > header > span {
  color: #ffdf76;
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
}

.dr88aph-prize-sample h2 {
  margin: 5px 0 0;
  padding-block: 0.05em;
  color: var(--dr88-white);
  font-size: 30px;
  font-weight: 800;
  line-height: 38px;
  letter-spacing: -0.02em;
}

.dr88aph-prize-sample > header p {
  max-width: 75ch;
  margin: 7px 0 0;
  color: #ffe8e5;
  font-size: 14px;
  line-height: 21px;
}

.dr88aph-prize-sample > h3 {
  margin: 24px 26px 10px;
  color: var(--dr88-ink);
  font-size: 18px;
  font-weight: 800;
  line-height: 26px;
}

.dr88aph-prize-sample > .dr88aph-table-wrap {
  margin: 0 26px;
}

.dr88aph-table-wrap {
  overflow: auto;
  border-radius: 12px;
  background: var(--dr88-white);
  box-shadow: 0 0 0 1px var(--dr88-line);
  scrollbar-color: #b77f59 #fff4ec;
  scrollbar-width: thin;
}

.dr88aph-table-wrap:focus-visible {
  outline: 3px solid #7a060b;
  outline-offset: 3px;
}

.dr88aph-prize-table,
.dr88aph-ranking {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  color: #394255;
  font-size: 13px;
  line-height: 19px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-prize-table.is-vip {
  min-width: 820px;
  text-align: center;
}

.dr88aph-prize-table th,
.dr88aph-prize-table td,
.dr88aph-ranking th,
.dr88aph-ranking td {
  padding: 13px 15px;
  border-bottom: 1px solid #eee5df;
  text-align: left;
}

.dr88aph-prize-table.is-vip th,
.dr88aph-prize-table.is-vip td {
  text-align: center;
}

.dr88aph-prize-table.is-vip th:first-child,
.dr88aph-prize-table.is-vip td:first-child {
  text-align: left;
}

.dr88aph-prize-table th,
.dr88aph-ranking th {
  background: #b80f18;
  color: var(--dr88-white);
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
}

.dr88aph-prize-table tbody tr:last-child td,
.dr88aph-ranking tbody tr:last-child td {
  border-bottom: 0;
}

.dr88aph-prize-table td:first-child strong {
  color: #a30a12;
}

.dr88aph-sample-note {
  margin: 22px 26px 26px;
  padding: 13px 15px;
  border-radius: 10px;
  background: #fff0d9;
  color: #674b18;
  font-size: 13px;
  line-height: 20px;
}

.dr88aph-policy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 28px;
}

.dr88aph-policy-grid > section {
  padding: 22px;
  border-radius: 14px;
  background: #fff8f2;
  box-shadow: 0 0 0 1px var(--dr88-line);
}

.dr88aph-policy-grid h2 {
  margin: 0;
  color: var(--dr88-ink);
  font-size: 20px;
  line-height: 28px;
}

.dr88aph-policy-grid ul {
  display: grid;
  gap: 8px;
  margin: 14px 0 0;
  padding-left: 20px;
  color: #4f596b;
  font-size: 14px;
  line-height: 21px;
}

.dr88aph-policy-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  color: #8b5808;
  font-size: 13px;
  font-weight: 800;
}

.dr88aph-policy-status i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #e1a21c;
  box-shadow: 0 0 0 4px rgba(225, 162, 28, 0.15);
}

.dr88aph-segmented {
  width: fit-content;
  padding: 4px;
  border-radius: 999px;
  background: #f0ebe7;
}

.dr88aph-segmented a {
  min-width: 150px;
  border: 0;
  background: transparent;
}

/* V4 route surfaces: horizontal reward reel and compact rule subviews. */
.dr88aph-wheel-page { padding: 32px; }
.dr88aph-wheel-head { align-items: center; }

.dr88aph-eyebrow,
.dr88aph-section-kicker {
  display: block;
  margin-bottom: 7px;
  color: #9d0a11;
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
  letter-spacing: 0.1em;
}

.dr88aph-demo-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 44px;
  padding: 8px 13px;
  border: 1px solid #e7c978;
  border-radius: 999px;
  background: #fff4cf;
  color: #704606;
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.dr88aph-wheel-subnav,
.dr88aph-rules-subnav { margin-block: 18px; }

.dr88aph-wheel-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, 0.68fr);
  align-items: start;
  gap: 18px;
}

.dr88aph-wheel-console {
  min-width: 0;
  padding: 18px;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255, 227, 76, 0.08), transparent 30%), linear-gradient(155deg, #570408, #2b0205 58%, #180103);
  box-shadow: 0 18px 38px rgba(35, 0, 4, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  color: #fffdf5;
}

.dr88aph-wheel-console > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 15px;
}

.dr88aph-wheel-console > header span { color: #ffd968; font-size: 10px; font-weight: 800; line-height: 15px; letter-spacing: 0.13em; }
.dr88aph-wheel-console > header h2 { margin: 3px 0 0; color: #fffdf5; font-size: clamp(21px, 2.4vw, 28px); font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; }

.dr88aph-wheel-console > header > b {
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: 7px;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(255, 246, 208, 0.1);
  color: #fff0b6;
  font-size: 10px;
  line-height: 15px;
  letter-spacing: 0.08em;
}

.dr88aph-wheel-console > header > b i { width: 7px; height: 7px; border-radius: 50%; background: var(--dr88-gold); box-shadow: 0 0 0 4px rgba(255, 227, 76, 0.12); }

.dr88aph-wheel-stage {
  position: relative;
  height: 198px;
  padding: 14px 0;
  overflow: hidden;
  border: 1px solid rgba(255, 227, 76, 0.42);
  border-radius: 11px;
  background: linear-gradient(180deg, #320206, #120104 20%, #090103 78%, #3b0307);
  box-shadow: inset 0 0 32px rgba(0, 0, 0, 0.86), inset 0 2px 0 rgba(255, 244, 195, 0.08);
  perspective: 900px;
}

.dr88aph-wheel-stage::before,
.dr88aph-wheel-stage::after { content: ""; position: absolute; z-index: 8; top: 0; bottom: 0; width: 12%; pointer-events: none; }
.dr88aph-wheel-stage::before { left: 0; background: linear-gradient(90deg, #0b0103, transparent); }
.dr88aph-wheel-stage::after { right: 0; background: linear-gradient(-90deg, #0b0103, transparent); }

.dr88aph-wheel-track {
  display: flex;
  align-items: center;
  width: max-content;
  min-width: 100%;
  height: 100%;
  gap: 10px;
  padding: 0 16px;
  transform: translate3d(0, 0, 0);
  transform-style: preserve-3d;
  will-change: transform;
}

.dr88aph-wheel-marker {
  position: absolute;
  z-index: 12;
  top: -1px;
  bottom: -1px;
  left: 50%;
  width: 3px;
  transform: translateX(-50%);
  background: var(--dr88-gold);
  box-shadow: 0 0 12px rgba(255, 227, 76, 0.72);
  pointer-events: none;
}

.dr88aph-wheel-marker::before,
.dr88aph-wheel-marker::after { content: ""; position: absolute; left: 50%; transform: translateX(-50%); border-right: 10px solid transparent; border-left: 10px solid transparent; }
.dr88aph-wheel-marker::before { top: 0; border-top: 15px solid var(--dr88-gold); }
.dr88aph-wheel-marker::after { bottom: 0; border-bottom: 15px solid var(--dr88-gold); }
.dr88aph-wheel-marker span { position: absolute; top: 50%; left: 50%; width: 9px; height: 32px; transform: translate(-50%, -50%); border-radius: 999px; background: rgba(255, 227, 76, 0.2); }

.dr88aph-wheel-card {
  --dr88aph-prize-accent: #e9a72a;
  position: relative;
  display: flex;
  flex: 0 0 188px;
  height: 158px;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(255, 246, 221, 0.38);
  border-radius: 10px;
  background: linear-gradient(142deg, rgba(255, 255, 255, 0.2), transparent 26%), linear-gradient(155deg, #7d0a10, #360307 55%, #180103);
  box-shadow: 0 13px 22px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 -7px 15px rgba(0, 0, 0, 0.35);
  transform: rotateX(1deg) translateZ(0);
  transform-style: preserve-3d;
}

.dr88aph-wheel-card::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(125deg, transparent 34%, rgba(255, 227, 76, 0.13) 64%, transparent 84%); pointer-events: none; }
.dr88aph-wheel-card::after { content: ""; position: absolute; z-index: -1; right: 6px; bottom: -7px; left: 6px; height: 9px; border-radius: 0 0 8px 8px; background: #100103; transform: translateZ(-8px) rotateX(-28deg); transform-origin: top; }
.dr88aph-wheel-card.is-code { --dr88aph-prize-accent: #ffca45; }
.dr88aph-wheel-card.is-merch { --dr88aph-prize-accent: #ff725f; }
.dr88aph-wheel-card.is-tech { --dr88aph-prize-accent: #f19a38; }
.dr88aph-wheel-card.is-grand { --dr88aph-prize-accent: #ffe34c; }

.dr88aph-wheel-card__symbol { position: absolute; top: 21px; right: 10px; left: 10px; color: #fff6d0; font-size: 34px; font-weight: 800; line-height: 42px; letter-spacing: -0.03em; text-align: center; text-shadow: 0 8px 14px rgba(0, 0, 0, 0.72); }
.dr88aph-wheel-card__info { position: relative; z-index: 2; display: grid; gap: 2px; min-height: 56px; padding: 10px 11px; border-top: 4px solid var(--dr88aph-prize-accent); border-radius: 0 0 9px 9px; background: linear-gradient(95deg, #8a0910, #4d0408); box-shadow: 0 -8px 18px rgba(255, 188, 48, 0.12); }
.dr88aph-wheel-card__info strong { color: #fffdf5; font-size: 13px; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; }
.dr88aph-wheel-card__info small { color: #ffe9df; font-size: 10px; font-weight: 700; line-height: 15px; letter-spacing: 0.06em; text-transform: uppercase; }

.dr88aph-wheel-card.is-winner,
.dr88aph-wheel-card.is-selected,
.dr88aph-wheel-card[data-wheel-winner="true"],
.dr88aph-wheel-card[aria-current="true"] { border-color: var(--dr88-gold); box-shadow: 0 17px 28px rgba(0, 0, 0, 0.62), 0 0 0 2px rgba(255, 227, 76, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.3); transform: translateY(-3px) translateZ(18px); }
.dr88aph-wheel-console[data-state="spinning"] .dr88aph-wheel-stage { box-shadow: inset 0 0 34px rgba(0, 0, 0, 0.9), 0 9px 26px rgba(255, 190, 52, 0.2); }
.dr88aph-wheel-console[data-state="spinning"] .dr88aph-wheel-track { will-change: transform; }

.dr88aph-wheel-actions { display: flex; align-items: center; gap: 16px; margin-top: 17px; }
.dr88aph-wheel-actions .dr88aph-primary { min-width: 184px; }
.dr88aph-wheel-actions p { margin: 0; color: #f7deda; font-size: 12px; line-height: 18px; }

.dr88aph-wheel-result { display: grid; gap: 3px; margin-top: 15px; padding: 13px 15px; scroll-margin-bottom: calc(96px + env(safe-area-inset-bottom)); border-radius: 10px; background: #fff4cf; color: #5a3703; animation: dr88aph-wheel-reveal 0.42s cubic-bezier(0.16, 0.72, 0.24, 1) both; }
.dr88aph-wheel-result span,
.dr88aph-wheel-result small { font-size: 11px; line-height: 16px; }
.dr88aph-wheel-result strong { display: grid; gap: 1px; color: #8e080e; }
.dr88aph-wheel-result strong > span { font-size: 18px; line-height: 24px; }
.dr88aph-wheel-result strong > small {
  color: #7a3504;
  font-size: 11px;
  font-weight: 850;
  line-height: 16px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.dr88aph-wheel-disclaimer { margin: 15px 0 0; padding-top: 13px; border-top: 1px solid rgba(255, 245, 216, 0.16); color: #e9cbc8; font-size: 11px; line-height: 17px; text-align: center; }
.dr88aph-wheel-disclaimer strong { color: #ffe27b; }

@keyframes dr88aph-wheel-reveal {
  from { opacity: 0.35; transform: translateY(7px); filter: blur(2px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

.dr88aph-wheel-pool { min-width: 0; padding: 18px; border: 1px solid var(--dr88-line); border-radius: 14px; background: #fffaf6; }
.dr88aph-wheel-pool > header span { color: #a30a12; font-size: 10px; font-weight: 800; line-height: 15px; letter-spacing: 0.09em; }
.dr88aph-wheel-pool h2 { margin: 3px 0 0; color: var(--dr88-ink); font-size: 18px; line-height: 24px; }
.dr88aph-wheel-pool ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin: 14px 0; padding: 0; overflow: visible; list-style: none; }
.dr88aph-wheel-pool li { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: center; gap: 9px; min-height: 52px; padding: 7px 8px; border-radius: 8px; color: #4b5363; }
.dr88aph-wheel-pool li:nth-child(odd) { background: #fff3ed; }
.dr88aph-wheel-pool li > b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #7d070c; color: #ffe98a; font-size: 11px; font-variant-numeric: tabular-nums; }
.dr88aph-wheel-pool li > span { display: grid; min-width: 0; }
.dr88aph-wheel-pool li strong { display: -webkit-box; overflow: hidden; color: var(--dr88-ink); font-size: 11px; line-height: 16px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.dr88aph-wheel-pool li small { color: var(--dr88-muted); font-size: 10px; line-height: 15px; text-transform: uppercase; }

.dr88aph-wheel-rules { display: grid; gap: 18px; }
.dr88aph-beta-banner { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 3px 14px; padding: 14px 16px; border-radius: 12px; background: linear-gradient(145deg, #590408, #340204); color: #fffdf5; box-shadow: 0 11px 24px rgba(50, 0, 4, 0.2); }
.dr88aph-beta-banner span { grid-row: 1 / span 2; padding: 7px 9px; border-radius: 8px; background: #ffe34c; color: #4b2800; font-size: 10px; font-weight: 800; line-height: 15px; text-align: center; }
.dr88aph-beta-banner strong { color: #ffe985; font-size: 13px; line-height: 18px; }
.dr88aph-beta-banner p { margin: 0; color: #f4d9d5; font-size: 12px; line-height: 18px; }
.dr88aph-rule-summary.is-wheel { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }

.dr88aph-wheel-policy-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.dr88aph-wheel-policy-grid > section,
.dr88aph-live-rules { min-width: 0; padding: 21px; border-radius: 14px; background: #fff8f2; box-shadow: 0 0 0 1px var(--dr88-line); }
.dr88aph-wheel-policy-grid h2,
.dr88aph-live-rules h2 { margin: 0; color: var(--dr88-ink); font-size: 20px; line-height: 28px; }
.dr88aph-wheel-policy-grid ul,
.dr88aph-live-rules ul { display: grid; gap: 8px; margin: 13px 0 0; padding-left: 19px; color: #4f596b; font-size: 13px; line-height: 20px; }
.dr88aph-live-rules ul { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 30px; }
.dr88aph-live-rules strong { color: #9b0910; }
.dr88aph-wheel-rule-prizes { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }
.dr88aph-wheel-rule-prizes span { padding: 7px 9px; border: 1px solid #ead5c9; border-radius: 999px; background: #fffdf5; color: #6f2930; font-size: 11px; font-weight: 700; line-height: 16px; }
.dr88aph-wheel-policy-grid section > p { margin: 13px 0 0; color: var(--dr88-muted); font-size: 12px; line-height: 19px; }
.dr88aph-wheel-back { justify-self: start; }
.dr88aph-policy-grid.is-policy-only { margin-top: 0; }

.dr88aph-results-list {
  display: grid;
  gap: 12px;
  width: min(880px, 100%);
  margin: 0 auto;
}

.dr88aph-result-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.8fr) minmax(320px, 1.4fr) minmax(150px, 0.8fr);
  align-items: center;
  gap: 20px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--dr88-line);
}

.dr88aph-result-row__meta {
  display: grid;
  gap: 3px;
}

.dr88aph-result-row__meta span {
  color: var(--dr88-red);
  font-size: 12px;
  font-weight: 800;
}

.dr88aph-result-row__meta time,
.dr88aph-result-row > p {
  margin: 0;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-result-row__score {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
}

.dr88aph-result-row__score > strong {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 24px;
  line-height: 30px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-result-row__score > strong i {
  color: #9c928c;
  font-style: normal;
}

.dr88aph-result-row .dr88aph-team__flag {
  width: 50px;
  height: 38px;
  padding: 4px;
}

.dr88aph-result-row .dr88aph-team__flag img {
  width: 40px;
  height: 27px;
}

.dr88aph-result-row .dr88aph-team strong {
  font-size: 12px;
}

.dr88aph-result-row > p {
  text-align: right;
}

.dr88aph-ranking {
  min-width: 700px;
}

.dr88aph-ranking th {
  background: #fff2ed;
  color: #6a5b57;
}

.dr88aph-ranking td small {
  display: block;
  margin-top: 2px;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 17px;
}

.dr88aph-ranking td:nth-child(7) b {
  color: var(--dr88-red);
  font-size: 18px;
}

.dr88aph-results-page .dr88aph-ranking {
  min-width: 820px;
  table-layout: fixed;
}

.dr88aph-results-page .dr88aph-ranking th,
.dr88aph-results-page .dr88aph-ranking td {
  vertical-align: middle;
  text-align: center;
}

.dr88aph-results-page .dr88aph-ranking th:first-child,
.dr88aph-results-page .dr88aph-ranking td:first-child {
  width: 7.5%;
}

.dr88aph-results-page .dr88aph-ranking td:first-child .dr88aph-rank {
  margin-inline: auto;
}

.dr88aph-results-page .dr88aph-ranking th:nth-child(2),
.dr88aph-results-page .dr88aph-ranking td:nth-child(2) {
  width: 15.5%;
  text-align: center;
}

.dr88aph-results-page .dr88aph-ranking th:nth-child(3),
.dr88aph-results-page .dr88aph-ranking td:nth-child(3) {
  width: 12%;
}

.dr88aph-results-page .dr88aph-ranking th:nth-child(4),
.dr88aph-results-page .dr88aph-ranking td:nth-child(4),
.dr88aph-results-page .dr88aph-ranking th:nth-child(5),
.dr88aph-results-page .dr88aph-ranking td:nth-child(5) {
  width: 14%;
}

.dr88aph-results-page .dr88aph-ranking th:nth-child(6),
.dr88aph-results-page .dr88aph-ranking td:nth-child(6) {
  width: 10%;
}

.dr88aph-results-page .dr88aph-ranking th:nth-child(7),
.dr88aph-results-page .dr88aph-ranking td:nth-child(7) {
  width: 12%;
}

.dr88aph-results-page .dr88aph-ranking th:last-child,
.dr88aph-results-page .dr88aph-ranking td:last-child {
  width: 15%;
  text-align: center;
}

.dr88aph-ranking-code {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 82px;
  min-height: 34px;
  overflow: hidden;
  border-radius: 5px;
  background: linear-gradient(120deg, #cc2938, #8f0714);
  clip-path: polygon(0 0, 100% 0, 100% 36%, 94% 50%, 100% 64%, 100% 100%, 0 100%, 0 64%, 6% 50%, 0 36%);
  color: #fff4d5;
  box-shadow: 0 5px 11px rgba(68, 6, 9, 0.16), inset 0 0 0 1px rgba(237, 196, 91, 0.34);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.dr88aph-ranking-code strong {
  color: currentColor;
  font-size: 16px;
  font-weight: 900;
  line-height: 18px;
  letter-spacing: -0.02em;
}

.dr88aph-ranking-code > * {
  position: relative;
  z-index: 1;
}

.dr88aph-ranking-code::selection,
.dr88aph-ranking-code *::selection {
  background: #6d0710;
  color: #fff4cf;
}

.dr88aph-ranking-code.is-888k {
  background: linear-gradient(120deg, #fff0a9 0%, #e6b534 48%, #b97912 100%);
  color: #3d2500;
  box-shadow: 0 5px 13px rgba(154, 101, 10, 0.25), inset 0 0 0 1px rgba(255, 247, 197, 0.8);
}

.dr88aph-ranking-code.is-588k {
  background: linear-gradient(120deg, #ffffff 0%, #d8e0e5 48%, #9caab5 100%);
  color: #26353f;
  box-shadow: 0 5px 12px rgba(62, 79, 91, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
}

.dr88aph-ranking-code.is-388k {
  background: linear-gradient(120deg, #ffd3a8 0%, #df8a4b 50%, #a94a25 100%);
  color: #3f1b0c;
  box-shadow: 0 5px 12px rgba(114, 46, 20, 0.22), inset 0 0 0 1px rgba(255, 225, 190, 0.75);
}

.dr88aph-ranking-code.is-188k {
  background: linear-gradient(120deg, #e63b48 0%, #b70e20 54%, #77000c 100%);
  color: #fff3d2;
}

.dr88aph-ranking-code.is-88k {
  background: linear-gradient(120deg, #b94d67 0%, #8a193a 52%, #57051f 100%);
  color: #fff0d8;
}

.dr88aph-ranking-code.is-18k {
  background: linear-gradient(120deg, #9d5960 0%, #74313b 52%, #48131c 100%);
  color: #fff1dc;
}

.dr88aph-ranking-code::after {
  position: absolute;
  top: 50%;
  right: auto;
  left: -48%;
  width: 30%;
  height: 160%;
  border-radius: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.58), transparent);
  content: "";
  transform: translateY(-50%) skewX(-18deg);
  animation: dr88aph-ranking-ticket-foil 4.6s ease-in-out infinite;
}

.dr88aph-ranking tbody tr:nth-child(3n + 2) .dr88aph-ranking-code::after { animation-delay: 460ms; }
.dr88aph-ranking tbody tr:nth-child(3n) .dr88aph-ranking-code::after { animation-delay: 920ms; }

.dr88aph-ranking tbody tr:hover .dr88aph-ranking-code {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 8px 16px rgba(68, 6, 9, 0.2), inset 0 0 0 1px rgba(255, 224, 140, 0.5);
}

@keyframes dr88aph-ranking-ticket-foil {
  0%, 58% { left: -48%; opacity: 0; }
  64% { opacity: 0.72; }
  82%, 100% { left: 122%; opacity: 0; }
}

.dr88aph-rank {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: #edf0f3;
  color: #4d5768;
  font-weight: 800;
}

.dr88aph-rank.is-1 {
  background: linear-gradient(145deg, #ffe98d, #d9a217);
  color: #533000;
}

.dr88aph-rank.is-2 {
  background: #dfe4e9;
}

.dr88aph-rank.is-3 {
  background: #edd1bd;
}

.dr88aph-ranking-note {
  margin: 13px 0 0;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
  text-align: right;
}

/* Results ranking board: compact, tournament-first hierarchy. */
.dr88aph-results-page .dr88aph-ranking-board {
  margin-top: 20px;
  overflow: hidden;
  border-radius: 14px;
  background: #fffdf9;
  box-shadow: inset 0 0 0 1px #e4c17a, 0 14px 34px rgba(79, 7, 11, 0.09);
}

.dr88aph-results-page .dr88aph-ranking-showcase {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(310px, 0.85fr);
  gap: 10px;
  min-height: 204px;
  padding: 10px;
  overflow: hidden;
  background:
    radial-gradient(circle at 82% -30%, rgba(216, 176, 88, 0.12), transparent 30%),
    linear-gradient(120deg, #270205 0%, #4a0509 55%, #650a10 100%);
  color: #fff;
}

.dr88aph-results-page .dr88aph-ranking-showcase::after {
  position: absolute;
  left: 48%;
  bottom: -160px;
  width: 420px;
  height: 420px;
  border: 1px solid rgba(211, 173, 92, 0.1);
  border-radius: 50%;
  box-shadow: inset 0 0 0 34px rgba(211, 173, 92, 0.015), inset 0 0 0 84px rgba(211, 173, 92, 0.015);
  content: "";
  pointer-events: none;
}

.dr88aph-results-page .dr88aph-ranking-champion {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  overflow: hidden;
  padding: 26px 32px;
  border-radius: 12px;
  background: linear-gradient(125deg, #57070b 0%, #780b10 68%, #8d1015 100%);
  box-shadow: 0 12px 28px rgba(20, 0, 1, 0.2);
}

.dr88aph-results-page .dr88aph-ranking-champion::before {
  position: absolute;
  inset: 0;
  background: url("../images/lac-birds.png") right -28px center / 290px auto no-repeat;
  content: "";
  opacity: 0.18;
  pointer-events: none;
}

.dr88aph-results-page .dr88aph-ranking-champion__copy {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.dr88aph-results-page .dr88aph-ranking-champion__copy > span,
.dr88aph-results-page .dr88aph-ranking-reward div > span {
  color: #dcbc78;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 15px;
}

.dr88aph-results-page .dr88aph-ranking-champion h2 {
  max-width: 410px;
  margin: 6px 0 18px;
  color: #fffaf2;
  font-size: clamp(24px, 2.1vw, 31px);
  font-weight: 850;
  letter-spacing: -0.025em;
  line-height: 1.12;
}

.dr88aph-results-page .dr88aph-ranking-champion__player {
  display: flex;
  align-items: end;
  gap: 18px;
}

.dr88aph-results-page .dr88aph-ranking-champion__player > b {
  overflow: hidden;
  color: #f4e9df;
  font-size: 16px;
  font-weight: 750;
  line-height: 24px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-results-page .dr88aph-ranking-champion__player > strong {
  color: #e9c76e;
  font-size: 27px;
  font-weight: 850;
  line-height: 30px;
}

.dr88aph-results-page .dr88aph-ranking-champion__player small {
  margin-left: 4px;
  font-size: 12px;
  font-weight: 800;
}

.dr88aph-results-page .dr88aph-ranking-champion__visual {
  position: relative;
  display: grid;
  place-items: center;
  width: 138px;
  height: 138px;
  flex: none;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(225, 192, 113, 0.18) 0%, rgba(211, 172, 80, 0.04) 52%, transparent 72%);
}

.dr88aph-results-page .dr88aph-ranking-champion__visual svg {
  width: 84px;
  height: 84px;
  fill: rgba(229, 194, 106, 0.035);
  stroke: #dfbd6b;
  stroke-width: 1.2;
}

.dr88aph-results-page .dr88aph-ranking-champion__visual span {
  position: absolute;
  top: 52px;
  color: #ead18d;
  font-size: 21px;
  font-weight: 900;
}

.dr88aph-results-page .dr88aph-ranking-showcase__aside {
  display: grid;
  position: relative;
  z-index: 1;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.dr88aph-results-page .dr88aph-ranking-reward {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
  overflow: hidden;
  padding: 12px 18px 12px 104px;
  border-radius: 12px;
  background: linear-gradient(115deg, #fffaf0 0%, #ead399 100%);
  color: #4c1710;
}

.dr88aph-results-page .dr88aph-ranking-reward img {
  position: absolute;
  left: 3px;
  bottom: -16px;
  width: 96px;
  height: 96px;
  object-fit: contain;
  filter: saturate(0.82) drop-shadow(0 8px 10px rgba(77, 17, 1, 0.14));
}

.dr88aph-results-page .dr88aph-ranking-reward div {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.dr88aph-results-page .dr88aph-ranking-reward div > span {
  color: #7a4933;
}

.dr88aph-results-page .dr88aph-ranking-reward strong {
  color: #6e090e;
  font-size: 22px;
  font-weight: 850;
  line-height: 27px;
}

.dr88aph-results-page .dr88aph-ranking-reward small {
  color: #725749;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
}

.dr88aph-results-page .dr88aph-ranking-reward.is-top50 {
  background:
    radial-gradient(circle at 12% 120%, rgba(213, 177, 91, 0.12), transparent 38%),
    linear-gradient(115deg, #58080d 0%, #310204 100%);
}

.dr88aph-results-page .dr88aph-ranking-reward.is-top50 img {
  left: 18px;
  bottom: 8px;
  width: 68px;
  height: 68px;
  opacity: 0.68;
  filter: saturate(0.72) drop-shadow(0 6px 10px rgba(0, 0, 0, 0.18));
}

.dr88aph-results-page .dr88aph-ranking-reward.is-top50 div > span,
.dr88aph-results-page .dr88aph-ranking-reward.is-top50 strong {
  color: #e1bd67;
}

.dr88aph-results-page .dr88aph-ranking-reward.is-top50 small {
  color: #dbc9bd;
}

.dr88aph-results-page .dr88aph-ranking-podium {
  position: relative;
  overflow: hidden;
  padding: 20px 24px 0;
  background:
    radial-gradient(circle at 50% 22%, rgba(224, 188, 99, 0.16), transparent 28%),
    linear-gradient(135deg, #260204 0%, #4d0509 55%, #310204 100%);
  color: #fff;
}

.dr88aph-results-page .dr88aph-ranking-podium::before {
  position: absolute;
  inset: 0;
  background: url("../images/dong-son-drum-800.webp") center 22% / 520px auto no-repeat;
  content: "";
  opacity: 0.07;
  pointer-events: none;
}

.dr88aph-results-page .dr88aph-ranking-podium > header {
  position: relative;
  z-index: 1;
  text-align: center;
}

.dr88aph-results-page .dr88aph-ranking-podium > header h2 {
  margin: 0;
  color: #f7e6b5;
  font-size: 25px;
  font-weight: 850;
  letter-spacing: -0.025em;
  line-height: 30px;
}

.dr88aph-results-page .dr88aph-ranking-podium > header p {
  margin: 3px 0 0;
  color: #cfb8ab;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
}

.dr88aph-results-page .dr88aph-ranking-podium__stage {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
  width: min(960px, 100%);
  margin: 16px auto 0;
}

.dr88aph-results-page .dr88aph-ranking-podium__visual {
  position: relative;
  width: 160px;
  height: 205px;
  margin: 0 auto;
  overflow: hidden;
}

.dr88aph-results-page .dr88aph-ranking-podium__visual::before {
  position: absolute;
  z-index: 0;
  right: 18%;
  bottom: 3px;
  left: 18%;
  height: 38%;
  border-radius: 50%;
  background: radial-gradient(ellipse, var(--podium-glow) 0%, transparent 72%);
  content: "";
  filter: blur(8px);
  opacity: 0.45;
  transform: scale(0.84);
  animation: dr88aph-podium-aura 5.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  pointer-events: none;
}

.dr88aph-results-page .dr88aph-ranking-podium__visual img {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: -89px;
  width: auto;
  max-width: none;
  height: 205px;
  filter: drop-shadow(0 14px 18px rgba(0, 0, 0, 0.28));
  animation: dr88aph-podium-metal 5.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual {
  width: 180px;
  height: 235px;
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual img {
  left: -262px;
  height: 235px;
}

.dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__visual {
  width: 150px;
  height: 195px;
}

.dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__visual img {
  left: -356px;
  height: 195px;
}

.dr88aph-results-page .dr88aph-ranking-podium__place {
  --podium-metal: #b88755;
  --podium-light: #edc99d;
  --podium-ink: #5d2d16;
  --podium-glow: rgba(231, 157, 83, 0.3);
  position: relative;
  display: block;
  min-width: 0;
  min-height: 0;
  padding: 0;
  background: none;
  box-shadow: none;
  text-align: center;
}

.dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1 {
  --podium-metal: #d5ad4b;
  --podium-light: #f8e8a6;
  --podium-ink: #4f3000;
  --podium-glow: rgba(255, 211, 82, 0.48);
  min-height: 0;
  padding-top: 0;
  background: none;
  box-shadow: none;
}

.dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-2 {
  --podium-metal: #aeb8bf;
  --podium-light: #edf1f2;
  --podium-ink: #35414a;
  --podium-glow: rgba(221, 237, 245, 0.38);
  --podium-delay: 0s;
}

.dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1 {
  --podium-delay: 0.48s;
}

.dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-3 {
  --podium-glow: rgba(231, 157, 83, 0.34);
  --podium-delay: 0.96s;
}

.dr88aph-results-page .dr88aph-ranking-podium__place .dr88aph-ranking-podium__visual::before,
.dr88aph-results-page .dr88aph-ranking-podium__place .dr88aph-ranking-podium__visual img,
.dr88aph-results-page .dr88aph-ranking-podium__place .dr88aph-ranking-podium__info::after {
  animation-delay: var(--podium-delay, 0s);
}

.dr88aph-results-page .dr88aph-ranking-podium__info {
  --podium-info: #591218;
  position: relative;
  isolation: isolate;
  display: grid;
  justify-items: center;
  min-height: 132px;
  padding: 15px 16px 16px;
  overflow: hidden;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(155deg, #701a20, var(--podium-info));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.13), 0 -9px 24px rgba(0, 0, 0, 0.14);
}

.dr88aph-results-page .dr88aph-ranking-podium__info::after {
  position: absolute;
  z-index: 0;
  top: -55%;
  bottom: -55%;
  left: -38%;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgba(255, 245, 211, 0.22), transparent);
  content: "";
  opacity: 0;
  transform: skewX(-18deg) translateX(0);
  animation: dr88aph-podium-light-pass 5.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  pointer-events: none;
}

.dr88aph-results-page .dr88aph-ranking-podium__info > * {
  position: relative;
  z-index: 1;
}

@keyframes dr88aph-podium-aura {
  0%, 16%, 100% {
    opacity: 0.38;
    transform: scale(0.84);
  }
  23%, 34% {
    opacity: 0.88;
    transform: scale(1.08);
  }
  44% {
    opacity: 0.48;
    transform: scale(0.92);
  }
}

@keyframes dr88aph-podium-metal {
  0%, 16%, 44%, 100% {
    filter: brightness(1) saturate(1) drop-shadow(0 14px 18px rgba(0, 0, 0, 0.28));
  }
  25%, 32% {
    filter: brightness(1.13) saturate(1.08) drop-shadow(0 18px 22px var(--podium-glow));
  }
}

@keyframes dr88aph-podium-light-pass {
  0%, 14% {
    opacity: 0;
    transform: skewX(-18deg) translateX(0);
  }
  19% {
    opacity: 0.78;
  }
  35% {
    opacity: 0;
    transform: skewX(-18deg) translateX(650%);
  }
  100% {
    opacity: 0;
    transform: skewX(-18deg) translateX(650%);
  }
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__info {
  --podium-info: #5c2015;
  min-height: 144px;
  background: linear-gradient(155deg, #813b24, var(--podium-info));
  box-shadow: inset 0 1px rgba(255, 229, 159, 0.24), 0 -14px 34px rgba(202, 155, 54, 0.18);
}

.dr88aph-results-page .is-rank-2 .dr88aph-ranking-podium__info {
  --podium-info: #3f171b;
  background: linear-gradient(155deg, #5d252a, var(--podium-info));
  box-shadow: inset 0 1px rgba(237, 241, 242, 0.2), 0 -10px 26px rgba(194, 214, 224, 0.12);
}

.dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__info {
  --podium-info: #521a19;
  background: linear-gradient(155deg, #6d2923, var(--podium-info));
  box-shadow: inset 0 1px rgba(237, 201, 157, 0.18), 0 -10px 26px rgba(213, 126, 70, 0.13);
}

.dr88aph-results-page .dr88aph-ranking-podium__crest {
  position: absolute;
  top: -18px;
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border: 1px solid var(--podium-light);
  border-radius: 50%;
  background: linear-gradient(145deg, var(--podium-light), var(--podium-metal));
  color: var(--podium-ink);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.6);
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__crest {
  top: -26px;
  width: 78px;
  height: 78px;
}

.dr88aph-results-page .dr88aph-ranking-podium__crest svg {
  width: 38px;
  height: 38px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__crest svg {
  width: 48px;
  height: 48px;
}

.dr88aph-results-page .dr88aph-ranking-podium__crest span {
  position: absolute;
  top: 22px;
  font-size: 14px;
  font-weight: 950;
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__crest span {
  top: 28px;
  font-size: 17px;
}

.dr88aph-results-page .dr88aph-ranking-podium__title {
  display: grid;
  grid-template-columns: 24px auto;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--podium-light);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 15px;
  text-transform: uppercase;
}

.dr88aph-results-page .dr88aph-ranking-podium__title b {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 12px;
}

.dr88aph-results-page .dr88aph-ranking-podium__player {
  max-width: 100%;
  margin-top: 3px;
  overflow: hidden;
  color: #fffaf4;
  font-size: 16px;
  font-weight: 850;
  line-height: 22px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__player {
  font-size: 19px;
  line-height: 25px;
}

.dr88aph-results-page .dr88aph-ranking-podium__score {
  color: #cdbdb3;
  font-size: 11px;
  font-weight: 700;
  line-height: 17px;
}

.dr88aph-results-page .dr88aph-ranking-podium__prize {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(164px, 92%);
  min-height: 46px;
  margin: 13px auto 0;
  gap: 10px;
  border-radius: 6px;
  background: linear-gradient(120deg, #efce82 0%, #b68124 100%);
  color: #4b2b00;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.18), inset 0 1px rgba(255, 255, 255, 0.55);
}

.dr88aph-results-page .dr88aph-ranking-podium__prize::before,
.dr88aph-results-page .dr88aph-ranking-podium__prize::after {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--podium-info);
  content: "";
  transform: translateY(-50%);
}

.dr88aph-results-page .dr88aph-ranking-podium__prize::before {
  left: -6px;
}

.dr88aph-results-page .dr88aph-ranking-podium__prize::after {
  right: -6px;
}

.dr88aph-results-page .is-rank-2 .dr88aph-ranking-podium__prize {
  background: linear-gradient(120deg, #f1f4f4 0%, #a8b2b8 100%);
  color: #354149;
}

.dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__prize {
  background: linear-gradient(120deg, #e8bb8a 0%, #a75e34 100%);
  color: #4f2411;
}

.dr88aph-results-page .dr88aph-ranking-podium__prize small {
  color: currentColor;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
}

.dr88aph-results-page .dr88aph-ranking-podium__prize strong {
  color: currentColor;
  font-size: 18px;
  font-weight: 900;
}

.dr88aph-results-page .dr88aph-ranking-podium__benefit {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  margin: 0 -24px;
  padding: 8px 22px;
  gap: 10px;
  border-top: 1px solid rgba(223, 190, 110, 0.2);
  background: rgba(20, 0, 1, 0.34);
}

.dr88aph-results-page .dr88aph-ranking-podium__benefit img {
  width: 46px;
  height: 46px;
  object-fit: contain;
  filter: saturate(0.68) drop-shadow(0 5px 8px rgba(0, 0, 0, 0.24));
}

.dr88aph-results-page .dr88aph-ranking-podium__ticket {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 82px;
  min-height: 34px;
  padding: 5px 10px;
  gap: 4px;
  border: 1px solid #e3bd58;
  border-radius: 8px;
  color: #3d2100;
  background: linear-gradient(135deg, #fff4b7, #e0ad2f 58%, #f7dc7d);
  box-shadow: 0 7px 16px rgba(15, 0, 1, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  font-variant-numeric: tabular-nums;
}

.dr88aph-results-page .dr88aph-ranking-podium__ticket small,
.dr88aph-results-page .dr88aph-ranking-podium__ticket strong,
.dr88aph-results-page .dr88aph-ranking-podium__ticket i {
  color: currentColor;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 14px;
  text-shadow: 0 1px rgba(255, 255, 255, 0.36);
}

.dr88aph-results-page .dr88aph-ranking-podium__benefit p {
  display: flex;
  align-items: baseline;
  margin: 0;
  gap: 10px;
}

.dr88aph-results-page .dr88aph-ranking-podium__benefit p > strong {
  color: #e7c972;
  font-size: 13px;
  line-height: 18px;
}

.dr88aph-results-page .dr88aph-ranking-podium__benefit p > span {
  color: #d7c8bf;
  font-size: 11px;
  line-height: 17px;
}

.dr88aph-results-page .dr88aph-ranking-board__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 16px 18px;
  border-top: 1px solid rgba(222, 187, 106, 0.42);
  background: linear-gradient(110deg, #710a0f 0%, #8b0d13 72%, #9d1418 100%);
  color: #fff;
}

.dr88aph-results-page .dr88aph-ranking-board__head h2 {
  margin: 0;
  color: #fff;
  font-size: 20px;
  line-height: 26px;
}

.dr88aph-results-page .dr88aph-ranking-board__head p {
  margin: 2px 0 0;
  color: #ffe7c2;
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters {
  flex: none;
  margin: 0;
  padding: 3px;
  border: 1px solid rgba(255, 224, 150, 0.42);
  border-radius: 11px;
  background: rgba(75, 0, 5, 0.34);
}

.dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a {
  min-height: 36px;
  padding: 8px 15px;
  border: 0;
  background: transparent;
  color: #fff4df;
  box-shadow: none;
}

.dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a:hover {
  background: rgba(255, 255, 255, 0.1);
}

.dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a.is-active {
  background: #e8c56d;
  color: #430609;
  box-shadow: 0 5px 12px rgba(35, 0, 2, 0.22);
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-table-wrap {
  max-height: min(64vh, 620px);
  border-radius: 0;
  box-shadow: none;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th {
  padding-block: 12px;
  background: #fff3e8;
  color: #6b3b32;
  letter-spacing: 0.035em;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td {
  padding-block: 10px;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking tbody tr[data-rank="1"] {
  background: #fffaf0;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-rank.is-1 {
  background: linear-gradient(145deg, #f0d786, #c69426);
  color: #472600;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking tbody tr[data-rank="2"] {
  background: #fbfcfd;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking tbody tr[data-rank="3"] {
  background: #fff8f2;
}

.dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking tbody tr:hover {
  background: #fff1e7;
}

.dr88aph-results-page .dr88aph-ranking-board__foot {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 6px 18px;
  border-top: 1px solid #ead9cb;
  background: #fff8f1;
}

.dr88aph-results-page .dr88aph-ranking-board__foot .dr88aph-ranking-note,
.dr88aph-results-page .dr88aph-ranking-board__foot .dr88aph-review-scroll-cue {
  margin: 0;
}

.dr88aph-results-page .dr88aph-ranking-empty {
  min-height: 230px;
  padding: 28px 20px 30px;
}

.dr88aph-ranking-empty__rank {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin: 0 auto 10px;
  border-radius: 14px;
  background: linear-gradient(145deg, #ffe98d, #d9a217);
  color: #5b3000;
  font-size: 22px;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(154, 93, 0, 0.2);
}

@media (max-width: 760px) {
  .dr88aph-results-page .dr88aph-ranking-podium {
    padding: 18px 10px 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__stage {
    gap: 5px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place {
    min-height: 138px;
    padding: 38px 6px 10px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1 {
    min-height: 158px;
    padding-top: 46px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__title {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 3px;
    font-size: 10px;
    line-height: 12px;
    white-space: nowrap;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__crest {
    width: 52px;
    height: 52px;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__crest {
    width: 64px;
    height: 64px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__crest svg {
    width: 31px;
    height: 31px;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__crest svg {
    width: 39px;
    height: 39px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__crest span {
    top: 18px;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__crest span {
    top: 23px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__player,
  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__player {
    font-size: 12px;
    line-height: 18px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__prize {
    align-content: center;
    flex-direction: column;
    width: calc(100% + 12px);
    margin: 10px -6px -10px;
    gap: 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__prize small {
    font-size: 10px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__prize strong {
    font-size: 15px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__benefit {
    margin-inline: -10px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__benefit p {
    display: grid;
    gap: 0;
  }

  .dr88aph-results-page .dr88aph-ranking-showcase {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .dr88aph-results-page .dr88aph-ranking-champion {
    min-height: 190px;
    padding: 22px;
  }

  .dr88aph-results-page .dr88aph-ranking-champion__visual {
    width: 112px;
    height: 112px;
  }

  .dr88aph-results-page .dr88aph-ranking-champion__visual svg {
    width: 76px;
    height: 76px;
  }

  .dr88aph-results-page .dr88aph-ranking-champion__visual span {
    top: 42px;
    font-size: 20px;
  }

  .dr88aph-results-page .dr88aph-ranking-showcase__aside {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
  }

  .dr88aph-results-page .dr88aph-ranking-reward {
    min-height: 104px;
    padding-left: 88px;
  }

  .dr88aph-results-page .dr88aph-ranking-reward img {
    width: 84px;
    height: 84px;
  }

  .dr88aph-results-page .dr88aph-ranking-board__head {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  .dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a {
    justify-content: center;
    padding-inline: 8px;
  }

  .dr88aph-results-page .dr88aph-ranking-board__foot {
    align-items: flex-start;
    flex-direction: column;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-table-wrap {
    max-height: min(54vh, 480px);
    overflow-x: hidden;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    font-size: 11px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th,
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td {
    padding: 10px 6px;
    text-align: center;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:first-child,
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:first-child {
    width: 54px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(2),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(2) {
    width: 118px;
    text-align: center;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(n + 3):nth-child(-n + 6),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(n + 3):nth-child(-n + 6) {
    display: none;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(7),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(7) {
    width: 76px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(8),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(8) {
    width: 96px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(7) b {
    font-size: 16px;
  }

  .dr88aph-results-page .dr88aph-ranking-code {
    width: 76px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph-ranking-code::after { animation: none; opacity: 0; }
  .dr88aph-ranking-code { transition: none; }
  .dr88aph-results-page .dr88aph-ranking-podium__visual::before,
  .dr88aph-results-page .dr88aph-ranking-podium__visual img,
  .dr88aph-results-page .dr88aph-ranking-podium__info::after {
    animation: none !important;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__visual::before {
    opacity: 0.58;
    transform: scale(0.94);
  }
}

/* V1.18.3 mobile authority: content-led layouts, not scaled desktop compositions. */
@media (max-width: 680px) {
  .dr88aph-shell {
    width: calc(100% - 8px);
  }

  .dr88aph-main {
    padding-top: 10px;
  }

  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page,
  .dr88aph-results-page,
  .dr88aph-history-page,
  .dr88aph-top-page {
    padding: 12px;
  }

  .dr88aph-main-nav {
    right: 4px;
    bottom: max(4px, env(safe-area-inset-bottom));
    left: 4px;
    min-height: 64px;
    border: 1px solid rgba(112, 15, 21, 0.12);
    border-radius: 16px;
    background: rgba(255, 253, 250, 0.97);
    box-shadow: 0 10px 28px rgba(42, 3, 7, 0.18);
    backdrop-filter: blur(14px);
  }

  .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph-nav-more {
    min-height: 52px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__poster,
  .dr88aph[data-view="home"] .dr88aph-home__poster img {
    height: 190px;
    min-height: 190px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__poster img {
    object-position: center 20%;
  }

  .dr88aph[data-view="home"] .dr88aph-home__content {
    padding: 18px 14px 14px;
  }

  .dr88aph[data-view="home"] .dr88aph-home h1 {
    margin-top: 15px;
    font-size: 28px;
    line-height: 1.08;
  }

  .dr88aph[data-view="home"] .dr88aph-next-match {
    margin-top: 14px;
    padding: 12px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__actions .dr88aph-primary {
    grid-column: 1 / -1;
  }

  .dr88aph[data-view="home"] .dr88aph-home__actions .dr88aph-primary,
  .dr88aph[data-view="home"] .dr88aph-home__actions .dr88aph-secondary {
    min-height: 46px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__content > .dr88aph-home__conversion-hook,
  .dr88aph[data-view="home"] .dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
    min-height: 62px;
    padding: 5px 10px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits {
    margin-top: 8px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a {
    border-radius: 10px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__schedule {
    padding: 0 8px 14px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match.is-compact > .dr88aph-primary {
    min-height: 44px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a {
    display: grid;
    place-items: center;
    padding: 7px 4px;
    border-radius: 10px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__copy strong {
    font-size: 12px;
    line-height: 16px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel {
    gap: 0;
    overflow: hidden;
    border: 1px solid #ead7ce;
    border-radius: 12px;
    background: #fffaf5;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel > div {
    min-height: 88px;
    padding: 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel > div:nth-child(even) {
    border-left: 1px solid #ead7ce;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel > div:nth-child(n + 3) {
    border-top: 1px solid #ead7ce;
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules {
    padding: 15px;
    border-radius: 12px;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules h2 {
    font-size: 18px;
    line-height: 24px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-slot-cta {
    padding-inline: 12px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium {
    width: 100%;
    padding: 18px 10px 0;
    overflow: hidden;
    border-radius: 13px 13px 0 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__stage {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    width: 100%;
    gap: 8px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place {
    display: grid;
    min-width: 0;
    min-height: 0;
    padding: 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1 {
    grid-column: 1 / -1;
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: end;
    width: min(300px, 100%);
    margin-inline: auto;
    padding: 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__visual {
    width: 110px;
    height: 138px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__visual img {
    left: -60px;
    height: 138px;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual {
    width: 132px;
    height: 172px;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual img {
    left: -192px;
    height: 172px;
  }

  .dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__visual {
    width: 105px;
    height: 132px;
  }

  .dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__visual img {
    left: -241px;
    height: 132px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__info,
  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__info {
    min-width: 0;
    min-height: 122px;
    padding: 12px 7px;
    border-radius: 10px 10px 0 0;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__info {
    min-height: 146px;
    justify-content: center;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__title {
    grid-template-columns: 22px minmax(0, auto);
    gap: 5px;
    font-size: 10px;
    line-height: 12px;
    white-space: normal;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__title b {
    width: 22px;
    height: 22px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__player,
  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__player {
    margin-top: 5px;
    overflow: visible;
    font-size: 12px;
    line-height: 16px;
    text-overflow: clip;
    white-space: normal;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__prize {
    flex-direction: row;
    width: min(110px, calc(100% - 8px));
    min-height: 40px;
    margin: 9px auto 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__prize strong {
    font-size: 16px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__benefit {
    min-height: 58px;
    margin-inline: -10px;
    padding: 8px 12px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__benefit p > strong {
    font-size: 12px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__benefit p > span {
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph-results-page .dr88aph-ranking-board__head {
    padding: 14px 12px;
  }

  .dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a,
  .dr88aph-results-page .dr88aph-results-subnav a,
  .dr88aph-results-page .dr88aph-review-launcher {
    min-height: 44px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__actions .dr88aph-text-link {
    min-height: 44px;
  }

  .dr88aph[data-view="mine"] .dr88aph-member-head__identity h2 {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 340px) {
  .dr88aph[data-view="home"] .dr88aph-home__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="home"] .dr88aph-home__actions .dr88aph-primary {
    grid-column: 1 / -1;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy small {
    font-size: 10px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
    font-size: 10px;
    line-height: 13px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1 {
    grid-template-columns: 110px minmax(0, 1fr);
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual {
    width: 110px;
  }
}

/* Mobile app chrome: persistent registration rail and seven direct destinations. */
@media (max-width: 680px) {
  .dr88aph,
  body.admin-bar .dr88aph {
    --dr88aph-mobile-header-clearance: calc(72px + env(safe-area-inset-top));
  }

  .dr88aph-header,
  body.admin-bar .dr88aph-header {
    position: fixed !important;
    z-index: 120;
    top: 0 !important;
    right: 0;
    left: 0;
    width: 100%;
    padding: max(4px, env(safe-area-inset-top)) 0 4px;
    background: rgba(74, 1, 6, 0.96);
    box-shadow: 0 8px 22px rgba(35, 0, 3, 0.24);
  }

  body.admin-bar .dr88aph-header {
    top: 46px !important;
  }

  .dr88aph-header .dr88aph-header__inner {
    width: calc(100% - 8px);
    min-height: 60px;
    padding: 7px 8px;
    gap: 8px;
    border-radius: 0 0 12px 12px;
    box-shadow: none;
  }

  .dr88aph-header .dr88aph-brand > img {
    width: 54px;
    height: 42px;
    padding: 6px 8px;
  }

  .dr88aph-header .dr88aph-header-cta.dr88aph-attention-cta {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 46px;
    margin-left: 0;
    padding: 8px 10px;
  }

  .dr88aph-header .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 10.5px;
    line-height: 14px;
    white-space: normal;
    text-wrap: balance;
  }

  .dr88aph-main {
    padding-top: calc(var(--dr88aph-mobile-header-clearance) + 10px);
    scroll-padding-top: calc(var(--dr88aph-mobile-header-clearance) + 10px);
    scroll-padding-bottom: var(--dr88aph-mobile-nav-clearance);
  }

  .dr88aph[data-view] .dr88aph-footer {
    padding-bottom: var(--dr88aph-mobile-nav-clearance);
  }

  .dr88aph .dr88aph-main-nav {
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(7, minmax(44px, 1fr));
    width: 100%;
    padding: 5px 2px max(5px, env(safe-area-inset-bottom));
    gap: 0;
    border-top: 1px solid rgba(110, 12, 18, 0.16);
    border-radius: 14px 14px 0 0;
    background: rgba(255, 253, 250, 0.985);
    box-shadow: 0 -10px 28px rgba(43, 2, 6, 0.2);
    backdrop-filter: blur(14px);
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-overflow > .dr88aph-nav-link {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    place-items: center;
    align-content: center;
    min-width: 0;
    min-height: 58px;
    padding: 4px 1px;
    gap: 2px;
    border-radius: 9px;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    white-space: normal;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > span,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-overflow > .dr88aph-nav-link > span {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 24px;
    overflow: visible;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    text-overflow: clip;
    white-space: normal;
  }

  .dr88aph .dr88aph-main-nav .dr88aph-nav-link.is-top > span {
    font-size: 0;
  }

  .dr88aph .dr88aph-main-nav .dr88aph-nav-link.is-top > span::after {
    content: "Đua Top";
    line-height: 12px;
  }

  .dr88aph .dr88aph-main-nav a svg {
    display: block;
    width: 17px;
    height: 17px;
  }

  .dr88aph .dr88aph-main-nav a.is-active::after {
    top: 0;
    right: calc(50% - 11px);
    bottom: auto;
    left: calc(50% - 11px);
    height: 3px;
  }

  .dr88aph .dr88aph-nav-link.is-home { order: 1; }
  .dr88aph .dr88aph-nav-link.is-matches { order: 2; }
  .dr88aph .dr88aph-nav-link.is-wheel { order: 3; }
  .dr88aph .dr88aph-nav-link.is-top { order: 4; }
  .dr88aph .dr88aph-nav-link.is-rules { order: 5; }
  .dr88aph .dr88aph-nav-link.is-results { order: 6; }
  .dr88aph .dr88aph-nav-link.is-mine { order: 7; }

  .dr88aph .dr88aph-nav-overflow,
  .dr88aph .dr88aph-nav-overflow.is-open,
  .dr88aph .dr88aph-main-nav.is-more-open .dr88aph-nav-overflow,
  .dr88aph .dr88aph-main-nav[data-more-open="true"] .dr88aph-nav-overflow {
    position: static;
    display: contents !important;
    width: auto;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph .dr88aph-nav-more {
    display: none !important;
  }

  .dr88aph :where([id], [tabindex], a, button) {
    scroll-margin-top: calc(var(--dr88aph-mobile-header-clearance) + 10px);
    scroll-margin-bottom: var(--dr88aph-mobile-nav-clearance);
  }
}

.dr88aph-member-gate {
  display: grid;
  justify-items: center;
  width: min(620px, 100%);
  margin: 36px auto 0;
  padding: 40px 24px;
  text-align: center;
}

.dr88aph-loading-status {
  width: fit-content;
  margin: 24px auto 0;
  padding: 10px 14px;
  border-radius: 10px;
  background: #fff1d7;
  color: #6f4d00;
  font-size: 14px;
  font-weight: 800;
  line-height: 22px;
}

.dr88aph-member-gate__mark {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  margin-bottom: 18px;
  border: 1px solid #ffe58c;
  border-radius: 16px;
  background: linear-gradient(145deg, #6d0509, #c8181e 54%, #520306);
  box-shadow: 0 12px 25px rgba(69, 2, 7, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  color: var(--dr88-gold);
  font-size: 21px;
  font-weight: 800;
}

.dr88aph-member-gate h2 {
  margin: 0;
  color: var(--dr88-ink);
  font-size: 24px;
  line-height: 32px;
}

.dr88aph-member-gate p {
  max-width: 52ch;
  margin: 9px 0 22px;
  color: var(--dr88-muted);
  font-size: 14px;
  line-height: 21px;
}

.dr88aph-member-content {
  margin-top: 28px;
}

.dr88aph-member-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.dr88aph-member-head p {
  margin: 0;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-member-head h2 {
  margin: 2px 0 0;
  color: var(--dr88-ink);
  font-size: 24px;
  line-height: 32px;
  overflow-wrap: anywhere;
}

.dr88aph-text-button {
  min-height: 44px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: var(--dr88-red);
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.dr88aph-summary {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  margin: 20px 0;
  overflow: hidden;
  border-radius: 12px;
  background: #e8ddd7;
}

.dr88aph-summary > div {
  padding: 15px;
  background: #fff8f3;
}

.dr88aph-summary span {
  display: block;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 17px;
}

.dr88aph-summary b {
  display: block;
  margin-top: 3px;
  color: var(--dr88-ink);
  font-size: 20px;
  line-height: 27px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-ticket-list {
  display: grid;
  gap: 10px;
}

.dr88aph-ticket {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 24px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--dr88-line);
}

.dr88aph-ticket__match p,
.dr88aph-ticket__match small,
.dr88aph-ticket__pick small {
  margin: 0;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-ticket__match strong {
  display: block;
  margin: 3px 0;
  color: var(--dr88-ink);
  font-size: 14px;
  line-height: 20px;
}

.dr88aph-ticket__pick b {
  display: block;
  color: var(--dr88-ink);
  font-size: 20px;
  line-height: 27px;
}

.dr88aph-ticket__points {
  text-align: right;
}

.dr88aph-ticket__points b {
  display: block;
  color: var(--dr88-red);
  font-size: 21px;
  line-height: 28px;
}

.dr88aph-ticket__points span {
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 17px;
}

.dr88aph-empty {
  padding: 48px 24px;
  border-radius: 14px;
  background: #fff8f3;
  text-align: center;
}

.dr88aph-empty h1,
.dr88aph-empty h2,
.dr88aph-empty h3 {
  margin: 0;
  color: var(--dr88-ink);
  font-size: 22px;
  line-height: 30px;
}

.dr88aph-empty.is-standalone {
  width: min(720px, 100%);
  margin: 80px auto;
}

.dr88aph-empty p {
  margin: 8px 0 0;
  color: var(--dr88-muted);
  font-size: 14px;
  line-height: 21px;
}

.dr88aph-empty .dr88aph-primary {
  width: fit-content;
  margin: 20px auto 0;
}

.dr88aph-empty.is-table {
  border-radius: 0;
}

.dr88aph-footer {
  padding: 22px 0 34px;
  color: #e8cfc8;
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-footer > .dr88aph-shell {
  display: flex;
  gap: 16px;
}

.dr88aph-footer img {
  width: 72px;
  height: 40px;
  object-fit: contain;
}

.dr88aph-footer p {
  margin: 0 auto 0 0;
}

.dr88aph-dialog {
  width: min(480px, calc(100% - 28px));
  max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px);
  padding: 28px;
  overflow: auto;
  border: 1px solid #e4d9d2;
  border-radius: 16px;
  background: var(--dr88-white);
  box-shadow: 0 30px 90px rgba(32, 1, 4, 0.42);
  color: var(--dr88-ink);
}

.dr88aph-dialog::backdrop {
  background: rgba(24, 1, 3, 0.72);
  backdrop-filter: blur(4px);
}

.dr88aph-dialog__close {
  position: absolute;
  top: 13px;
  right: 13px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #e1d7d1;
  border-radius: 50%;
  background: var(--dr88-white);
  color: var(--dr88-muted);
  cursor: pointer;
}

.dr88aph-dialog__close svg {
  width: 18px;
  height: 18px;
}

.dr88aph-dialog h2 {
  margin: 0;
  padding: 0.05em 42px 0.05em 0;
  color: var(--dr88-ink);
  font-size: 25px;
  font-weight: 800;
  line-height: 32px;
  letter-spacing: -0.02em;
}

.dr88aph-dialog > p:not(.dr88aph-field-error):not(.dr88aph-privacy):not(.dr88aph-same-count) {
  margin: 9px 0 18px;
  color: var(--dr88-muted);
  font-size: 14px;
  line-height: 21px;
}

.dr88aph-dialog label {
  display: block;
  margin: 14px 0;
  color: #3d4758;
  font-size: 13px;
  font-weight: 800;
  line-height: 19px;
}

.dr88aph-dialog input {
  display: block;
  width: 100%;
  height: 50px;
  margin-top: 6px;
  padding: 0 13px;
  border: 1px solid #d5cec8;
  border-radius: 10px;
  background: #fffaf6;
  color: var(--dr88-ink);
  font-size: 16px;
  outline: 0;
  caret-color: var(--dr88-red);
}

.dr88aph-dialog input:focus {
  border-color: var(--dr88-red);
  box-shadow: 0 0 0 3px rgba(183, 13, 22, 0.12);
}

.dr88aph-dialog [data-identity-form] > .dr88aph-primary,
.dr88aph-dialog > .dr88aph-primary {
  width: 100%;
  margin-top: 5px;
}

.dr88aph-identity-dialog {
  width: min(460px, calc(100% - 28px));
  overflow-x: hidden;
  overflow-y: auto;
  border-color: rgba(197, 137, 29, 0.58);
}

.dr88aph-identity-dialog__intro {
  margin: -28px -28px 20px;
  padding: 24px 72px 21px 28px;
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 226, 92, 0.22), transparent 42%),
    linear-gradient(135deg, #450205, #8c080e 68%, #590306);
}

.dr88aph-identity-dialog__intro > span {
  display: inline-flex;
  margin-bottom: 5px;
  color: #ffe36c;
  font-size: 10px;
  font-weight: 800;
  line-height: 15px;
  letter-spacing: 0.1em;
}

.dr88aph .dr88aph-identity-dialog__intro h2 {
  padding: 0;
  color: #fffdf7;
}

.dr88aph-identity-dialog__intro p {
  margin: 6px 0 0;
  color: #f4ded9;
  font-size: 13px;
  line-height: 19px;
}

.dr88aph-identity-dialog [data-identity-form] {
  display: grid;
  gap: 12px;
}

.dr88aph-identity-dialog [data-identity-form] label {
  margin: 0;
}

.dr88aph-identity-dialog [data-identity-form] input:focus-visible {
  outline: 0;
  border-color: var(--dr88-red);
  box-shadow: 0 0 0 3px rgba(183, 13, 22, 0.16);
}

.dr88aph-identity-dialog [data-identity-form] > .dr88aph-primary {
  margin-top: 2px;
}

.dr88aph-privacy {
  margin: 15px 0 0;
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
  text-align: center;
}

.dr88aph-prediction-dialog {
  width: min(540px, calc(100% - 28px));
  padding: 24px;
  border-color: rgba(190, 128, 20, 0.52);
}

.dr88aph-prediction-dialog__head {
  margin: 0 52px 16px 0;
}

.dr88aph-prediction-dialog__head h2 {
  padding: 0;
}

.dr88aph-prediction-dialog__head p {
  margin: 4px 0 0;
  color: var(--dr88-muted);
  font-size: 13px;
  line-height: 19px;
}

.dr88aph-prediction-recap {
  overflow: hidden;
  border: 1px solid rgba(198, 135, 27, 0.48);
  border-radius: 14px;
  background: #fffaf1;
  box-shadow: 0 12px 30px rgba(62, 5, 8, 0.1);
}

.dr88aph-prediction-recap > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding: 8px 13px;
  border-bottom: 1px solid rgba(198, 135, 27, 0.28);
  background: #fff2dc;
  color: #970b12;
  font-size: 11px;
  font-weight: 850;
  line-height: 16px;
  letter-spacing: 0.02em;
}

.dr88aph-prediction-recap > header small {
  color: #75675f;
  font-size: 10px;
  font-weight: 750;
  line-height: 15px;
}

.dr88aph-prediction-recap__score {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-height: 132px;
  padding: 17px 16px;
}

.dr88aph-prediction-recap__team {
  display: grid;
  justify-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--dr88-ink);
  text-align: center;
}

.dr88aph-prediction-recap__team > span {
  display: grid;
  place-items: center;
  width: 62px;
  height: 44px;
  padding: 4px;
  border: 1px solid rgba(205, 144, 31, 0.56);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 5px 12px rgba(62, 5, 8, 0.12);
}

.dr88aph-prediction-recap__team img {
  width: 52px;
  height: 34px;
  object-fit: cover;
  border-radius: 4px;
}

.dr88aph-prediction-recap__team strong {
  overflow-wrap: anywhere;
  font-size: 13px;
  font-weight: 800;
  line-height: 18px;
}

.dr88aph-prediction-recap__numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 112px;
  min-height: 58px;
  padding: 12px 16px;
  border: 1px solid rgba(255, 218, 82, 0.72);
  border-radius: 12px;
  background: linear-gradient(145deg, #470306, #79070c 62%, #390104);
  box-shadow: 0 10px 22px rgba(65, 3, 7, 0.25), inset 0 1px 0 rgba(255, 244, 183, 0.18);
  color: #ffe681;
  font-size: 25px;
  font-variant-numeric: tabular-nums;
  line-height: 32px;
}

.dr88aph-prediction-recap__numbers i {
  color: rgba(255, 245, 205, 0.76);
  font-size: 18px;
  font-style: normal;
}

.dr88aph-prediction-recap__corners {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 38px;
  padding: 9px 13px;
  background: #520307;
  color: #fff8e9;
  text-align: center;
}

.dr88aph-prediction-recap__corners span {
  font-size: 10px;
  font-weight: 750;
  line-height: 15px;
  letter-spacing: 0.05em;
}

.dr88aph-prediction-recap__corners strong {
  color: #ffe36c;
  font-size: 12px;
  font-weight: 850;
  line-height: 17px;
}

.dr88aph-review-account {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 2px 12px;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid var(--dr88-line);
  border-radius: 10px;
  background: #fff;
}

.dr88aph-review-account span {
  color: var(--dr88-muted);
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-review-account b {
  grid-column: 1;
  color: var(--dr88-ink);
  font-size: 14px;
  font-weight: 800;
  line-height: 20px;
}

.dr88aph-review-account button {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-height: 44px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: var(--dr88-red);
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.dr88aph-dialog__note {
  padding: 10px 12px;
  border-radius: 9px;
  background: #fff0ef !important;
  color: #821019 !important;
  font-size: 12px !important;
  line-height: 18px !important;
  text-align: center;
}

.dr88aph-success-mark {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 auto 17px;
  border-radius: 50%;
  background: #daf8eb;
  color: var(--dr88-green);
}

.dr88aph-success-mark svg {
  width: 29px;
  height: 29px;
}

.dr88aph-dialog.is-success {
  text-align: center;
}

.dr88aph-dialog.is-success .dr88aph-prediction-dialog__head {
  margin: 0 0 16px;
}

.dr88aph-same-count {
  margin: 11px 0 16px;
  color: var(--dr88-red);
  font-size: 13px;
  font-weight: 800;
  line-height: 19px;
}

.dr88aph-dialog__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 10px;
}

.dr88aph-dialog__actions form {
  display: flex;
  align-self: stretch;
  width: 100%;
  min-height: 52px;
  margin: 0 !important;
}

.dr88aph-dialog__actions button {
  width: 100%;
  height: 100%;
  min-height: 52px;
  margin: 0 !important;
  gap: 0;
  padding: 12px 16px;
  box-sizing: border-box;
  font-size: 14px;
  line-height: 22px;
  white-space: nowrap;
}

.dr88aph-dialog__actions button::before {
  position: absolute;
  left: clamp(17px, 12%, 28px);
}

.dr88aph-toast {
  position: fixed;
  z-index: 120;
  right: 20px;
  bottom: 24px;
  max-width: 340px;
  padding: 13px 16px;
  border-radius: 11px;
  background: #20283a;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
  color: var(--dr88-white);
  font-size: 13px;
  line-height: 19px;
}

.dr88aph-noscript {
  padding: 12px;
  background: #fff2cf;
  color: #6f4d00;
  text-align: center;
}

.dr88aph a:focus-visible,
.dr88aph button:focus-visible,
.dr88aph input:focus-visible {
  outline: 3px solid #7a060b;
  outline-offset: 4px;
}

.dr88aph-primary:focus-visible,
.dr88aph-secondary:focus-visible {
  outline: 3px solid var(--dr88-gold);
  outline-offset: 4px;
}

.dr88aph ::selection {
  background: var(--dr88-gold);
  color: #3b2000;
}

.dr88aph .is-loading {
  cursor: wait;
}

.dr88aph .is-loading::after {
  content: "";
  width: 16px;
  height: 16px;
  flex: none;
  border: 2px solid rgba(255, 255, 255, 0.48);
  border-top-color: var(--dr88-white);
  border-radius: 50%;
  animation: dr88aph-spin 0.7s linear infinite;
}

@keyframes dr88aph-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 1080px) {
  .dr88aph-brand > span { display: none; }
  .dr88aph-main-nav a { padding-inline: 8px; font-size: 12px; }
  .dr88aph-header__inner { gap: 14px; }
  .dr88aph-home { grid-template-columns: minmax(340px, 0.82fr) minmax(0, 1.18fr); }
  .dr88aph-home__content { padding-inline: 34px; }
  .dr88aph-home__schedule { padding-inline: 34px; }
  .dr88aph-next-match { grid-template-columns: 1fr; gap: 12px; }
  .dr88aph-wheel-layout { grid-template-columns: minmax(0, 1fr) 250px; }
  .dr88aph-wheel-card { flex-basis: 170px; }
}

@media (max-width: 1100px) {
  body.admin-bar .dr88aph-header { top: 46px; }
  body.admin-bar .dr88aph-skip:focus { top: 58px; }
  .dr88aph-shell { width: min(100% - 28px, 760px); }
  .dr88aph-header { padding-top: 0; }
  .dr88aph-header__inner { min-height: 62px; padding: 8px 12px; border-radius: 0 0 14px 14px; }
  .dr88aph-brand > img { width: 79px; height: 42px; }
  .dr88aph-header-cta { min-height: 44px; margin-left: auto; padding: 8px 13px; font-size: 13px; }
  .dr88aph-header-cta::before { width: 14px; flex-basis: 14px; }
  .dr88aph-main-nav {
    position: fixed;
    z-index: 105;
    right: 8px;
    bottom: 8px;
    left: 8px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    border: 1px solid #e5ddd6;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 42px rgba(31, 3, 7, 0.28);
  }
  .dr88aph-main-nav > .dr88aph-nav-link { display: grid; justify-items: center; align-content: center; gap: 2px; min-width: 0; min-height: 52px; padding: 3px 2px; font-size: 14px; line-height: 19px; white-space: nowrap; }
  .dr88aph-nav-link.is-home { order: 1; }
  .dr88aph-nav-link.is-matches { order: 2; }
  .dr88aph-nav-link.is-wheel { order: 3; }
  .dr88aph-nav-overflow {
    position: absolute;
    right: 0;
    bottom: calc(100% + 10px);
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(300px, calc(100vw - 16px));
    padding: 8px;
    border: 1px solid #e5d4ca;
    border-radius: 14px;
    background: #fffdf9;
    box-shadow: 0 18px 38px rgba(31, 3, 7, 0.25);
  }
  .dr88aph-nav-overflow.is-open,
  .dr88aph-main-nav.is-more-open .dr88aph-nav-overflow,
  .dr88aph-main-nav[data-more-open="true"] .dr88aph-nav-overflow { display: grid; }
  .dr88aph-nav-overflow .dr88aph-nav-link { display: grid; grid-template-columns: 22px 1fr; align-items: center; justify-content: start; gap: 8px; min-height: 48px; padding: 6px 10px; font-size: 13px; text-align: left; }
  .dr88aph-nav-overflow .dr88aph-nav-link svg { display: block; width: 18px; height: 18px; }
  .dr88aph-nav-overflow .dr88aph-nav-link.is-active::after { top: 7px; right: auto; bottom: 7px; left: 2px; width: 3px; height: auto; }
  .dr88aph-nav-more { display: grid; justify-items: center; align-content: center; gap: 2px; min-height: 52px; padding: 3px 2px; font-size: 14px; line-height: 19px; white-space: nowrap; }
  .dr88aph-nav-more.is-active::after,
  .dr88aph-nav-more[aria-expanded="true"]::after { content: ""; position: absolute; top: -2px; right: calc(50% - 12px); left: calc(50% - 12px); height: 3px; border-radius: 2px; background: var(--dr88-red); }
  .dr88aph-main-nav a svg { display: block; width: 18px; height: 18px; }
  .dr88aph-main-nav a.is-active::after { top: -2px; right: calc(50% - 12px); bottom: auto; left: calc(50% - 12px); height: 3px; }
  .dr88aph-main { min-height: calc(100vh - 142px); padding: 14px 0 18px; }
  .dr88aph-home { grid-template-columns: 1fr; min-height: 0; }
  .dr88aph-home__poster { grid-row: auto; min-height: 310px; height: 310px; }
  .dr88aph-home__poster::after { border-right: 0; border-bottom: 1px solid rgba(255, 227, 76, 0.72); box-shadow: inset 0 -24px 38px rgba(37, 0, 3, 0.2); }
  .dr88aph-home__poster img { min-height: 310px; object-position: center 23%; }
  .dr88aph-home__content { padding: 26px 24px 22px; }
  .dr88aph-home h1 { margin-top: 22px; font-size: clamp(34px, 8vw, 44px); line-height: 1.1; }
  .dr88aph-home__content > p { font-size: 15px; line-height: 23px; }
  .dr88aph-next-match { grid-template-columns: minmax(120px, 0.7fr) minmax(240px, 1.3fr); }
  .dr88aph-home__schedule { padding: 0 24px 24px; }
  .dr88aph-workspace, .dr88aph-rules-page, .dr88aph-results-page, .dr88aph-history-page { min-height: 540px; padding: 24px; }
  .dr88aph-wheel-page { padding: 24px; }
  .dr88aph-page-head { align-items: flex-start; }
  .dr88aph-page-head h1 { font-size: 32px; line-height: 38px; }
  .dr88aph-rule-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dr88aph-rule-summary.is-wheel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dr88aph-policy-grid { grid-template-columns: 1fr; }
  .dr88aph-wheel-layout { grid-template-columns: 1fr; }
  .dr88aph-wheel-policy-grid { grid-template-columns: 1fr; }
  .dr88aph-wheel-pool ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dr88aph-result-row { grid-template-columns: 140px minmax(300px, 1fr); }
  .dr88aph-result-row > p { grid-column: 1 / -1; text-align: center; }
  .dr88aph-summary { grid-template-columns: repeat(3, 1fr); }
  .dr88aph-footer { padding-bottom: 104px; }
  .dr88aph-toast { bottom: calc(88px + env(safe-area-inset-bottom)); }
}

@media (max-width: 620px) {
  .dr88aph-shell { width: calc(100% - 24px); }
  .dr88aph-demo { align-items: flex-start; flex-direction: column; gap: 4px; font-size: 12px; }
  .dr88aph-home__poster { height: 280px; min-height: 280px; }
  .dr88aph-home__poster img { min-height: 280px; }
  .dr88aph-campaign-mark { align-items: flex-start; flex-direction: column; gap: 2px; }
  .dr88aph-home h1 { font-size: 36px; }
  .dr88aph-next-match { grid-template-columns: 1fr; }
  .dr88aph-home__actions { display: grid; grid-template-columns: 1fr; }
  .dr88aph-home__actions .dr88aph-primary, .dr88aph-home__actions .dr88aph-secondary { width: 100%; min-height: 52px; }
  .dr88aph-trust li + li { padding-left: 10px; }
  .dr88aph-trust span { font-size: 12px; line-height: 18px; }
  .dr88aph-home__schedule > header { align-items: flex-start; }
  .dr88aph-home__schedule > header a { white-space: nowrap; }
  .dr88aph-workspace, .dr88aph-rules-page, .dr88aph-results-page, .dr88aph-history-page { padding: 18px; }
  .dr88aph-wheel-page { padding: 18px; }
  .dr88aph-page-head { align-items: flex-start; flex-direction: column; gap: 14px; padding-bottom: 18px; }
  .dr88aph-page-head__cta { width: 100%; }
  .dr88aph-match { padding: 17px; }
  .dr88aph-match__time { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dr88aph-countdown { align-self: flex-end; margin-top: -36px; }
  .dr88aph-score-builder { grid-template-columns: 1fr 24px 1fr; gap: 5px; }
  .dr88aph-score-builder__vs b { font-size: 28px; }
  .dr88aph-score-input input { width: 52px; height: 52px; font-size: 32px; line-height: 36px; }
  .dr88aph-team.is-large .dr88aph-team__flag { width: 66px; height: 48px; }
  .dr88aph-team.is-large .dr88aph-team__flag img { width: 50px; height: 33px; }
  .dr88aph-corners legend { grid-template-columns: 26px 1fr; }
  .dr88aph-corners legend small { grid-column: 1 / -1; justify-self: start; padding-left: 35px; }
  .dr88aph-corners label > span { min-height: 72px; padding: 11px 34px 11px 12px; }
  .dr88aph-corners label > span::after { right: 9px; }
  .dr88aph-submit-meta { align-items: flex-start; flex-direction: column; gap: 4px; }
  .dr88aph-primary, .dr88aph-secondary { min-height: 52px; padding: 11px 13px; font-size: 14px; }
  .dr88aph-sample-label { align-items: flex-start; flex-direction: column; gap: 2px; }
  .dr88aph-prize-sample > header { padding: 22px 18px 19px; }
  .dr88aph-prize-sample h2 { font-size: 26px; line-height: 33px; }
  .dr88aph-prize-sample > h3 { margin-inline: 18px; }
  .dr88aph-prize-sample > .dr88aph-table-wrap { margin-inline: 18px; }
  .dr88aph-sample-note { margin-inline: 18px; }
  .dr88aph-segmented { width: 100%; }
  .dr88aph-segmented a { flex: 1; min-width: 0; padding-inline: 10px; }
  .dr88aph-wheel-head { align-items: flex-start; }
  .dr88aph-wheel-stage { height: 180px; }
  .dr88aph-wheel-card { flex-basis: 158px; height: 142px; }
  .dr88aph-wheel-card__symbol { top: 16px; font-size: 29px; line-height: 36px; }
  .dr88aph-wheel-actions { align-items: stretch; flex-direction: column; gap: 9px; }
  .dr88aph-wheel-actions .dr88aph-primary { width: 100%; }
  .dr88aph-wheel-actions p { text-align: center; }
  .dr88aph-wheel-pool ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dr88aph-beta-banner { grid-template-columns: 1fr; gap: 5px; }
  .dr88aph-beta-banner span { grid-row: auto; justify-self: start; }
  .dr88aph-live-rules ul { grid-template-columns: 1fr; }
  .dr88aph-result-row { grid-template-columns: 1fr; gap: 12px; padding-inline: 4px; }
  .dr88aph-result-row__meta { grid-template-columns: 1fr auto; }
  .dr88aph-result-row__score { width: min(330px, 100%); margin: 0 auto; }
  .dr88aph-result-row > p { grid-column: auto; text-align: center; }
  .dr88aph-summary { grid-template-columns: 1fr 1fr; }
  .dr88aph-ticket { grid-template-columns: 1fr; gap: 10px; }
  .dr88aph-ticket__points { text-align: left; }
  .dr88aph-footer > .dr88aph-shell { flex-wrap: wrap; }
  .dr88aph-footer p { order: 3; width: 100%; }
  .dr88aph-dialog { padding: 25px 18px; }
  .dr88aph-prediction-dialog__head { margin-right: 48px; }
  .dr88aph-dialog.is-success .dr88aph-prediction-dialog__head { margin-right: 0; }
  .dr88aph-prediction-recap__score { gap: 8px; min-height: 118px; padding: 14px 9px; }
  .dr88aph-prediction-recap__team { gap: 6px; }
  .dr88aph-prediction-recap__team > span { width: 54px; height: 40px; }
  .dr88aph-prediction-recap__team img { width: 46px; height: 30px; }
  .dr88aph-prediction-recap__team strong { font-size: 12px; line-height: 17px; }
  .dr88aph-prediction-recap__numbers { gap: 7px; min-width: 94px; min-height: 52px; padding: 10px 12px; font-size: 22px; line-height: 29px; }
  .dr88aph-prediction-recap__corners { align-items: center; flex-direction: column; gap: 1px; }
  .dr88aph-dialog__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 390px) {
  .dr88aph-shell { width: calc(100% - 18px); }
  .dr88aph-header__inner { padding-inline: 9px; }
  .dr88aph-header-cta { padding-inline: 11px; }
  .dr88aph-header-cta::before { display: none; }
  .dr88aph-main-nav a { font-size: 14px; }
  .dr88aph-main-nav > .dr88aph-nav-link, .dr88aph-nav-more { font-size: 13px; }
  .dr88aph-prediction-dialog { width: calc(100% - 14px); padding-inline: 14px; }
  .dr88aph-prediction-recap__score { gap: 6px; padding-inline: 6px; }
  .dr88aph-prediction-recap__numbers { min-width: 82px; padding-inline: 9px; }
  .dr88aph-home__content, .dr88aph-home__schedule { padding-inline: 16px; }
  .dr88aph-home h1 { font-size: 34px; }
  .dr88aph-workspace, .dr88aph-rules-page, .dr88aph-results-page, .dr88aph-history-page { padding: 14px; }
  .dr88aph-wheel-page { padding: 14px; }
  .dr88aph-wheel-head { gap: 8px; padding-bottom: 10px; }
  .dr88aph-wheel-head p { display: none; }
  .dr88aph-wheel-head .dr88aph-demo-chip { min-height: 34px; padding-block: 5px; }
  .dr88aph-wheel-subnav { margin-block: 10px 12px; }
  .dr88aph-wheel-console, .dr88aph-wheel-pool { padding: 14px; }
  .dr88aph-wheel-console > header { margin-bottom: 10px; }
  .dr88aph-wheel-stage { height: 150px; }
  .dr88aph-wheel-card { flex-basis: 140px; height: 116px; }
  .dr88aph-wheel-card__symbol { top: 10px; font-size: 24px; line-height: 30px; }
  .dr88aph-wheel-card__info { min-height: 52px; padding: 8px 9px; }
  .dr88aph-wheel-card__info strong { font-size: 12px; }
  .dr88aph-wheel-actions { margin-top: 12px; }
  .dr88aph-wheel-marker::before, .dr88aph-wheel-marker::after { border-right-width: 8px; border-left-width: 8px; }
  .dr88aph-rule-summary.is-wheel { grid-template-columns: 1fr; }
  .dr88aph-rule-summary.is-wheel > div { min-height: 76px; }
  .dr88aph-wheel-policy-grid > section, .dr88aph-live-rules { padding: 17px; }
  .dr88aph-match { padding: 14px; }
  .dr88aph-corners label b { font-size: 13px; }
  .dr88aph-corners label em { font-size: 12px; line-height: 18px; }
}

/* History profile: one wine-and-gold system for identity, score and match slips. */
.dr88aph-history-page {
  position: relative;
  overflow: hidden;
  background: #fff9f1;
  box-shadow: 0 18px 46px rgba(47, 2, 5, 0.2);
}

.dr88aph-history-page > .dr88aph-page-head {
  position: relative;
  isolation: isolate;
  align-items: center;
  padding: 28px 30px 26px;
  overflow: hidden;
  border: 0;
  background:
    radial-gradient(circle at 78% 28%, rgba(226, 184, 82, 0.18), transparent 25%),
    linear-gradient(125deg, #350204 0%, #69080d 58%, #410204 100%);
}

.dr88aph-history-page > .dr88aph-page-head::before {
  position: absolute;
  z-index: -1;
  top: -150px;
  right: 9%;
  width: 430px;
  height: 430px;
  background: url("../images/dong-son-drum-800.webp") center / contain no-repeat;
  content: "";
  opacity: 0.07;
  pointer-events: none;
}

.dr88aph-history-page > .dr88aph-page-head h1 {
  color: #fff5da;
  font-size: clamp(34px, 4vw, 42px);
  font-weight: 850;
  letter-spacing: -0.03em;
  line-height: 1.08;
}

.dr88aph-history-page > .dr88aph-page-head p {
  max-width: 58ch;
  margin-top: 7px;
  color: #e7cfc2;
  font-size: 14px;
  line-height: 21px;
}

.dr88aph-history-page .dr88aph-page-head__actions {
  position: relative;
  z-index: 1;
}

.dr88aph-history-page .dr88aph-page-head__actions .dr88aph-text-link {
  color: #f6dda0;
}

.dr88aph-history-page .dr88aph-page-head__actions .dr88aph-review-launcher {
  border-color: #e2b64f;
  background: #fff0c4;
  color: #62070b;
  box-shadow: 0 9px 20px rgba(20, 0, 2, 0.25);
}

.dr88aph-history-page > .dr88aph-review-notice {
  margin: 16px 28px 0;
  border-color: #d3a73f;
  background: linear-gradient(100deg, #76090e, #a41118 62%, #6b070c);
  box-shadow: 0 9px 22px rgba(91, 4, 9, 0.16);
}

.dr88aph-history-page [data-member-dashboard] {
  padding: 0 28px 28px;
}

.dr88aph-history-page .dr88aph-member-content {
  margin-top: 20px;
}

.dr88aph-history-page .dr88aph-member-head {
  position: relative;
  isolation: isolate;
  min-height: 82px;
  padding: 16px 20px;
  overflow: hidden;
  border-radius: 14px 14px 0 0;
  background:
    radial-gradient(circle at 82% 24%, rgba(239, 200, 105, 0.2), transparent 24%),
    linear-gradient(120deg, #3a0205, #6a080d 60%, #430205);
  box-shadow: 0 12px 28px rgba(52, 2, 5, 0.18);
}

.dr88aph-history-page .dr88aph-member-head::after {
  position: absolute;
  z-index: -1;
  top: -72px;
  right: 4%;
  width: 220px;
  height: 220px;
  background: url("../images/dong-son-drum-800.webp") center / contain no-repeat;
  content: "";
  opacity: 0.06;
  pointer-events: none;
}

.dr88aph-history-page .dr88aph-member-head p {
  color: #e1bd67;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.1em;
  line-height: 15px;
}

.dr88aph-history-page .dr88aph-member-head h2 {
  margin-top: 2px;
  color: #fff8e8;
  font-size: 25px;
  font-weight: 850;
  letter-spacing: -0.02em;
  line-height: 31px;
}

.dr88aph-history-page .dr88aph-member-head .dr88aph-text-button {
  color: #f7dd9c;
}

.dr88aph-history-page .dr88aph-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  margin: 0 0 18px;
  border-radius: 0 0 14px 14px;
  background: linear-gradient(110deg, #4b0508, #710a0f 56%, #430205);
  box-shadow: 0 13px 28px rgba(48, 2, 4, 0.16);
}

.dr88aph-history-page .dr88aph-summary > div,
.dr88aph-history-page.is-review-preview .dr88aph-summary > div {
  position: relative;
  padding: 13px 10px 15px;
  border: 0;
  text-align: center;
}

.dr88aph-history-page .dr88aph-summary > div + div::before {
  position: absolute;
  top: 13px;
  bottom: 13px;
  left: 0;
  width: 1px;
  background: rgba(239, 207, 131, 0.2);
  content: "";
}

.dr88aph-history-page .dr88aph-summary span {
  color: #dbc6bb;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
}

.dr88aph-history-page .dr88aph-summary b {
  margin-top: 2px;
  color: #ffe083;
  font-size: 22px;
  font-weight: 900;
  line-height: 28px;
}

.dr88aph-history-page .dr88aph-summary [data-summary-metric="rank"] b,
.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"] b {
  color: #fff5cf;
  font-size: 24px;
}

.dr88aph-history-page .dr88aph-ticket-list,
.dr88aph-history-page.is-review-preview .dr88aph-ticket-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 12px;
  max-height: min(58vh, 620px);
  padding: 4px 8px 10px 4px;
  overflow-y: auto;
  scrollbar-color: #9b5554 #f8eadc;
}

.dr88aph-history-page .dr88aph-ticket,
.dr88aph-history-page.is-review-preview .dr88aph-ticket {
  --history-ticket-accent: #8d1017;
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px 14px;
  min-height: 166px;
  padding: 15px 16px 14px;
  overflow: hidden;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(145deg, #fffdf8, #fff5e9);
  box-shadow: 0 10px 24px rgba(77, 17, 10, 0.11), inset 0 1px rgba(255, 255, 255, 0.9);
}

.dr88aph-history-page .dr88aph-ticket::after {
  position: absolute;
  z-index: -1;
  top: -52px;
  right: -46px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--history-ticket-accent) 11%, transparent), transparent 68%);
  content: "";
  pointer-events: none;
}

.dr88aph-history-page .dr88aph-ticket.is-perfect { --history-ticket-accent: #b9871f; }
.dr88aph-history-page .dr88aph-ticket.is-partial { --history-ticket-accent: #a20d15; }
.dr88aph-history-page .dr88aph-ticket.is-incorrect { --history-ticket-accent: #756862; }
.dr88aph-history-page .dr88aph-ticket.is-pending { --history-ticket-accent: #9c7337; }

.dr88aph-history-page .dr88aph-ticket__match {
  min-width: 0;
}

.dr88aph-history-page .dr88aph-ticket__match p {
  color: #8a6a5e;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-history-page .dr88aph-ticket__match strong {
  margin: 4px 0 3px;
  color: #351d1d;
  font-size: 15px;
  font-weight: 850;
  line-height: 20px;
}

.dr88aph-history-page .dr88aph-ticket__match small {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--history-ticket-accent) 10%, #fff);
  color: var(--history-ticket-accent);
  font-size: 10px;
  font-weight: 850;
  line-height: 15px;
}

.dr88aph-history-page .dr88aph-ticket__points {
  grid-column: 2;
  grid-row: 1;
  min-width: 60px;
  padding: 7px 9px;
  border-radius: 10px;
  background: var(--history-ticket-accent);
  box-shadow: 0 7px 15px color-mix(in srgb, var(--history-ticket-accent) 20%, transparent);
  text-align: center;
}

.dr88aph-history-page .dr88aph-ticket__points b {
  color: #fff4cd;
  font-size: 19px;
  font-weight: 900;
  line-height: 23px;
}

.dr88aph-history-page .dr88aph-ticket__points span {
  color: #f2ddd0;
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
}

.dr88aph-history-page .dr88aph-ticket__pick,
.dr88aph-history-page.is-review-preview .dr88aph-ticket__pick {
  grid-column: 1 / -1;
  padding-top: 10px;
  border-top: 1px solid #ead8c8;
}

.dr88aph-history-page .dr88aph-ticket__pick b {
  color: #4a1417;
  font-size: 23px;
  font-weight: 850;
  line-height: 28px;
}

.dr88aph-history-page .dr88aph-ticket__pick small {
  color: #806b63;
  font-size: 11px;
  line-height: 16px;
}

.dr88aph-history-page .dr88aph-ticket__breakdown {
  margin-top: 8px;
  gap: 6px;
}

.dr88aph-history-page .dr88aph-ticket__breakdown span {
  min-height: 23px;
  padding: 4px 7px;
  background: #eee8e2;
  color: #655d59;
  font-size: 10px;
  line-height: 15px;
}

.dr88aph-history-page .dr88aph-ticket__breakdown span.is-hit {
  background: #dcefe1;
  color: #17653a;
}

.dr88aph-history-page .dr88aph-ticket__breakdown span.is-pending {
  background: #f6e6b9;
  color: #72500b;
}

.dr88aph-history-page .dr88aph-review-scroll-cue {
  margin: 8px 0 0;
  color: #8b5d21;
  font-size: 10px;
  font-weight: 800;
  line-height: 15px;
  text-align: center;
}

.dr88aph-history-page .dr88aph-member-gate {
  margin-block: 26px 0;
  border-radius: 16px;
  background: #fff4e7;
  box-shadow: inset 0 0 0 1px #ead2bd;
}

@media (max-width: 1100px) {
  .dr88aph-history-page > .dr88aph-page-head {
    align-items: flex-start;
    flex-direction: column;
    padding: 24px;
  }

  .dr88aph-history-page [data-member-dashboard] {
    padding-inline: 20px;
  }

  .dr88aph-history-page > .dr88aph-review-notice {
    margin-inline: 20px;
  }

  .dr88aph-history-page .dr88aph-ticket-list,
  .dr88aph-history-page.is-review-preview .dr88aph-ticket-list {
    grid-template-columns: minmax(0, 1fr);
    max-height: min(58vh, 620px);
    overflow-y: auto;
  }
}

@media (max-width: 600px) {
  .dr88aph-history-page > .dr88aph-page-head {
    padding: 21px 18px;
  }

  .dr88aph-history-page > .dr88aph-page-head h1 {
    font-size: 29px;
  }

  .dr88aph-history-page > .dr88aph-review-notice {
    margin: 12px 15px 0;
  }

  .dr88aph-history-page [data-member-dashboard] {
    padding: 0 15px 20px;
  }

  .dr88aph-history-page .dr88aph-member-head {
    min-height: 76px;
    padding: 14px 16px;
  }

  .dr88aph-history-page .dr88aph-member-head h2 {
    font-size: 21px;
    line-height: 27px;
  }

  .dr88aph-history-page .dr88aph-summary,
  .dr88aph-history-page.is-review-preview .dr88aph-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph-history-page .dr88aph-summary > div:nth-child(4)::before {
    display: none;
  }

  .dr88aph-history-page .dr88aph-summary > div:nth-child(n + 4) {
    border-top: 1px solid rgba(239, 207, 131, 0.2);
  }

  .dr88aph-history-page .dr88aph-summary span {
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph-history-page .dr88aph-summary b,
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="rank"] b,
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="points"] b {
    font-size: 20px;
    line-height: 25px;
  }

  .dr88aph-history-page .dr88aph-ticket,
  .dr88aph-history-page.is-review-preview .dr88aph-ticket {
    min-height: 0;
    padding: 14px;
  }
}


@media (max-width: 430px) {
  .dr88aph-score-builder { grid-template-columns: 1fr; gap: 14px; }
  .dr88aph-score-builder__vs { display: none; }
  .dr88aph-score-side { grid-template-columns: minmax(76px, 90px) 1fr; align-items: center; justify-items: start; }
}

@media (max-width: 350px) {
  .dr88aph-header-cta span { font-size: 12px; }
  .dr88aph-header-cta .dr88aph-inline-icon { display: none; }
  .dr88aph-corners { grid-template-columns: 1fr; }
}

/* Compact prize history: premium ledger rhythm without desktop wrapping. */
.dr88aph-spin-history {
  grid-column: 1 / -1;
  min-width: 0;
  padding: 0;
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid rgba(205, 164, 76, .86);
  border-radius: 14px;
  background: linear-gradient(145deg, #fffdf8, #fff7e8);
  color: #650509;
  box-shadow: 0 14px 34px rgba(71, 3, 6, .13), inset 0 1px 0 #fff;
  scroll-margin-top: 100px;
}
.dr88aph-spin-history > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 60px;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255, 227, 76, .42);
  background: linear-gradient(135deg, #72070c, #3f0104);
}
.dr88aph-spin-history h2 {
  margin: 0;
  color: #fff8e7;
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
  letter-spacing: -.01em;
  white-space: nowrap;
}
.dr88aph-spin-history button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  height: 36px;
  padding: 0 13px;
  border: 1px solid rgba(255, 227, 76, .68);
  border-radius: 9px;
  background: rgba(255, 255, 255, .08);
  color: #fff8e7;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
  white-space: nowrap;
  cursor: pointer;
}
.dr88aph-spin-history > header > button[data-spin-history-refresh] {
  margin: 0 !important;
}
.dr88aph-spin-history button svg { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.dr88aph-spin-history button:hover { background: rgba(255, 227, 76, .15); }
.dr88aph-spin-history button:focus-visible { outline: 2px solid #fff8e7; outline-offset: 3px; }
.dr88aph-spin-history button:disabled { opacity: .6; cursor: wait; }
.dr88aph-spin-history [hidden] { display: none !important; }
.dr88aph-spin-history > p { margin: 0; padding: 14px 16px; color: #725d49; }
.dr88aph-spin-history > p:empty { display: none; }
.dr88aph-spin-history ol { list-style: none; padding: 5px 16px 10px; margin: 0; }
.dr88aph-spin-history li {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) max-content;
  gap: 14px;
  align-items: center;
  min-height: 64px;
  padding: 9px 0;
  margin: 0 !important;
  border-bottom: 1px solid rgba(189, 123, 12, .18);
}
.dr88aph-spin-history li:last-child { border-bottom: 0; }
.dr88aph-spin-history li > span:nth-child(2) { display: grid; grid-template-columns: minmax(0, 1fr) max-content; align-items: center; gap: 20px; min-width: 0; }
.dr88aph-spin-history:not(.is-expanded) li:nth-child(n+6) { display: none; }
.dr88aph-spin-history__image {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  overflow: hidden;
  border: 1px solid rgba(205, 164, 76, .5);
  border-radius: 10px;
  background: #fffaf0;
  font-size: 10px;
  font-weight: 800;
}
.dr88aph-spin-history__image img { width: 38px; height: 38px; object-fit: contain; }
.dr88aph-spin-history strong,
.dr88aph-spin-history time {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dr88aph-spin-history strong { color: #650509; font-size: 14px; line-height: 20px; }
.dr88aph-spin-history time { margin: 0; color: #806c58; font-size: 11px; font-variant-numeric: tabular-nums; line-height: 16px; }
.dr88aph-spin-history__status {
  min-width: max-content;
  padding: 6px 10px;
  border: 1px solid rgba(189, 123, 12, .2);
  border-radius: 8px;
  background: #fff0c4;
  color: #684b13;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  white-space: nowrap;
}
.dr88aph-spin-history__status.is-fulfilled { border-color: rgba(8, 120, 82, .2); background: #e8f7f1; color: #087852; }
.dr88aph-spin-history__status.is-cancelled { border-color: #e4d8cf; background: #f2ece7; color: #655c57; }
.dr88aph-spin-history > button[data-spin-history-more] {
  display: flex;
  width: max-content;
  margin: 8px auto 12px !important;
  border-color: #bd7b0c;
  background: #fff8e7;
  color: #650509;
}
@media (max-width: 680px) {
  .dr88aph-spin-history { margin-top: 12px; border-radius: 12px; }
  .dr88aph-spin-history > header { min-height: 56px; padding: 10px 12px; }
  .dr88aph-spin-history h2 { font-size: 16px; line-height: 22px; }
  .dr88aph-spin-history button { padding-inline: 11px; }
  .dr88aph-spin-history ol { padding: 4px 12px 8px; }
  .dr88aph-spin-history li { grid-template-columns: 40px minmax(0, 1fr) max-content; gap: 10px; min-height: 62px; padding: 8px 0; }
  .dr88aph-spin-history li > span:nth-child(2) { display: block; }
  .dr88aph-spin-history__image { width: 40px; height: 40px; }
  .dr88aph-spin-history__image img { width: 35px; height: 35px; }
  .dr88aph-spin-history strong { font-size: 13px; line-height: 18px; }
  .dr88aph-spin-history time { margin-top: 2px; font-size: 10px; line-height: 15px; }
  .dr88aph-spin-history__status { padding: 5px 7px; font-size: 10px; line-height: 14px; }
  .dr88aph-spin-history:not(.is-expanded) li:nth-child(n+4) { display: none; }
}

.dr88aph-member-bar {
  position: relative;
  z-index: 90;
  width: 100%;
  padding: 9px 0 0;
}

.dr88aph-member-bar__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 56px;
  padding: 6px 9px;
  overflow: visible;
  border: 1px solid rgba(219, 170, 46, 0.72);
  border-radius: 14px;
  background: linear-gradient(135deg, #fffefb 0%, #fff8eb 100%);
  box-shadow: 0 8px 22px rgba(57, 8, 10, 0.14), inset 0 1px 0 #fff;
}

/* Signed-out state stays a compact account utility instead of an empty full-width strip. */
.dr88aph-member-bar:not(.is-authenticated) .dr88aph-member-bar__inner {
  display: block;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph-member-bar__login,
.dr88aph-member-bar__account {
  grid-column: 1 / -1;
  width: 100%;
}

.dr88aph-member-bar__login {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 46px;
  margin: 0;
  padding: 2px 2px 2px 5px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #4c5567;
  cursor: pointer;
  text-align: left;
  transition: background-color 180ms ease-out, box-shadow 180ms ease-out;
}

.dr88aph-member-bar:not(.is-authenticated) .dr88aph-member-bar__login {
  grid-template-columns: minmax(250px, 1fr) auto auto;
  width: 100%;
  min-height: 56px;
  padding: 6px 6px 6px 8px;
  border: 1px solid rgba(233, 188, 76, 0.76);
  border-radius: 14px;
  background: linear-gradient(105deg, #410206 0%, #69070d 52%, #3a0105 100%);
  box-shadow: 0 10px 26px rgba(35, 1, 4, 0.24), inset 0 1px 0 rgba(255, 237, 176, 0.14);
}

.dr88aph-member-bar:not(.is-authenticated) .dr88aph-member-bar__login-copy strong {
  color: #fff8e5;
}

.dr88aph-member-bar:not(.is-authenticated) .dr88aph-member-bar__login-copy small {
  color: #dcccae;
}

.dr88aph-member-bar__login-benefits {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.dr88aph-member-bar__login-benefits > span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid rgba(239, 202, 105, 0.34);
  border-radius: 9px;
  background: rgba(255, 244, 210, 0.07);
  color: #f3db9b;
  font-size: 10px;
  font-weight: 750;
  line-height: 14px;
  white-space: nowrap;
}

.dr88aph-member-bar__login:hover {
  box-shadow: 0 12px 30px rgba(35, 1, 4, 0.29), inset 0 1px 0 rgba(255, 237, 176, 0.18);
}

.dr88aph-member-bar__login:focus-visible {
  outline: 3px solid #7a060b;
  outline-offset: 3px;
}

.dr88aph-member-bar__login-copy {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}

.dr88aph-member-bar__login-copy > span:last-child,
.dr88aph-member-bar__identity > span:last-child {
  display: grid;
  min-width: 0;
  gap: 1px;
}

.dr88aph-member-bar__login strong,
.dr88aph-member-bar__identity strong {
  color: #70080d;
  font-size: 13px;
  font-weight: 850;
  line-height: 17px;
}

.dr88aph-member-bar__login small,
.dr88aph-member-bar__identity small {
  color: #757b88;
  font-size: 10px;
  font-weight: 650;
  line-height: 14px;
}

.dr88aph-member-bar__login-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 118px;
  min-height: 42px;
  padding: 0 17px;
  border: 1px solid #d8aa35;
  border-radius: 10px;
  background: linear-gradient(145deg, #b20e19, #79070e 76%);
  box-shadow: 0 7px 16px rgba(91, 4, 10, 0.22), inset 0 1px 0 rgba(255, 238, 176, 0.28);
  color: #fff7dd;
  font-size: 12px;
  font-weight: 850;
  line-height: 16px;
  white-space: nowrap;
  transition: transform 180ms ease-out, box-shadow 180ms ease-out;
}

.dr88aph-member-bar__login-cta svg {
  width: 15px;
  height: 15px;
  color: #ffdc68;
}

.dr88aph-member-bar__login:hover .dr88aph-member-bar__login-cta {
  transform: translateY(-1px);
  box-shadow: 0 9px 20px rgba(91, 4, 10, 0.27), inset 0 1px 0 rgba(255, 238, 176, 0.34);
}

.dr88aph-member-bar__login:active .dr88aph-member-bar__login-cta {
  transform: translateY(0);
}

.dr88aph-member-bar__icon {
  display: inline-grid;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid #e5b530;
  border-radius: 11px;
  background: linear-gradient(145deg, #980b14, #5d0509);
  color: #ffd85d;
  box-shadow: 0 4px 10px rgba(111, 5, 11, 0.18);
}

.dr88aph-member-bar__icon svg {
  width: 19px;
  height: 19px;
}

.dr88aph-member-bar__account {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto auto;
  align-items: center;
  gap: 14px;
}

.dr88aph-member-bar__identity {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.dr88aph-member-bar__meta {
  display: flex;
  align-items: center;
  gap: 0;
  color: #5d6472;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.dr88aph-member-bar__meta > span {
  display: grid;
  gap: 3px;
  min-width: 90px;
  padding: 2px 16px;
  border-right: 1px solid #e7d8bf;
  text-align: center;
}

.dr88aph-member-bar__meta b { color: #680b12; font-size: 14px; line-height: 17px; }
.dr88aph-member-bar__meta small { color: #82745e; font-size: 10px; font-weight: 600; line-height: 13px; }

.dr88aph-member-bar__turns {
  display: grid;
  min-width: 88px;
  padding: 7px 14px;
  border: 1px solid #c6a25f;
  border-radius: 10px;
  background: linear-gradient(145deg, #74202a, #3e0810);
  box-shadow: inset 0 1px 0 #ffffff20;
  color: #f3d997;
  text-align: center;
}

.dr88aph-member-bar__turns b {
  font-size: 18px;
  line-height: 20px;
}

.dr88aph-member-bar__turns small {
  font-size: 10px;
  font-weight: 800;
  line-height: 10px;
  text-transform: uppercase;
}

.dr88aph .dr88aph-member-bar__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 44px;
  padding: 9px 16px;
  border: 1px solid #d9c49d;
  border-radius: 9px;
  background: #fffaf0;
  color: #69121a;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.dr88aph-member-bar__action svg {
  width: 13px;
  height: 13px;
}

.dr88aph-account-menu { position: relative; margin: 0; }
.dr88aph-account-menu > summary { cursor: pointer; list-style: none; }
.dr88aph-account-menu > summary::-webkit-details-marker { display: none; }
.dr88aph-account-menu__panel {
  position: absolute;
  z-index: 101;
  top: calc(100% + 9px);
  right: 0;
  display: grid;
  min-width: 210px;
  padding: 7px;
  border: 1px solid #d6bc88;
  border-radius: 12px;
  background: #fffaf1;
  box-shadow: 0 12px 30px #33061030;
}
.dr88aph .dr88aph-account-menu__panel > :is(a, button) {
  display: block;
  width: 100%;
  min-height: 42px;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #66121b;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.dr88aph .dr88aph-account-menu__panel > :is(a, button):hover,
.dr88aph .dr88aph-account-menu__panel > :is(a, button):focus-visible { background: #f3e7d4; }

.dr88aph-member-bar [hidden] {
  display: none !important;
}

@media (min-width: 1101px) {
  [data-dr88aph-app].dr88aph[data-view] {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }
}

.dr88aph[data-view="top"] .dr88aph-top-tier-ranks {
  width: 100%;
  box-sizing: border-box;
  max-width: 100%;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank,
.dr88aph[data-view="top"] .dr88aph-top-ladder .dr88aph-top-tier-rank {
  margin: 0 !important;
}

.dr88aph[data-view="top"] .dr88aph-top-code-delivery strong,
.dr88aph[data-view="top"] .dr88aph-top-code-delivery p {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (max-width: 680px) {
  .dr88aph-member-bar {
    padding-top: calc(var(--dr88aph-mobile-header-clearance) + 8px);
  }

  .dr88aph-member-bar__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    width: calc(100% - 20px);
    min-height: 54px;
    margin: 0 auto;
    padding: 5px 7px;
    border-radius: 12px;
  }

  .dr88aph-member-bar__login {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    min-height: 42px;
    padding: 0;
  }

  .dr88aph-member-bar:not(.is-authenticated) .dr88aph-member-bar__login {
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    min-height: 48px;
    padding: 4px;
  }

  .dr88aph-member-bar__login-benefits {
    display: none;
  }

  .dr88aph-member-bar__login-copy {
    gap: 8px;
  }

  .dr88aph-member-bar__login-copy .dr88aph-member-bar__icon {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
    border-radius: 9px;
  }

  .dr88aph-member-bar__login-copy strong {
    font-size: 12px;
    line-height: 16px;
    white-space: nowrap;
  }

  .dr88aph-member-bar__login-copy small {
    display: none;
  }

  .dr88aph-member-bar__login-cta {
    min-width: 86px;
    min-height: 40px;
    padding-inline: 10px;
    font-size: 11px;
  }

  .dr88aph-member-bar__account {
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
  }

  .dr88aph-member-bar__identity {
    gap: 7px;
  }

  .dr88aph-member-bar__meta,
  .dr88aph-member-bar__action {
    display: none;
  }

  .dr88aph-member-bar__turns {
    min-width: 62px;
    padding-inline: 8px;
  }

  .dr88aph .dr88aph-member-bar__action { display: inline-flex; padding: 8px; font-size: 10px; }
  .dr88aph-member-bar__identity strong { font-size: 11px; overflow-wrap: anywhere; }
  .dr88aph-member-bar__identity .dr88aph-member-bar__icon { display: none; }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-main {
    padding-top: 10px !important;
    scroll-padding-top: calc(var(--dr88aph-mobile-header-clearance) + 74px);
  }
}

@media (min-width: 681px) and (max-width: 980px) {
  .dr88aph-member-bar__login-benefits { display: none; }
  .dr88aph-member-bar:not(.is-authenticated) .dr88aph-member-bar__login {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

/* V1.18.39: center the identity feedback and privacy copy. */
.dr88aph-identity-dialog [data-identity-error],
.dr88aph-identity-dialog .dr88aph-privacy {
  box-sizing: border-box;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

/* Mobile composition repair: readable campaign cards, full-width Top panels and stable history actions. */

@media (max-width: 680px) {

  .dr88aph[data-view="top"] .dr88aph-top-ranking,
  .dr88aph[data-view="top"] .dr88aph-top-board,
  .dr88aph[data-view="top"] .dr88aph-top-ladder,
  .dr88aph[data-view="top"] .dr88aph-top-band-panels,
  .dr88aph[data-view="top"] .dr88aph-top-band-panel,
  .dr88aph[data-view="top"] .dr88aph-top-tier-panels {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav {
    padding-right: 8px;
    padding-left: 8px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium {
    padding-right: 8px;
    padding-left: 8px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card,
  .dr88aph[data-view="top"] .dr88aph-top-tier {
    width: 100%;
  }

  .dr88aph-history-page .dr88aph-member-head__rank {
    width: 82px;
  }

  .dr88aph-history-page .dr88aph-member-head .dr88aph-text-button {
    box-sizing: border-box;
    width: 82px;
  }
}

/* Mobile polish: readable review actions and evenly paced prize-claim steps. */
.dr88aph-results-page .dr88aph-review-launcher,
.dr88aph-history-page .dr88aph-page-head__actions .dr88aph-review-launcher {
  border-color: #e2b64f !important;
  background: linear-gradient(145deg, #7c070d, #b3111a) !important;
  color: #fff8e7 !important;
  text-shadow: 0 1px 0 rgba(52, 1, 5, 0.32);
}

.dr88aph-results-page .dr88aph-review-launcher:hover,
.dr88aph-results-page .dr88aph-review-launcher:focus-visible,
.dr88aph-history-page .dr88aph-page-head__actions .dr88aph-review-launcher:hover,
.dr88aph-history-page .dr88aph-page-head__actions .dr88aph-review-launcher:focus-visible {
  border-color: #f0ca66 !important;
  background: linear-gradient(145deg, #970b13, #c91a24) !important;
  color: #ffffff !important;
}

.dr88aph-results-page .dr88aph-review-launcher.is-active,
.dr88aph-history-page .dr88aph-page-head__actions .dr88aph-review-launcher.is-active {
  border-color: #d7a63b !important;
  background: #fff4cf !important;
  color: #72070c !important;
  text-shadow: none;
}

@media (max-width: 680px) {
  .dr88aph[data-view="rules"] .dr88aph-rules-focus.is-prizes .dr88aph-wheel-policy-grid ol {
    display: grid;
    gap: 10px;
    margin: 12px 0 0;
    padding-left: 21px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-focus.is-prizes .dr88aph-wheel-policy-grid ol li {
    min-height: 0;
    padding-left: 3px;
    line-height: 1.55;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-focus.is-prizes .dr88aph-wheel-policy-grid ol li::marker {
    color: #ffe16a;
    font-weight: 900;
  }
}

/* Mobile Results density lock: contained title and one-line score ledger. */
@media (max-width: 680px) {
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-results-page > .dr88aph-page-head {
    box-sizing: border-box;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    overflow: hidden;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-results-page > .dr88aph-page-head > div {
    width: 100%;
    min-width: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] #dr88aph-results-title {
    max-width: 100%;
    font-size: clamp(20px, 5.5vw, 22px);
    line-height: 1.18;
    letter-spacing: -0.025em;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking th,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking td {
    padding: 4px;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking th {
    font-size: 10px;
    line-height: 13px;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking th:first-child,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking td:first-child {
    width: 15%;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking th:nth-child(2),
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking td:nth-child(2) {
    width: 35%;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking th:nth-child(7),
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking td:nth-child(7) {
    width: 25%;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking th:nth-child(8),
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking td:nth-child(8) {
    width: 25%;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-rank {
    width: 26px;
    height: 26px;
    margin-inline: auto;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-ranking-code {
    width: min(64px, 100%);
    min-width: 0;
    min-height: 26px;
    padding-inline: 4px;
  }
}

/* V1.18.6 mobile composition: aligned benefits, unified honours and a fully visible ranking table. */
@media (max-width: 680px) {
  .dr88aph[data-view="home"] .dr88aph-home-benefits {
    display: grid;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    padding-inline: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits > li,
  .dr88aph[data-view="home"] .dr88aph-home-benefits > li + li {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    border: 1px solid #c99a24;
    border-radius: 12px;
    background: linear-gradient(145deg, #73070c 0%, #430205 100%);
    box-shadow: 0 8px 18px rgba(74, 2, 6, 0.2);
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a > .dr88aph-inline-icon {
    right: 11px;
    width: 17px;
    height: 17px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy small {
    line-height: 13px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
    font-size: 12px;
    line-height: 16px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium {
    gap: 9px;
    padding: 10px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
    gap: 8px;
    padding: 11px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card .dr88aph-top-rank b {
    width: 36px;
    height: 64px;
    background-position: -40px bottom;
    background-size: 192px 64px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-rank b {
    width: 42px;
    height: 72px;
    background-position: -84px bottom;
    background-size: 216px 72px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="3"] .dr88aph-top-rank b {
    background-position-x: -120px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-honor {
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-honor {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .dr88aph[data-view="top"] .dr88aph-top-honor__copy {
    align-self: center;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card__reward {
    gap: 8px;
    padding-top: 7px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member {
    justify-items: start;
    text-align: left;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-metrics > div {
    min-height: 44px;
    padding-block: 5px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__stage {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 9px;
    margin-top: 12px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place,
  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1,
  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-2,
  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-3 {
    display: grid;
    grid-column: auto;
    grid-template-columns: 82px minmax(0, 1fr);
    align-items: stretch;
    width: 100%;
    min-height: 104px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--podium-light);
    border-radius: 12px;
    background: linear-gradient(155deg, #6d2923, #521a19);
    box-shadow: inset 0 1px rgba(237, 201, 157, 0.18);
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-1 {
    order: 1;
    background: linear-gradient(155deg, #813b24, #5c2015);
    box-shadow: inset 0 1px rgba(255, 229, 159, 0.24);
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-2 {
    order: 2;
    background: linear-gradient(155deg, #5d252a, #3f171b);
    box-shadow: inset 0 1px rgba(237, 241, 242, 0.2);
  }

  .dr88aph-results-page .dr88aph-ranking-podium__place.is-rank-3 { order: 3; }

  .dr88aph-results-page .dr88aph-ranking-podium__visual,
  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual,
  .dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__visual {
    align-self: end;
    width: 82px;
    height: 104px;
    margin: 0;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__visual img {
    left: -45px;
    height: 104px;
  }

  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__visual img {
    left: -116px;
    height: 104px;
  }

  .dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__visual img {
    left: -190px;
    height: 104px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__info,
  .dr88aph-results-page .is-rank-1 .dr88aph-ranking-podium__info,
  .dr88aph-results-page .is-rank-2 .dr88aph-ranking-podium__info,
  .dr88aph-results-page .is-rank-3 .dr88aph-ranking-podium__info {
    align-content: center;
    min-height: 104px;
    padding: 9px 11px;
    overflow: hidden;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__prize {
    width: min(108px, 100%);
    min-height: 36px;
    margin-top: 7px;
  }

  .dr88aph-results-page .dr88aph-ranking-podium__benefit {
    margin-top: 10px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-table-wrap {
    overflow-x: hidden;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th,
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td {
    padding-right: 4px;
    padding-left: 4px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:first-child,
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:first-child {
    width: 40px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(2),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(2) {
    width: auto;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(7),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(7) {
    width: 58px;
  }

  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking th:nth-child(8),
  .dr88aph-results-page .dr88aph-ranking-board .dr88aph-ranking td:nth-child(8) {
    width: 68px;
  }

  .dr88aph-results-page .dr88aph-ranking-code {
    min-width: 58px;
    padding-inline: 5px;
  }
}

/* Root-scoped authority prevents theme list spacing and older mobile layers from shifting the cards. */
@media (max-width: 680px) {
  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
    gap: 8px;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits > li,
  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits > li + li {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits a {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 60px;
    margin: 0;
    padding: 10px 42px 10px 16px;
    border: 1px solid #c99a24;
    border-radius: 12px;
    background: linear-gradient(145deg, #73070c 0%, #430205 100%);
    box-shadow: 0 8px 18px rgba(74, 2, 6, 0.2);
  }

  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefit__copy small {
    font-size: 10px;
    line-height: 13px;
  }

  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
    font-size: 12px;
    line-height: 16px;
  }

  [data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits a > .dr88aph-inline-icon {
    right: 11px;
    width: 17px;
    height: 17px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card,
  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
    grid-template-rows: auto auto auto;
    align-content: start;
    gap: 8px;
    min-height: 0;
    padding: 11px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card .dr88aph-top-rank b {
    width: 36px;
    height: 64px;
    background-position: -40px bottom;
    background-size: 192px 64px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-rank b {
    width: 42px;
    height: 72px;
    background-position: -84px bottom;
    background-size: 216px 72px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="3"] .dr88aph-top-rank b {
    background-position-x: -120px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-honor {
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-honor {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-honor__copy {
    align-self: center;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card__reward {
    gap: 8px;
    padding-top: 7px;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member {
    justify-items: start;
    text-align: left;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-metrics > div {
    min-height: 44px;
    padding-block: 5px;
  }
}

@media (max-width: 350px) {
}

/* Mobile frame lock: full-bleed route surfaces clear the fixed campaign header. */
@media (max-width: 680px) {
  [data-dr88aph-app].dr88aph[data-view] {
    --dr88aph-mobile-header-clearance: calc(60px + env(safe-area-inset-top));
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-header,
  body.admin-bar [data-dr88aph-app].dr88aph[data-view] > .dr88aph-header {
    top: 0 !important;
  }

  body.admin-bar [data-dr88aph-app].dr88aph[data-view] > .dr88aph-header {
    top: 46px !important;
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-main {
    padding: calc(var(--dr88aph-mobile-header-clearance) + 10px) 0 24px;
    scroll-padding-top: calc(var(--dr88aph-mobile-header-clearance) + 10px);
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-main > .dr88aph-shell {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-main > .dr88aph-shell > .dr88aph-panel {
    width: 100%;
    max-width: none;
    border-right-width: 0;
    border-left-width: 0;
    border-radius: 0;
  }
}

/* Desktop frame lock: every route uses one viewport shell and one footer rhythm. */
@media (min-width: 1101px) {
  [data-dr88aph-app].dr88aph[data-view] {
    /* The WordPress admin-bar class can survive after the toolbar is hidden. */
    --dr88aph-viewport: calc(100vh - var(--dr88aph-host-top-offset));
    --dr88aph-viewport: calc(100dvh - var(--dr88aph-host-top-offset));
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: var(--dr88aph-viewport);
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-main {
    min-height: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="home"] > .dr88aph-main {
    /* Match the 9px header-to-member gap without changing mobile clearance. */
    padding-block: 9px;
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-footer {
    align-self: end;
    width: 100%;
    margin: 0;
    padding: 8px 0;
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-footer > .dr88aph-shell {
    grid-template-columns: minmax(260px, 1fr) minmax(300px, 1fr);
    gap: 24px;
    min-height: 52px;
  }

  [data-dr88aph-app].dr88aph[data-view] .dr88aph-footer__trust {
    grid-column: 2;
    min-height: 50px;
    padding: 8px 12px;
  }

  [data-dr88aph-app].dr88aph[data-view] .dr88aph-footer__base {
    grid-column: 1;
    grid-row: 1;
    justify-content: stretch;
    padding-top: 0;
    border-top: 0;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="matches"] .dr88aph-match.is-compact {
    padding-bottom: 6px;
  }

  [data-dr88aph-app].dr88aph[data-view="matches"] .dr88aph-match.is-compact > .dr88aph-primary {
    margin-top: 9px;
  }
}

/* Top controls use the full width of their parent surfaces. */
.dr88aph[data-view="top"] .dr88aph-top-brief {
  --dr88aph-top-brief-gutter: 18px;
}

@media (max-width: 1100px) {
  .dr88aph[data-view="top"] .dr88aph-top-brief {
    --dr88aph-top-brief-gutter: 17px;
  }

}

/* Deployment boundary lock: protect campaign geometry from WordPress theme list and button styles. */
[data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
}

[data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits > li,
[data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits > li + li,
[data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefits > li > a {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

@media (max-width: 680px) {
  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-slot-cta,
  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-wheel-back,
  [data-dr88aph-app].dr88aph[data-view="rules"] .dr88aph-policy-claim-cta {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
    margin-right: 0;
    margin-left: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-slot-cta > span:nth-child(2) {
    min-width: 0;
    overflow-wrap: normal;
    word-break: normal;
  }

  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-slot-cta > span:nth-child(2) strong {
    display: inline-block;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-live-rules ul,
  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid :is(ul, ol) {
    box-sizing: border-box;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    padding-left: 18px;
  }

  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-live-rules li,
  [data-dr88aph-app].dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid li {
    padding-left: 2px;
    line-height: 1.55;
  }

  [data-dr88aph-app].dr88aph[data-view="rules"] .dr88aph-policy-claim-cta {
    justify-content: center;
    gap: 6px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 12px;
    line-height: 16px;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium,
  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card,
  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank] {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
    margin-right: 0;
    margin-left: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member strong,
  [data-dr88aph-app].dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member small,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium__title,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium__player,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium__score,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium__prize strong {
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-main > .dr88aph-shell {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-results-page {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium__stage,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium__place,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board__head,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-board .dr88aph-table-wrap,
  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
    margin-right: 0;
    margin-left: 0;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-podium {
    padding-right: 8px;
    padding-left: 8px;
  }

  [data-dr88aph-app].dr88aph[data-view="results"] .dr88aph-ranking-code {
    box-sizing: border-box;
    max-width: 100%;
  }
}

/* V1.18.4 release authority: one full-bleed History profile block across every responsive layer. */
.dr88aph .dr88aph-history-page .dr88aph-member-profile-card {
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  width: calc(100% + (2 * var(--dr88aph-history-gutter)));
  max-width: none;
  margin: 0 calc(0px - var(--dr88aph-history-gutter)) 18px;
  overflow: hidden;
  border: 1px solid rgba(239, 207, 131, 0.62);
  border-radius: 0;
  background: linear-gradient(118deg, #3a0205, #6f0a10 56%, #420205);
  box-shadow: 0 14px 30px rgba(48, 2, 4, 0.2);
}

.dr88aph .dr88aph-history-page .dr88aph-member-profile-card > .dr88aph-member-head {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph .dr88aph-history-page .dr88aph-member-profile-card > .dr88aph-summary,
.dr88aph .dr88aph-history-page.is-review-preview .dr88aph-member-profile-card > .dr88aph-summary {
  margin: 0;
  clip-path: none;
  border: 0;
  border-top: 1px solid rgba(239, 207, 131, 0.3);
  border-radius: 0;
  background: rgba(39, 0, 3, 0.2);
  box-shadow: none;
}

.dr88aph .dr88aph-history-page .dr88aph-member-profile-card .dr88aph-summary [data-summary-metric="exact"]::before {
  display: none;
}

@media (max-width: 680px) {
  .dr88aph .dr88aph-history-page .dr88aph-member-profile-card {
    margin-bottom: 14px;
  }

  .dr88aph .dr88aph-history-page .dr88aph-member-profile-card > .dr88aph-summary,
  .dr88aph .dr88aph-history-page.is-review-preview .dr88aph-member-profile-card > .dr88aph-summary {
    margin-top: 0;
  }
}

/* Full-bleed history profile: the hero spans the panel while prediction cards retain their reading gutter. */
.dr88aph-history-page [data-member-dashboard] {
  --dr88aph-history-gutter: 28px;
}

.dr88aph-history-page .dr88aph-member-profile-card {
  width: calc(100% + (2 * var(--dr88aph-history-gutter)));
  margin-right: calc(0px - var(--dr88aph-history-gutter));
  margin-left: calc(0px - var(--dr88aph-history-gutter));
}

@media (max-width: 1100px) {
  .dr88aph-history-page [data-member-dashboard] {
    --dr88aph-history-gutter: 20px;
  }
}

@media (max-width: 680px) {
  .dr88aph-history-page [data-member-dashboard] {
    --dr88aph-history-gutter: 15px;
  }
}

/* Unified history profile card: identity and achievement metrics share one continuous frame. */
.dr88aph-history-page .dr88aph-member-profile-card {
  position: relative;
  isolation: isolate;
  margin: 0 calc(0px - var(--dr88aph-history-gutter)) 18px;
  overflow: hidden;
  border-radius: 0;
  background:
    radial-gradient(circle at 82% 16%, rgba(239, 200, 105, 0.2), transparent 25%),
    linear-gradient(118deg, #3a0205, #6f0a10 56%, #420205);
  box-shadow:
    inset 0 0 0 1px rgba(239, 207, 131, 0.48),
    0 14px 30px rgba(48, 2, 4, 0.2);
}

.dr88aph-history-page .dr88aph-member-profile-card .dr88aph-summary [data-summary-metric="exact"]::before {
  display: none;
}

.dr88aph-history-page .dr88aph-member-profile-card > .dr88aph-member-head {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph-history-page .dr88aph-member-profile-card > .dr88aph-summary,
.dr88aph-history-page.is-review-preview .dr88aph-member-profile-card > .dr88aph-summary {
  margin: 0;
  clip-path: none;
  border-top: 1px solid rgba(239, 207, 131, 0.28);
  border-radius: 0;
  background:
    radial-gradient(circle at 50% 0%, rgba(201, 55, 45, 0.2), transparent 38%),
    rgba(39, 0, 3, 0.18);
  box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph *, .dr88aph *::before, .dr88aph *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}

/* V6: full fixture overview, direct score entry, reward showcase and claim preview. */
.dr88aph-home__actions > a,
.dr88aph-home__actions > a > span { white-space: nowrap; }

.dr88aph-home__actions > a { gap: 5px; padding-inline: 8px; font-size: 13px; }
.dr88aph-home__actions .dr88aph-inline-icon { width: 18px; height: 18px; }

.dr88aph-trust li {
  justify-items: center;
  padding-inline: 12px;
  text-align: center;
}

.dr88aph-trust li + li { padding-inline: 12px; }

.dr88aph[data-view="home"] .dr88aph-fixture-rail {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  padding: 2px;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab {
  flex: none;
  min-width: 0;
  min-height: 62px;
  gap: 4px;
  padding: 6px 4px;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab time {
  font-size: 10px;
  line-height: 13px;
  text-align: center;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab > span { gap: 4px; }
.dr88aph[data-view="home"] .dr88aph-fixture-tab img { width: 25px; height: 17px; }

.dr88aph-prediction-intro { min-width: 0; }

.dr88aph-slot-cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: min(420px, 100%);
  min-height: 62px;
  padding: 11px 18px;
  overflow: hidden;
  border: 2px solid #ffd94d;
  border-radius: 16px;
  outline: 0;
  background: linear-gradient(180deg, #e2222b 0%, #a60a11 52%, #670307 100%);
  box-shadow: 0 6px 0 #4a0205, 0 14px 28px rgba(25, 0, 2, 0.42), inset 0 2px 0 rgba(255, 255, 255, 0.32), inset 0 -3px 0 rgba(49, 0, 2, 0.42);
  color: #fffdf5;
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  line-height: 20px;
  letter-spacing: 0.025em;
  text-align: center;
  text-shadow: 0 2px 4px rgba(42, 0, 2, 0.55);
  cursor: pointer;
  transition: transform 0.16s ease-out, filter 0.16s ease-out, box-shadow 0.16s ease-out;
}

.dr88aph-slot-cta::before {
  content: "";
  position: absolute;
  top: 3px;
  right: 16px;
  left: 16px;
  height: 1px;
  background: rgba(255, 247, 210, 0.68);
  pointer-events: none;
}

.dr88aph-slot-cta:hover { filter: brightness(1.08) saturate(1.05); transform: translateY(-1px); }
.dr88aph-slot-cta:active { transform: translateY(4px); box-shadow: 0 2px 0 #4a0205, 0 8px 18px rgba(25, 0, 2, 0.38), inset 0 2px 0 rgba(255, 255, 255, 0.24); }
.dr88aph-slot-cta:focus-visible { outline: 3px solid var(--dr88-gold); outline-offset: 4px; }
.dr88aph-slot-cta:disabled { opacity: 0.7; filter: saturate(0.72); cursor: wait; }
.dr88aph-slot-cta .dr88aph-button-flag { width: 30px; height: 20px; }
.dr88aph-slot-lever { width: 25px; height: 25px; flex: none; fill: none; stroke: #ffe784; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.dr88aph-wheel-layout.is-console-only { display: grid; gap: 12px; }
.dr88aph-wheel-actions { display: grid; justify-items: center; gap: 9px; text-align: center; }
.dr88aph-wheel-actions p { max-width: 66ch; }
.dr88aph-wheel-console[data-state="result"] .dr88aph-wheel-actions p { display: none; }
.dr88aph-wheel-prize-catalog.is-wheel-showcase { margin-top: 0; }

.dr88aph-claim-card {
  padding: 18px;
  border-radius: 14px;
  background: #fff8f2;
  box-shadow: 0 0 0 1px var(--dr88-line);
}

.dr88aph-claim-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 14px;
}

.dr88aph-claim-card > header h2 { margin: 0; color: var(--dr88-ink); font-size: 20px; line-height: 27px; }
.dr88aph-claim-card > header p { margin: 3px 0 0; color: var(--dr88-muted); font-size: 12px; line-height: 18px; }
.dr88aph-claim-card > header > span { flex: none; padding: 5px 8px; border-radius: 7px; background: #5c0509; color: #ffe780; font-size: 10px; font-weight: 800; line-height: 15px; letter-spacing: 0.06em; }

.dr88aph-claim-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
}

.dr88aph-claim-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #3f4757;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}

.dr88aph-claim-grid label > span { color: #a30a12; }

.dr88aph-claim-grid input,
.dr88aph-claim-grid textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 11px;
  border: 1px solid #d9cbc3;
  border-radius: 10px;
  outline: 0;
  background: #fffdf9;
  color: var(--dr88-ink);
  font: inherit;
  font-size: 14px;
  line-height: 20px;
  caret-color: var(--dr88-red);
}

.dr88aph-claim-grid textarea { min-height: 44px; resize: vertical; }
.dr88aph-claim-grid input:hover,
.dr88aph-claim-grid textarea:hover { border-color: #b99989; }
.dr88aph-claim-grid input:focus-visible,
.dr88aph-claim-grid textarea:focus-visible { border-color: #a30a12; box-shadow: 0 0 0 3px rgba(163, 10, 18, 0.14); }
.dr88aph-claim-grid input[aria-invalid="true"],
.dr88aph-claim-grid textarea[aria-invalid="true"] { border-color: #b70d16; background: #fff4f3; }
.dr88aph-claim-grid .is-wide { grid-column: span 2; }

.dr88aph-claim-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 13px;
}

.dr88aph-claim-actions p { margin: 0; color: #667085; font-size: 12px; line-height: 18px; }
.dr88aph-claim-actions .dr88aph-primary { flex: none; }

@media (min-width: 1081px) {
  .dr88aph[data-view="home"] .dr88aph-home__schedule { gap: 9px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab { border-radius: 9px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab img { width: 22px; height: 15px; }

  .dr88aph-page-head.is-prediction { align-items: center; gap: 16px; }
  .dr88aph-prediction-intro { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
  .dr88aph-workspace .dr88aph-page-head.is-prediction h1 { flex: none; font-size: 21px; line-height: 28px; text-wrap: nowrap; }
  .dr88aph-workspace .dr88aph-page-head.is-prediction p { margin: 0; font-size: 12px; line-height: 18px; white-space: nowrap; }
  .dr88aph-page-head.is-prediction .dr88aph-text-link { flex: none; }
}

@media (min-width: 1101px) and (max-height: 960px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > span { grid-template-columns: 18px 28px minmax(0, 1fr); min-height: 34px; padding: 2px 6px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual { width: 28px; height: 28px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual svg,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual img { width: 25px; height: 25px; }
}

@media (max-width: 1100px) {
  .dr88aph-page-head.is-prediction { gap: 8px; }
  .dr88aph-claim-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dr88aph-claim-actions { align-items: stretch; flex-direction: column; }
  .dr88aph-claim-actions .dr88aph-primary { width: 100%; }
}

@media (max-width: 680px) {
  .dr88aph-home__actions > a { padding-inline: 9px; font-size: 12px; }
  .dr88aph-wheel-prize-catalog > header,
  .dr88aph-claim-card > header { align-items: flex-start; }
  .dr88aph-wheel-prize-catalog > header > span,
  .dr88aph-claim-card > header > span { display: none; }
  .dr88aph-claim-grid { grid-template-columns: 1fr; }
  .dr88aph-claim-grid .is-wide { grid-column: auto; }
  .dr88aph-claim-card { scroll-margin-bottom: calc(92px + env(safe-area-inset-bottom)); }
}

@media (max-width: 390px) {
  .dr88aph-home__actions .dr88aph-secondary .dr88aph-inline-icon { display: none; }
  .dr88aph-home__actions > a { gap: 5px; padding-inline: 8px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-rail { gap: 5px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab { min-height: 58px; padding-inline: 2px; }
  .dr88aph-slot-cta { gap: 8px; min-height: 58px; padding-inline: 12px; font-size: 13px; }
  .dr88aph-slot-lever { width: 22px; height: 22px; }
  .dr88aph-wheel-prize-catalog > div > span { gap: 4px; padding-inline: 5px; }
  .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual { width: 32px; height: 32px; }
  .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual svg,
  .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual img { width: 28px; height: 28px; }
}

@media (min-width: 1101px) and (min-height: 700px) {
  .dr88aph[data-view="home"] .dr88aph-header { padding-top: 0; }
  .dr88aph[data-view="home"] .dr88aph-main { padding-block: 6px; }

  .dr88aph[data-view="home"] .dr88aph-home {
    grid-template-rows: minmax(0, 1fr) auto;
    height: min(720px, calc(var(--dr88aph-viewport) - 84px));
    min-height: 0;
  }

  .dr88aph[data-view="home"] .dr88aph-home__poster {
    grid-row: 1;
    height: auto;
    min-height: 0;
  }

  .dr88aph[data-view="home"] .dr88aph-home__poster img {
    height: 100%;
    min-height: 0;
  }

  .dr88aph[data-view="home"] .dr88aph-home__content {
    grid-column: 2;
    grid-row: 1;
  }

  .dr88aph[data-view="home"] .dr88aph-home__schedule {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: 172px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 8px 16px 6px;
    border-top: 1px solid var(--dr88-line);
  }

  .dr88aph[data-view="home"] .dr88aph-home__schedule > header {
    display: grid;
    align-items: flex-start;
    gap: 0;
    margin: 0;
  }

  .dr88aph[data-view="home"] .dr88aph-fixture-rail { padding-bottom: 2px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab { min-height: 64px; }
}

/* V5 compact campaign surfaces: all fixtures stay available without a long desktop page. */
.dr88aph {
  --dr88aph-host-top-offset: 0px;
  --dr88aph-viewport: calc(100vh - var(--dr88aph-host-top-offset));
  --dr88aph-viewport: calc(100dvh - var(--dr88aph-host-top-offset));
  overflow-x: clip;
  overflow-y: visible;
}

.dr88aph-header,
.dr88aph-main,
.dr88aph-footer { min-width: 0; }

.dr88aph-home__actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dr88aph-home__actions .dr88aph-primary,
.dr88aph-home__actions .dr88aph-secondary {
  width: 100%;
  min-width: 0;
  padding-inline: 13px;
}

.dr88aph-workspace {
  min-height: 0;
  padding: 20px;
}

.dr88aph-workspace .dr88aph-page-head {
  align-items: center;
  padding-bottom: 13px;
}

.dr88aph-workspace .dr88aph-page-head h1 {
  font-size: clamp(26px, 3vw, 32px);
  line-height: 1.18;
}

.dr88aph-workspace .dr88aph-page-head p {
  margin-top: 4px;
  font-size: 13px;
  line-height: 19px;
}

.dr88aph-match-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 12px 0;
}

.dr88aph-match-toolbar .dr88aph-filters {
  margin: 0;
}

.dr88aph-match-rail-controls {
  display: flex;
  align-items: center;
  flex: none;
  gap: 8px;
}

.dr88aph-match-rail-controls button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #d9c7bd;
  border-radius: 11px;
  background: #fff9f4;
  box-shadow: 0 6px 15px rgba(66, 12, 10, 0.1);
  color: #8e0910;
  cursor: pointer;
}

.dr88aph-match-rail-controls button:first-child svg { transform: rotate(180deg); }
.dr88aph-match-rail-controls button:hover { border-color: #b30c14; background: #fff0ed; }
.dr88aph-match-rail-controls button:disabled { opacity: 0.36; box-shadow: none; cursor: not-allowed; }
.dr88aph-match-rail-controls output { min-width: 74px; color: #5b6474; font-size: 12px; font-weight: 800; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums; }

.dr88aph-match-rail {
  min-width: 0;
  padding: 3px 2px 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-padding-inline: 2px;
  scroll-snap-type: inline mandatory;
  scrollbar-width: none;
}

.dr88aph-match-rail::-webkit-scrollbar { display: none; }

.dr88aph-match-grid {
  display: flex;
  align-items: stretch;
  gap: 12px;
  width: 100%;
  min-width: 100%;
}

.dr88aph-match.is-compact {
  flex: 0 0 calc((100% - 36px) / 4);
  width: calc((100% - 36px) / 4);
  padding: 9px;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(48, 12, 10, 0.1);
}

.dr88aph-match.is-compact.is-target {
  border-color: #d49b15;
  box-shadow: 0 14px 30px rgba(48, 12, 10, 0.12), 0 0 0 2px rgba(255, 227, 76, 0.42);
}

.dr88aph-match.is-compact .dr88aph-match__meta { gap: 6px; padding-bottom: 5px; }
.dr88aph-match.is-compact .dr88aph-match__meta > span:first-child { overflow: hidden; font-size: 11px; line-height: 16px; text-overflow: ellipsis; white-space: nowrap; }
.dr88aph-match.is-compact .dr88aph-status { min-height: 24px; gap: 5px; padding: 3px 7px; font-size: 10px; line-height: 16px; }
.dr88aph-match.is-compact .dr88aph-status i { width: 6px; height: 6px; box-shadow: none; }

.dr88aph-match.is-compact .dr88aph-match__time { gap: 6px; padding-top: 5px; }
.dr88aph-match.is-compact .dr88aph-match__time > span:first-child { min-width: 0; gap: 0; }
.dr88aph-match.is-compact .dr88aph-match__time time { color: #283144; font-size: 12px; line-height: 17px; }
.dr88aph-match.is-compact .dr88aph-match__time small { max-width: 155px; overflow: hidden; font-size: 10px; line-height: 15px; text-overflow: ellipsis; white-space: nowrap; }
.dr88aph-match.is-compact .dr88aph-countdown { flex: 0 0 auto; max-width: none; padding: 5px 9px; overflow: visible; font-size: 10px; line-height: 15px; text-overflow: clip; white-space: nowrap; }

.dr88aph-match.is-compact .dr88aph-score-builder {
  grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
  gap: 4px;
  margin: 6px 0 8px;
}

.dr88aph-match.is-compact .dr88aph-score-side { gap: 4px; }
.dr88aph-match.is-compact .dr88aph-score-builder__vs b { font-size: 23px; line-height: 26px; }
.dr88aph-match.is-compact .dr88aph-score-builder__vs small { display: none; }
.dr88aph-match.is-compact .dr88aph-team { gap: 3px; }
.dr88aph-match.is-compact .dr88aph-team__flag { width: 44px; height: 32px; padding: 3px; border-radius: 8px; }
.dr88aph-match.is-compact .dr88aph-team__flag img { width: 36px; height: 24px; }
.dr88aph-match.is-compact .dr88aph-team strong { display: -webkit-box; min-height: 28px; max-width: 108px; overflow: hidden; font-size: 10.5px; line-height: 14px; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

.dr88aph-match.is-compact .dr88aph-score-input input {
  width: 48px;
  height: 42px;
  border-radius: 9px;
  font-size: 27px;
  line-height: 32px;
}

.dr88aph-match.is-compact .dr88aph-corners { gap: 5px; padding-top: 6px; }
.dr88aph-match.is-compact .dr88aph-corners legend { grid-template-columns: 1fr auto; gap: 8px; margin-bottom: 4px; }
.dr88aph-match.is-compact .dr88aph-corners legend b { font-size: 12px; line-height: 17px; }
.dr88aph-match.is-compact .dr88aph-corners legend small { justify-self: end; padding: 0; font-size: 10px; line-height: 15px; }
.dr88aph-match.is-compact .dr88aph-corners label > span { min-height: 44px; gap: 0; padding: 5px 25px 5px 7px; border-radius: 9px; }
.dr88aph-match.is-compact .dr88aph-corners label b { font-size: 11px; line-height: 16px; }
.dr88aph-match.is-compact .dr88aph-corners label em { font-size: 10px; line-height: 15px; }
.dr88aph-match.is-compact .dr88aph-corners label > span::after { right: 6px; width: 17px; height: 17px; }
.dr88aph-match.is-compact > .dr88aph-primary { min-height: 40px; margin-top: 6px; padding: 7px 9px; border-radius: 10px; font-size: 11.5px; line-height: 17px; }
.dr88aph-match.is-compact > .dr88aph-primary .dr88aph-inline-icon { width: 17px; height: 17px; }
.dr88aph-match.is-compact .dr88aph-button-flag { width: 24px; height: 17px; }
.dr88aph-match.is-compact .dr88aph-field-error,
.dr88aph-match.is-compact .dr88aph-card-status { margin-top: 5px; font-size: 10px; line-height: 15px; }

.dr88aph-live-cta {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  gap: 7px;
  padding: 7px 13px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.38);
  border-radius: 13px;
  background: linear-gradient(120deg, #172554 0%, #2458d7 52%, #f0445a 100%);
  box-shadow: 0 8px 18px rgba(36, 88, 215, 0.2);
  color: #fff !important;
  font-size: 11px;
  font-weight: 850;
  line-height: 15px;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  margin-left: auto;
}

.dr88aph-live-cta > i {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: #ff4654;
  box-shadow: 0 0 0 4px rgba(255, 70, 84, 0.22);
}

.dr88aph-live-cta img {
  width: 92px;
  height: auto;
  flex: 0 0 auto;
  filter: drop-shadow(0 3px 5px rgba(10, 15, 46, 0.26));
}
.dr88aph-live-cta:hover { filter: brightness(1.08) saturate(1.08); transform: translateY(-1px); }

.dr88aph[data-view="matches"] .dr88aph-filters a.is-active,
.dr88aph[data-view="matches"] .dr88aph-match.is-compact > .dr88aph-primary {
  border-color: #f2c337;
  background: linear-gradient(145deg, #f0444b 0%, #d71920 52%, #a80710 100%);
  box-shadow: 0 8px 18px rgba(190, 12, 22, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.dr88aph[data-view="matches"] .dr88aph-match.is-compact > .dr88aph-primary:hover {
  background: linear-gradient(145deg, #ff5960 0%, #e51d27 52%, #b60a13 100%);
}

.dr88aph[data-view="matches"] .dr88aph-match__meta > span:first-child { color: #c6111b; }

@media (max-width: 1100px) {
  .dr88aph-live-cta { display: none; }
}

.dr88aph-workspace-note {
  margin: 2px 0 0;
  color: #697283;
  font-size: 10px;
  line-height: 15px;
  text-align: center;
}

.dr88aph-wheel-layout.is-console-only { display: block; }
.dr88aph-wheel-layout.is-console-only .dr88aph-wheel-console { width: 100%; }
.dr88aph-wheel-page { min-height: 0; padding: 20px; }
.dr88aph-wheel-page .dr88aph-page-head { padding-bottom: 13px; }
.dr88aph-wheel-page .dr88aph-page-head h1 { font-size: clamp(26px, 3vw, 32px); }
.dr88aph-wheel-page .dr88aph-page-head p { margin-top: 4px; font-size: 13px; line-height: 19px; }
.dr88aph-wheel-subnav,
.dr88aph-rules-subnav { margin-block: 12px; }
.dr88aph-wheel-console { padding: 15px; }
.dr88aph-wheel-console > header { margin-bottom: 10px; }
.dr88aph-wheel-stage { height: 195px; padding-block: 10px; }
.dr88aph-wheel-card { flex-basis: 178px; height: 174px; }
.dr88aph-wheel-card.is-home { --dr88aph-prize-accent: #f39d55; }

.dr88aph-wheel-card__visual {
  position: absolute;
  z-index: 2;
  top: 8px;
  right: 10px;
  left: 10px;
  display: grid;
  place-items: center;
  height: 94px;
  color: var(--dr88aph-prize-accent);
}

.dr88aph-wheel-card__visual svg,
.dr88aph-wheel-card__visual img {
  width: 68px;
  height: 68px;
  object-fit: contain;
}

.dr88aph-wheel-card__visual svg {
  stroke-width: 1.7;
  filter: drop-shadow(0 9px 12px rgba(0, 0, 0, 0.58));
}

.dr88aph-wheel-card__visual img {
  filter: drop-shadow(0 9px 12px rgba(0, 0, 0, 0.5));
}

.dr88aph-wheel-card__visual small {
  position: absolute;
  right: 2px;
  bottom: 0;
  max-width: 92px;
  padding: 2px 5px;
  overflow: hidden;
  border: 1px solid rgba(255, 226, 123, 0.45);
  border-radius: 5px;
  background: rgba(9, 1, 3, 0.74);
  color: #fff7dc;
  font-size: 10px;
  font-weight: 800;
  line-height: 12px;
  letter-spacing: 0.05em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-wheel-card__info { min-height: 59px; padding: 9px 10px; }
.dr88aph-wheel-actions { margin-top: 12px; }
.dr88aph-wheel-result { margin-top: 10px; padding-block: 9px; }
.dr88aph-wheel-disclaimer { margin-top: 9px; padding-top: 8px; }

.dr88aph-wheel-rules { gap: 12px; }
.dr88aph-wheel-rule-tabs { width: 100%; margin: 0; }
.dr88aph-wheel-rule-tabs a { flex: 1; min-width: 0; }
.dr88aph-wheel-rule-tab__copy { display: grid; min-width: 0; }
.dr88aph-wheel-rule-tab__copy small,
.dr88aph-wheel-rule-tab__number,
.dr88aph-wheel-rule-tab__arrow { display: none; }
.dr88aph-wheel-rules .dr88aph-rule-summary { margin: 0; }

@media (min-width: 1101px) {
  .dr88aph-wheel-rule-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 0;
    overflow: visible;
    border-radius: 0;
    background: transparent;
  }

  .dr88aph-wheel-rule-tabs a {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 20px;
    place-items: initial;
    align-items: center;
    gap: 10px;
    min-height: 82px;
    padding: 12px;
    border: 1px solid #ecd6c4;
    border-radius: 13px;
    background: linear-gradient(145deg, #fffdf9, #fff4e9);
    box-shadow: 0 7px 18px rgba(85, 23, 13, 0.08);
    color: #78070c;
    text-align: left;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
  }

  .dr88aph-wheel-rule-tabs a:hover,
  .dr88aph-wheel-rule-tabs a:focus-visible {
    transform: translateY(-2px);
    border-color: #e3ad2e;
    box-shadow: 0 11px 24px rgba(85, 23, 13, 0.14);
  }

  .dr88aph-wheel-rule-tabs a.is-active {
    border-color: #f3c338;
    background: linear-gradient(135deg, #c81720 0%, #9f0710 55%, #740409 100%);
    box-shadow: 0 11px 24px rgba(133, 4, 11, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.22);
    color: #fff;
  }

  .dr88aph-wheel-rule-tab__number {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid #e8bd49;
    border-radius: 50%;
    background: #fff0ad;
    color: #8e080e;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
  }

  .dr88aph-wheel-rule-tab__copy strong {
    font-size: 14px;
    font-weight: 900;
    line-height: 19px;
  }

  .dr88aph-wheel-rule-tab__copy small {
    display: block;
    margin-top: 2px;
    overflow: hidden;
    color: #7b6670;
    font-size: 10px;
    font-weight: 650;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dr88aph-wheel-rule-tab__arrow {
    display: block;
    color: #bd8b13;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    text-align: right;
  }

  .dr88aph-wheel-rule-tabs a.is-active .dr88aph-wheel-rule-tab__number {
    border-color: rgba(255, 232, 122, 0.58);
    background: #ffe04b;
    color: #72050a;
  }

  .dr88aph-wheel-rule-tabs a.is-active .dr88aph-wheel-rule-tab__copy small { color: #ffe9cb; }
  .dr88aph-wheel-rule-tabs a.is-active .dr88aph-wheel-rule-tab__arrow { color: #ffe04b; }
}

/* Results ledger — warm ivory, wine red and restrained champagne accents. */
.dr88aph[data-view="results"] .dr88aph-results-page {
  overflow: hidden;
  padding: clamp(22px, 3vw, 38px);
  border: 1px solid rgba(133, 83, 43, 0.18);
  background: radial-gradient(circle at 96% 0%, rgba(226, 186, 99, 0.16), transparent 30%), linear-gradient(180deg, #fffefb 0%, #fffaf2 100%);
  box-shadow: 0 24px 60px rgba(49, 7, 10, 0.2), inset 0 1px 0 #fff;
}

.dr88aph[data-view="results"] .dr88aph-results-page .dr88aph-page-head {
  align-items: end;
  padding-bottom: 18px;
  border-bottom: 1px solid #ead9bf;
}

.dr88aph[data-view="results"] .dr88aph-results-page .dr88aph-page-head h1 {
  color: #241e29;
  letter-spacing: -0.035em;
}

.dr88aph[data-view="results"] .dr88aph-results-page .dr88aph-page-head > div > p {
  display: block;
  max-width: 620px;
  margin: 6px 0 0;
  color: #756b70;
  font-size: 13px;
  line-height: 19px;
}

.dr88aph[data-view="results"] .dr88aph-results-page .dr88aph-review-launcher {
  min-height: 40px;
  padding-inline: 15px;
  border-color: #c99c3e;
  color: #6b0b11;
  background: linear-gradient(180deg, #fffaf0, #faedcf);
  box-shadow: 0 6px 16px rgba(83, 37, 9, 0.1), inset 0 1px 0 #fff;
}

.dr88aph[data-view="results"] .dr88aph-review-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 14px 0 0;
  padding: 9px 12px;
  border: 1px solid #ddc58e;
  border-radius: 10px;
  color: #675745;
  background: linear-gradient(100deg, #fff8e6, #fffdf8 70%);
  box-shadow: inset 0 1px 0 #fff, 0 5px 14px rgba(84, 53, 18, 0.06);
}

.dr88aph[data-view="results"] .dr88aph-review-notice strong {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 6px;
  color: #f8dc8d;
  background: linear-gradient(145deg, #851018, #57050a);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.07em;
}

.dr88aph[data-view="results"] .dr88aph-review-notice span {
  color: #776756;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.dr88aph[data-view="results"] .dr88aph-results-subnav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  width: 100%;
  margin: 20px 0 48px;
  padding: 5px;
  border: 1px solid #decba8;
  border-radius: 14px;
  background: linear-gradient(135deg, #f9f3eb, #eee3d6);
  box-shadow: inset 0 1px 3px rgba(69, 42, 23, 0.08), 0 7px 16px rgba(84, 44, 18, 0.05);
}

.dr88aph[data-view="results"] .dr88aph-results-subnav a {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  color: #675b5b;
  background: transparent;
  box-shadow: none;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.025em;
  text-align: center;
  transition: color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.dr88aph[data-view="results"] .dr88aph-results-subnav a:not(.is-active):hover {
  color: #7e0c14;
  background: rgba(255, 255, 255, 0.62);
}

.dr88aph[data-view="results"] .dr88aph-results-subnav a.is-active,
.dr88aph[data-view="results"] .dr88aph-results-subnav a[aria-selected="true"] {
  color: #ffe39a;
  background: linear-gradient(145deg, #970f18 0%, #68070c 70%, #4a0306 100%);
  box-shadow: 0 7px 16px rgba(100, 5, 10, 0.22), inset 0 1px 0 rgba(255, 234, 174, 0.28);
}

.dr88aph[data-view="results"] .dr88aph-results-groups {
  display: grid;
  gap: 24px;
}

.dr88aph[data-view="results"] .dr88aph-results-group {
  display: grid;
  gap: 12px;
}

.dr88aph[data-view="results"] .dr88aph-results-group > header {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 3px;
  min-height: 52px;
  padding: 10px 14px;
  border: 1px solid #ead8bd;
  border-radius: 11px;
  background: linear-gradient(110deg, #fffaf2, #f8eee0);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
  text-align: center;
}

.dr88aph[data-view="results"] .dr88aph-results-group > header strong {
  color: #850d16;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.06em;
}

.dr88aph[data-view="results"] .dr88aph-results-group > header span {
  color: #806f67;
  font-size: 11px;
  font-weight: 700;
}

.dr88aph[data-view="results"] .dr88aph-results-group.is-division-two > header strong {
  color: #8c671a;
}

.dr88aph[data-view="results"] .dr88aph-results-group.is-division-two > header {
  border-color: #e7d5a7;
  background: linear-gradient(110deg, #fffaf0, #fbf2dd);
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-subnav a:focus-visible {
  outline: 3px solid rgba(211, 165, 66, 0.42);
  outline-offset: 2px;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-list,
.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page.is-review-preview .dr88aph-results-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 14px;
  width: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: visible;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row,
.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page.is-review-preview .dr88aph-result-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(112px, 1fr) auto auto;
  gap: 0;
  min-height: 252px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e2cdaa;
  border-radius: 14px;
  background: radial-gradient(circle at 50% 34%, rgba(226, 186, 99, 0.17), transparent 34%), linear-gradient(155deg, #fffefa, #fff7e9);
  box-shadow: 0 13px 30px rgba(74, 42, 17, 0.12), inset 0 1px 0 #fff;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row:hover {
  border-color: #cda44f;
  box-shadow: 0 14px 30px rgba(73, 35, 12, 0.14), inset 0 1px 0 #fff;
  transform: translateY(-2px);
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 13px 9px;
  border-bottom: 1px solid rgba(170, 119, 51, 0.18);
  background: rgba(244, 229, 205, 0.38);
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__meta span {
  color: #8d0d15;
  font-size: 11px;
  font-weight: 900;
  line-height: 16px;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__meta time {
  color: #7b6c60;
  font-size: 10.5px;
  font-weight: 650;
  line-height: 16px;
  white-space: nowrap;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__score {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 20px 18px 17px;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__score > strong {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 112px;
  min-height: 58px;
  gap: 10px;
  padding: 8px 15px;
  border: 1px solid #d7b65b;
  border-radius: 13px;
  color: #ffe6a0;
  background: linear-gradient(145deg, #821019 0%, #4c0509 68%, #2d0205 100%);
  box-shadow: 0 12px 24px rgba(73, 4, 8, 0.25), inset 0 1px 0 rgba(255, 239, 184, 0.35), inset 0 -10px 18px rgba(25, 0, 2, 0.18);
  font-size: 31px;
  font-weight: 900;
  line-height: 34px;
  font-variant-numeric: tabular-nums;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__score > strong i {
  color: #d8ba72;
  font-size: 17px;
  font-style: normal;
  font-weight: 600;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row .dr88aph-team {
  gap: 7px;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row .dr88aph-team__flag {
  width: 58px;
  height: 44px;
  padding: 5px;
  border-color: #d8b45f;
  border-radius: 9px;
  background: #fffdfa;
  box-shadow: 0 8px 17px rgba(65, 38, 15, 0.18), inset 0 1px 0 #fff;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row .dr88aph-team__flag img {
  width: 46px;
  height: 31px;
  border-radius: 3px;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row .dr88aph-team strong {
  color: #302a2d;
  font-size: 12px;
  font-weight: 850;
  line-height: 16px;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row > p,
.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page.is-review-preview .dr88aph-result-row > p {
  grid-column: auto;
  margin: 0;
  padding: 9px 13px 10px;
  border-top: 1px solid rgba(170, 119, 51, 0.16);
  color: #75685e;
  background: rgba(251, 244, 233, 0.76);
  font-size: 10.5px;
  font-weight: 650;
  line-height: 15px;
  text-align: center;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row > p strong {
  color: #8c1017;
  font-weight: 900;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__verdict {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  color: #f8dda0;
  background: linear-gradient(90deg, #350206, #710a10 48%, #350206);
  box-shadow: inset 0 1px 0 rgba(255, 225, 142, 0.2);
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__verdict span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__verdict i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #57d98c;
  box-shadow: 0 0 0 3px rgba(87, 217, 140, 0.13);
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts {
  display: grid;
  grid-template-columns: 1.35fr 0.8fr 1fr;
  gap: 6px;
  margin: 0;
  padding: 8px;
  background: #fffaf1;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts > div {
  display: grid;
  align-content: center;
  min-width: 0;
  min-height: 54px;
  padding: 7px 8px;
  border: 1px solid #ead7b6;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.68);
  text-align: center;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts dt {
  color: #88776c;
  font-size: 10px;
  font-weight: 850;
  line-height: 12px;
  text-transform: uppercase;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts dd {
  margin: 3px 0 0;
  overflow: hidden;
  color: #3b2c2c;
  font-size: 11px;
  font-weight: 900;
  line-height: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts > div:first-child dd {
  color: #8d0c14;
}

@media (max-width: 1100px) {
  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page {
    padding: 18px;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-list,
  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page.is-review-preview .dr88aph-results-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 520px) {
  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page {
    padding: 15px;
    border-radius: 16px;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page .dr88aph-page-head {
    align-items: stretch;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-page .dr88aph-review-launcher {
    width: 100%;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-review-notice {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-results-subnav {
    width: 100%;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__score {
    gap: 8px;
    padding-inline: 10px;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__score > strong {
    min-width: 92px;
    min-height: 52px;
    padding-inline: 11px;
    font-size: 27px;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts {
    grid-template-columns: 1fr 0.72fr;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row__facts > div:last-child {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row {
    transition: none;
  }

  .dr88aph:where([data-view="results"], [data-view="mine"]) .dr88aph-result-row:hover {
    transform: none;
  }
}

.dr88aph-wheel-prize-catalog { padding: 17px; border-radius: 14px; background: #fff8f2; box-shadow: 0 0 0 1px var(--dr88-line); }
.dr88aph-wheel-prize-catalog > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 12px; }
.dr88aph-wheel-prize-catalog > header h2 { margin: 0; color: var(--dr88-ink); font-size: 20px; line-height: 27px; }
.dr88aph-wheel-prize-catalog > header p { margin: 3px 0 0; color: var(--dr88-muted); font-size: 12px; line-height: 18px; }
.dr88aph-wheel-prize-catalog > header > span { flex: none; padding: 5px 8px; border-radius: 7px; background: #5c0509; color: #ffe780; font-size: 10px; font-weight: 800; line-height: 15px; letter-spacing: 0.06em; }
.dr88aph-wheel-prize-catalog > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.dr88aph-wheel-prize-catalog > div > span { display: grid; align-items: center; gap: 7px; min-height: 52px; padding: 5px 8px; border: 1px solid #eadbd3; border-radius: 10px; background: #fffdf9; }
.dr88aph-wheel-prize-catalog > div > span > b { color: #a30a12; font-size: 10px; line-height: 15px; font-variant-numeric: tabular-nums; }
.dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual { position: relative; inset: auto; width: 42px; height: 42px; color: #a30a12; }
.dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual svg { width: 34px; height: 34px; filter: none; }
.dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual img { width: 34px; height: 34px; filter: none; }
.dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual small { display: none; }
.dr88aph-wheel-prize-catalog strong { color: #30394a; font-size: 10px; line-height: 15px; }

.dr88aph-rules-page { min-height: 0; padding: 20px; }
.dr88aph-rules-page .dr88aph-page-head { align-items: center; padding-bottom: 13px; }
.dr88aph-rules-page .dr88aph-page-head h1 { font-size: clamp(26px, 3vw, 32px); }
.dr88aph-rules-page .dr88aph-page-head p { margin-top: 4px; font-size: 13px; line-height: 19px; }
.dr88aph-beta-banner.is-rules { margin-top: 12px; }
.dr88aph-rules-page .dr88aph-rule-summary { margin: 12px 0; }
.dr88aph-rules-page .dr88aph-live-rules { padding: 17px; }
.dr88aph-rules-page .dr88aph-policy-grid { margin-top: 12px; }
.dr88aph-policy-grid ol { display: grid; gap: 6px; margin: 12px 0 0; padding-left: 21px; color: #4f596b; font-size: 12px; line-height: 18px; }
.dr88aph-proposal-note { margin: 12px 0 0; padding: 9px 11px; border-radius: 9px; background: #fff0d9; color: #694b14; font-size: 11px; line-height: 17px; }
.dr88aph-code-strip { display: flex; align-items: center; gap: 6px; margin-top: 10px; padding: 9px; overflow-x: auto; border-radius: 11px; background: #fff8f2; box-shadow: 0 0 0 1px var(--dr88-line); scrollbar-width: thin; }
.dr88aph-code-strip strong { flex: none; margin-right: 4px; color: #8e0910; font-size: 11px; }
.dr88aph-code-strip span { flex: none; padding: 5px 7px; border-radius: 6px; background: #65070c; color: #ffe985; font-size: 10px; font-weight: 800; font-variant-numeric: tabular-nums; }

@media (min-width: 1101px) and (min-height: 700px) {
  .dr88aph[data-view="home"],
  .dr88aph[data-view="matches"],
  .dr88aph[data-view="wheel"],
  .dr88aph[data-view="rules"] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: var(--dr88aph-viewport);
  }

  .dr88aph[data-view="home"] .dr88aph-main,
  .dr88aph[data-view="matches"] .dr88aph-main,
  .dr88aph[data-view="wheel"] .dr88aph-main,
  .dr88aph[data-view="rules"] .dr88aph-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    min-height: 0;
    padding: 12px 0;
  }

  .dr88aph[data-view="home"] .dr88aph-header,
  .dr88aph[data-view="matches"] .dr88aph-header,
  .dr88aph[data-view="wheel"] .dr88aph-header,
  .dr88aph[data-view="rules"] .dr88aph-header { padding-top: 0; }

  .dr88aph[data-view="home"] .dr88aph-main,
  .dr88aph[data-view="matches"] .dr88aph-main,
  .dr88aph[data-view="wheel"] .dr88aph-main,
  .dr88aph[data-view="rules"] .dr88aph-main { padding-block: 6px; }

  .dr88aph[data-view="matches"] .dr88aph-workspace,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-page,
  .dr88aph[data-view="rules"] .dr88aph-rules-page { padding-block: 14px; }

  .dr88aph[data-view="matches"] .dr88aph-page-head,
  .dr88aph[data-view="wheel"] .dr88aph-page-head,
  .dr88aph[data-view="rules"] .dr88aph-page-head { padding-bottom: 7px; }
}

@media (min-width: 1101px) and (max-height: 820px) {
  .dr88aph-home { min-height: min(610px, calc(var(--dr88aph-viewport) - 172px)); }
  .dr88aph-home__poster,
  .dr88aph-home__poster img { min-height: min(610px, calc(var(--dr88aph-viewport) - 172px)); }
  .dr88aph-home__content { padding: 22px 32px 12px; }
  .dr88aph-home h1 { margin-top: 14px; font-size: 38px; }
  .dr88aph-home__content > p { margin-top: 8px; font-size: 13px; line-height: 19px; }
  .dr88aph-next-match { grid-template-columns: 118px minmax(0, 1fr); gap: 10px; margin-top: 12px; padding: 9px 11px; }
  .dr88aph-home__actions { gap: 7px; margin-top: 12px; }
  .dr88aph-home__actions .dr88aph-primary,
  .dr88aph-home__actions .dr88aph-secondary { min-height: 44px; font-size: 12px; }
  .dr88aph-trust { margin-top: 12px; padding-top: 8px; }
  .dr88aph-home__schedule { padding: 0 32px 13px; }
  .dr88aph-fixture-tab { min-height: 68px; padding-block: 6px; }
}

@media (max-width: 1080px) and (min-width: 681px) {
  .dr88aph-match.is-compact { flex-basis: calc((100% - 12px) / 2); width: calc((100% - 12px) / 2); }
  .dr88aph-wheel-prize-catalog > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page { padding: 17px; }
  .dr88aph-match-toolbar { align-items: flex-end; }
  .dr88aph-match-toolbar .dr88aph-filters { padding-bottom: 0; }
  .dr88aph-wheel-rule-tabs { overflow-x: auto; }
  .dr88aph-wheel-rule-tabs a { min-width: 128px; }
}

@media (max-width: 680px) {
  .dr88aph-home__actions { grid-template-columns: 1fr 1fr; }
  .dr88aph-workspace .dr88aph-page-head { align-items: flex-start; }
  .dr88aph-workspace .dr88aph-page-head .dr88aph-text-link { display: none; }
  .dr88aph-match-toolbar { align-items: stretch; flex-direction: column; gap: 8px; }
  .dr88aph-match-toolbar .dr88aph-filters { width: 100%; }
  .dr88aph-match-toolbar .dr88aph-filters a { flex: 1; min-width: 78px; padding-inline: 9px; }
  .dr88aph-match-rail-controls { justify-content: space-between; width: 100%; }
  .dr88aph-match-rail-controls output { flex: 1; }
  .dr88aph-match.is-compact { flex-basis: 100%; width: 100%; }
  .dr88aph-match.is-compact .dr88aph-match__time { align-items: center; flex-direction: row; }
  .dr88aph-match.is-compact .dr88aph-countdown { align-self: auto; margin-top: 0; }
  .dr88aph-wheel-stage { height: 190px; }
  .dr88aph-wheel-card { flex-basis: 164px; height: 154px; }
  .dr88aph-wheel-card__visual { height: 78px; }
  .dr88aph-wheel-card__visual svg,
  .dr88aph-wheel-card__visual img { width: 56px; height: 56px; }
  .dr88aph-wheel-prize-catalog > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dr88aph-rules-page .dr88aph-page-head__cta { display: none; }
}

@media (max-width: 390px) {
  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page { padding: 13px; }
  .dr88aph-workspace .dr88aph-page-head h1,
  .dr88aph-wheel-page .dr88aph-page-head h1,
  .dr88aph-rules-page .dr88aph-page-head h1 { font-size: 25px; line-height: 31px; }
  .dr88aph-match-toolbar .dr88aph-filters { gap: 4px; }
  .dr88aph-match-toolbar .dr88aph-filters a { min-width: 70px; padding-inline: 6px; font-size: 11px; }
  .dr88aph-match.is-compact { padding: 10px; }
  .dr88aph-match.is-compact .dr88aph-score-input input { width: 52px; }
}

@media (max-width: 430px) {
  .dr88aph-match.is-compact .dr88aph-score-builder {
    grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
    gap: 4px;
  }

  .dr88aph-match.is-compact .dr88aph-score-builder__vs { display: grid; }
  .dr88aph-match.is-compact .dr88aph-score-side {
    grid-template-columns: 1fr;
    justify-items: center;
  }
}

@media (max-width: 350px) {
  .dr88aph-match.is-compact .dr88aph-score-builder {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .dr88aph-match.is-compact .dr88aph-score-builder__vs { display: none; }
  .dr88aph-match.is-compact .dr88aph-score-side {
    grid-template-columns: minmax(76px, 90px) minmax(0, 1fr);
    justify-items: start;
  }
}

/* V6 final cascade bridge over the retained V5 responsive contract. */
.dr88aph-home__actions .dr88aph-primary,
.dr88aph-home__actions .dr88aph-secondary { padding-inline: 6px; font-size: 13px; }
.dr88aph-home__actions .dr88aph-primary .dr88aph-button-flag { width: 24px; height: 16px; }
.dr88aph-wheel-prize-catalog > div > span { grid-template-columns: 22px 42px minmax(0, 1fr); }

@media (min-width: 1081px) {
  .dr88aph[data-view="home"] .dr88aph-home__schedule { grid-template-columns: 160px minmax(0, 1fr); }
  .dr88aph[data-view="home"] .dr88aph-fixture-rail { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 5px; padding: 2px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab { min-height: 60px; }
}

@media (min-width: 1101px) and (max-height: 960px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-page { padding: 9px 14px; }
  .dr88aph[data-view="wheel"] .dr88aph-page-head { padding-bottom: 5px; }
  .dr88aph[data-view="wheel"] .dr88aph-page-head h1 { font-size: 25px; line-height: 31px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-subnav { margin-block: 6px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-console { padding: 10px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-console > header { margin-bottom: 6px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-console > header h2 { font-size: 18px; line-height: 23px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-stage { height: 136px; padding-block: 8px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card { flex-basis: 148px; height: 118px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual { height: 62px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual svg,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual img { width: 47px; height: 47px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__info { min-height: 48px; padding: 6px 8px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions { gap: 6px; margin-top: 7px; }
  .dr88aph[data-view="wheel"] .dr88aph-slot-cta { min-height: 52px; padding-block: 8px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions p { font-size: 10px; line-height: 14px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-result { margin-top: 6px; padding-block: 6px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-disclaimer { margin-top: 6px; padding-top: 5px; font-size: 10px; line-height: 14px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog { padding: 8px 10px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header { margin-bottom: 5px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header h2 { font-size: 16px; line-height: 21px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header p { display: none; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > span { grid-template-columns: 18px 24px minmax(0, 1fr); min-height: 28px; gap: 5px; padding: 1px 6px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual { width: 24px; height: 24px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual svg,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-wheel-card__visual img { width: 22px; height: 22px; }
}

@media (min-width: 1101px) and (max-height: 740px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-page { padding-block: 7px; }
  .dr88aph[data-view="wheel"] .dr88aph-page-head p { display: none; }
  .dr88aph[data-view="wheel"] .dr88aph-page-head { align-items: center; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-subnav { margin-block: 4px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog { padding-block: 4px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > span { min-height: 26px; }
}

@media (max-width: 680px) {
  .dr88aph-home__actions { grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); }
  .dr88aph-home__actions .dr88aph-primary,
  .dr88aph-home__actions .dr88aph-secondary { padding-inline: 9px; font-size: 12px; }
  .dr88aph-match.is-compact .dr88aph-score-builder { margin: 5px 0 6px; }
  .dr88aph-match.is-compact .dr88aph-score-side { gap: 3px; }
  .dr88aph-match.is-compact .dr88aph-score-input input { height: 44px; }
  .dr88aph-match.is-compact .dr88aph-corners { padding-top: 6px; }
  .dr88aph-match.is-compact .dr88aph-submit-meta { margin: 4px 0 3px; }
}

@media (max-width: 390px) {
  .dr88aph-slot-cta {
    gap: 6px;
    min-height: 52px;
    padding: 7px 8px;
    font-size: 12px;
    white-space: nowrap;
  }
  .dr88aph-slot-cta .dr88aph-button-flag { width: 24px; height: 16px; }
  .dr88aph-slot-lever { width: 18px; height: 18px; }
  .dr88aph-match.is-compact .dr88aph-team strong {
    display: block;
    min-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dr88aph-match.is-compact .dr88aph-match__time small,
  .dr88aph-match.is-compact .dr88aph-submit-meta { display: none; }
  .dr88aph-wheel-prize-catalog > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dr88aph-wheel-prize-catalog > div > span { grid-template-columns: 18px 32px minmax(0, 1fr); }
}

@media (min-width: 1101px) and (min-height: 700px) {
  .dr88aph[data-view="results"],
  .dr88aph[data-view="mine"] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: var(--dr88aph-viewport);
  }

  .dr88aph[data-view="results"] .dr88aph-main,
  .dr88aph[data-view="mine"] .dr88aph-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    min-height: 0;
    padding-block: 6px;
  }

}

@media (min-width: 1101px) and (max-height: 820px) {
  .dr88aph[data-view="results"] .dr88aph-results-page,
  .dr88aph[data-view="mine"] .dr88aph-history-page {
    min-height: 0;
    padding-block: 14px;
  }
}

/* V7 refinement: clearer prediction controls, image-led rewards and the Top 10 race console. */
.dr88aph-nav-link.is-top { order: 4; }
.dr88aph-nav-link.is-rules { order: 5; }
.dr88aph-nav-link.is-results { order: 6; }
.dr88aph-nav-link.is-mine { order: 7; }
.dr88aph-nav-more { order: 8; }

.dr88aph-home__lead,
.dr88aph-home__reward-copy,
.dr88aph-home__schedule-title,
.dr88aph-wheel-subcopy {
  white-space: nowrap;
}

.dr88aph-home__content > .dr88aph-home__lead {
  max-width: none;
  font-size: 13px;
  line-height: 20px;
  letter-spacing: -0.018em;
}

.dr88aph-wheel-page .dr88aph-page-head .dr88aph-wheel-subcopy {
  font-size: 11px;
  line-height: 17px;
  letter-spacing: -0.012em;
}

.dr88aph-home__reward-copy {
  white-space: nowrap;
  font-size: 10px;
  letter-spacing: -0.025em;
}

.dr88aph-home__schedule-title {
  display: inline-flex !important;
  align-items: baseline;
  gap: 5px;
}

.dr88aph-prediction-intro {
  display: grid;
  align-items: start;
  gap: 2px;
  white-space: normal;
}

.dr88aph-workspace .dr88aph-page-head.is-prediction .dr88aph-prediction-subtitle {
  margin: 0;
}

.dr88aph-score-input input {
  border-color: #d5a329;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.88), transparent 34%),
    linear-gradient(165deg, #fffdf4 0%, #fff2ce 64%, #f2cf72 100%);
  box-shadow:
    inset 0 2px 0 #fff,
    inset 0 -2px 0 rgba(152, 91, 4, 0.2),
    0 4px 0 #a96607,
    0 9px 17px rgba(74, 23, 3, 0.19);
  color: #79070c;
  caret-color: #a30a12;
  text-shadow: 0 1px 0 #fff;
}

.dr88aph-score-input input:hover {
  border-color: #aa6809;
  background: linear-gradient(165deg, #fffefa 0%, #ffedb5 68%, #eebc45 100%);
}

.dr88aph-score-input input:focus-visible {
  border-color: #a30a12;
  box-shadow:
    inset 0 2px 0 #fff,
    0 4px 0 #a96607,
    0 0 0 4px rgba(183, 13, 22, 0.2),
    0 10px 20px rgba(74, 23, 3, 0.18);
}

.dr88aph-score-input input[aria-invalid="true"] {
  border-color: #b10b13;
  box-shadow: inset 0 2px 0 #fff, 0 4px 0 #75050a, 0 0 0 4px rgba(200, 24, 30, 0.18);
}

.dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item],
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 38px minmax(16px, auto);
  justify-items: center;
  align-content: center;
  gap: 2px;
  min-height: 62px;
  padding: 4px 6px 5px;
}

.dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] > b {
  position: absolute;
  top: 5px;
  left: 6px;
  z-index: 2;
}

.dr88aph-wheel-prize-catalog [data-prize-catalog-visual] {
  display: grid;
  place-items: center;
  width: 100%;
  height: 38px;
}

.dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual,
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual {
  width: 42px;
  height: 38px;
}

.dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual svg,
.dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual img,
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual svg,
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual img {
  width: 36px;
  height: 36px;
}

.dr88aph-wheel-prize-catalog [data-prize-catalog-title] {
  min-width: 0;
  color: #30394a;
  font-size: 10px;
  text-align: center;
}

.dr88aph-top-page {
  min-height: 0;
  padding: 18px;
}

.dr88aph-top-head {
  align-items: center;
  padding-bottom: 11px;
}

.dr88aph-top-head h1 {
  font-size: clamp(27px, 3.2vw, 34px);
  line-height: 1.15;
}

.dr88aph-top-head p {
  margin-top: 3px;
  font-size: 13px;
  line-height: 19px;
}

.dr88aph-top-data-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #d3a72f;
  border-radius: 8px;
  background: #5c0509;
  color: #ffe985;
  font-size: 10px;
  font-weight: 800;
  line-height: 15px;
  letter-spacing: 0.07em;
  white-space: nowrap;
}

.dr88aph-top-data-label.is-demo {
  background: #fff3ca;
  color: #724804;
}

.dr88aph-top-ranking {
  display: grid;
  grid-template-columns: 286px minmax(0, 1fr);
  gap: 14px;
  margin-top: 13px;
}

.dr88aph-top-brief {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(255, 227, 76, 0.52);
  border-radius: 14px;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 227, 76, 0.15), transparent 31%),
    linear-gradient(155deg, #64060b 0%, #380205 58%, #230103 100%);
  box-shadow: 0 14px 30px rgba(48, 2, 6, 0.21), inset 0 1px 0 rgba(255, 255, 255, 0.11);
  color: #fff8ef;
}

.dr88aph-top-brief__intro > span,
.dr88aph-top-board > header > div > span {
  color: #ffdc67;
  font-size: 10px;
  font-weight: 800;
  line-height: 15px;
  letter-spacing: 0.12em;
}

.dr88aph-top-brief h2 {
  margin: 2px 0 0;
  color: #fffdf5;
  font-size: 20px;
  line-height: 26px;
}

.dr88aph-top-brief__intro p {
  margin: 5px 0 0;
  color: #f2d9d6;
  font-size: 11px;
}

.dr88aph-top-score-rules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  box-sizing: border-box;
  width: calc(100% - (2 * var(--dr88aph-top-brief-gutter)));
  margin: 14px 0 0;
  border-block: 1px solid rgba(255, 224, 105, 0.25);
}

.dr88aph-top-score-rules > div {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 1px;
  min-height: 67px;
  padding: 9px 4px 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: center;
}

.dr88aph-top-score-rules > div + div {
  border-left: 1px solid rgba(255, 224, 105, 0.22);
}

.dr88aph-top-score-rules dt {
  color: #ffe059;
  font-size: 25px;
  font-weight: 800;
  line-height: 29px;
  text-shadow: 0 2px 10px rgba(255, 198, 24, 0.16);
}

.dr88aph-top-score-rules dd {
  margin: 0;
  color: #fff7ed;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 17px;
  text-transform: uppercase;
  white-space: nowrap;
}

@media (min-width: 1101px) {
  .dr88aph[data-view="top"] .dr88aph-top-score-rules {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.15fr) minmax(0, 1fr);
  }
}

.dr88aph-top-brief__actions {
  display: grid;
  gap: 1px;
}

.dr88aph-top-brief__actions .dr88aph-primary {
  width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  font-size: 12px;
}

.dr88aph-top-brief__actions .dr88aph-text-link {
  justify-self: center;
  min-height: 36px;
  color: #ffe680;
  font-size: 11px;
}

.dr88aph-top-board {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e4d6cd;
  border-radius: 14px;
  background: #fffdf9;
  box-shadow: 0 13px 28px rgba(56, 15, 12, 0.11);
}

.dr88aph-top-board > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 53px;
  border-bottom: 1px solid #eadfd8;
}

.dr88aph-top-board > header h2 {
  margin: 1px 0 0;
  color: #20283a;
  line-height: 22px;
}

.dr88aph-top-board .dr88aph-filters {
  flex: none;
  gap: 4px;
  margin: 0;
}

.dr88aph-top-board .dr88aph-filters a {
  min-width: 65px;
  min-height: 36px;
  padding-inline: 9px;
  font-size: 10px;
}

.dr88aph-top-row {
  display: grid;
  grid-template-columns: 42px minmax(126px, 1.45fr) repeat(3, 52px) 56px 66px;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.dr88aph-top-row.is-heading {
  min-height: 29px;
  padding: 4px 9px;
  background: #f5eee9;
  color: #786b67;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
  text-align: center;
}

.dr88aph-top-row.is-heading span:nth-child(2) {
  text-align: left;
}

.dr88aph-top-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dr88aph-top-list .dr88aph-top-row {
  min-height: 34px;
  padding: 3px 9px;
  border-bottom: 1px solid #eee5df;
  color: #465064;
  font-size: 11px;
  line-height: 15px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.dr88aph-top-list .dr88aph-top-row.is-podium {
  background: linear-gradient(90deg, #fff8dd 0%, #fffdf8 62%);
}

.dr88aph-top-list .dr88aph-top-row.is-empty {
  color: #596273;
}

.dr88aph-top-rank {
  display: grid;
  place-items: center;
}

.dr88aph-top-rank b {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: #ece5e0;
  color: #525b6a;
  font-size: 11px;
}

.dr88aph-top-row[data-top-rank="1"] .dr88aph-top-rank b,
.dr88aph-top-row[data-top-rank="2"] .dr88aph-top-rank b,
.dr88aph-top-row[data-top-rank="3"] .dr88aph-top-rank b {
  border: 1px solid #dfaa23;
  background: linear-gradient(145deg, #7c070c, #c91b23 56%, #5a0408);
  box-shadow: 0 3px 0 #9d6408;
  color: #ffe87a;
}

.dr88aph-top-member {
  display: grid;
  min-width: 0;
  text-align: left;
}

.dr88aph-top-member strong,
.dr88aph-top-member small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-top-member strong {
  color: #273044;
  font-size: 11px;
  line-height: 14px;
}

.dr88aph-top-member small {
  color: #596273;
  font-size: 10px;
  line-height: 13px;
}

.dr88aph-top-points b {
  color: #a30a12;
  font-size: 13px;
}

.dr88aph-top-prize {
  justify-self: center;
  min-width: 52px;
  padding: 3px 5px;
  border: 1px solid #d9ad31;
  border-radius: 6px;
  background: #5c0509;
  color: #ffe985;
  font-size: 10px;
  font-weight: 800;
}

.dr88aph-top-tiebreak {
  margin: 0;
  padding: 7px 11px;
  background: #fff6e4;
  color: #6a5a4b;
  font-size: 10px;
  line-height: 15px;
}

@media (min-width: 1101px) and (min-height: 700px) {
  .dr88aph[data-view="top"] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: var(--dr88aph-viewport);
  }

  .dr88aph[data-view="top"] .dr88aph-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    min-height: 0;
    padding-block: 6px;
  }

}

@media (min-width: 1101px) and (min-height: 741px) and (max-height: 960px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-stage { height: 150px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card { flex-basis: 158px; height: 132px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual { height: 74px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual svg,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual img { width: 56px; height: 56px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__info { min-height: 50px; }
}

@media (min-width: 1101px) and (max-height: 740px) {
  .dr88aph[data-view="wheel"] .dr88aph-page-head .dr88aph-wheel-subcopy {
    display: block;
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual svg,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual img { width: 51px; height: 51px; }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
    grid-template-rows: 28px 14px;
    min-height: 48px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual],
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual {
    height: 28px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual svg,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual img {
    width: 27px;
    height: 27px;
  }
}

@media (max-width: 1100px) {
  .dr88aph-nav-link.is-results { order: 4; }
  .dr88aph-nav-more { order: 5; }
  .dr88aph-home__lead,
  .dr88aph-home__reward-copy,
  .dr88aph-home__schedule-title,
  .dr88aph-wheel-subcopy,
  .dr88aph-prediction-subtitle { white-space: normal; }
  .dr88aph-home__reward-copy { font-size: 11px; letter-spacing: 0; }
  .dr88aph-top-page { padding: 17px; }
  .dr88aph-top-head { align-items: flex-start; }
  .dr88aph-top-board .dr88aph-filters a { min-height: 44px; }
}

@media (max-width: 680px) {
  .dr88aph-top-page { padding: 14px; }
  .dr88aph-top-head { gap: 9px; }
  .dr88aph-top-head h1 { font-size: 28px; }
  .dr88aph-top-head p { font-size: 12px; line-height: 18px; }
  .dr88aph-top-board > header { align-items: stretch; flex-direction: column; }
  .dr88aph-top-board .dr88aph-filters { width: 100%; }
  .dr88aph-top-board .dr88aph-filters a { flex: 1; }
  .dr88aph-top-row.is-heading { display: none; }
  .dr88aph-top-list { display: grid; gap: 7px; padding: 8px; }
  .dr88aph-top-list .dr88aph-top-row {
    grid-template-columns: 42px minmax(0, 1fr) 76px;
    grid-template-rows: auto auto auto;
    gap: 4px 8px;
    min-height: 94px;
    padding: 8px;
    border: 1px solid #eadfd8;
    border-radius: 10px;
    text-align: left;
  }
  .dr88aph-top-rank { grid-column: 1; grid-row: 1 / 4; align-self: stretch; }
  .dr88aph-top-member { grid-column: 2; grid-row: 1; }
  .dr88aph-top-prize { grid-column: 3; grid-row: 1; justify-self: end; }
  .dr88aph-top-list .dr88aph-top-row > span:nth-child(3) { grid-column: 2; grid-row: 2; }
  .dr88aph-top-list .dr88aph-top-row > span:nth-child(4) { grid-column: 3; grid-row: 2; }
  .dr88aph-top-list .dr88aph-top-row > span:nth-child(5) { grid-column: 2; grid-row: 3; }
  .dr88aph-top-list .dr88aph-top-row > span:nth-child(6) { grid-column: 3; grid-row: 3; }
  .dr88aph-top-list .dr88aph-top-row > span[data-label]::before {
    content: attr(data-label) ": ";
    color: #8a7f7b;
    font-size: 10px;
    font-weight: 700;
  }
  .dr88aph-top-list .dr88aph-top-member::before,
  .dr88aph-top-list .dr88aph-top-rank::before,
  .dr88aph-top-list .dr88aph-top-prize::before { content: none !important; }
  .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item],
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
    grid-template-rows: 48px minmax(28px, auto);
    min-height: 82px;
    padding: 6px;
  }
  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual],
  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual { height: 48px; }
  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual svg,
  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual img { width: 44px; height: 44px; }
}

@media (max-width: 390px) {
  .dr88aph-top-page { padding: 12px; padding-bottom: 92px; }
}

/* V8 — clearer play controls, product-led rewards and three-step rules flow. */

.dr88aph-match.is-compact .dr88aph-score-builder__vs {
  align-self: end;
  place-content: center;
  min-height: 48px;
  padding-bottom: 2px;
}

.dr88aph-match.is-compact .dr88aph-score-builder__vs b {
  display: grid;
  place-items: center;
  width: 18px;
  height: 48px;
  color: #a30a12;
  font-size: 24px;
  line-height: 1;
}

.dr88aph-prize-image-crop {
  position: relative;
  display: block;
  width: min(100%, 134px);
  height: 112px;
  overflow: hidden;
}

.dr88aph-prize-image-crop [data-prize-image] {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  filter: drop-shadow(0 9px 12px rgba(0, 0, 0, 0.5));
}

.dr88aph-wheel-card__visual.has-prize-image { height: 120px; }
.dr88aph-wheel-card__visual.has-prize-image small { bottom: 2px; }
.dr88aph-wheel-card__info { min-height: 62px; }

.dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item],
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
  grid-template-rows: 68px minmax(20px, auto);
  min-height: 98px;
  padding: 7px 7px 8px;
}

.dr88aph-wheel-prize-catalog [data-prize-catalog-visual],
.dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual,
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual {
  width: 78px;
  height: 68px;
}

.dr88aph-wheel-prize-catalog .dr88aph-prize-image-crop {
  width: 72px;
  height: 66px;
}

.dr88aph-wheel-prize-catalog [data-prize-catalog-title] {
  min-height: 28px;
  font-weight: 750;
  line-height: 14px;
}

.dr88aph-rules-flow { margin: 12px 0; }

.dr88aph-rules-flow ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dr88aph-rules-flow li {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  min-height: 70px;
  padding: 10px 12px;
  border: 1px solid #ead5c9;
  border-radius: 12px;
  background: linear-gradient(145deg, #fffdf9, #fff4ea);
  box-shadow: 0 8px 18px rgba(56, 8, 8, 0.08);
}

.dr88aph-rules-flow li::before {
  content: attr(data-step-number);
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: linear-gradient(145deg, #6d0509, #c8181e 55%, #520306);
  color: #ffe87a;
  font-size: 12px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.dr88aph-rules-flow li:not(:last-child)::after {
  content: "→";
  position: absolute;
  z-index: 2;
  top: 50%;
  right: -17px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #ffe34c;
  color: #72070b;
  font-size: 13px;
  font-weight: 900;
  transform: translateY(-50%);
}

.dr88aph-rules-flow a {
  align-self: end;
  color: #7d070c;
  font-size: 15px;
  font-weight: 850;
  line-height: 20px;
}

.dr88aph-rules-flow a::after {
  content: " ↗";
  color: #bd1118;
}

.dr88aph-rules-flow small {
  align-self: start;
  color: #626a78;
  font-size: 10px;
  font-weight: 650;
  line-height: 15px;
}

.dr88aph-rules-flow a:focus-visible {
  border-radius: 4px;
  outline: 3px solid rgba(163, 10, 18, 0.25);
  outline-offset: 3px;
}

.dr88aph-rules-stage-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 12px 0 8px;
  padding: 10px 12px;
  border-left: 4px solid #c8181e;
  background: #fff8f2;
}

.dr88aph-rules-stage-head > span {
  padding: 6px 8px;
  border-radius: 7px;
  background: #69070b;
  color: #ffe985;
  font-size: 10px;
  font-weight: 850;
  line-height: 14px;
  white-space: nowrap;
}

.dr88aph-rules-stage-head h2 { margin: 0; color: #252d3e; font-size: 18px; line-height: 24px; }
.dr88aph-rules-stage-head p { margin: 2px 0 0; color: #596273; font-size: 11px; line-height: 17px; }
.dr88aph-rules-stage-link { margin-top: 10px; }

@keyframes dr88aph-button-sheen {
  0%, 68% { opacity: 0; transform: translateX(-180%) skewX(-18deg); }
  74% { opacity: 0.72; }
  88%, 100% { opacity: 0; transform: translateX(430%) skewX(-18deg); }
}

.dr88aph-primary::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -40%;
  bottom: -40%;
  left: 0;
  width: 22%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.62), transparent);
  animation: dr88aph-button-sheen 5.8s ease-in-out infinite;
}

.dr88aph-secondary::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -40%;
  bottom: -40%;
  left: 0;
  width: 22%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 232, 152, 0.54), transparent);
  animation: dr88aph-button-sheen 6.4s 0.8s ease-in-out infinite;
}

.dr88aph-slot-cta::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -45%;
  bottom: -45%;
  left: 0;
  width: 18%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
  animation: dr88aph-button-sheen 5.2s 0.35s ease-in-out infinite;
}

.dr88aph-primary > *,
.dr88aph-secondary > *,
.dr88aph-slot-cta > * { position: relative; z-index: 2; }

[data-ambient-effects] {
  position: fixed;
  z-index: 0;
  inset: 68px 0 0;
  overflow: hidden;
  pointer-events: none;
  opacity: 0.7;
  animation: dr88aph-ambient-pulse 8s ease-in-out infinite alternate;
}

[data-ambient-effects] span {
  position: absolute;
  top: -20%;
  width: 32vw;
  height: 78vh;
  background: linear-gradient(108deg, transparent 20%, rgba(255, 226, 112, 0.12) 48%, transparent 72%);
  transform: rotate(9deg);
}

[data-ambient-effects] span:nth-child(1) { left: -7vw; }
[data-ambient-effects] span:nth-child(2) { left: 34vw; opacity: 0.52; transform: rotate(-7deg); }
[data-ambient-effects] span:nth-child(3) { right: -6vw; opacity: 0.66; }

.dr88aph-header { position: sticky; z-index: 100; }
.dr88aph-main,
.dr88aph-footer { position: relative; z-index: 1; }

@keyframes dr88aph-ambient-pulse {
  from { opacity: 0.44; transform: translate3d(-1.5%, 0, 0); }
  to { opacity: 0.72; transform: translate3d(1.5%, 0, 0); }
}

@media (min-width: 1101px) {
  .dr88aph-top-head > div { flex: 1; min-width: 0; }
  .dr88aph-top-head [data-top-subtitle] { max-width: none; white-space: nowrap; }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-stage { height: 212px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card { flex-basis: 202px; height: 188px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual { height: 122px; }
  .dr88aph[data-view="wheel"] .dr88aph-main { padding-block: 2px; }
}

@media (min-width: 1081px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

@media (min-width: 1101px) and (max-height: 820px) {
  .dr88aph[data-view="wheel"] .dr88aph-main { padding-block: 0; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-page { padding-block: 7px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-subnav { margin-block: 4px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-console { padding: 8px 10px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-console > header { margin-bottom: 4px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-stage { height: 166px; padding-block: 7px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card { flex-basis: 174px; height: 148px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual { height: 100px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__visual small { bottom: 8px; }
  .dr88aph[data-view="wheel"] .dr88aph-prize-image-crop { width: 116px; height: 92px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card__info { min-height: 48px; padding: 6px 8px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions { margin-top: 5px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions p { display: none; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-disclaimer { margin-top: 4px; padding-top: 4px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog { padding: 6px 8px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header { margin-bottom: 3px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
    grid-template-rows: 56px minmax(20px, auto);
    min-height: 84px;
    padding: 4px 5px;
  }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual],
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual {
    width: 66px;
    height: 56px;
  }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog .dr88aph-prize-image-crop { width: 64px; height: 56px; }
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog [data-prize-catalog-title] {
    min-height: 24px;
    font-size: 10px;
    line-height: 12px;
  }
}

@media (max-width: 1100px) {
  [data-top-subtitle] { white-space: normal; }
}

@media (max-width: 680px) {
  .dr88aph-match.is-compact .dr88aph-score-builder__vs,
  .dr88aph-match.is-compact .dr88aph-score-builder__vs b { min-height: 44px; height: 44px; }

  .dr88aph-wheel-card__visual.has-prize-image { height: 108px; }
  .dr88aph-prize-image-crop { width: 116px; height: 100px; }
  .dr88aph-wheel-prize-catalog .dr88aph-prize-image-crop { width: 68px; height: 64px; }

  .dr88aph-rules-flow ol { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .dr88aph-rules-flow li { min-height: 66px; }
  .dr88aph-rules-flow li:not(:last-child)::after {
    top: auto;
    right: 18px;
    bottom: -15px;
    transform: rotate(90deg);
  }
  .dr88aph-rules-stage-head { grid-template-columns: 1fr; gap: 7px; }
  .dr88aph-rules-stage-head > span { justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph *,
  .dr88aph *::before,
  .dr88aph *::after { scroll-behavior: auto !important; animation: none !important; transition-duration: 0.01ms !important; }
}

/* V9 — competition-first Top 10 board with rewards attached to every rank. */
.dr88aph-top-ranking {
  grid-template-columns: minmax(0, 1fr) 276px;
  align-items: stretch;
  gap: 12px;
  margin-top: 10px;
}

.dr88aph-top-board {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  border-color: rgba(118, 8, 13, 0.28);
  box-shadow: 0 16px 34px rgba(65, 3, 7, 0.2), inset 0 1px 0 #fff;
}

.dr88aph-top-board::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  pointer-events: none;
  background: linear-gradient(90deg, #8b070d, #ffe064 48%, #ba1018);
}

.dr88aph-top-board > header {
  min-height: 50px;
  padding: 7px 10px 7px 13px;
  border-bottom-color: rgba(255, 222, 103, 0.3);
  background:
    radial-gradient(circle at 4% 20%, rgba(255, 223, 100, 0.18), transparent 24%),
    linear-gradient(105deg, #430104, #83080e 68%, #570205);
}

.dr88aph-top-board > header > div > span {
  color: #ffdd69;
  font-size: 10px;
  font-weight: 850;
  line-height: 12px;
  letter-spacing: 0.12em;
}

.dr88aph-top-board > header h2 {
  margin-top: 0;
  color: #fffdf7;
  font-size: 17px;
  line-height: 21px;
}

.dr88aph-top-board .dr88aph-filters a {
  border-color: rgba(255, 239, 195, 0.34);
  background: rgba(255, 255, 255, 0.1);
  color: #fff9ed;
}

.dr88aph-top-board .dr88aph-filters a.is-active {
  border-color: #ffe16a;
  background: linear-gradient(145deg, #fff1a1, #ffc52f 62%, #d88c06);
  box-shadow: 0 6px 14px rgba(30, 0, 2, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.75);
  color: #650409;
}

.dr88aph-top-podium {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr) minmax(0, 1fr);
  grid-template-areas: "second first third";
  align-items: end;
  gap: 8px;
  margin: 0;
  padding: 10px;
  list-style: none;
  background:
    linear-gradient(90deg, transparent 49.7%, rgba(255, 224, 100, 0.2) 50%, transparent 50.3%),
    radial-gradient(circle at 50% 4%, rgba(255, 218, 73, 0.19), transparent 38%),
    linear-gradient(180deg, #270002, #580407);
}

.dr88aph-top-podium-card {
  position: relative;
  display: grid;
  align-content: space-between;
  gap: 7px;
  min-width: 0;
  min-height: 100px;
  padding: 9px;
  overflow: hidden;
  border: 1px solid rgba(255, 230, 146, 0.3);
  border-radius: 11px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.025)),
    #65060a;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 8px 18px rgba(10, 0, 1, 0.28);
  color: #fffaf1;
}

.dr88aph-top-podium-card::after {
  content: "";
  position: absolute;
  right: -22px;
  bottom: -38px;
  width: 96px;
  height: 96px;
  border: 14px solid rgba(255, 224, 100, 0.07);
  border-radius: 50%;
  pointer-events: none;
}

.dr88aph-top-podium-card[data-top-rank="1"] {
  grid-area: first;
  min-height: 112px;
  border-color: rgba(255, 221, 86, 0.82);
  background:
    radial-gradient(circle at 50% 0, rgba(255, 223, 91, 0.22), transparent 42%),
    linear-gradient(145deg, #9a0b13, #5a0307 72%);
  box-shadow: 0 0 24px rgba(255, 199, 39, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.dr88aph-top-podium-card[data-top-rank="2"] {
  grid-area: second;
  border-color: rgba(229, 233, 239, 0.58);
}

.dr88aph-top-podium-card[data-top-rank="3"] {
  grid-area: third;
  border-color: rgba(236, 161, 89, 0.62);
}

.dr88aph-top-podium-card__head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.dr88aph-top-podium-card .dr88aph-top-rank b {
  width: 29px;
  height: 29px;
  border: 1px solid rgba(255, 227, 117, 0.72);
  border-radius: 9px;
  background: linear-gradient(145deg, #940b12, #d4242c 56%, #5f0307);
  box-shadow: 0 3px 0 #8f5905, inset 0 1px 0 rgba(255, 255, 255, 0.3);
  color: #ffed8c;
  font-size: 12px;
}

.dr88aph-top-podium-card[data-top-rank="2"] .dr88aph-top-rank b {
  border-color: #e4e7ec;
  box-shadow: 0 3px 0 #8d939d;
}

.dr88aph-top-podium-card[data-top-rank="3"] .dr88aph-top-rank b {
  border-color: #e5a263;
  box-shadow: 0 3px 0 #93501f;
}

.dr88aph-top-podium-card .dr88aph-top-member {
  position: relative;
  z-index: 1;
}

.dr88aph-top-podium-card .dr88aph-top-member strong {
  color: #fffdf7;
  font-size: 11px;
  line-height: 15px;
}

.dr88aph-top-podium-card .dr88aph-top-member small {
  color: #e9ceca;
  line-height: 13px;
}

.dr88aph-top-podium-metrics {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 3px;
  margin: 0;
}

.dr88aph-top-podium-metrics > div {
  display: grid;
  justify-items: center;
  min-width: 0;
  padding: 3px 1px;
  border-radius: 5px;
  background: rgba(12, 0, 1, 0.24);
}

.dr88aph-top-podium-metrics dt {
  color: #d9bab8;
  font-weight: 700;
  line-height: 11px;
}

.dr88aph-top-podium-metrics dd {
  margin: 0;
  color: #fffdf7;
  font-size: 11px;
  font-weight: 850;
  line-height: 13px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-top-podium-metrics .dr88aph-top-points b { color: #ffe45d; font-size: 12px; }

.dr88aph-top-podium .dr88aph-top-prize {
  display: grid;
  justify-items: end;
  min-width: 68px;
  padding: 3px 7px;
  border-color: rgba(255, 220, 88, 0.68);
  background: rgba(36, 0, 2, 0.72);
}

.dr88aph-top-podium .dr88aph-top-prize small,
.dr88aph-top-chasers .dr88aph-top-prize small {
  color: #eacb9b;
  font-size: 10px;
  font-weight: 800;
  line-height: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.dr88aph-top-podium .dr88aph-top-prize strong {
  color: #ffe55e;
  font-size: 13px;
  line-height: 15px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-top-board .dr88aph-top-row {
  grid-template-columns: 42px minmax(126px, 1.45fr) repeat(3, 50px) 54px 82px;
}

.dr88aph-top-board .dr88aph-top-row.is-heading {
  min-height: 27px;
  background: #f2e7df;
  color: #78635e;
  font-size: 10px;
  letter-spacing: 0.015em;
}

.dr88aph-top-board .dr88aph-top-row.is-heading span:last-child { white-space: nowrap; }

.dr88aph-top-chasers .dr88aph-top-row {
  min-height: 39px;
  border-left: 3px solid transparent;
  background: #fffdfa;
}

.dr88aph-top-chasers .dr88aph-top-row:nth-child(even) { background: #fff8ef; }

.dr88aph-top-chasers .dr88aph-top-rank b {
  width: 27px;
  height: 27px;
  border: 1px solid #dfd3cb;
  background: linear-gradient(145deg, #fffdf9, #e9e0db);
  color: #535b69;
}

.dr88aph-top-chasers .dr88aph-top-prize {
  display: grid;
  justify-items: center;
  min-width: 61px;
  padding: 3px 5px;
  border-color: #d9ad31;
  background: linear-gradient(145deg, #6e0509, #3c0103);
}

.dr88aph-top-chasers .dr88aph-top-prize small { display: none; }
.dr88aph-top-chasers .dr88aph-top-prize strong { color: #ffe65f; font-size: 11px; line-height: 14px; }

.dr88aph-top-board__note {
  display: grid;
  align-content: center;
  justify-items: center;
  row-gap: 1px;
  margin: 0;
  min-height: 26px;
  padding: 6px 10px;
  background: #fff2d5;
  color: #715944;
  font-size: 10px;
  font-weight: 650;
  line-height: 14px;
  text-align: center;
}

.dr88aph-top-board__note > span { display: block; }

.dr88aph-top-brief {
  grid-column: 2;
  grid-row: 1;
  grid-template-rows: auto auto auto 1fr;
  padding: 13px;
}

.dr88aph-top-brief__intro > span {
  display: block;
  margin-bottom: 2px;
}

.dr88aph-top-brief h2 {
  font-size: 19px;
  line-height: 24px;
}

.dr88aph-top-brief__intro p { line-height: 16px; }

.dr88aph-top-brief .dr88aph-top-tiebreak {
  padding: 9px;
  border: 1px solid rgba(255, 226, 122, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.07);
  color: #f3d9d5;
}

.dr88aph-top-brief .dr88aph-top-tiebreak strong {
  color: #ffe16a;
  font-size: 10px;
  line-height: 14px;
}

.dr88aph-top-brief .dr88aph-top-tiebreak p {
  margin: 3px 0 0;
  font-size: 10px;
  line-height: 14px;
}

@media (min-width: 1101px) and (max-height: 820px) {
  .dr88aph[data-view="top"] .dr88aph-top-page { padding: 11px 14px; }
  .dr88aph[data-view="top"] .dr88aph-top-head { padding-bottom: 7px; }
  .dr88aph[data-view="top"] .dr88aph-top-head h1 { font-size: 27px; }
  .dr88aph[data-view="top"] .dr88aph-top-ranking { margin-top: 7px; }
  .dr88aph[data-view="top"] .dr88aph-top-board > header { min-height: 46px; }
  .dr88aph[data-view="top"] .dr88aph-top-podium { padding: 8px; }
  .dr88aph[data-view="top"] .dr88aph-top-podium-card { min-height: 92px; padding: 7px; }
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] { min-height: 102px; }
  .dr88aph[data-view="top"] .dr88aph-top-chasers .dr88aph-top-row { min-height: 36px; }
  .dr88aph[data-view="top"] .dr88aph-top-board__note { min-height: 23px; padding-block: 4px; }
  .dr88aph[data-view="top"] .dr88aph-top-brief { padding: 11px; }
  .dr88aph[data-view="top"] .dr88aph-top-brief h2 { font-size: 18px; line-height: 22px; }
}

@media (max-width: 1100px) {
  .dr88aph-top-ranking { grid-template-columns: minmax(0, 1fr); }
  .dr88aph-top-board { grid-column: 1; grid-row: 1; }
  .dr88aph-top-brief { grid-column: 1; grid-row: 2; }
}

@media (max-width: 680px) {
  .dr88aph-top-podium {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "first first"
      "second third";
  }

  .dr88aph-top-podium-card[data-top-rank="1"] { min-height: 96px; }
  .dr88aph-top-podium-card[data-top-rank="2"],
  .dr88aph-top-podium-card[data-top-rank="3"] { min-height: 92px; }
  .dr88aph-top-board .dr88aph-top-row { grid-template-columns: 42px minmax(0, 1fr) 76px; }
  .dr88aph-top-chasers .dr88aph-top-row { min-height: 88px; }
  .dr88aph-top-chasers .dr88aph-top-prize small { display: block; }
  .dr88aph-top-board__note { padding-inline: 8px; text-align: center; }
}

@media (max-width: 520px) {
  .dr88aph-top-podium {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "first" "second" "third";
  }

  .dr88aph-top-podium-card[data-top-rank="2"],
  .dr88aph-top-podium-card[data-top-rank="3"] {
    min-height: 104px;
  }
}

/* V9 — focused hero conversion line, reliable score typing and isolated prize crops. */
.dr88aph-home__content > .dr88aph-home__conversion-hook {
  display: flex;
  justify-content: center;
  max-width: none;
  gap: 7px;
  min-height: 30px;
  margin: 10px 0 0;
  padding: 5px 8px;
  border-block: 1px solid rgba(196, 151, 39, 0.24);
  background: linear-gradient(90deg, transparent, rgba(255, 246, 216, 0.74) 18%, rgba(255, 246, 216, 0.74) 82%, transparent);
  color: #5d1820;
  font-size: 12px;
  font-weight: 750;
  line-height: 18px;
  text-align: center;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook > span {
  color: #d2a124;
  font-weight: 900;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook > strong {
  color: #b50d15;
  font-weight: 900;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook + .dr88aph-trust {
  margin-top: 10px;
  padding-top: 12px;
}

.dr88aph .dr88aph-score-input [data-score-entry] {
  appearance: none;
  box-sizing: border-box;
  width: 58px;
  height: 48px;
  min-height: 44px;
  margin: 0;
  padding: 0 !important;
  border: 1px solid #d8b347;
  border-radius: 11px;
  background: linear-gradient(160deg, #fffdf7 0%, #fff8dc 57%, #ffe38c 100%);
  box-shadow: inset 0 2px 5px rgba(70, 20, 10, 0.08), 0 4px 10px rgba(74, 13, 10, 0.12);
  color: #79070c !important;
  -webkit-text-fill-color: #79070c;
  caret-color: #bd1018;
  font-family: var(--dr88-font-ui) !important;
  font-size: 28px !important;
  font-weight: 900 !important;
  font-style: normal;
  font-synthesis: none;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  letter-spacing: 0 !important;
  line-height: 46px !important;
  text-align: center;
  opacity: 1;
}

.dr88aph .dr88aph-score-input [data-score-entry]:hover {
  border-color: #b68414;
  background: linear-gradient(160deg, #fffef9, #fff4c7 58%, #ffdb64);
}

.dr88aph .dr88aph-score-input [data-score-entry]:focus-visible {
  border-color: #b90e16;
  outline: 3px solid rgba(213, 27, 37, 0.2);
  outline-offset: 2px;
  box-shadow: inset 0 2px 5px rgba(70, 20, 10, 0.08), 0 0 0 1px #ffe269, 0 6px 14px rgba(113, 4, 9, 0.18);
}

.dr88aph .dr88aph-score-input [data-score-entry][disabled] {
  border-color: #d9cec6;
  background: #efe9e4;
  color: #6d6662 !important;
  -webkit-text-fill-color: #6d6662;
  box-shadow: none;
  cursor: not-allowed;
}

.dr88aph .dr88aph-prize-image-crop {
  display: grid;
  place-items: center;
  isolation: isolate;
}

.dr88aph .dr88aph-prize-image-crop > img[data-prize-image] {
  position: static;
  inset: auto;
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  overflow: hidden;
  filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.44));
  pointer-events: none;
}

.dr88aph .dr88aph-top-prize.is-period-disabled {
  border-color: #d8cec6;
  background: #eee8e3;
  box-shadow: none;
}

.dr88aph .dr88aph-top-prize.is-period-disabled small,
.dr88aph .dr88aph-top-prize.is-period-disabled strong {
  color: #746b65;
}

@media (max-width: 1100px) {
  .dr88aph-home__content > .dr88aph-home__conversion-hook {
    flex-wrap: wrap;
    gap: 2px 6px;
    min-height: 38px;
    font-size: 11px;
    line-height: 16px;
  }
}

@media (max-width: 680px) {
  .dr88aph .dr88aph-score-input [data-score-entry] {
    width: 52px;
    height: 44px;
    font-size: 26px !important;
    line-height: 42px !important;
  }
}

/* V10 — premium conversion, complete fixture story and reusable reward profile. */
.dr88aph-button-flag img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto 22px;
  align-items: center;
  gap: 11px;
  min-height: 58px;
  margin-top: 11px;
  padding: 8px 13px;
  overflow: hidden;
  border: 1px solid #e0ae2f;
  border-radius: 13px;
  background:
    radial-gradient(circle at 78% 0, rgba(255, 224, 94, 0.23), transparent 29%),
    linear-gradient(105deg, #4e0206 0%, #970a11 54%, #4b0205 100%);
  box-shadow: 0 15px 27px rgba(54, 2, 6, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  color: #fff9ed;
  line-height: 1;
  text-align: left;
  white-space: nowrap;
  isolation: isolate;
  transition: transform 0.18s ease-out, box-shadow 0.18s ease-out, filter 0.18s ease-out;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -55%;
  bottom: -55%;
  left: 0;
  width: 18%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.68), transparent);
  animation: dr88aph-button-sheen 5.1s 0.2s ease-in-out infinite;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook:hover {
  filter: brightness(1.08) saturate(1.04);
  transform: translateY(-2px);
  box-shadow: 0 18px 31px rgba(54, 2, 6, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.dr88aph-home__content > .dr88aph-home__conversion-hook:active {
  box-shadow: 0 10px 19px rgba(54, 2, 6, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.dr88aph-home__content > .dr88aph-home__conversion-hook:focus-visible {
  outline: 3px solid rgba(209, 24, 34, 0.27);
  outline-offset: 4px;
}

.dr88aph-home__conversion-icon {
  display: grid !important;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 231, 126, 0.62);
  border-radius: 11px;
  background: linear-gradient(145deg, #ffe978, #e5ae1f);
  box-shadow: inset 0 1px 0 #fff7c8, 0 4px 10px rgba(30, 0, 2, 0.35);
  color: #75060b !important;
}

.dr88aph-home__conversion-icon svg { width: 23px; height: 23px; }

.dr88aph-home__conversion-copy,
.dr88aph-home__conversion-prize {
  display: grid !important;
  gap: 4px;
  min-width: 0;
}

.dr88aph-home__conversion-copy strong {
  color: #fffdf7 !important;
  font-size: 14px;
  font-weight: 850;
  line-height: 17px;
}

.dr88aph-home__conversion-copy small,
.dr88aph-home__conversion-prize small {
  color: #f2d7cb;
  font-weight: 750;
  line-height: 13px;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.dr88aph-home__conversion-prize {
  min-width: 150px;
  padding-left: 16px;
  border-left: 1px solid rgba(255, 224, 107, 0.31);
  text-align: left;
}

.dr88aph-home__conversion-prize strong {
  color: #ffe35b !important;
  font-size: 14px;
  font-weight: 900;
  line-height: 17px;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-inline-icon {
  width: 21px;
  height: 21px;
  color: #ffe46d;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook + .dr88aph-trust {
  margin-top: 13px;
  padding-top: 11px;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule {
  display: grid;
  padding: 8px 12px 10px;
  border-top: 1px solid rgba(154, 96, 33, 0.23);
  background: linear-gradient(180deg, #fffdf9, #fff7ed);
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > header {
  margin: 0;
  padding: 8px 10px;
  border: 1px solid rgba(222, 176, 57, 0.7);
  border-radius: 11px;
  background:
    radial-gradient(circle at 20% 0, rgba(255, 226, 97, 0.18), transparent 35%),
    linear-gradient(135deg, #4c0206, #79070c 64%, #3d0104);
  box-shadow: 0 7px 16px rgba(62, 2, 6, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > header > div {
  min-width: 0;
}

.dr88aph-schedule-emblem {
  position: relative;
  display: grid !important;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border: 1px solid rgba(255, 238, 168, 0.62);
  border-radius: 11px;
  background: linear-gradient(145deg, #ffe57a, #bd7f08);
  box-shadow: inset 0 1px 0 #fff8d6, 0 4px 11px rgba(22, 0, 2, 0.38);
  color: #6a0509;
}

.dr88aph-schedule-emblem svg { width: 22px; height: 22px; }
.dr88aph-schedule-emblem i {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 11px;
  height: 11px;
  border: 2px solid #540306;
  border-radius: 50%;
  background: #ffe34d;
  box-shadow: 0 0 0 2px rgba(255, 227, 77, 0.18);
}

.dr88aph[data-view="home"] .dr88aph-home__schedule-title {
  display: grid !important;
  gap: 2px;
  min-width: 0;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > header b {
  color: #fffdf5;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.015em;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > header small {
  overflow: hidden;
  color: #efd2bd;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-schedule-edition {
  display: inline-flex !important;
  align-items: center;
  min-height: 22px;
  padding: 3px 7px;
  border: 1px solid rgba(255, 226, 104, 0.38);
  border-radius: 999px;
  color: #ffe885;
  font-size: 10px;
  font-weight: 850;
  line-height: 13px;
  white-space: nowrap;
}

.dr88aph[data-view="home"] .dr88aph-fixture-rail {
  align-self: stretch;
  gap: 5px;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab {
  position: relative;
  border-color: #e4d5c5;
  background: linear-gradient(160deg, #fffefa, #fff7e9);
  box-shadow: inset 0 1px 0 #fff, 0 3px 8px rgba(72, 22, 9, 0.08);
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-active {
  border-color: #d01b24;
  background: linear-gradient(160deg, #fff9f0, #ffe7dd);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(208, 27, 36, 0.08), 0 5px 12px rgba(119, 6, 12, 0.13);
}

.dr88aph-fixture-tab.is-final {
  align-content: center;
  gap: 2px !important;
  overflow: hidden;
  border-color: #dfae32 !important;
  background:
    radial-gradient(circle at 50% 0, rgba(255, 228, 98, 0.22), transparent 42%),
    linear-gradient(145deg, #71060b, #3d0104) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 5px 13px rgba(61, 2, 5, 0.22) !important;
  color: #fff8ed !important;
}

.dr88aph-fixture-tab.is-final::after {
  content: "";
  position: absolute;
  right: -18px;
  bottom: -25px;
  width: 64px;
  height: 64px;
  border: 8px solid rgba(255, 224, 95, 0.08);
  border-radius: 50%;
}

.dr88aph-final-status {
  position: relative;
  z-index: 1;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  white-space: nowrap;
}

.dr88aph-final-status b {
  flex: none;
  padding: 2px 4px;
  border: 1px solid rgba(255, 229, 119, 0.46);
  border-radius: 4px;
  background: rgba(255, 226, 92, 0.14);
  color: #ffe274;
  font-size: 10px;
  font-weight: 900;
  line-height: 10px;
  letter-spacing: 0.035em;
}

.dr88aph-final-status small {
  min-width: 0;
  overflow: hidden;
  color: #f5d8ca;
  font-size: 10px;
  font-weight: 800;
  line-height: 10px;
  text-overflow: ellipsis;
}

.dr88aph-fixture-tab.is-final time {
  position: relative;
  z-index: 1;
  color: #fffdf6;
  font-size: 11px !important;
}

.dr88aph-finalists {
  position: relative;
  z-index: 1;
  display: flex !important;
  justify-content: center;
  gap: 4px !important;
  min-width: 0;
  color: #fff8ed;
  font-size: 10px;
  line-height: 12px;
  white-space: nowrap;
}

.dr88aph-finalists b { overflow: hidden; text-overflow: ellipsis; }
.dr88aph-finalists i { color: #ffe15f !important; font-weight: 900; }
.dr88aph-fixture-tab.is-final > small {
  position: relative;
  z-index: 1;
  max-width: 100%;
  overflow: hidden;
  color: #e8c9bd;
  font-size: 10px;
  line-height: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-prize-image-crop {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.dr88aph .dr88aph-prize-image-crop > img[data-prize-image] {
  background: transparent;
  filter: drop-shadow(0 8px 9px rgba(20, 0, 2, 0.36));
}

.dr88aph-wheel-prize-catalog [data-prize-catalog-title] {
  display: block;
  width: 100%;
  min-height: 15px;
  line-height: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-line-clamp: unset;
}

.dr88aph-top-brief {
  grid-template-rows: auto auto auto auto 1fr;
  gap: 9px;
}

.dr88aph-official-note {
  margin: 10px 0 0;
  padding: 8px 10px;
  border-left: 3px solid #c4141c;
  border-radius: 7px;
  background: #fff0dc;
  color: #6c4917;
  font-size: 11px;
  line-height: 16px;
}

.dr88aph-policy-claim-cta { width: 100%; margin-top: 13px; }

.dr88aph-claim-launch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.dr88aph-claim-launch p {
  max-width: 62ch;
  margin: 0;
  color: #596273;
  font-size: 12px;
  line-height: 18px;
}

.dr88aph-claim-launch .dr88aph-primary { flex: none; }

.dr88aph-prize-dialog {
  width: min(720px, calc(100% - 28px));
  grid-template-rows: auto minmax(0, 1fr);
  padding: 0;
  overflow: hidden;
  border-color: rgba(210, 158, 43, 0.8);
  background: #fffaf4;
}

.dr88aph-prize-dialog[open] {
  display: grid;
}

.dr88aph-prize-dialog__body {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.dr88aph-prize-dialog > form:first-child { position: absolute; z-index: 4; top: 0; right: 0; }
.dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close {
  position: relative;
  top: 12px;
  right: 12px;
  border-color: rgba(255, 232, 151, 0.38);
  background: rgba(31, 0, 2, 0.48);
  color: #fff8e9;
}

.dr88aph-prize-dialog__hero {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 132px;
  padding: 22px 78px 22px 24px;
  background:
    radial-gradient(circle at 12% 12%, rgba(255, 224, 93, 0.22), transparent 31%),
    linear-gradient(125deg, #3d0104, #8a080e 66%, #4c0206);
  color: #fff9ed;
}

.dr88aph-prize-dialog__visual {
  display: grid;
  place-items: center;
  width: 118px;
  height: 88px;
  flex: 0 0 118px;
  overflow: hidden;
  border: 1px solid rgba(255, 226, 108, 0.36);
  border-radius: 13px;
  background: rgba(24, 0, 2, 0.28);
}

.dr88aph-prize-dialog__visual:empty { display: none; }
.dr88aph-prize-dialog__visual .dr88aph-wheel-card__visual { position: static; width: 110px; height: 82px; }
.dr88aph-prize-dialog__visual .dr88aph-prize-image-crop { width: 108px; height: 80px; }
.dr88aph-prize-dialog__visual .dr88aph-prize-image-crop > img[data-prize-image] {
  transform: translateY(-5px) scale(1.19);
  transform-origin: center;
  filter: drop-shadow(0 1px 2px rgba(20, 0, 2, 0.3));
}
.dr88aph-prize-dialog__visual .dr88aph-wheel-card__visual small { display: none; }

.dr88aph-prize-dialog__copy {
  display: grid;
  align-content: center;
  gap: 7px;
  min-width: 0;
}

@media (min-width: 1101px) {
  .dr88aph-prize-dialog__copy {
    transform: translateY(-5px);
  }
}

.dr88aph-prize-dialog .dr88aph-prize-dialog__hero h2 {
  margin: 0;
  padding: 0;
  color: #fffdf8;
  font-size: var(--dr88-type-dialog-title, clamp(25px, 3.3vw, 29px));
  font-weight: 850;
  line-height: 1.12;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.dr88aph-prize-dialog__hero [data-prize-dialog-result] {
  display: grid;
  gap: 7px;
  margin: 0;
  color: #ffe56e;
}

.dr88aph-prize-dialog__hero [data-prize-dialog-result] > strong {
  font-size: var(--dr88-type-card, 16px);
  font-weight: 850;
  line-height: 19px;
}

.dr88aph-prize-dialog__hero [data-prize-dialog-result] > small {
  color: #fff0b0;
  font-size: var(--dr88-type-meta, 12px);
  font-weight: 800;
  line-height: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dr88aph-claim-profile-loading,
.dr88aph-claim-auth-gate,
.dr88aph-claim-profile-summary,
.dr88aph-claim-profile-form,
.dr88aph-claim-profile-status,
.dr88aph-prize-dialog__disclaimer { margin-inline: 22px; }

.dr88aph-prize-dialog__body > .dr88aph-claim-profile-loading {
  margin-block: 22px;
  padding: 18px;
  border-radius: 11px;
  background: #fff1de;
  color: #65554c;
  text-align: center;
}

.dr88aph-claim-auth-gate {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  margin-block: 20px;
  padding: 16px;
  border: 1px solid #ead4c2;
  border-radius: 13px;
  background: #fffdf9;
}

.dr88aph-claim-auth-gate > span {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background: linear-gradient(145deg, #7a070c, #c91b23 58%, #510205);
  box-shadow: 0 4px 0 #b1790b;
  color: #ffe570;
  font-size: 18px;
  font-weight: 900;
}

.dr88aph-claim-auth-gate h3,
.dr88aph-claim-profile-summary h3 { margin: 0; color: #252d3e; font-size: 17px; line-height: 23px; }
.dr88aph-claim-auth-gate p { margin: 3px 0 0; color: #657084; font-size: 11px; line-height: 16px; }

.dr88aph-claim-profile-summary {
  margin-block: 18px;
  padding: 16px;
  border: 1px solid #e5d4c7;
  border-radius: 13px;
  background: #fffdf9;
}

.dr88aph-claim-profile-summary > header > span {
  color: #a30a12;
  font-size: 10px;
  font-weight: 850;
  line-height: 14px;
  letter-spacing: 0.08em;
}

.dr88aph-claim-profile-summary dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 13px 0 0;
}

.dr88aph-claim-profile-summary dl > div {
  min-width: 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: #fff5e9;
}

.dr88aph-claim-profile-summary dl > div.is-wide { grid-column: 1 / -1; }
.dr88aph-claim-profile-summary dt { color: #786b64; font-size: 10px; font-weight: 750; line-height: 14px; }
.dr88aph-claim-profile-summary dd { margin: 2px 0 0; overflow-wrap: anywhere; color: #293143; font-size: 12px; font-weight: 750; line-height: 17px; }

.dr88aph-claim-summary-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-top: 13px;
}

.dr88aph-claim-profile-form {
  margin-block: 18px 12px;
  padding: 16px;
  border: 1px solid #e5d4c7;
  border-radius: 13px;
  background: #fffdf9;
}

.dr88aph-prize-dialog .dr88aph-claim-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dr88aph-prize-dialog .dr88aph-claim-grid label { margin: 0; }
.dr88aph-prize-dialog .dr88aph-claim-grid input,
.dr88aph-prize-dialog .dr88aph-claim-grid textarea { margin-top: 0; }
.dr88aph-prize-dialog .dr88aph-claim-grid input[readonly] { border-style: dashed; background: #f1ece7; color: #665f5b; cursor: default; }
.dr88aph-claim-profile-form > .dr88aph-primary { width: 100%; margin-top: 13px; }

.dr88aph-prize-dialog__body > .dr88aph-claim-profile-status {
  min-height: 18px;
  margin-block: 6px;
  color: #6c5c52;
  font-size: 11px;
  line-height: 17px;
  text-align: center;
}

.dr88aph-prize-dialog__body > .dr88aph-prize-dialog__disclaimer {
  margin-block: 10px 18px;
  padding-top: 10px;
  border-top: 1px solid #e5d5c9;
  color: #74675f;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  text-wrap: balance;
}

[hidden] { display: none !important; }

@media (min-width: 1081px) {
  .dr88aph[data-view="home"] .dr88aph-home__schedule {
    grid-template-columns: 184px minmax(0, 1fr);
  }

  .dr88aph[data-view="home"] .dr88aph-home__schedule > header {
    align-items: center;
  }

  .dr88aph[data-view="home"] .dr88aph-home__schedule > header > div { align-items: center; }
  .dr88aph[data-view="home"] .dr88aph-home__schedule > header .dr88aph-schedule-edition { display: none !important; }
  .dr88aph[data-view="home"] .dr88aph-fixture-rail {
    grid-template-columns: repeat(12, minmax(0, 1fr)) minmax(132px, 1.7fr);
  }
}

@media (min-width: 1101px) and (max-height: 820px) {
  .dr88aph-top-brief { gap: 6px; }
}

@media (max-width: 1100px) {
  .dr88aph-home__content > .dr88aph-home__conversion-hook {
    grid-template-columns: 39px minmax(0, 1fr) 20px;
    gap: 9px;
    min-height: 56px;
    white-space: normal;
  }

  .dr88aph-home__conversion-icon { width: 39px; height: 39px; }
  .dr88aph-home__conversion-prize { grid-column: 2; padding: 0; border: 0; text-align: left; }
  .dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-inline-icon { grid-column: 3; grid-row: 1 / span 2; }
  .dr88aph[data-view="home"] .dr88aph-home__schedule > header { justify-content: space-between; }
  .dr88aph-claim-launch { align-items: stretch; flex-direction: column; }
  .dr88aph-claim-launch .dr88aph-primary { width: 100%; }
  .dr88aph-top-brief { grid-template-rows: auto; }
  .dr88aph-prize-dialog .dr88aph-claim-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .dr88aph[data-view="home"] .dr88aph-home__schedule { padding-inline: 8px; }
  .dr88aph[data-view="home"] .dr88aph-home__schedule > header { align-items: center; padding: 7px 8px; }
  .dr88aph-schedule-emblem { width: 36px; height: 36px; flex-basis: 36px; }
  .dr88aph-schedule-edition { display: none !important; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final { grid-column: 1 / -1; min-height: 64px; }
  .dr88aph-finalists { font-size: 11px; }

  .dr88aph-prize-dialog__hero { gap: 16px; min-height: 116px; padding: 19px 64px 19px 18px; }
  .dr88aph-prize-dialog__visual { width: 88px; height: 74px; flex-basis: 88px; }
  .dr88aph-prize-dialog__visual .dr88aph-wheel-card__visual,
  .dr88aph-prize-dialog__visual .dr88aph-prize-image-crop { width: 84px; height: 70px; }
  .dr88aph-prize-dialog .dr88aph-prize-dialog__hero h2 { font-size: var(--dr88-type-section, 22px); line-height: 1.16; }
  .dr88aph-prize-dialog__copy,
  .dr88aph-prize-dialog__hero [data-prize-dialog-result] { gap: 6px; }
  .dr88aph-claim-profile-loading,
  .dr88aph-claim-auth-gate,
  .dr88aph-claim-profile-summary,
  .dr88aph-claim-profile-form,
  .dr88aph-claim-profile-status,
  .dr88aph-prize-dialog__disclaimer { margin-inline: 14px; }
  .dr88aph-claim-auth-gate { grid-template-columns: 46px minmax(0, 1fr); padding: 13px; }
  .dr88aph-claim-auth-gate > span { width: 46px; height: 46px; }
  .dr88aph-claim-auth-gate .dr88aph-primary { grid-column: 1 / -1; width: 100%; }
  .dr88aph-prize-dialog .dr88aph-claim-grid { grid-template-columns: minmax(0, 1fr); }
  .dr88aph-prize-dialog .dr88aph-claim-grid .is-wide { grid-column: auto; }
  .dr88aph-claim-profile-summary dl { grid-template-columns: minmax(0, 1fr); }
  .dr88aph-claim-profile-summary dl > div.is-wide { grid-column: auto; }
  .dr88aph-claim-summary-actions {
    grid-template-columns: minmax(0, 1fr);
    margin-top: 24px;
  }
}

@media (max-width: 420px) {
  .dr88aph-home__content > .dr88aph-home__conversion-hook { padding-inline: 10px; }
  .dr88aph-home__conversion-copy strong,
  .dr88aph-home__conversion-prize strong { font-size: 12px; line-height: 15px; }
  .dr88aph-home__conversion-copy small,
  .dr88aph-home__conversion-prize small { font-size: 10px; }
  .dr88aph-prize-dialog__visual { display: none; }
  .dr88aph-prize-dialog__hero { min-height: 112px; padding: 20px 62px 20px 18px; }
}

/* V1.11 — repair the home hierarchy, clarify rules and focus attention on the two conversion actions. */
.dr88aph .dr88aph-button-flag,
.dr88aph .dr88aph-home__actions .dr88aph-primary .dr88aph-button-flag,
.dr88aph .dr88aph-slot-cta .dr88aph-button-flag {
  width: 30px;
  height: 20px;
  flex: 0 0 30px;
  padding: 0;
  border-color: rgba(255, 244, 190, 0.78);
  background: #da251d;
}

.dr88aph-vietnam-flag-icon {
  display: block;
  width: 100%;
  height: 100%;
  fill: initial;
  stroke: none;
}

.dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
  grid-template-columns: 54px minmax(0, 1fr) auto 24px;
  gap: 14px;
  min-height: 68px;
  padding: 9px 16px;
  border-width: 2px;
  border-color: #f0c744;
  background:
    radial-gradient(circle at 80% -20%, rgba(255, 230, 103, 0.34), transparent 36%),
    linear-gradient(108deg, #400104 0%, #a30b13 52%, #4a0205 100%);
  box-shadow: 0 17px 31px rgba(54, 2, 6, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.dr88aph-home__conversion-icon {
  width: 54px;
  height: 48px;
  border-color: #ffe795;
  background: linear-gradient(155deg, #ffec8a 0%, #e2a813 63%, #9a5c02 100%);
}

.dr88aph-home__conversion-copy strong,
.dr88aph-home__conversion-prize strong {
  font-size: 15px;
  line-height: 19px;
}

.dr88aph-home__conversion-copy small,
.dr88aph-home__conversion-prize small {
  font-size: 10px;
  line-height: 14px;
}

@keyframes dr88aph-verdict-pulse {
  0%, 58%, 100% { filter: brightness(1) saturate(1); }
  68% { filter: brightness(1.18) saturate(1.12); }
  76% { filter: brightness(1.03) saturate(1.04); }
  86% { filter: brightness(1.15) saturate(1.1); }
}

@keyframes dr88aph-attention-sweep {
  0%, 55% { transform: translateX(-180%) skewX(-18deg); opacity: 0; }
  61% { opacity: 0.78; }
  78%, 100% { transform: translateX(680%) skewX(-18deg); opacity: 0; }
}

.dr88aph [data-attention-cta] {
  position: relative;
  overflow: hidden;
}

.dr88aph [data-attention-cta]::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: -35%;
  bottom: -35%;
  left: 0;
  width: 11%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.82), transparent);
  filter: blur(0.5px);
  animation: dr88aph-attention-sweep 2.6s ease-in-out infinite;
}

.dr88aph [data-attention-cta] > * { position: relative; z-index: 1; }

.dr88aph [data-attention-cta]:hover,
.dr88aph [data-attention-cta]:focus-visible,
.dr88aph [data-attention-cta]:active,
.dr88aph [data-attention-cta][aria-busy="true"] {
  filter: brightness(1.08) saturate(1.05);
}

.dr88aph [data-attention-cta]:hover::after,
.dr88aph [data-attention-cta]:focus-visible::after,
.dr88aph [data-attention-cta]:active::after,
.dr88aph [data-attention-cta][aria-busy="true"]::after { animation-play-state: paused; }

.dr88aph-home__content > .dr88aph-home__conversion-hook::before { animation: none; opacity: 0; }

.dr88aph .dr88aph-slot-cta [data-vietnam-flag-icon] { width: 100%; height: 100%; }
.dr88aph .dr88aph-slot-cta > span:nth-child(2) { white-space: nowrap; }
.dr88aph .dr88aph-slot-cta > span:nth-child(2) strong { color: #ffe65f; font-weight: 900; }

.dr88aph[data-view="home"] .dr88aph-home__schedule {
  grid-template-columns: 174px minmax(0, 1fr);
  align-items: stretch;
  gap: 8px;
  padding: 8px 12px 11px;
  border-top-color: rgba(162, 99, 24, 0.24);
  background: linear-gradient(180deg, #fffdf9 0%, #fff8ed 100%);
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > header {
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  padding: 7px 5px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > header > div { gap: 9px; }
.dr88aph[data-view="home"] .dr88aph-home__schedule > header > div,
.dr88aph[data-view="home"] .dr88aph-home__schedule-title { min-width: 0; }

.dr88aph .dr88aph-schedule-emblem {
  width: 34px;
  height: 34px;
  flex-basis: 34px;
  border-color: #e0b346;
  background: linear-gradient(145deg, #7b070c, #c81820 58%, #570305);
  box-shadow: 0 5px 12px rgba(79, 4, 8, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.22);
  color: #ffe66a;
}

.dr88aph .dr88aph-schedule-emblem i {
  right: -2px;
  bottom: -2px;
  width: 9px;
  height: 9px;
  border-color: #fff8ec;
  background: #1f9b59;
  box-shadow: none;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule-title { gap: 1px; }
.dr88aph[data-view="home"] .dr88aph-home__schedule > header b {
  color: #65050a;
  font-size: 13px;
  line-height: 17px;
  white-space: nowrap;
}
.dr88aph[data-view="home"] .dr88aph-home__schedule > header small {
  color: #776a62;
  font-size: 10px;
  font-weight: 700;
  line-height: 13px;
}

.dr88aph[data-view="home"] .dr88aph-fixture-rail {
  display: grid;
  grid-template-columns: repeat(13, minmax(0, 1fr));
  align-items: stretch;
  gap: 4px;
  padding: 1px;
  overflow: visible;
  scroll-snap-type: none;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab,
.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final {
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  min-height: 66px;
  padding: 6px 3px;
  align-content: center;
  gap: 5px;
  flex: 0 0 calc((100% - 48px) / 13);
  border: 1px solid #dfd0c1 !important;
  border-radius: 9px;
  background: linear-gradient(160deg, #fffefa, #fff5e6) !important;
  box-shadow: inset 0 1px 0 #fff, 0 3px 8px rgba(72, 22, 9, 0.07) !important;
  color: #3e4654 !important;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final { grid-column: auto; }

.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-active {
  border-color: #c71922 !important;
  background: linear-gradient(160deg, #fff9f0, #ffe5da) !important;
  color: #8c0910 !important;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab time,
.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final time {
  color: inherit;
  font-size: 10px !important;
  font-weight: 850;
  line-height: 12px;
  white-space: nowrap;
}

.dr88aph-final-label-long { display: none; }

.dr88aph[data-view="home"] .dr88aph-fixture-tab img { width: 22px; height: 15px; }
.dr88aph[data-view="home"] .dr88aph-fixture-tab > span { gap: 3px; }
.dr88aph[data-view="home"] .dr88aph-fixture-tab i { font-size: 10px; }
.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final::after { display: none; }
.dr88aph[data-view="home"] .dr88aph-finalists { gap: 3px !important; color: #79070c; font-size: 10px; line-height: 15px; }
.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final > small {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: #756861;
  font-size: 10px;
  line-height: 10px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph[data-view="top"] .dr88aph-top-ranking { grid-template-columns: minmax(0, 1fr) 310px; gap: 16px; }
.dr88aph[data-view="top"] .dr88aph-top-brief {
  gap: 13px;
  padding: 20px;
  border-color: #d19a2f;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 221, 92, 0.16), transparent 34%),
    linear-gradient(180deg, #6e090d 0%, #360104 58%, #250002 100%);
}
.dr88aph[data-view="top"] .dr88aph-top-brief__intro > span { color: #ffe168; font-size: 10px; letter-spacing: 0.1em; }
.dr88aph[data-view="top"] .dr88aph-top-brief h2 { max-width: 12ch; margin-top: 4px; font-size: 25px; line-height: 29px; text-wrap: balance; }
.dr88aph[data-view="top"] .dr88aph-top-brief__intro p { max-width: 31ch; margin-top: 6px; font-size: 12px; line-height: 18px; }
.dr88aph[data-view="top"] .dr88aph-top-brief__actions { align-self: end; }

.dr88aph .dr88aph-policy-grid.is-policy-only {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 12px;
}

.dr88aph .dr88aph-policy-grid.is-policy-only > section {
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 178px;
  padding: 18px;
}

.dr88aph .dr88aph-policy-grid.is-policy-only h2 { margin: 0; font-size: 17px; line-height: 23px; }
.dr88aph-rule-score-mini {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
}
.dr88aph-rule-score-mini > div { display: grid; justify-items: center; gap: 4px; padding: 10px 4px; border-radius: 9px; background: #fff0df; text-align: center; }
.dr88aph-rule-score-mini dt { color: #b70e16; font-size: 22px; font-weight: 900; line-height: 27px; }
.dr88aph-rule-score-mini dd { margin: 0; color: #4d5564; font-size: 10px; font-weight: 750; line-height: 14px; }
.dr88aph-rule-equation { display: grid; gap: 4px; margin: 8px 0 0; text-align: center; }
.dr88aph-rule-equation strong { color: #b70e16; font-size: 27px; line-height: 32px; }
.dr88aph-rule-equation b { color: #755008; font-size: 18px; line-height: 24px; }
.dr88aph .dr88aph-policy-grid.is-policy-only > section > p { margin: 0; color: #515a6a; font-size: 13px; line-height: 20px; }
.dr88aph .dr88aph-policy-grid.is-policy-only > section > small { color: #6b625d; font-size: 11px; line-height: 17px; text-align: center; }
.dr88aph-live-rules.is-compact { padding: 16px 18px; }
.dr88aph-live-rules.is-compact ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 20px; }
.dr88aph-live-rules.is-compact > p { margin: 4px 0 0; color: #525c6d; font-size: 13px; line-height: 20px; }

.dr88aph .dr88aph-review-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 9px 12px;
  border: 1px solid #e0a42b;
  border-radius: 10px;
  background: linear-gradient(100deg, #560408, #8e0a10);
  box-shadow: 0 8px 18px rgba(66, 2, 6, 0.14);
  color: #fff8e6;
  font-size: 11px;
  line-height: 16px;
}

.dr88aph .dr88aph-review-notice strong {
  padding: 4px 7px;
  border-radius: 6px;
  background: #ffe052;
  color: #5a0307;
  font-size: 10px;
  letter-spacing: 0.06em;
}

.dr88aph .dr88aph-review-notice span { font-weight: 750; letter-spacing: 0.025em; }

.dr88aph-results-page.is-review-preview .dr88aph-results-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  width: 100%;
  max-height: 500px;
  padding: 2px 6px 8px 2px;
  overflow-y: auto;
}

.dr88aph-results-page.is-review-preview .dr88aph-result-row {
  grid-template-columns: minmax(118px, 0.68fr) minmax(250px, 1.32fr);
  gap: 10px 14px;
  padding: 12px;
  border: 1px solid #ead8ca;
  border-radius: 11px;
  background: linear-gradient(145deg, #fffdf9, #fff7ee);
  box-shadow: 0 5px 13px rgba(72, 22, 8, 0.06);
}

.dr88aph-results-page.is-review-preview .dr88aph-result-row > p {
  grid-column: 1 / -1;
  padding-top: 7px;
  border-top: 1px solid #eee0d5;
  text-align: right;
}

.dr88aph-results-page.is-review-preview .dr88aph-table-wrap {
  max-height: min(64vh, 620px);
  overflow: auto;
}

.dr88aph-results-page.is-review-preview .dr88aph-ranking thead { position: sticky; z-index: 2; top: 0; }
.dr88aph-results-page.is-review-preview .dr88aph-ranking tbody tr:nth-child(even) { background: #fff9f1; }

.dr88aph-history-page.is-review-preview .dr88aph-summary {
  gap: 6px;
}

.dr88aph-history-page.is-review-preview .dr88aph-summary > div {
  padding: 10px;
  border: 1px solid #ead8ca;
  border-radius: 10px;
  background: #fffaf3;
  text-align: center;
}

.dr88aph-history-page.is-review-preview .dr88aph-ticket-list {
  align-content: start;
  max-height: 510px;
  padding: 2px 6px 8px 2px;
}

.dr88aph-history-page.is-review-preview .dr88aph-ticket {
  gap: 9px 14px;
  padding: 12px 14px;
  border: 1px solid #ead8ca;
  border-radius: 11px;
  background: linear-gradient(145deg, #fffdf9, #fff7ee);
  box-shadow: 0 5px 13px rgba(72, 22, 8, 0.055);
}

.dr88aph-history-page.is-review-preview .dr88aph-ticket__match { min-width: 0; }
.dr88aph-history-page.is-review-preview .dr88aph-ticket__points { grid-column: 2; grid-row: 1; }
.dr88aph-history-page.is-review-preview .dr88aph-ticket__pick { grid-column: 1 / -1; }

.dr88aph-ticket__breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}

.dr88aph-ticket__breakdown span {
  padding: 3px 6px;
  border-radius: 999px;
  background: #f1ece7;
  color: #6d625c;
  font-size: 10px;
  font-weight: 800;
  line-height: 13px;
}

.dr88aph-ticket__breakdown span.is-hit { background: #e4f7e9; color: #187740; }
.dr88aph-ticket__breakdown span.is-pending { background: #fff2ce; color: #865900; }

@media (max-width: 1080px) {
  .dr88aph[data-view="home"] .dr88aph-home__schedule { grid-template-columns: minmax(0, 1fr); }
  .dr88aph[data-view="home"] .dr88aph-home__schedule > header { padding-inline: 3px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-rail { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .dr88aph[data-view="top"] .dr88aph-top-ranking { grid-template-columns: minmax(0, 1fr) 270px; }
}

@media (max-width: 1100px) {
  .dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
    grid-template-columns: 48px minmax(0, 1fr) 22px;
    gap: 10px;
    min-height: 68px;
  }
  .dr88aph-home__conversion-icon { width: 48px; height: 44px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dr88aph .dr88aph-policy-grid.is-policy-only { grid-template-columns: minmax(0, 1fr); }
  .dr88aph .dr88aph-policy-grid.is-policy-only > section { min-height: 0; }
  .dr88aph-live-rules.is-compact ul { grid-template-columns: minmax(0, 1fr); }
  .dr88aph-results-page.is-review-preview .dr88aph-results-list,
  .dr88aph-history-page.is-review-preview .dr88aph-ticket-list { grid-template-columns: minmax(0, 1fr); max-height: none; overflow: visible; }
  .dr88aph-results-page.is-review-preview .dr88aph-table-wrap { max-height: min(54vh, 480px); }
}

@media (max-width: 680px) {
  .dr88aph .dr88aph-rules-flow ol { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .dr88aph .dr88aph-rules-flow li {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    justify-items: center;
    min-height: 78px;
    padding: 8px 4px;
    text-align: center;
  }
  .dr88aph .dr88aph-rules-flow li::before {
    grid-row: auto;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    font-size: 10px;
  }
  .dr88aph .dr88aph-rules-flow li:not(:last-child)::after {
    top: 50%;
    right: -10px;
    bottom: auto;
    width: 16px;
    height: 16px;
    font-size: 10px;
    transform: translateY(-50%);
  }
  .dr88aph .dr88aph-rules-flow a { align-self: center; font-size: 12px; line-height: 16px; }
  .dr88aph .dr88aph-rules-flow small { display: none; }
  .dr88aph .dr88aph-rules-stage-head { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 8px; padding: 8px 10px; }
  .dr88aph .dr88aph-rules-stage-head > span { display: none; }
}

@media (max-width: 520px) {
  .dr88aph[data-view="home"] .dr88aph-fixture-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dr88aph-home__conversion-copy strong,
  .dr88aph-home__conversion-prize strong { font-size: 12px; line-height: 16px; }
  .dr88aph-home__conversion-copy small,
  .dr88aph-home__conversion-prize small { font-size: 10px; line-height: 13px; }
  .dr88aph .dr88aph-slot-cta > span:nth-child(2) { font-size: 11px; }
  .dr88aph .dr88aph-review-notice { align-items: flex-start; flex-direction: column; gap: 5px; }
  .dr88aph-history-page.is-review-preview .dr88aph-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph [data-attention-cta]::after { animation: none !important; opacity: 0; }
}

/* V1.12 polish: compact fixture rail, podium honours, focused rules and visible review launchers. */
.dr88aph[data-view="home"] .dr88aph-home__schedule {
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 5px;
  padding: 8px 11px 10px;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule > .dr88aph-home__schedule-icon {
  display: grid;
  place-items: center;
  width: 46px;
  min-width: 46px;
  min-height: 58px;
  margin: 0;
  padding: 0;
}

.dr88aph[data-view="home"] .dr88aph-home__schedule-icon .dr88aph-schedule-emblem {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex-basis: 34px;
  border: 1px solid #d8aa36;
  border-radius: 50%;
  background: #76070c;
  box-shadow: 0 3px 8px rgba(72, 3, 7, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.dr88aph[data-view="home"] .dr88aph-home__schedule-icon .dr88aph-schedule-emblem svg {
  width: 17px;
  height: 17px;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab,
.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final {
  min-height: 58px;
  padding-block: 5px;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-vietnam {
  border-color: #d51a23 !important;
  background:
    radial-gradient(circle at 50% -30%, rgba(255, 225, 96, 0.2), transparent 52%),
    linear-gradient(155deg, #aa1018 0%, #78070c 54%, #500205 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 4px 10px rgba(102, 4, 9, 0.2) !important;
  color: #fffaf0 !important;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-vietnam.is-active {
  border-color: #ffdc54 !important;
  box-shadow: 0 0 0 2px rgba(184, 15, 23, 0.96), 0 5px 13px rgba(104, 3, 8, 0.26) !important;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-vietnam i { color: #ffe46b !important; }

.dr88aph[data-view="home"] .dr88aph-home-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  justify-self: stretch;
  width: 100%;
  max-width: none;
  gap: 12px;
  margin: 10px 0 6px;
  padding: 0;
  border: 0;
}

.dr88aph[data-view="home"] .dr88aph-home-benefits > li,
.dr88aph[data-view="home"] .dr88aph-home-benefits > li + li {
  display: flex;
  align-items: stretch;
  min-width: 0;
  width: 100%;
  max-width: none;
  padding: 0;
  border: 0;
}

.dr88aph[data-view="home"] .dr88aph-home-benefits a {
  position: relative;
  display: grid;
  place-items: center;
  align-self: stretch;
  width: 100%;
  max-width: none;
  min-height: 72px;
  padding: 10px 30px 10px 18px;
  overflow: hidden;
  border: 1px solid #c99a24;
  border-radius: 12px;
  background: linear-gradient(145deg, #73070c 0%, #430205 100%);
  box-shadow: 0 8px 18px rgba(74, 2, 6, 0.2);
  color: #fffaf0;
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.dr88aph[data-view="home"] .dr88aph-home-benefits a:hover {
  transform: translateY(-2px);
  border-color: #c9920f;
  box-shadow: 0 10px 22px rgba(85, 7, 10, 0.18);
}

.dr88aph[data-view="home"] .dr88aph-home-benefits a:focus-visible {
  outline: 3px solid #c5121a;
  outline-offset: 2px;
}

.dr88aph[data-view="home"] .dr88aph-home-benefit__copy {
  display: grid;
  min-width: 0;
  gap: 1px;
  justify-items: center;
  text-align: center;
}

.dr88aph[data-view="home"] .dr88aph-home-benefit__copy small {
  color: #ffe067;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
}

.dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
  color: #fffdf7;
  font-size: 14px;
  font-weight: 850;
  line-height: 18px;
}

.dr88aph[data-view="home"] .dr88aph-home-benefits a > .dr88aph-inline-icon {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 17px;
  height: 17px;
  color: #ffe067;
  transform: translateY(-50%);
}

@media (max-width: 520px) {
  .dr88aph[data-view="home"] .dr88aph-home-benefits {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a {
    min-height: 62px;
    place-items: center start;
    padding: 10px 44px 10px 18px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy {
    justify-items: start;
    text-align: left;
  }
}

.dr88aph-top-podium__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px 3px;
  background: #310003;
}

.dr88aph-top-podium__head span {
  color: #ffe168;
  font-size: 10px;
  font-weight: 900;
  line-height: 14px;
  letter-spacing: 0.13em;
}

.dr88aph-top-podium__head small {
  color: #d9bab7;
  font-size: 10px;
  font-weight: 650;
  line-height: 14px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium {
  padding-top: 13px;
  background:
    linear-gradient(90deg, transparent 49.7%, rgba(255, 224, 100, 0.18) 50%, transparent 50.3%),
    radial-gradient(circle at 50% 0, rgba(255, 218, 73, 0.2), transparent 42%),
    linear-gradient(180deg, #310003, #580407);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card {
  min-height: 116px;
  padding: 10px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
  min-height: 132px;
}

.dr88aph-top-honor {
  position: relative;
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow: hidden;
  border-radius: 9px;
}

.dr88aph-top-honor > span:last-child {
  display: grid;
  min-width: 0;
}

.dr88aph-top-honor small {
  color: #d8b98f;
  font-size: 10px;
  font-weight: 800;
  line-height: 10px;
  letter-spacing: 0.1em;
}

.dr88aph-top-honor strong {
  overflow: hidden;
  color: #ffe879;
  font-size: 10px;
  font-weight: 900;
  line-height: 12px;
  letter-spacing: 0.035em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-top-honor.is-silver strong { color: #f2f4f7; }
.dr88aph-top-honor.is-bronze strong { color: #efb172; }

.dr88aph-top-honor::after {
  content: "";
  position: absolute;
  top: -30%;
  bottom: -30%;
  left: -28%;
  width: 22%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
  transform: skewX(-18deg);
  animation: dr88aph-honor-sheen 3.8s ease-in-out infinite;
}

.dr88aph-top-podium-card[data-top-entry-state="empty"] .dr88aph-top-honor::after { animation: none; opacity: 0; }

@keyframes dr88aph-honor-sheen {
  0%, 55% { transform: translateX(0) skewX(-18deg); opacity: 0; }
  62% { opacity: 0.72; }
  82%, 100% { transform: translateX(560%) skewX(-18deg); opacity: 0; }
}

.dr88aph-top-chasers__label {
  padding: 7px 12px 4px;
  border-top: 1px solid rgba(224, 211, 202, 0.72);
  background: #fffdf9;
  color: #8b0a10;
  font-size: 10px;
  font-weight: 900;
  line-height: 12px;
  letter-spacing: 0.12em;
}

.dr88aph[data-view="top"] .dr88aph-top-ranking {
  grid-template-columns: minmax(0, 1fr) 286px;
  align-items: start;
}

.dr88aph[data-view="top"] .dr88aph-top-brief {
  grid-template-rows: auto auto auto auto;
  align-self: start;
  gap: 0;
  padding: 18px;
}

.dr88aph[data-view="top"] .dr88aph-top-brief h2 {
  max-width: none;
  margin-top: 3px;
  color: #fffdf6;
  font-size: 20px;
  line-height: 25px;
  white-space: nowrap;
}

.dr88aph[data-view="top"] .dr88aph-top-brief h2 strong { color: #ffe25d; }
.dr88aph[data-view="top"] .dr88aph-top-brief__intro p { max-width: none; margin-top: 4px; font-size: 11px; line-height: 16px; }

.dr88aph[data-view="top"] .dr88aph-top-tiebreak {
  margin-top: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 11.5px;
  line-height: 17px;
}

.dr88aph[data-view="top"] .dr88aph-top-tiebreak strong { color: #ffe16a; font-size: 10px; line-height: 14px; text-transform: uppercase; letter-spacing: 0.06em; }
.dr88aph[data-view="top"] .dr88aph-top-tiebreak p { margin: 3px 0 0; color: #f2dcd6; font-size: 10px; line-height: 15px; }
.dr88aph[data-view="top"] .dr88aph-top-brief__actions { margin-top: 14px; }

.dr88aph[data-view="rules"] .dr88aph-rules-page {
  padding: 18px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-page .dr88aph-page-head {
  padding-bottom: 10px;
}

.dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid #ecd396;
  border-radius: 10px;
  background: linear-gradient(90deg, #fff7dc, #fffdf8);
  box-shadow: none;
  color: #5b2021;
}

.dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules > span {
  padding: 5px 7px;
  border-radius: 6px;
  background: #72070c;
  color: #ffe66a;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.07em;
}

.dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules > strong { color: #a70d15; font-size: 12px; line-height: 16px; }
.dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules > p { margin: 0; color: #6d625e; font-size: 10px; line-height: 14px; white-space: nowrap; }

.dr88aph[data-view="rules"] .dr88aph-rules-flow { margin: 10px 0; }
.dr88aph[data-view="rules"] .dr88aph-rules-flow ol {
  gap: 0;
  overflow: hidden;
  border: 1px solid #ead7c9;
  border-radius: 12px;
  background: #fffaf4;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li {
  grid-template-columns: 42px minmax(0, 1fr);
  min-height: 58px;
  padding: 8px 11px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li + li { border-left: 1px solid #ead7c9; }
.dr88aph[data-view="rules"] .dr88aph-rules-flow li.is-current { background: linear-gradient(100deg, #fff0df, #fffaf4); }
.dr88aph[data-view="rules"] .dr88aph-rules-flow li::before { width: 34px; height: 34px; border-radius: 8px; }
.dr88aph[data-view="rules"] .dr88aph-rules-flow li:not(:last-child)::after { display: none; }
.dr88aph[data-view="rules"] .dr88aph-rules-flow a { font-size: 14px; line-height: 18px; }

.dr88aph[data-view="rules"] .dr88aph-rules-subnav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid #e5d7cf;
  border-radius: 0;
  background: transparent;
}

.dr88aph[data-view="rules"] .dr88aph-rules-subnav a {
  min-width: 0;
  min-height: 44px;
  padding: 10px 6px;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #667084;
  font-size: 12px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-subnav a.is-active {
  border-bottom-color: #be1119;
  background: transparent;
  box-shadow: none;
  color: #a10c13;
}

.dr88aph-rules-focus {
  margin-top: 10px;
  overflow: hidden;
  border: 1px solid #c8952c;
  border-radius: 15px;
  background:
    radial-gradient(circle at 95% 0, rgba(255, 224, 96, 0.17), transparent 30%),
    linear-gradient(145deg, #6c080d 0%, #3d0104 58%, #260002 100%);
  box-shadow: 0 14px 30px rgba(59, 2, 6, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  color: #fff9ef;
}

.dr88aph[data-view="rules"] .dr88aph-rules-stage-head {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 11px;
  margin: 0;
  padding: 13px 16px 11px;
  border: 0;
  border-bottom: 1px solid rgba(255, 226, 117, 0.18);
  background: transparent;
}

.dr88aph[data-view="rules"] .dr88aph-rules-stage-head > span {
  background: #ffe15d;
  color: #65050a;
}

.dr88aph[data-view="rules"] .dr88aph-rules-stage-head h2 { color: #fffdf7; font-size: 20px; line-height: 25px; }
.dr88aph[data-view="rules"] .dr88aph-rules-stage-head p { color: #e6cbc7; font-size: 11px; line-height: 16px; }

.dr88aph[data-view="rules"] .dr88aph-rule-summary {
  gap: 0;
  margin: 0;
  padding: 0 10px;
  background: transparent;
}

.dr88aph[data-view="rules"] .dr88aph-rule-summary > div {
  min-height: 84px;
  padding: 13px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph[data-view="rules"] .dr88aph-rule-summary > div + div { border-left: 1px solid rgba(255, 226, 117, 0.18); }
.dr88aph[data-view="rules"] .dr88aph-rule-summary > div > b { background: #ffe15d; color: #65050a; box-shadow: none; }
.dr88aph[data-view="rules"] .dr88aph-rule-summary strong { color: #fffdf6; }
.dr88aph[data-view="rules"] .dr88aph-rule-summary small { color: #dfc4c0; }

.dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact {
  margin: 0;
  padding: 11px 16px 13px;
  border: 0;
  border-top: 1px solid rgba(255, 226, 117, 0.18);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.055);
  box-shadow: none;
}

.dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact h2 { color: #ffe16a; font-size: 12px; line-height: 17px; text-transform: uppercase; letter-spacing: 0.06em; }
.dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact ul { margin: 6px 0 0; color: #f6e6df; font-size: 11px; line-height: 16px; }
.dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact li::marker { color: #ffe15d; }
.dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact > p { color: #f2dcd6; }
.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-text-link { color: #ffe16a; }

.dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only {
  grid-template-columns: 1.16fr 0.82fr 1fr;
  gap: 0;
  margin: 0;
  padding: 0 10px;
}

.dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only > section {
  min-height: 150px;
  padding: 18px 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only > section + section { border-left: 1px solid rgba(255, 226, 117, 0.18); }
.dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only h2 { color: #ffe16a; font-size: 13px; line-height: 18px; text-transform: uppercase; letter-spacing: 0.045em; }
.dr88aph[data-view="rules"] .dr88aph-rule-score-mini { gap: 0; margin-top: 8px; }
.dr88aph[data-view="rules"] .dr88aph-rule-score-mini > div { padding: 8px 3px; border-radius: 0; background: transparent; }
.dr88aph[data-view="rules"] .dr88aph-rule-score-mini > div + div { border-left: 1px solid rgba(255, 226, 117, 0.18); }
.dr88aph[data-view="rules"] .dr88aph-rule-score-mini dt { color: #ffe15d; }
.dr88aph[data-view="rules"] .dr88aph-rule-score-mini dd { color: #fff5e9; }
.dr88aph[data-view="rules"] .dr88aph-rule-equation strong { color: #ffe15d; }
.dr88aph[data-view="rules"] .dr88aph-rule-equation b { color: #fffdf6; }
.dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only > section > p,
.dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only > section > small { color: #ead2cc; }

.dr88aph[data-view="rules"] .dr88aph-code-strip {
  margin: 0;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.065);
  box-shadow: none;
}
.dr88aph[data-view="rules"] .dr88aph-code-strip strong { color: #ffe16a; }
.dr88aph[data-view="rules"] .dr88aph-code-strip span { border: 1px solid rgba(255, 224, 96, 0.22); background: rgba(30, 0, 2, 0.42); }

.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0 10px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid > section {
  padding: 17px 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid > section + section { border-left: 1px solid rgba(255, 226, 117, 0.18); }
.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid h2 { color: #ffe16a; font-size: 14px; line-height: 19px; }
.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid ul,
.dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid ol { color: #f5e5df; font-size: 11px; line-height: 17px; }

.dr88aph[data-view="rules"] .dr88aph-wheel-rule-prizes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0 16px 14px;
  counter-reset: dr88-prize;
}

.dr88aph[data-view="rules"] .dr88aph-wheel-rule-prizes > span {
  position: relative;
  min-width: 0;
  padding: 7px 6px 7px 23px;
  overflow: hidden;
  border: 0;
  border-top: 1px solid rgba(255, 226, 117, 0.15);
  border-radius: 0;
  background: transparent;
  color: #f4dfd8;
  font-size: 10px;
  line-height: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
  counter-increment: dr88-prize;
}

.dr88aph[data-view="rules"] .dr88aph-wheel-rule-prizes > span::before {
  content: counter(dr88-prize, decimal-leading-zero);
  position: absolute;
  left: 2px;
  color: #ffe16a;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.dr88aph-review-launcher {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 8px 13px;
  border: 1px solid #d49e2d;
  border-radius: 9px;
  background: linear-gradient(145deg, #69060a, #a90d15);
  box-shadow: 0 4px 0 #7d5209, 0 8px 16px rgba(78, 4, 8, 0.15);
  color: #fff8e7 !important;
  font-size: 11px;
  font-weight: 850;
  line-height: 15px;
  white-space: nowrap;
}

.dr88aph-review-launcher.is-active { background: #fff4cf; color: #72070c !important; box-shadow: none; }
.dr88aph-page-head__actions { display: flex; align-items: center; gap: 10px; }
.dr88aph-review-scroll-cue { margin: 5px 0 0; color: #8b5f13; font-size: 10px; font-weight: 750; line-height: 14px; text-align: right; }

@media (max-width: 1100px) {
  .dr88aph[data-view="top"] .dr88aph-top-brief { width: 100%; }
}

@media (max-width: 1100px) {
  .dr88aph[data-view="home"] .dr88aph-home__schedule { grid-template-columns: minmax(0, 1fr); }
  .dr88aph[data-view="home"] .dr88aph-home__schedule > .dr88aph-home__schedule-icon { width: 100%; min-width: 0; min-height: 38px; }
  .dr88aph[data-view="home"] .dr88aph-fixture-tab,
  .dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final { min-height: 58px; }

  .dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules { grid-template-columns: auto minmax(0, 1fr); }
  .dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules > p { grid-column: 1 / -1; white-space: normal; }
  .dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only { grid-template-columns: minmax(0, 1fr); padding-inline: 14px; }
  .dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only > section { min-height: 0; padding-block: 14px; }
  .dr88aph[data-view="rules"] .dr88aph-policy-grid.is-policy-only > section + section { border-top: 1px solid rgba(255, 226, 117, 0.18); border-left: 0; }
  .dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid { grid-template-columns: minmax(0, 1fr); padding-inline: 14px; }
  .dr88aph[data-view="rules"] .dr88aph-rules-focus .dr88aph-wheel-policy-grid > section + section { border-top: 1px solid rgba(255, 226, 117, 0.18); border-left: 0; }
  .dr88aph[data-view="rules"] .dr88aph-wheel-rule-prizes { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .dr88aph-page-head__actions { align-items: flex-end; flex-direction: column; gap: 4px; }
}

@media (max-width: 680px) {
  .dr88aph[data-view="home"] .dr88aph-trust[data-home-stats] > li { padding-inline: 5px; }
  .dr88aph[data-view="home"] .dr88aph-trust [data-stat-label],
  .dr88aph[data-view="home"] .dr88aph-trust .dr88aph-home__reward-copy { font-size: 10px; line-height: 14px; white-space: normal; }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] { min-height: 126px; }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dr88aph[data-view="rules"] .dr88aph-rules-flow li { grid-template-columns: minmax(0, 1fr); justify-items: center; min-height: 76px; padding: 8px 4px; text-align: center; }
  .dr88aph[data-view="rules"] .dr88aph-rules-flow li::before { grid-row: auto; }
  .dr88aph[data-view="rules"] .dr88aph-rules-subnav a { font-size: 10px; line-height: 14px; }
  .dr88aph[data-view="rules"] .dr88aph-rules-stage-head { grid-template-columns: minmax(0, 1fr); gap: 3px; }
  .dr88aph[data-view="rules"] .dr88aph-rules-stage-head > span { display: inline-flex; justify-self: start; }
  .dr88aph[data-view="rules"] .dr88aph-rule-summary { grid-template-columns: minmax(0, 1fr); }
  .dr88aph[data-view="rules"] .dr88aph-rule-summary > div { min-height: 68px; }
  .dr88aph[data-view="rules"] .dr88aph-rule-summary > div + div { border-top: 1px solid rgba(255, 226, 117, 0.18); border-left: 0; }
  .dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact ul { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 520px) {
  .dr88aph[data-view="rules"] .dr88aph-rules-page { padding: 12px; }
  .dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules > p { grid-column: auto; }
  .dr88aph[data-view="rules"] .dr88aph-beta-banner.is-rules > strong { font-size: 10px; line-height: 14px; }
  .dr88aph[data-view="rules"] .dr88aph-rules-subnav a { padding-inline: 3px; }
  .dr88aph-top-podium__head { align-items: flex-start; flex-direction: column; gap: 1px; }
  .dr88aph-page-head__actions { width: 100%; align-items: stretch; }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph-top-honor::after { animation: none !important; opacity: 0; }
}

/* Keep primary page headers focused; supporting details live inside each surface. */
.dr88aph-page-head > div > p {
  display: none;
}

.dr88aph[data-view="top"] .dr88aph-top-code-delivery {
  container-type: inline-size;
  position: relative;
  display: block;
  margin-top: 12px;
  padding: 12px 13px 12px 17px;
  border: 1px solid rgba(255, 226, 106, 0.5);
  border-radius: 11px;
  background: linear-gradient(135deg, #fff6d8 0%, #ffe9a8 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  color: #5c070b;
}

.dr88aph[data-view="top"] .dr88aph-top-code-delivery::before {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 8px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f0b91c, #cf8500);
  content: "";
}

.dr88aph[data-view="top"] .dr88aph-top-code-delivery strong {
  display: block;
  color: #65070b;
  font-size: 12.5px;
  font-weight: 850;
  line-height: 17px;
  letter-spacing: -0.01em;
  white-space: normal;
  overflow-wrap: anywhere;
}

.dr88aph[data-view="top"] .dr88aph-top-code-delivery p {
  margin: 2px 0 0;
  color: #71433d;
  font-size: min(9px, 3.75cqi);
  font-weight: 650;
  line-height: 15px;
  white-space: nowrap;
  overflow-wrap: normal;
}

@media (min-width: 1101px) {
  .dr88aph[data-view="top"] .dr88aph-top-board {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }

  .dr88aph[data-view="top"] .dr88aph-top-ladder,
  .dr88aph[data-view="top"] .dr88aph-top-band-panels,
  .dr88aph[data-view="top"] .dr88aph-top-band-panel.is-podium {
    height: 100%;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-panel.is-podium {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium {
    align-items: stretch;
    height: 100%;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card {
    align-self: stretch;
    height: 100%;
  }
}

@media (min-width: 1101px) {
  .dr88aph[data-view="rules"] .dr88aph-rules-official {
    grid-template-columns: minmax(132px, 0.9fr) repeat(3, minmax(150px, 1fr)) minmax(178px, 1.12fr);
    gap: 7px;
    min-height: 68px;
    padding: 7px;
    border-color: #d8a52d;
    border-radius: 15px;
    background:
      radial-gradient(circle at 90% 0, rgba(255, 224, 107, 0.17), transparent 32%),
      linear-gradient(135deg, #4a0206 0%, #76080d 48%, #310103 100%);
    box-shadow: 0 12px 26px rgba(61, 2, 7, 0.2), inset 0 1px 0 rgba(255, 246, 211, 0.18);
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > strong,
  .dr88aph[data-view="rules"] .dr88aph-rules-official > span {
    min-height: 52px;
    border: 1px solid rgba(255, 231, 145, 0.2);
    border-radius: 10px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > strong {
    justify-content: flex-start;
    padding-inline: 14px;
    background: linear-gradient(145deg, #fff4c7, #ffd75b);
    box-shadow: inset 0 1px 0 #fffdf2;
    font-size: 11px;
    font-weight: 900;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > span {
    flex-direction: column;
    gap: 1px;
    padding: 6px 10px;
    border-left: 1px solid rgba(255, 231, 145, 0.2);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025));
    color: #f8e7df;
    font-size: 10.5px;
    line-height: 14px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > span b {
    font-size: 18px;
    line-height: 20px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > .is-total {
    border-color: rgba(255, 224, 91, 0.62);
    background: linear-gradient(145deg, rgba(255, 216, 79, 0.25), rgba(255, 255, 255, 0.08));
    box-shadow: inset 0 1px 0 rgba(255, 249, 214, 0.2), 0 5px 12px rgba(30, 0, 2, 0.2);
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-layout {
    align-items: stretch;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-formula {
    display: grid;
    grid-template-rows: auto auto auto auto;
    align-self: stretch;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    align-self: stretch;
    gap: 18px;
    min-height: 58px;
    padding: 13px 15px;
    border: 1px solid rgba(255, 224, 91, 0.28);
    border-left: 3px solid #ffe15d;
    background:
      radial-gradient(circle at 88% 50%, rgba(255, 220, 86, 0.17), transparent 24%),
      linear-gradient(135deg, rgba(255, 226, 83, 0.12), rgba(255, 255, 255, 0.035));
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer > div {
    display: grid;
    gap: 4px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer strong {
    font-size: 15px;
    line-height: 20px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer > div > span {
    color: #f4ddd5;
    font-size: 11px;
    line-height: 17px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards.is-inline {
    margin-top: 10px;
    padding: 11px 12px 8px;
    border: 1px solid rgba(255, 224, 91, 0.24);
    border-radius: 10px;
    background: rgba(26, 0, 2, 0.16);
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards.is-inline > header h2 {
    font-size: 15px;
    line-height: 19px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards.is-inline > header p {
    margin-top: 1px;
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards.is-inline > div {
    margin-top: 7px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards.is-inline > div > span {
    min-height: 42px;
    padding: 5px 3px;
  }
}

/* Top 50 reward tickets: one visual language across every ranking band. */
.dr88aph[data-view="top"] .dr88aph-code-ticket {
  --ticket-bg: linear-gradient(120deg, #e63b48 0%, #b70e20 54%, #77000c 100%);
  --ticket-fg: #fff3d2;
  --ticket-depth: rgba(80, 3, 11, 0.28);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 66px;
  min-height: 28px;
  padding: 4px 11px;
  overflow: hidden;
  border: 0;
  border-radius: 5px;
  background: var(--ticket-bg);
  clip-path: polygon(0 0, 100% 0, 100% 34%, 94% 50%, 100% 66%, 100% 100%, 0 100%, 0 66%, 6% 50%, 0 34%);
  box-shadow: 0 6px 13px var(--ticket-depth), inset 0 0 0 1px rgba(255, 245, 206, 0.34);
  color: var(--ticket-fg);
  font-size: 12px;
  font-weight: 900;
  line-height: 16px;
  letter-spacing: -0.02em;
  text-align: center;
  white-space: nowrap;
  isolation: isolate;
}

.dr88aph[data-view="top"] .dr88aph-code-ticket > * {
  position: relative;
  z-index: 1;
  color: inherit;
}

.dr88aph[data-view="top"] .dr88aph-code-ticket::after {
  position: absolute;
  z-index: 0;
  top: -45%;
  bottom: -45%;
  left: -42%;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
  content: "";
  opacity: 0;
  transform: skewX(-18deg);
  animation: dr88aph-code-ticket-foil 4.8s ease-in-out infinite;
}

.dr88aph[data-view="top"] .dr88aph-code-ticket.is-range,
.dr88aph[data-view="top"] .dr88aph-code-ticket.is-888k {
  --ticket-bg: linear-gradient(120deg, #fff0a9 0%, #e6b534 48%, #b97912 100%);
  --ticket-fg: #3d2500;
  --ticket-depth: rgba(143, 91, 5, 0.28);
}

.dr88aph[data-view="top"] .dr88aph-code-ticket.is-588k {
  --ticket-bg: linear-gradient(120deg, #ffffff 0%, #d8e0e5 48%, #9caab5 100%);
  --ticket-fg: #26353f;
  --ticket-depth: rgba(57, 72, 82, 0.22);
}

.dr88aph[data-view="top"] .dr88aph-code-ticket.is-388k {
  --ticket-bg: linear-gradient(120deg, #ffd3a8 0%, #df8a4b 50%, #a94a25 100%);
  --ticket-fg: #3f1b0c;
  --ticket-depth: rgba(105, 40, 15, 0.24);
}

.dr88aph[data-view="top"] .dr88aph-code-ticket.is-188k {
  --ticket-bg: linear-gradient(120deg, #f04451 0%, #c20f25 54%, #82000d 100%);
  --ticket-fg: #fff5d7;
}

.dr88aph[data-view="top"] .dr88aph-code-ticket.is-88k {
  --ticket-bg: linear-gradient(120deg, #c65a74 0%, #921b40 52%, #5e0824 100%);
  --ticket-fg: #fff2dd;
}

.dr88aph[data-view="top"] .dr88aph-code-ticket.is-18k {
  --ticket-bg: linear-gradient(120deg, #aa6870 0%, #7d3944 52%, #4f1720 100%);
  --ticket-fg: #fff2df;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket {
  grid-column: 2;
  justify-self: start;
  min-width: 68px;
  min-height: 22px;
  padding: 2px 9px;
  color: var(--ticket-fg);
  font-size: 11px;
  line-height: 14px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket.is-range {
  min-width: 94px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium .dr88aph-top-prize.dr88aph-code-ticket {
  justify-items: center;
  min-width: 76px;
  min-height: 34px;
  padding: 5px 12px;
  border: 0;
  border-radius: 5px;
  background: var(--ticket-bg);
  color: var(--ticket-fg);
}

.dr88aph[data-view="top"] .dr88aph-top-podium .dr88aph-top-prize.dr88aph-code-ticket strong {
  color: inherit;
  font-size: 17px;
  line-height: 20px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier__head > b.dr88aph-code-ticket {
  min-width: 78px;
  min-height: 32px;
  margin-right: 0;
  padding: 5px 12px;
  color: var(--ticket-fg);
  font-size: 15px;
  line-height: 19px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a:nth-child(2) .dr88aph-code-ticket::after,
.dr88aph[data-view="top"] .dr88aph-top-podium-card:nth-child(2) .dr88aph-code-ticket::after {
  animation-delay: 640ms;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a:nth-child(3) .dr88aph-code-ticket::after,
.dr88aph[data-view="top"] .dr88aph-top-podium-card:nth-child(3) .dr88aph-code-ticket::after {
  animation-delay: 1.28s;
}

@keyframes dr88aph-code-ticket-foil {
  0%, 58% { left: -42%; opacity: 0; }
  65% { opacity: 0.72; }
  82%, 100% { left: 122%; opacity: 0; }
}

@media (max-width: 1100px) {
  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket {
    min-width: 62px;
    font-size: 10.5px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket.is-range {
    min-width: 86px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph[data-view="top"] .dr88aph-code-ticket::after {
    animation: none;
    opacity: 0;
  }
}

/* V1.13: unified fixtures, synchronized attention, Top 50 ladder and scoring hierarchy. */
.dr88aph[data-view="home"] .dr88aph-fixture-tab[data-vietnam-fixture],
.dr88aph[data-view="home"] .dr88aph-fixture-tab[data-vietnam-fixture].is-active {
  border-color: #d51a23 !important;
  background:
    radial-gradient(circle at 50% -30%, rgba(255, 225, 96, 0.2), transparent 52%),
    linear-gradient(155deg, #aa1018 0%, #78070c 54%, #500205 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    0 4px 10px rgba(102, 4, 9, 0.2) !important;
  color: #fffaf0 !important;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab[data-vietnam-fixture] time,
.dr88aph[data-view="home"] .dr88aph-fixture-tab[data-vietnam-fixture].is-active time {
  color: #fffaf0 !important;
}

.dr88aph[data-view="home"] .dr88aph-fixture-tab[data-vietnam-fixture] i,
.dr88aph[data-view="home"] .dr88aph-fixture-tab[data-vietnam-fixture].is-active i {
  color: var(--dr88-gold) !important;
}

.dr88aph [data-attention-poster] {
  isolation: isolate;
  overflow: hidden;
}

.dr88aph [data-attention-poster] > img {
  position: relative;
  z-index: 0;
}

.dr88aph [data-attention-poster]::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: -12%;
  bottom: -12%;
  left: 0;
  width: 18%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 246, 201, 0.28), rgba(255, 255, 255, 0.46), transparent);
  filter: blur(1px);
  opacity: 0;
  transform: translateX(-180%) skewX(-18deg);
  animation: dr88aph-attention-sweep 2.6s ease-in-out infinite;
}

.dr88aph [data-attention-poster]::after {
  z-index: 2;
}

.dr88aph-top-head__badges {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: none;
  flex-wrap: wrap;
  gap: 6px;
}

.dr88aph-top-policy-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #d3a72f;
  border-radius: 8px;
  background: linear-gradient(145deg, #78070c, #4a0205);
  color: #ffe985;
  font-size: 10px;
  font-weight: 900;
  line-height: 15px;
  letter-spacing: 0.07em;
  white-space: nowrap;
}

.dr88aph-top-band-nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid #eadfd8;
  background: #fff9f2;
}

.dr88aph-top-band-nav a {
  display: inline-flex;
  justify-content: center;
  min-width: 0;
  min-height: 38px;
  padding: 7px 5px;
  color: #6d4d46;
  font-size: 11px;
  font-weight: 850;
  line-height: 15px;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

.dr88aph-top-band-nav a + a {
  border-left: 1px solid #eadfd8;
}

.dr88aph-top-band-nav a:hover {
  background: #fff0dd;
  color: #9d0b12;
}

.dr88aph-top-band-nav a:focus-visible {
  position: relative;
  outline: 3px solid rgba(183, 13, 22, 0.3);
  outline-offset: -3px;
}

.dr88aph-top-ladder {
  max-height: clamp(300px, 46vh, 440px);
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scroll-behavior: auto;
}

.dr88aph-top-ladder:focus-visible {
  outline: 3px solid rgba(183, 13, 22, 0.28);
  outline-offset: -3px;
}

.dr88aph-top-tier {
  min-width: 0;
  scroll-margin-top: 52px;
}

.dr88aph-top-tier + .dr88aph-top-tier {
  border-top: 1px solid #dfcec4;
}

.dr88aph-top-tier__head {
  position: sticky;
  z-index: 3;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 43px;
  padding: 6px 10px 6px 13px;
  border-bottom: 1px solid rgba(255, 225, 101, 0.28);
  background: linear-gradient(100deg, #430205, #68060a 68%, #510306);
  color: #fffaf1;
  cursor: pointer;
  list-style: none;
}

.dr88aph-top-tier__head::-webkit-details-marker { display: none; }

.dr88aph-top-tier__head::before {
  content: "";
  position: absolute;
  right: 10px;
  width: 7px;
  height: 7px;
  border-right: 2px solid #ffe468;
  border-bottom: 2px solid #ffe468;
  transform: rotate(-45deg);
  transform-origin: center;
}

.dr88aph-top-tier[open] > .dr88aph-top-tier__head::before { transform: rotate(45deg); }
.dr88aph-top-tier__head > b { margin-right: 18px; }

.dr88aph-top-tier__head > span,
.dr88aph-top-tier__head > b {
  display: grid;
  min-width: 0;
  gap: 0;
}

.dr88aph-top-tier__head > b {
  flex: none;
  justify-items: end;
  color: #ffe468;
  font-size: 13px;
  line-height: 17px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-top-tier__head small {
  color: #e7c6bd;
  font-size: 10px;
  font-weight: 850;
  line-height: 12px;
  letter-spacing: 0.09em;
}

.dr88aph-top-tier__head strong {
  overflow: hidden;
  color: #fffdf8;
  font-size: 12px;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-top-tier__head > b small {
  color: #e7c6bd;
  text-align: right;
}

.dr88aph-top-tier .dr88aph-top-list .dr88aph-top-row:last-child {
  border-bottom: 0;
}

.dr88aph-top-ladder .dr88aph-top-prize {
  display: grid;
  justify-items: center;
  min-width: 58px;
  background: linear-gradient(145deg, #6e0509, #3c0103);
}

.dr88aph-top-ladder .dr88aph-top-prize small { display: none; }
.dr88aph-top-ladder .dr88aph-top-prize strong { color: #ffe65f; font-size: 11px; line-height: 14px; }

.dr88aph[data-view="rules"] .dr88aph-scoring-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.62fr) minmax(240px, 0.88fr);
  min-width: 0;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-formula,
.dr88aph[data-view="rules"] .dr88aph-scoring-order,
.dr88aph[data-view="rules"] .dr88aph-scoring-rewards {
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-formula,
.dr88aph[data-view="rules"] .dr88aph-scoring-order {
  padding: 16px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-order {
  border-left: 1px solid rgba(255, 226, 117, 0.2);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-formula header > span,
.dr88aph[data-view="rules"] .dr88aph-scoring-order > span,
.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header > span {
  color: #ffe16a;
  font-size: 10px;
  font-weight: 900;
  line-height: 14px;
  letter-spacing: 0.09em;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-formula h2,
.dr88aph[data-view="rules"] .dr88aph-scoring-order h2,
.dr88aph[data-view="rules"] .dr88aph-scoring-rewards h2 {
  margin: 2px 0 0;
  color: #fffdf7;
  font-size: 17px;
  line-height: 22px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 13px 0 0;
  border-block: 1px solid rgba(255, 226, 117, 0.2);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow > div {
  display: grid;
  align-content: center;
  justify-items: center;
  min-width: 0;
  min-height: 76px;
  padding: 9px 5px;
  text-align: center;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow > div + div {
  border-left: 1px solid rgba(255, 226, 117, 0.18);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow dt {
  color: #ffe34c;
  font-size: 28px;
  font-weight: 900;
  line-height: 31px;
  font-variant-numeric: tabular-nums;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow dd {
  margin: 2px 0 0;
  color: #fff8ef;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow .is-total {
  background: linear-gradient(145deg, rgba(255, 226, 83, 0.18), rgba(255, 255, 255, 0.06));
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow .is-total dt {
  color: #fff4ad;
  font-size: 34px;
  line-height: 35px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-explainer {
  margin: 10px 0 0;
  color: #ead2cc;
  font-size: 11px;
  line-height: 16px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-order ol {
  display: grid;
  gap: 0;
  margin: 10px 0 8px;
  padding: 0;
  border-block: 1px solid rgba(255, 226, 117, 0.18);
  list-style: none;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-order li {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 39px;
  padding: 5px 2px;
  color: #fff8ef;
  font-size: 11px;
  font-weight: 750;
  line-height: 15px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-order li + li {
  border-top: 1px solid rgba(255, 226, 117, 0.15);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-order li b {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(255, 226, 117, 0.45);
  border-radius: 6px;
  background: rgba(255, 226, 83, 0.12);
  color: #ffe16a;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards {
  padding: 14px 16px 16px;
  border-top: 1px solid rgba(255, 226, 117, 0.2);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header {
  display: flex;
  align-items: center;
  gap: 11px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 29px;
  padding: 5px 8px;
  border-radius: 6px;
  background: #ffe15d;
  color: #65050a;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header p {
  margin: 1px 0 0;
  color: #ead2cc;
  font-size: 10px;
  line-height: 14px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  margin-top: 11px;
  border-block: 1px solid rgba(255, 226, 117, 0.2);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span {
  display: grid;
  align-content: center;
  justify-items: center;
  min-width: 0;
  min-height: 54px;
  padding: 7px 4px;
  text-align: center;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span + span {
  border-left: 1px solid rgba(255, 226, 117, 0.17);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards small {
  overflow: hidden;
  color: #e1c3bc;
  font-size: 10px;
  font-weight: 800;
  line-height: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards strong {
  color: #ffe468;
  font-size: 15px;
  line-height: 19px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

@media (min-width: 1081px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .dr88aph-top-head__badges {
    width: 100%;
    justify-content: flex-start;
  }

  .dr88aph-top-band-nav a {
    min-height: 44px;
    padding-inline: 3px;
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph-top-ladder {
    max-height: none;
    overflow: visible;
    overscroll-behavior: auto;
    scrollbar-gutter: auto;
    scroll-behavior: auto;
  }

  .dr88aph-top-tier__head {
    position: static;
  }

  .dr88aph[data-view="top"] .dr88aph-top-board,
  .dr88aph[data-view="top"] .dr88aph-top-ladder,
  .dr88aph[data-view="top"] .dr88aph-top-tier,
  .dr88aph[data-view="top"] .dr88aph-top-row {
    max-width: 100%;
    min-width: 0;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-order {
    border-top: 1px solid rgba(255, 226, 117, 0.2);
    border-left: 0;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span:nth-child(4) {
    border-left: 0;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span:nth-child(n + 4) {
    border-top: 1px solid rgba(255, 226, 117, 0.17);
  }
}

@media (max-width: 680px) {
  .dr88aph[data-view="top"] .dr88aph-top-ladder .dr88aph-top-row {
    grid-template-columns: 42px minmax(0, 1fr) minmax(64px, 76px);
    min-height: 88px;
    overflow: hidden;
  }

  .dr88aph[data-view="top"] .dr88aph-top-ladder .dr88aph-top-member {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier__head {
    min-height: 46px;
    padding-inline: 9px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier__head strong {
    max-width: 30ch;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-flow > div:nth-child(3) {
    border-left: 0;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-flow > div:nth-child(n + 3) {
    border-top: 1px solid rgba(255, 226, 117, 0.18);
  }
}

@media (max-width: 520px) {
  .dr88aph-top-head__badges > * {
    flex: 1 1 auto;
  }

  .dr88aph-top-tier__head > span {
    max-width: calc(100% - 82px);
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-formula,
  .dr88aph[data-view="rules"] .dr88aph-scoring-order,
  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards {
    padding: 14px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header {
    align-items: flex-start;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span:nth-child(3n + 1) {
    border-left: 1px solid rgba(255, 226, 117, 0.17);
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span:nth-child(odd) {
    border-left: 0;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards > div > span:nth-child(n + 3) {
    border-top: 1px solid rgba(255, 226, 117, 0.17);
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph [data-attention-poster]::before {
    animation: none !important;
    opacity: 0 !important;
  }
}

/* V1.14: reliable Top 50 navigation, clearer competitive levels and balanced fulfillment UI. */
.dr88aph[data-view="top"] .dr88aph-top-board {
  border-radius: 14px;
}

.dr88aph-top-band-nav {
  gap: 8px;
  padding: 9px;
  border-bottom: 1px solid rgba(255, 226, 117, 0.22);
  background:
    radial-gradient(circle at 50% 0, rgba(255, 220, 77, 0.14), transparent 48%),
    linear-gradient(180deg, #360104, #210002);
}

.dr88aph-top-band-nav a {
  position: relative;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 0 8px;
  min-height: 44px;
  height: 64px;
  padding: 8px 9px;
  overflow: hidden;
  border: 1px solid rgba(255, 231, 143, 0.26);
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.025));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 5px 12px rgba(10, 0, 1, 0.2);
  color: #fff8e8;
  text-align: left;
  white-space: normal;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}

.dr88aph-top-band-nav a + a { border-left-color: rgba(255, 231, 143, 0.26); }

.dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) {
  display: grid;
  align-self: end;
  min-width: 0;
}

.dr88aph-top-band-nav a > span strong {
  overflow: hidden;
  color: #fffdf5;
  font-size: 11px;
  font-weight: 900;
  line-height: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-top-band-nav a > span small {
  color: #dfc9c0;
  font-size: 10px;
  font-weight: 750;
  line-height: 12px;
}

.dr88aph-top-band-nav a > b {
  grid-column: 2;
  align-self: start;
  color: #ffe263;
  font-size: 10px;
  font-weight: 850;
  line-height: 12px;
  font-variant-numeric: tabular-nums;
}

.dr88aph-top-band-nav__mark {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 228, 108, 0.5);
  border-radius: 10px;
  background: rgba(25, 0, 2, 0.3);
  color: #ffe76f;
  font-size: 12px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.dr88aph-top-band-nav__mark svg { width: 20px; height: 20px; }

.dr88aph-top-band-nav a.is-podium {
  background: linear-gradient(145deg, #9e0d15, #590307 72%);
}

.dr88aph-top-band-nav a.is-top10 {
  background: linear-gradient(145deg, #74100f, #3c0304 72%);
}

.dr88aph-top-band-nav a.is-midfield {
  border-color: rgba(232, 157, 79, 0.42);
  background: linear-gradient(145deg, #632316, #351008 72%);
}

.dr88aph-top-band-nav a.is-challenger {
  border-color: rgba(213, 209, 197, 0.3);
  background: linear-gradient(145deg, #442d2c, #241315 72%);
}

.dr88aph-top-band-nav a:hover {
  z-index: 1;
  transform: translateY(-2px);
  border-color: #ffe477;
  background: linear-gradient(145deg, #a81119, #5e0308 72%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 10px 20px rgba(10, 0, 1, 0.32);
  color: #fffdf5;
}

.dr88aph-top-band-nav a.is-active {
  border-color: #ffe362;
  background: linear-gradient(145deg, #d71d26, #8b080e 52%, #4c0205);
  box-shadow: 0 0 0 1px rgba(255, 226, 82, 0.28), 0 9px 22px rgba(4, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  filter: saturate(1.08);
}

.dr88aph-top-band-nav a:focus-visible {
  z-index: 2;
  outline: 3px solid #fff1a3;
  outline-offset: 2px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium {
  gap: 10px;
  padding: 14px 12px 13px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card {
  min-height: 150px;
  padding: 12px;
  border-width: 1px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
  min-height: 166px;
  border-width: 2px;
  box-shadow: 0 0 0 1px rgba(255, 224, 89, 0.16), 0 0 28px rgba(255, 196, 25, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.dr88aph-top-podium-card::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -35%;
  bottom: -35%;
  left: -42%;
  width: 24%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 250, 215, 0.58), transparent);
  opacity: 0;
  transform: translateX(0) skewX(-17deg);
  animation: dr88aph-top-podium-sweep 4.8s ease-in-out infinite;
}

.dr88aph-top-podium-card[data-top-rank="2"]::before { animation-delay: 720ms; }
.dr88aph-top-podium-card[data-top-rank="3"]::before { animation-delay: 1.44s; }

@keyframes dr88aph-top-podium-sweep {
  0%, 54% { opacity: 0; transform: translateX(0) skewX(-17deg); }
  61% { opacity: 0.65; }
  80%, 100% { opacity: 0; transform: translateX(720%) skewX(-17deg); }
}

.dr88aph-top-podium-card__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 9px;
  overflow: visible;
}

.dr88aph-top-honor {
  align-items: flex-start;
  overflow: visible;
}

.dr88aph-top-honor > span:last-child { align-content: center; }

.dr88aph-top-honor [data-top-honor-title] {
  overflow: visible;
  color: #ffe879;
  font-size: 12px;
  line-height: 14px;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

.dr88aph-top-podium-card .dr88aph-top-rank b {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  font-size: 15px;
}

.dr88aph-top-podium-card .dr88aph-top-member strong { font-size: 12px; line-height: 16px; }
.dr88aph-top-podium-card .dr88aph-top-member small { font-size: 10px; line-height: 14px; }

.dr88aph-top-podium-metrics {
  gap: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 228, 133, 0.12);
  border-radius: 8px;
  background: rgba(20, 0, 2, 0.22);
}

.dr88aph-top-podium-metrics > div {
  min-height: 45px;
  padding: 6px 2px 5px;
  border-radius: 0;
  background: transparent;
}

.dr88aph-top-podium-metrics > div + div { border-left: 1px solid rgba(255, 228, 133, 0.12); }

.dr88aph-top-podium-metrics dt {
  overflow: hidden;
  max-width: 100%;
  color: #dfc4bd;
  font-size: 10px;
  line-height: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-top-podium-metrics dd { margin-top: 2px; font-size: 12px; line-height: 14px; }

.dr88aph-top-tier.is-tier-top10 > .dr88aph-top-tier__head {
  border-bottom-color: rgba(255, 226, 92, 0.42);
  background: linear-gradient(100deg, #8f0b13, #5d0408 66%, #3b0103);
}

.dr88aph-top-tier.is-tier-midfield > .dr88aph-top-tier__head {
  border-bottom-color: rgba(241, 171, 85, 0.38);
  background: linear-gradient(100deg, #6b2417, #4a120c 66%, #2e0806);
}

.dr88aph-top-tier.is-tier-challenger > .dr88aph-top-tier__head {
  border-bottom-color: rgba(222, 215, 196, 0.3);
  background: linear-gradient(100deg, #483033, #342024 66%, #211214);
}

.dr88aph-top-tier.is-tier-top10 .dr88aph-top-row:nth-child(even) { background: #fff9e9; }
.dr88aph-top-tier.is-tier-midfield .dr88aph-top-row:nth-child(even) { background: #fff7f0; }
.dr88aph-top-tier.is-tier-challenger .dr88aph-top-row:nth-child(even) { background: #f8f5f2; }
.dr88aph-top-tier.is-tier-top10 .dr88aph-top-rank b { border-color: #efbd30; background: #8c0910; color: #ffe778; }
.dr88aph-top-tier.is-tier-midfield .dr88aph-top-rank b { border-color: #d88d52; background: #75301f; color: #ffe3c0; }
.dr88aph-top-tier.is-tier-challenger .dr88aph-top-rank b { border-color: #bdb4ac; background: #534548; color: #fff8ee; }

.dr88aph[data-view="rules"] .dr88aph-rules-action {
  width: 100%;
  min-height: 48px;
  margin-top: auto;
  padding: 8px 13px;
  border-width: 1px;
  border-color: #e9b92d;
  border-radius: 10px;
  background: linear-gradient(145deg, #b71018, #78060b 70%, #490204);
  box-shadow: 0 5px 0 #470204, 0 11px 20px rgba(69, 2, 6, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  font-size: 12px;
  line-height: 16px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-action .dr88aph-button-flag {
  width: 28px;
  height: 19px;
  flex-basis: 28px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-action > .dr88aph-inline-icon { margin-left: auto; }

.dr88aph-prize-dialog .dr88aph-claim-profile-form {
  display: grid;
  gap: 15px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph-prize-dialog .dr88aph-claim-group {
  min-width: 0;
  margin: 0;
  padding: 14px;
  border: 1px solid #ead7c8;
  border-radius: 12px;
  background: linear-gradient(180deg, #fffdf9, #fff9f2);
}

.dr88aph-prize-dialog .dr88aph-claim-group.is-delivery {
  border-color: #e4c997;
  background: linear-gradient(180deg, #fffdf7, #fff7e9);
}

.dr88aph-prize-dialog .dr88aph-claim-group legend {
  padding: 0 8px;
  color: #89080e;
  font-size: 12px;
  font-weight: 900;
  line-height: 17px;
  letter-spacing: 0.035em;
}

.dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dr88aph-prize-dialog .dr88aph-claim-grid.is-delivery {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dr88aph-prize-dialog .dr88aph-claim-grid label {
  align-content: start;
  gap: 6px;
}

.dr88aph-prize-dialog .dr88aph-claim-grid label > .dr88aph-field-label {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  min-height: 18px;
  color: #3f4757;
}

.dr88aph-prize-dialog .dr88aph-field-label em {
  color: #b70d16;
  font-style: normal;
}

.dr88aph-prize-dialog .dr88aph-field-label small {
  color: #81736a;
  font-size: 10px;
  font-weight: 650;
}

.dr88aph-prize-dialog .dr88aph-claim-grid label > small:not(.dr88aph-field-help) {
  color: #81736a;
  font-size: 10px;
  font-weight: 650;
}

.dr88aph-prize-dialog .dr88aph-claim-grid input,
.dr88aph-prize-dialog .dr88aph-claim-grid textarea {
  min-height: 48px;
  border-color: #d8c5b8;
  background: #fff;
  box-shadow: inset 0 1px 2px rgba(44, 13, 4, 0.035);
}

.dr88aph-prize-dialog .dr88aph-claim-grid input:focus-visible,
.dr88aph-prize-dialog .dr88aph-claim-grid textarea:focus-visible {
  outline: 0;
}

.dr88aph-prize-dialog .dr88aph-claim-grid textarea { min-height: 58px; }

.dr88aph-prize-dialog .dr88aph-claim-profile-form > .dr88aph-primary {
  position: sticky;
  z-index: 2;
  bottom: 10px;
  margin-inline: 0;
  box-shadow: 0 10px 24px rgba(66, 2, 6, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

.dr88aph-field-help {
  color: #756a64;
  font-size: 12px;
  font-weight: 600;
  line-height: 17px;
}

@media (min-width: 681px) {
  .dr88aph-prize-dialog .dr88aph-claim-grid.is-delivery > label.is-wide {
    grid-column: span 1;
  }
}

@media (max-width: 1080px) and (min-width: 1101px) {
  .dr88aph[data-view="top"] .dr88aph-top-brief { padding: 14px; }
  .dr88aph-top-band-nav { gap: 6px; padding: 7px; }
  .dr88aph-top-band-nav a { grid-template-columns: 32px minmax(0, 1fr); gap: 0 6px; padding-inline: 7px; }
  .dr88aph-top-band-nav__mark { width: 32px; height: 34px; }
  .dr88aph-top-band-nav a > b { font-size: 10px; }
  .dr88aph[data-view="top"] .dr88aph-top-podium-card { padding-inline: 8px; }
  .dr88aph-top-honor [data-top-honor-title] { font-size: 11px; }
}

@media (max-width: 1100px) {
  .dr88aph[data-view="top"] .dr88aph-top-brief {
    align-self: auto;
  }

  .dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient label:first-child { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
  .dr88aph-top-band-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 7px;
  }

  .dr88aph-top-band-nav a { min-height: 62px; }
  .dr88aph-top-band-nav a + a { border-left-color: rgba(255, 231, 143, 0.26); }

  .dr88aph[data-view="top"] .dr88aph-top-podium {
    grid-template-areas: "first" "second" "third";
    align-items: stretch;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] { min-height: 142px; }

  .dr88aph-prize-dialog .dr88aph-claim-profile-form { padding: 12px; }
  .dr88aph-prize-dialog .dr88aph-claim-group { padding: 12px; }
  .dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient,
  .dr88aph-prize-dialog .dr88aph-claim-grid.is-delivery { grid-template-columns: minmax(0, 1fr); }
  .dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient label:first-child,
  .dr88aph-prize-dialog .dr88aph-claim-grid .is-wide { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph [data-top-honor-motion]::after,
  .dr88aph .dr88aph-top-podium-card::before {
    animation: none !important;
  }
}

/* V1.15: sharper campaign CTA, prestige Top 50 board and concise official rules. */
.dr88aph {
  font-synthesis-weight: none;
}

.dr88aph-header-cta.dr88aph-attention-cta {
  flex: 0 1 276px;
  min-width: 248px;
  padding-inline: 14px;
  border-color: #f0c94d;
  box-shadow: 0 10px 24px rgba(86, 2, 8, 0.27), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  animation: dr88aph-header-cta-glow 2.6s ease-in-out infinite;
}

.dr88aph-header-cta.dr88aph-attention-cta > span {
  min-width: 0;
  font-size: 11px;
  text-align: center;
  white-space: nowrap;
}

.dr88aph-header-cta.dr88aph-attention-cta > .dr88aph-inline-icon {
  display: none;
}

/* Desktop density: both header actions stay within the shared shell before the tablet layout begins. */
@media (min-width: 1101px) and (max-width: 1500px) {
  .dr88aph-header-cta.dr88aph-attention-cta {
    flex-basis: 238px;
    padding-inline: 10px;
  }
}

@media (min-width: 1101px) and (max-width: 1200px) {
  .dr88aph-brand > span {
    display: none;
  }
}

@keyframes dr88aph-header-cta-glow {
  0%, 55%, 100% { box-shadow: 0 10px 24px rgba(86, 2, 8, 0.27), 0 0 0 0 rgba(255, 220, 73, 0); }
  68% { box-shadow: 0 13px 28px rgba(86, 2, 8, 0.34), 0 0 0 5px rgba(255, 220, 73, 0.16); }
  82% { box-shadow: 0 10px 24px rgba(86, 2, 8, 0.27), 0 0 0 2px rgba(255, 220, 73, 0.08); }
}

.dr88aph-home-action {
  border: 2px solid #efc747;
  border-radius: 11px;
  box-shadow: 0 9px 20px rgba(58, 1, 5, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.dr88aph[data-view="home"] .dr88aph-home__actions .dr88aph-primary,
.dr88aph[data-view="home"] .dr88aph-home__actions .dr88aph-secondary {
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0.2) 0 8%, transparent 23% 56%, rgba(255, 213, 89, 0.16) 74%, transparent 88%),
    linear-gradient(145deg, #6d0509 0%, #c8181e 46%, #95090f 72%, #520306 100%);
}

.dr88aph-home__content > .dr88aph-home__conversion-hook,
.dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
  grid-template-columns: 48px minmax(0, 1fr) auto 22px;
  gap: 12px;
  min-height: 64px;
  border-color: #efc747;
  box-shadow: 0 15px 30px rgba(54, 2, 6, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.dr88aph-home__content > .dr88aph-home__conversion-hook:hover {
  box-shadow: 0 18px 34px rgba(54, 2, 6, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.dr88aph-home__content > .dr88aph-home__conversion-hook:active {
  transform: translateY(1px);
  box-shadow: 0 9px 20px rgba(54, 2, 6, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.dr88aph-home__conversion-icon {
  width: 48px;
  height: 44px;
  border-radius: 10px;
  background: linear-gradient(150deg, #fff2a0, #e4b62f 64%, #b87908);
}

.dr88aph-promo-ticket-icon {
  width: 34px;
  height: 34px;
  overflow: visible;
  fill: none;
  stroke: #66060a;
  stroke-width: 1.8;
}

.dr88aph-promo-ticket-icon .is-ticket-shape {
  fill: rgba(255, 252, 224, 0.82);
  stroke: #650509;
}

.dr88aph-promo-ticket-icon .is-ticket-stitch {
  fill: none;
  stroke: #9e6908;
  stroke-dasharray: 2 3;
}

.dr88aph-promo-ticket-icon .is-gift {
  fill: #b90e17;
  stroke: #650509;
}

.dr88aph[data-view="top"] .dr88aph-top-head {
  align-items: center;
  padding-bottom: 13px;
}

.dr88aph[data-view="top"] .dr88aph-top-head h1 {
  color: #73060b;
  letter-spacing: -0.025em;
}

.dr88aph[data-view="top"] [data-top-code-range] {
  min-height: 38px;
  padding-inline: 13px;
  border-color: #e7b930;
  background: linear-gradient(145deg, #8e0910, #520205);
  color: #ffe876;
  font-size: 12px;
  letter-spacing: 0.04em;
}

.dr88aph[data-view="top"] .dr88aph-top-ranking {
  grid-template-columns: minmax(0, 1fr) 294px;
  align-items: stretch;
  gap: 15px;
}

.dr88aph[data-view="top"] .dr88aph-top-board {
  align-self: stretch;
  overflow: clip;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav {
  gap: 7px;
  padding: 8px 0;
  border-bottom-color: rgba(255, 226, 117, 0.2);
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a {
  min-height: 60px;
  height: auto;
  border-width: 1px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span strong,
.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span small,
.dr88aph[data-view="top"] .dr88aph-top-band-nav a > b {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > b {
  font-size: 10px;
  line-height: 12px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium {
  gap: 11px;
  padding: 17px 13px 15px;
  background:
    linear-gradient(90deg, transparent 49.7%, rgba(255, 224, 100, 0.22) 50%, transparent 50.3%),
    radial-gradient(circle at 50% 0, rgba(255, 218, 73, 0.24), transparent 40%),
    linear-gradient(180deg, #210002, #590407);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card {
  min-height: 168px;
  padding: 13px;
  border-radius: 14px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
  min-height: 188px;
  border-color: #f1cf43;
  background:
    radial-gradient(circle at 50% -10%, rgba(255, 229, 104, 0.28), transparent 47%),
    linear-gradient(150deg, #a90e17, #650307 72%);
  box-shadow: 0 0 0 1px rgba(255, 226, 82, 0.25), 0 0 32px rgba(255, 194, 27, 0.3), 0 17px 28px rgba(12, 0, 1, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="2"] {
  border-color: #d7dce4;
  background: linear-gradient(150deg, #771016, #480307 76%);
  box-shadow: 0 0 0 1px rgba(228, 233, 240, 0.12), 0 14px 24px rgba(12, 0, 1, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="3"] {
  border-color: #de9251;
  background: linear-gradient(150deg, #7d2418, #470605 76%);
  box-shadow: 0 0 0 1px rgba(229, 147, 75, 0.12), 0 14px 24px rgba(12, 0, 1, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card .dr88aph-top-rank b {
  height: 72px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  background-image: url("../images/ranking-star-awards-v1.png");
  background-repeat: no-repeat;
  background-position: -50px bottom;
  background-size: 240px 80px;
  box-shadow: none;
  color: transparent;
  font-size: 0;
  filter: drop-shadow(0 7px 8px rgba(0, 0, 0, 0.24));
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-rank b {
  background-position-x: -93px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="3"] .dr88aph-top-rank b {
  background-position-x: -150px;
}

.dr88aph[data-view="top"] .dr88aph-top-honor {
  display: grid;
  align-items: center;
  min-width: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-honor__copy {
  display: grid;
  align-content: center;
  min-width: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-honor__copy small {
  color: #f0c7b7;
  font-size: 10px;
  line-height: 12px;
  letter-spacing: 0.12em;
}

.dr88aph[data-view="top"] .dr88aph-top-honor [data-top-honor-title] {
  overflow: visible;
  color: #ffe879;
  font-size: 12px;
  line-height: 15px;
  text-overflow: clip;
  white-space: normal;
}

.dr88aph[data-view="top"] .dr88aph-top-podium .dr88aph-top-prize {
  min-width: 66px;
  padding: 5px 7px;
  border-color: #dfae2e;
  border-radius: 8px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium .dr88aph-top-prize strong {
  font-size: 17px;
  line-height: 20px;
}

.dr88aph-top-band-panels {
  min-width: 0;
  overflow: visible;
  background: linear-gradient(180deg, #fffaf3, #fffdf9);
}

.dr88aph[data-view="top"] .dr88aph-top-band-panel[hidden],
.dr88aph[data-view="top"] .dr88aph-top-tier-panels[hidden] {
  display: none !important;
}

.dr88aph-top-tier-panels {
  display: grid;
  gap: 10px;
  padding: 10px 0;
  background: linear-gradient(180deg, #fffaf3, #fffdf9);
}

.dr88aph[data-view="top"] .dr88aph-top-tier {
  overflow: hidden;
  border: 1px solid #dfcec3;
  border-radius: 12px;
  background: #fffdf9;
  scroll-margin-top: 96px;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.dr88aph[data-view="top"] .dr88aph-top-tier + .dr88aph-top-tier {
  border-top: 1px solid #dfcec3;
}

.dr88aph[data-view="top"] .dr88aph-top-tier__head {
  position: static;
  min-height: 48px;
  padding: 8px 12px;
  cursor: default;
}

.dr88aph[data-view="top"] .dr88aph-top-tier__head::before {
  display: none;
}

.dr88aph[data-view="top"] .dr88aph-top-tier__head > b {
  margin-right: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-ranks {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 1px;
  overflow: visible;
  background: #eadfd7;
  list-style: none;
}

.dr88aph[data-view="top"] .is-tier-top10 .dr88aph-top-tier-ranks {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank,
.dr88aph[data-view="top"] .dr88aph-top-ladder .dr88aph-top-tier-rank {
  display: grid;
  grid-template-columns: 32px repeat(4, minmax(0, 1fr));
  grid-template-rows: minmax(34px, auto) 24px;
  grid-template-areas:
    "rank member member member member"
    "rank exact corner combo points";
  gap: 0 3px;
  min-width: 0;
  min-height: 66px;
  padding: 6px;
  overflow: hidden;
  border: 0;
  background: #fffdf9;
  color: #343b4a;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank:nth-child(even) {
  background: #fff8ee;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-rank {
  grid-area: rank;
  align-self: center;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-rank b {
  width: 30px;
  height: 30px;
  border-width: 1px;
  border-radius: 9px;
  box-shadow: none;
  font-size: 11px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member {
  grid-area: member;
  align-content: center;
  min-width: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member strong,
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member strong {
  color: #303746;
  font-size: 10px;
  line-height: 13px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member small {
  color: #7a706a;
  font-size: 10px;
  line-height: 11px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(3) { grid-area: exact; }
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(4) { grid-area: corner; }
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(5) { grid-area: combo; }
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points { grid-area: points; }

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(3),
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(4),
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(5),
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points {
  display: grid;
  place-items: center;
  min-width: 0;
  border-radius: 5px;
  background: #f5eee8;
  color: #6b5e58;
  font-size: 10px;
  line-height: 12px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points b {
  color: #b50d15;
  font-size: 10px;
}

.dr88aph[data-view="top"] .is-band-highlighted {
  border-color: #e6b72e;
  box-shadow: 0 0 0 3px rgba(255, 218, 65, 0.18), 0 12px 24px rgba(77, 5, 8, 0.18);
}

.dr88aph[data-view="top"] .dr88aph-top-brief {
  align-self: stretch;
  height: 100%;
  min-height: 0;
  grid-template-rows: auto auto auto auto 1fr;
}

.dr88aph-rules-official {
  display: grid;
  grid-template-columns: auto repeat(3, minmax(0, 1fr)) minmax(150px, 1.15fr);
  align-items: center;
  gap: 0;
  max-width: 100%;
  min-height: 48px;
  margin: 0;
  overflow: hidden;
  border: 1px solid #d9aa31;
  border-radius: 11px;
  background: linear-gradient(105deg, #3d0104, #76060b 58%, #390103);
  box-shadow: 0 8px 18px rgba(58, 2, 6, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.13);
  color: #fff7ea;
}

.dr88aph-rules-official > strong,
.dr88aph-rules-official > span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 8px 10px;
  text-align: center;
}

.dr88aph-rules-official > strong {
  background: #ffe15d;
  color: #620509;
  font-size: 10px;
  line-height: 14px;
  letter-spacing: 0.07em;
}

.dr88aph-rules-official > span {
  gap: 5px;
  border-left: 1px solid rgba(255, 228, 115, 0.2);
  color: #f5dfd6;
  font-size: 10px;
  line-height: 14px;
}

.dr88aph-rules-official > span b {
  color: #ffe35b;
  font-size: 14px;
  line-height: 17px;
  white-space: nowrap;
}

.dr88aph-rules-official > .is-total {
  background: rgba(255, 226, 83, 0.1);
  color: #fff8e7;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow ol {
  width: min(100%, 1050px);
  max-width: 1050px;
  margin: 0 auto;
  margin-inline: auto;
  padding: 0 !important;
  padding-inline-start: 0 !important;
  list-style: none !important;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li {
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  justify-content: center;
  min-height: 64px;
  padding: 8px 12px;
  text-align: left;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li > a,
.dr88aph[data-view="rules"] .dr88aph-rules-flow li > small {
  align-self: center;
  min-width: 0;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li > a {
  line-height: 17px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li > small {
  font-size: 10px;
  line-height: 13px;
}

.dr88aph-rules-compact-cta,
.dr88aph[data-view="rules"] .dr88aph-rules-action.dr88aph-rules-compact-cta {
  width: fit-content;
  max-width: 100%;
  min-height: 42px;
  margin-top: 10px;
  padding: 7px 13px;
  border-color: #edc348;
  border-radius: 9px;
  box-shadow: 0 8px 17px rgba(37, 0, 2, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  font-size: 11px;
  line-height: 15px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-action.dr88aph-rules-compact-cta > .dr88aph-inline-icon {
  margin-left: 3px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-layout {
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, 0.75fr);
  align-items: start;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-formula,
.dr88aph[data-view="rules"] .dr88aph-scoring-order {
  align-self: start;
  padding: 18px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow {
  gap: 7px;
  margin-top: 12px;
  padding: 7px;
  border: 1px solid rgba(255, 226, 117, 0.21);
  border-radius: 11px;
  background: rgba(17, 0, 1, 0.2);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow > div {
  position: relative;
  min-height: 70px;
  padding: 8px 4px;
  border: 1px solid rgba(255, 226, 117, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.045);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow > div + div {
  border-left: 1px solid rgba(255, 226, 117, 0.12);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-flow .is-total {
  border-color: rgba(255, 226, 83, 0.42);
  background: linear-gradient(145deg, rgba(255, 226, 83, 0.25), rgba(255, 255, 255, 0.07));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.dr88aph[data-view="rules"] .dr88aph-scoring-explainer {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  margin-top: 9px;
  padding: 8px 11px;
  border-left: 3px solid #ffe15d;
  border-radius: 0 8px 8px 0;
  background: rgba(255, 226, 83, 0.09);
  color: #f3ddd6;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-explainer strong {
  flex: none;
  color: #ffe56c;
  font-size: 13px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-order ol {
  margin-bottom: 0;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header {
  display: block;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-rewards > header > div {
  display: grid;
  gap: 1px;
}

@media (min-width: 1101px) {
  .dr88aph[data-view="top"] .dr88aph-top-ladder {
    max-height: none;
    overflow: visible;
    scrollbar-gutter: auto;
  }
}

@media (max-width: 1100px) {
  .dr88aph-header-cta.dr88aph-attention-cta {
    flex-basis: 230px;
    min-width: 218px;
    padding-inline: 10px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-ranking {
    grid-template-columns: minmax(0, 1fr);
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief {
    height: auto;
    grid-template-rows: auto;
  }

}

@media (max-width: 1100px) {
  .dr88aph-header-cta.dr88aph-attention-cta {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 285px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-ranks,
  .dr88aph[data-view="top"] .is-tier-top10 .dr88aph-top-tier-ranks {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph-rules-official {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .dr88aph-rules-official > strong {
    grid-column: 1 / -1;
    min-height: 30px;
  }

  .dr88aph-rules-official > span {
    min-height: 42px;
    padding: 6px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 620px) {
  .dr88aph-header__inner {
    gap: 7px;
  }

  .dr88aph-brand > img {
    width: 58px;
    height: 40px;
    padding-inline: 7px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    min-height: 44px;
    padding: 6px 8px;
    gap: 6px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta::before {
    width: 12px;
    flex-basis: 12px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 10px;
    line-height: 13px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta .dr88aph-inline-icon {
    width: 15px;
    height: 15px;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook,
  .dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
    grid-template-columns: 42px minmax(0, 1fr) 20px;
    gap: 9px;
    padding-inline: 11px;
  }

  .dr88aph-home__conversion-icon {
    width: 42px;
    height: 40px;
  }

  .dr88aph-promo-ticket-icon {
    width: 30px;
    height: 30px;
  }

  .dr88aph-home__conversion-prize {
    grid-column: 2;
    padding-left: 0;
    border-left: 0;
    text-align: left;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-inline-icon {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-ranks,
  .dr88aph[data-view="top"] .is-tier-top10 .dr88aph-top-tier-ranks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    min-height: 82px;
    padding: 8px 5px;
    text-align: center;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li > a,
  .dr88aph[data-view="rules"] .dr88aph-rules-flow li > small {
    align-self: center;
  }

  .dr88aph-rules-official {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph-rules-official > span:nth-of-type(3) {
    border-top: 1px solid rgba(255, 228, 115, 0.2);
    border-left: 0;
  }

  .dr88aph-rules-official > span:nth-of-type(4) {
    border-top: 1px solid rgba(255, 228, 115, 0.2);
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }
}

@media (max-width: 390px) {
  .dr88aph-header-cta.dr88aph-attention-cta {
    padding-inline: 6px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta::before,
  .dr88aph-header-cta.dr88aph-attention-cta .dr88aph-inline-icon {
    display: none;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-ranks,
  .dr88aph[data-view="top"] .is-tier-top10 .dr88aph-top-tier-ranks {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph [data-attention-cta] {
    animation: none !important;
  }

  .dr88aph [data-attention-cta]::after,
  .dr88aph [data-top-honor-motion]::after,
  .dr88aph .dr88aph-top-podium-card::before {
    animation: none !important;
    opacity: 0 !important;
  }

  .dr88aph {
    scroll-behavior: auto;
  }
}

/* V1.16: login-first prediction flow and production-safe modal layout. */
.dr88aph-identity-dialog .dr88aph-dialog__close:focus-visible,
.dr88aph-prize-dialog .dr88aph-dialog__close:focus-visible {
  outline: 3px solid #ffe36c;
  outline-offset: 3px;
}

.dr88aph-prize-dialog .dr88aph-claim-profile-form > .dr88aph-primary {
  margin-top: 0;
}

@media (max-width: 680px) {
  .dr88aph-prize-dialog {
    width: calc(100% - 16px);
    max-height: calc(100vh - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 14px;
  }

  .dr88aph-prize-dialog__body {
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    scrollbar-gutter: auto;
  }

  .dr88aph-prize-dialog .dr88aph-claim-profile-form > .dr88aph-primary {
    position: static;
  }
}

@media (max-width: 620px) {
  .dr88aph-identity-dialog__intro {
    margin: -25px -18px 18px;
    padding: 21px 62px 18px 18px;
  }

  .dr88aph-identity-dialog__intro p {
    font-size: 12px;
    line-height: 18px;
  }

  .dr88aph-dialog.is-success .dr88aph-dialog__actions button {
    min-height: 48px;
  }
}

/* V1.17: authoritative typography and mobile composition repair. */
.dr88aph {
  --dr88-type-page: clamp(31px, 3vw, 40px);
  --dr88-type-dialog-title: clamp(25px, 3.3vw, 29px);
  --dr88-type-section: 22px;
  --dr88-type-card: 16px;
  --dr88-type-body: 14px;
  --dr88-type-meta: 12px;
  font-family: var(--dr88-font-ui) !important;
  font-size: 15px;
  line-height: 1.55;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.dr88aph :where(h1, h2, h3) {
  max-width: 100%;
  overflow: visible;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  text-wrap: pretty;
}

.dr88aph :where(time, output, input, .dr88aph-top-rank, .dr88aph-top-prize, .dr88aph-score-input) {
  font-variant-numeric: tabular-nums;
}

.dr88aph-page-head {
  gap: 24px;
  padding-bottom: 16px;
}

.dr88aph-page-head > div:first-child {
  min-width: 0;
}

.dr88aph-page-head h1,
.dr88aph-workspace .dr88aph-page-head h1,
.dr88aph-wheel-page .dr88aph-page-head h1,
.dr88aph-rules-page .dr88aph-page-head h1,
.dr88aph-top-head h1 {
  margin: 0;
  font-size: var(--dr88-type-page);
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: -0.028em;
}

.dr88aph-page-head p,
.dr88aph-workspace .dr88aph-page-head p,
.dr88aph-wheel-page .dr88aph-page-head p,
.dr88aph-rules-page .dr88aph-page-head p,
.dr88aph-top-head p {
  max-width: 68ch;
  margin-top: 6px;
  font-size: var(--dr88-type-body);
  line-height: 1.55;
  letter-spacing: -0.005em;
}

.dr88aph[data-view="top"] .dr88aph-top-head p {
  max-width: none;
  font-size: 13px;
  letter-spacing: -0.012em;
}

.dr88aph-workspace .dr88aph-page-head.is-prediction .dr88aph-prediction-subtitle,
.dr88aph-wheel-page .dr88aph-page-head .dr88aph-wheel-subcopy {
  width: auto;
  max-width: 68ch;
  white-space: normal;
}

.dr88aph-wheel-page .dr88aph-page-head .dr88aph-wheel-subcopy {
  width: max-content;
  max-width: none;
  font-size: 12px;
  white-space: nowrap;
}

.dr88aph-header-cta.dr88aph-attention-cta > span {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.012em;
}

@media (min-width: 1101px) and (max-width: 1500px) {
  .dr88aph-header-cta.dr88aph-attention-cta > span {
    line-height: 14px;
  }
}

.dr88aph-review-launcher,
.dr88aph-rules-compact-cta,
.dr88aph[data-view="rules"] .dr88aph-rules-action.dr88aph-rules-compact-cta {
  font-size: 12px;
  line-height: 17px;
}

.dr88aph-wheel-card__info strong {
  display: -webkit-box;
  min-height: 34px;
  overflow: hidden;
  font-size: 12px;
  line-height: 17px;
  text-overflow: clip;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.dr88aph-wheel-prize-catalog [data-prize-catalog-title] {
  display: -webkit-box;
  min-height: 32px;
  overflow: hidden;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  text-overflow: clip;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item],
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
  grid-template-rows: 44px minmax(32px, auto);
  min-height: 84px;
}

.dr88aph-wheel-prize-catalog > header p {
  font-size: 13px;
  line-height: 19px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span strong {
  font-size: 12px;
  line-height: 16px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span small,
.dr88aph[data-view="top"] .dr88aph-top-band-nav a > b {
  font-size: 10.5px;
  line-height: 14px;
}

.dr88aph[data-view="top"] .dr88aph-top-honor__copy small {
  font-size: 10.5px;
  line-height: 13px;
}

.dr88aph[data-view="top"] .dr88aph-top-honor [data-top-honor-title] {
  font-size: 13px;
  line-height: 17px;
  overflow-wrap: normal;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card .dr88aph-top-member strong {
  font-size: 12.5px;
  line-height: 17px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card .dr88aph-top-member small,
.dr88aph[data-view="top"] .dr88aph-top-podium-metrics dt {
  font-size: 10.5px;
  line-height: 14px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-metrics dd {
  font-size: 13px;
  line-height: 17px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member strong {
  font-size: 11px;
  line-height: 15px;
}

.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member small,
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(3),
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(4),
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(5),
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points,
.dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points b {
  font-size: 10.5px;
  line-height: 14px;
}

.dr88aph[data-view="top"] .dr88aph-top-brief__intro p {
  font-size: 11.5px;
  line-height: 17px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li > a {
  font-size: 14px;
  line-height: 19px;
}

.dr88aph[data-view="rules"] .dr88aph-rules-flow li > small,
.dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact ul,
.dr88aph[data-view="rules"] .dr88aph-policy-grid ol,
.dr88aph[data-view="rules"] .dr88aph-wheel-policy-grid :is(ul, ol) {
  font-size: 12px;
  line-height: 18px;
}

.dr88aph[data-view="rules"] .dr88aph-scoring-explainer,
.dr88aph[data-view="rules"] .dr88aph-scoring-order li {
  font-size: 12px;
  line-height: 18px;
}

@media (max-width: 1100px) {
  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 11px;
  }
}

@media (max-width: 1100px) {
  .dr88aph,
  body.admin-bar .dr88aph {
    --dr88aph-mobile-nav-clearance: calc(96px + env(safe-area-inset-bottom));
  }

  .dr88aph-header,
  body.admin-bar .dr88aph-header {
    position: relative;
    top: auto;
  }

  .dr88aph-main {
    min-height: 0;
    padding: 14px 0 24px;
    scroll-padding-bottom: var(--dr88aph-mobile-nav-clearance);
  }

  .dr88aph-shell {
    width: min(calc(100% - 20px), 760px);
  }

  .dr88aph-header__inner {
    min-height: 66px;
    padding: 9px 11px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    min-height: 48px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 11.5px;
    line-height: 15px;
    white-space: normal;
    text-wrap: balance;
  }

  .dr88aph-main-nav {
    min-height: 68px;
    padding-block: 5px max(5px, env(safe-area-inset-bottom));
  }

  .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph-nav-more {
    min-height: 54px;
    font-size: 13px;
    line-height: 17px;
  }

  .dr88aph-main-nav > .dr88aph-nav-link > span,
  .dr88aph-nav-more > span {
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
  }

  .dr88aph :where([id], [tabindex], a, button) {
    scroll-margin-bottom: var(--dr88aph-mobile-nav-clearance);
  }

  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page,
  .dr88aph-results-page,
  .dr88aph-history-page,
  .dr88aph-top-page {
    min-height: 0;
    padding: 22px;
  }

  .dr88aph-page-head {
    gap: 14px;
    padding-bottom: 16px;
  }

  .dr88aph-page-head h1,
  .dr88aph-workspace .dr88aph-page-head h1,
  .dr88aph-wheel-page .dr88aph-page-head h1,
  .dr88aph-rules-page .dr88aph-page-head h1,
  .dr88aph-top-head h1 {
    font-size: 30px;
    line-height: 1.18;
  }

  .dr88aph-page-head p,
  .dr88aph-workspace .dr88aph-page-head p,
  .dr88aph-wheel-page .dr88aph-page-head p,
  .dr88aph-rules-page .dr88aph-page-head p,
  .dr88aph-top-head p {
    font-size: 14px;
    line-height: 21px;
  }

  .dr88aph-wheel-page .dr88aph-page-head .dr88aph-wheel-subcopy {
    width: auto;
    max-width: 68ch;
    white-space: normal;
  }

  .dr88aph[data-view="top"] .dr88aph-top-head p {
    font-size: 14px;
    letter-spacing: -0.005em;
    white-space: normal;
  }

  .dr88aph-top-head__badges {
    gap: 8px;
  }

  .dr88aph-top-policy-label,
  .dr88aph-top-data-label {
    min-height: 40px;
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-ranking {
    gap: 14px;
    margin-top: 14px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 10px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a {
    min-height: 70px;
    padding: 9px 10px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span strong {
    font-size: 13px;
    line-height: 17px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span small,
  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-ranks,
  .dr88aph[data-view="top"] .is-tier-top10 .dr88aph-top-tier-ranks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > strong {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > span {
    font-size: 11.5px;
    line-height: 16px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li > small,
  .dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact ul,
  .dr88aph[data-view="rules"] .dr88aph-policy-grid ol,
  .dr88aph[data-view="rules"] .dr88aph-wheel-policy-grid :is(ul, ol) {
    font-size: 13px;
    line-height: 20px;
  }
}

@media (max-width: 680px) {
  .dr88aph-shell {
    width: min(calc(100% - 16px), 640px);
  }

  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page,
  .dr88aph-results-page,
  .dr88aph-history-page,
  .dr88aph-top-page {
    padding: 17px;
    border-radius: 16px;
  }

  .dr88aph-page-head {
    gap: 12px;
    padding-bottom: 15px;
  }

  .dr88aph-page-head h1,
  .dr88aph-workspace .dr88aph-page-head h1,
  .dr88aph-wheel-page .dr88aph-page-head h1,
  .dr88aph-rules-page .dr88aph-page-head h1,
  .dr88aph-top-head h1 {
    font-size: 28px;
    line-height: 1.2;
    letter-spacing: -0.026em;
  }

  .dr88aph-page-head p,
  .dr88aph-workspace .dr88aph-page-head p,
  .dr88aph-wheel-page .dr88aph-page-head p,
  .dr88aph-rules-page .dr88aph-page-head p,
  .dr88aph-top-head p {
    margin-top: 5px;
    font-size: 14px;
    line-height: 21px;
  }

  .dr88aph-header__inner {
    gap: 8px;
  }

  .dr88aph-brand > img {
    width: 60px;
    height: 42px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    padding-inline: 9px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 11px;
    line-height: 14px;
  }

  .dr88aph-home__poster,
  .dr88aph-home__poster img {
    height: 250px;
    min-height: 250px;
  }

  .dr88aph-home__poster img {
    object-position: center 25%;
  }

  .dr88aph-home__content {
    padding: 22px 18px 20px;
  }

  .dr88aph-home h1 {
    margin-top: 19px;
    font-size: 32px;
    line-height: 1.12;
    letter-spacing: -0.032em;
  }

  .dr88aph-home__content > .dr88aph-home__lead {
    margin-top: 11px;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
  }

  .dr88aph-next-match {
    gap: 13px;
    margin-top: 18px;
    padding: 15px;
  }

  .dr88aph-next-match time {
    font-size: 14px;
    line-height: 20px;
  }

  .dr88aph-next-match .dr88aph-team strong {
    font-size: 13px;
    line-height: 18px;
  }

  .dr88aph-home__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .dr88aph-home__actions .dr88aph-primary {
    grid-column: 1 / -1;
  }

  .dr88aph-home__actions .dr88aph-primary,
  .dr88aph-home__actions .dr88aph-secondary {
    min-height: 48px;
    padding-inline: 10px;
    font-size: 12.5px;
    line-height: 17px;
  }

  .dr88aph-home__actions > a,
  .dr88aph-home__actions > a > span {
    white-space: normal;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook,
  .dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    align-content: center;
    column-gap: 8px;
    row-gap: 2px;
  }

  .dr88aph-home__conversion-icon {
    width: 38px;
    height: 38px;
  }

  .dr88aph-promo-ticket-icon {
    width: 28px;
    height: 28px;
  }

  .dr88aph-home__conversion-copy {
    gap: 2px;
  }

  .dr88aph-home__conversion-copy strong {
    font-size: 12px;
    line-height: 15px;
  }

  .dr88aph-home__conversion-copy small {
    font-size: 10px;
    line-height: 13px;
  }

  .dr88aph-home__conversion-prize {
    display: flex !important;
    align-items: baseline;
    gap: 4px;
    min-width: 0;
    white-space: nowrap;
  }

  .dr88aph-home__conversion-prize small,
  .dr88aph-home__conversion-prize strong {
    font-size: 10px;
    line-height: 13px;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-inline-icon {
    width: 18px;
    height: 18px;
  }

  .dr88aph[data-view="home"] .dr88aph-trust [data-stat-label],
  .dr88aph[data-view="home"] .dr88aph-trust .dr88aph-home__reward-copy {
    font-size: 11px;
    line-height: 16px;
    letter-spacing: 0;
  }

  .dr88aph-home__schedule {
    padding: 0 16px 20px;
  }

  .dr88aph[data-view="home"] .dr88aph-home__schedule > .dr88aph-home__schedule-icon {
    display: none;
  }

  .dr88aph[data-view="home"] .dr88aph-fixture-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final {
    grid-column: 2;
    border-color: var(--dr88-gold-deep) !important;
    background: linear-gradient(145deg, #fff8d8 0%, #ffe28a 55%, #f4c94f 100%) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 6px 14px rgba(111, 66, 4, 0.18) !important;
    color: #5f090d !important;
  }

  .dr88aph[data-view="home"] .dr88aph-final-label-short { display: none; }
  .dr88aph[data-view="home"] .dr88aph-final-label-long {
    display: inline;
    font-weight: 900;
    letter-spacing: 0.02em;
  }
  .dr88aph[data-view="home"] .dr88aph-final-separator { display: none; }

  .dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final time > [aria-hidden="true"] {
    display: grid;
    justify-items: center;
    line-height: 13px;
  }

  .dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final .dr88aph-finalists {
    color: #5f090d;
  }

  .dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final .dr88aph-finalists i {
    color: #7a4b00 !important;
  }

  .dr88aph[data-view="home"] .dr88aph-fixture-tab time {
    font-size: 10.5px;
    line-height: 14px;
  }

  .dr88aph-workspace .dr88aph-page-head .dr88aph-text-link {
    display: inline-flex;
    min-height: 44px;
    font-size: 12.5px;
  }

  .dr88aph-match-toolbar .dr88aph-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
  }

  .dr88aph-match-toolbar .dr88aph-filters a {
    min-width: 0;
    padding-inline: 5px;
    font-size: 12px;
    line-height: 17px;
  }

  .dr88aph-match.is-compact {
    padding: 13px;
  }

  .dr88aph-match.is-compact .dr88aph-match__meta > span:first-child,
  .dr88aph-match.is-compact .dr88aph-match__time time,
  .dr88aph-match.is-compact .dr88aph-corners legend b,
  .dr88aph-match.is-compact > .dr88aph-primary {
    font-size: 12.5px;
    line-height: 17px;
  }

  .dr88aph-match.is-compact .dr88aph-status,
  .dr88aph-match.is-compact .dr88aph-match__time small,
  .dr88aph-match.is-compact .dr88aph-countdown,
  .dr88aph-match.is-compact .dr88aph-corners legend small,
  .dr88aph-match.is-compact .dr88aph-submit-meta,
  .dr88aph-match.is-compact .dr88aph-field-error,
  .dr88aph-match.is-compact .dr88aph-card-status {
    font-size: 10.5px;
    line-height: 15px;
  }

  .dr88aph-match.is-compact .dr88aph-team strong,
  .dr88aph-match.is-compact .dr88aph-corners label b {
    font-size: 12px;
    line-height: 17px;
  }

  .dr88aph-match.is-compact .dr88aph-corners label em {
    font-size: 11px;
    line-height: 16px;
  }

  .dr88aph-workspace-note {
    font-size: 10.5px;
    line-height: 16px;
  }

  .dr88aph-wheel-head p,
  .dr88aph-wheel-page .dr88aph-page-head .dr88aph-wheel-subcopy {
    display: block;
    font-size: 13.5px;
    line-height: 20px;
  }

  .dr88aph-wheel-console {
    padding: 16px;
  }

  .dr88aph-wheel-console > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    justify-content: stretch;
    width: 100%;
    gap: 7px;
    margin-bottom: 12px;
    text-align: center;
  }

  .dr88aph-wheel-console > header h2 {
    margin: 0;
    font-size: 20px;
    line-height: 25px;
    white-space: nowrap;
  }

  .dr88aph-wheel-console > header > b,
  .dr88aph-wheel-card__info small {
    font-size: 11.5px;
    line-height: 17px;
  }

  .dr88aph-wheel-disclaimer {
    font-size: 12px;
    line-height: 18px;
  }

  .dr88aph-wheel-card__info strong {
    min-height: 36px;
    font-size: 12.5px;
    line-height: 18px;
  }

  .dr88aph-slot-cta {
    min-height: 52px;
    font-size: 12.5px;
    line-height: 17px;
    white-space: normal;
  }

  .dr88aph-wheel-actions p {
    width: 100%;
    padding: 1px 8px 0;
    color: #f3dfbd;
    font-size: 11.5px;
    font-weight: 650;
    line-height: 18px;
    text-align: center;
    text-wrap: balance;
  }

  .dr88aph-wheel-prize-catalog {
    padding: 16px;
  }

  .dr88aph-wheel-prize-catalog > header {
    align-items: flex-start;
    gap: 10px;
  }

  .dr88aph-wheel-prize-catalog > header h2 {
    font-size: 21px;
    line-height: 27px;
  }

  .dr88aph-wheel-prize-catalog > header p {
    font-size: 13px;
    line-height: 19px;
  }

  .dr88aph-wheel-prize-catalog > header > span {
    font-size: 10.5px;
    line-height: 15px;
  }

  .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item],
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
    grid-template-rows: 58px minmax(36px, auto);
    min-height: 108px;
    padding: 8px 7px;
  }

  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual],
  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual {
    height: 58px;
  }

  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual svg,
  .dr88aph .dr88aph-wheel-prize-catalog [data-prize-catalog-visual] .dr88aph-wheel-card__visual img {
    width: 54px;
    height: 54px;
  }

  .dr88aph-wheel-prize-catalog [data-prize-catalog-title] {
    min-height: 34px;
    font-size: 11.5px;
    line-height: 16px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-page {
    padding-bottom: 18px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-head {
    gap: 12px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-head__badges {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="top"] .dr88aph-top-head__badges > * {
    width: 100%;
  }

  .dr88aph[data-view="top"] .dr88aph-top-board > header {
    gap: 12px;
    padding: 12px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-board > header h2 {
    font-size: 20px;
    line-height: 26px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-board .dr88aph-filters a {
    font-size: 11.5px;
    line-height: 16px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium__head {
    align-items: flex-start;
    padding: 11px 13px 7px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium__head span {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium__head small {
    font-size: 11px;
    line-height: 16px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    padding: 12px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    grid-template-areas: "podium-head" "podium-member" "podium-metrics";
    align-content: start;
    gap: 12px;
    min-height: 0;
    padding: 14px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"],
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="2"],
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="3"] {
    grid-area: auto;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card__head {
    grid-area: podium-head;
    align-items: center;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card > .dr88aph-top-member {
    grid-area: podium-member;
    min-width: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card > .dr88aph-top-member strong,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card > .dr88aph-top-member small {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card > .dr88aph-top-member strong {
    font-size: 14px;
    line-height: 19px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card > .dr88aph-top-member small {
    font-size: 11.5px;
    line-height: 17px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-honor {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 10px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-honor [data-top-honor-title] {
    font-size: 14px;
    line-height: 18px;
    white-space: normal;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-metrics {
    grid-area: podium-metrics;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-metrics > div {
    min-height: 52px;
    padding: 7px 3px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-metrics dt {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-metrics dd {
    font-size: 14px;
    line-height: 18px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier__head {
    min-height: 58px;
    padding: 10px 12px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier__head small {
    font-size: 10.5px;
    line-height: 14px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier__head strong,
  .dr88aph[data-view="top"] .dr88aph-top-tier__head > b {
    font-size: 13px;
    line-height: 18px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-ranks,
  .dr88aph[data-view="top"] .is-tier-top10 .dr88aph-top-tier-ranks {
    grid-template-columns: minmax(0, 1fr);
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-rank,
  .dr88aph[data-view="top"] .dr88aph-top-ladder .dr88aph-top-tier-rank {
    grid-template-columns: 38px repeat(3, minmax(0, 1fr)) 52px;
    grid-template-rows: minmax(42px, auto) 30px;
    min-height: 78px;
    padding: 8px;
    gap: 0 5px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-rank b {
    width: 34px;
    height: 34px;
    font-size: 12px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member strong {
    font-size: 12.5px;
    line-height: 17px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-member small,
  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(3),
  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(4),
  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > span:nth-child(5),
  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points,
  .dr88aph[data-view="top"] .dr88aph-top-tier-rank > .dr88aph-top-points b {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief {
    height: auto;
    min-height: 0;
    padding: 17px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief h2 {
    font-size: 22px;
    line-height: 28px;
    white-space: normal;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__intro p,
  .dr88aph[data-view="top"] .dr88aph-top-score-rules dd,
  .dr88aph[data-view="top"] .dr88aph-top-tiebreak {
    font-size: 12px;
    line-height: 18px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-tiebreak p {
    font-size: 11.5px;
    line-height: 17px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-board__note {
    font-size: 11.5px;
    line-height: 17px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__intro > span,
  .dr88aph[data-view="top"] .dr88aph-top-tiebreak strong {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-score-rules > div {
    min-height: 78px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-score-rules dt {
    font-size: 28px;
    line-height: 33px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__actions .dr88aph-primary {
    min-height: 48px;
    font-size: 13px;
    line-height: 18px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__actions .dr88aph-text-link {
    font-size: 12px;
    line-height: 17px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 12px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > strong {
    grid-column: 1 / -1;
    min-height: 38px;
    font-size: 11.5px;
    line-height: 16px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > span {
    min-height: 54px;
    padding: 8px;
    font-size: 12px;
    line-height: 17px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-official > span b {
    font-size: 16px;
    line-height: 20px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow ol {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li {
    grid-template-columns: 40px minmax(0, 1fr);
    grid-template-rows: auto auto;
    justify-items: stretch;
    min-height: 64px;
    padding: 9px 12px;
    border: 1px solid #ead7c9;
    border-radius: 10px;
    text-align: left;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li + li {
    border-left: 1px solid #ead7c9;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li::before {
    grid-row: 1 / span 2;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li > a {
    font-size: 14px;
    line-height: 19px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-flow li > small {
    font-size: 12px;
    line-height: 17px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-subnav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 5px;
    border-radius: 12px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-subnav a {
    min-height: 44px;
    padding: 8px 7px;
    border-radius: 9px;
    font-size: 12.5px;
    line-height: 17px;
    white-space: normal;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-stage-head {
    gap: 8px;
    padding: 14px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-stage-head h2 {
    font-size: 21px;
    line-height: 27px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-stage-head p {
    font-size: 12.5px;
    line-height: 18px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rule-summary {
    gap: 0;
    padding: 0 14px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rule-summary > div {
    min-height: 76px;
    padding-block: 12px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rule-summary strong {
    font-size: 14px;
    line-height: 19px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rule-summary small {
    font-size: 12.5px;
    line-height: 18px;
  }

  .dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact {
    padding: 15px;
  }

  .dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact h2 {
    font-size: 13px;
    line-height: 18px;
  }

  .dr88aph[data-view="rules"] .dr88aph-live-rules.is-compact ul,
  .dr88aph[data-view="rules"] .dr88aph-policy-grid ol,
  .dr88aph[data-view="rules"] .dr88aph-wheel-policy-grid :is(ul, ol) {
    font-size: 15px;
    line-height: 23px;
  }

  .dr88aph-rules-compact-cta,
  .dr88aph[data-view="rules"] .dr88aph-rules-action.dr88aph-rules-compact-cta {
    min-height: 44px;
    padding: 8px 13px;
    font-size: 14px;
    line-height: 20px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-formula,
  .dr88aph[data-view="rules"] .dr88aph-scoring-order,
  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards {
    padding: 16px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-formula h2,
  .dr88aph[data-view="rules"] .dr88aph-scoring-order h2,
  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards h2 {
    font-size: 19px;
    line-height: 25px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-flow dd,
  .dr88aph[data-view="rules"] .dr88aph-scoring-order li,
  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer {
    font-size: 12.5px;
    line-height: 18px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-explainer {
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 12px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards small {
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-rewards strong {
    font-size: 16px;
    line-height: 21px;
  }

  .dr88aph-results-page .dr88aph-segmented,
  .dr88aph-history-page .dr88aph-segmented {
    margin-top: 2px;
  }

  .dr88aph-segmented a {
    min-height: 44px;
    font-size: 13px;
    line-height: 18px;
  }

  .dr88aph-empty {
    min-height: 220px;
    padding: 28px 18px;
  }

  .dr88aph-empty h2,
  .dr88aph-member-gate h2 {
    font-size: 21px;
    line-height: 28px;
  }

  .dr88aph-empty p,
  .dr88aph-member-gate p {
    font-size: 14px;
    line-height: 21px;
  }

  .dr88aph-page-head__actions {
    align-items: stretch;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    gap: 8px;
  }

  .dr88aph-page-head__actions > * {
    min-height: 44px;
  }

  .dr88aph-footer p,
  .dr88aph-footer span {
    font-size: 12px;
    line-height: 18px;
  }
}

@media (max-width: 390px) {
  .dr88aph-shell {
    width: calc(100% - 14px);
  }

  .dr88aph-header__inner {
    min-height: 64px;
    padding-inline: 8px;
  }

  .dr88aph-brand > img {
    width: 56px;
    height: 40px;
    padding-inline: 6px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    padding-inline: 7px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 12px;
    line-height: 15px;
  }

  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page,
  .dr88aph-results-page,
  .dr88aph-history-page,
  .dr88aph-top-page {
    padding: 15px;
  }

  .dr88aph-page-head h1,
  .dr88aph-workspace .dr88aph-page-head h1,
  .dr88aph-wheel-page .dr88aph-page-head h1,
  .dr88aph-rules-page .dr88aph-page-head h1,
  .dr88aph-top-head h1 {
    font-size: 27px;
    line-height: 1.2;
  }

  .dr88aph-home h1 {
    font-size: 30px;
  }

  .dr88aph-home__content {
    padding-inline: 16px;
  }

  .dr88aph-home__actions .dr88aph-primary,
  .dr88aph-home__actions .dr88aph-secondary {
    font-size: 12px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav {
    gap: 6px;
    padding: 8px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 0 7px;
    min-height: 68px;
    padding: 8px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav__mark {
    width: 36px;
    height: 36px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span strong {
    font-size: 12px;
    line-height: 16px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span small,
  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b {
    font-size: 10.5px;
    line-height: 14px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
    padding: 13px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium .dr88aph-top-prize {
    min-width: 70px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium .dr88aph-top-prize strong {
    font-size: 18px;
    line-height: 22px;
  }

  .dr88aph[data-view="rules"] .dr88aph-rules-page {
    padding: 14px;
  }

  .dr88aph-wheel-prize-catalog {
    padding: 14px;
  }

  .dr88aph-wheel-prize-catalog > header {
    flex-direction: column;
  }

  .dr88aph-wheel-prize-catalog > header > span {
    align-self: flex-start;
  }
}

@media (max-width: 340px) {
  .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph-nav-more {
    min-height: 58px;
    font-size: 12px;
    line-height: 15px;
    white-space: normal;
  }

  .dr88aph-main-nav > .dr88aph-nav-link > span,
  .dr88aph-nav-more > span {
    text-align: center;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 12px;
  }

  .dr88aph-home h1 {
    font-size: 28px;
  }

  .dr88aph-home__actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .dr88aph-home__actions .dr88aph-primary {
    grid-column: auto;
  }

  .dr88aph-match-toolbar .dr88aph-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav {
    grid-template-columns: minmax(0, 1fr);
  }

  .dr88aph-wheel-prize-catalog > div {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Wheel rules: restrained wine-and-champagne presentation for desktop. */
@media (min-width: 1101px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rules {
    gap: 16px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rules .dr88aph-beta-banner {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 2px 14px;
    padding: 13px 16px;
    border: 1px solid rgba(213, 169, 79, 0.55);
    background: linear-gradient(110deg, #a70d16, #76070d);
    box-shadow: 0 12px 28px rgba(126, 5, 13, 0.18);
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rules .dr88aph-beta-banner > span {
    grid-row: 1 / span 2;
    padding: 6px 9px;
    border: 1px solid rgba(255, 226, 123, 0.34);
    background: #d31c27;
    color: #ffe58a;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rules .dr88aph-beta-banner > strong {
    color: #f5d77d;
    letter-spacing: 0.035em;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rules .dr88aph-beta-banner > p {
    color: #e7d6d2;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs {
    gap: 0;
    padding: 5px;
    border: 1px solid rgba(211, 168, 77, 0.58);
    border-radius: 15px;
    background: linear-gradient(105deg, #8f0911, #5e050a);
    box-shadow: 0 14px 32px rgba(113, 4, 11, 0.18);
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a {
    position: relative;
    display: flex;
    min-height: 72px;
    padding: 12px 18px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    box-shadow: none;
    color: #fff8f0;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a + a::before {
    content: "";
    position: absolute;
    top: 15px;
    bottom: 15px;
    left: 0;
    width: 1px;
    background: rgba(245, 211, 116, 0.2);
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a:hover,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a:focus-visible {
    transform: none;
    background: rgba(255, 255, 255, 0.065);
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a.is-active {
    background: linear-gradient(135deg, #e32631, #b70d17);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.18);
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a.is-active::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: 9px;
    left: 18px;
    height: 2px;
    border-radius: 2px;
    background: #e8bd58;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a.is-active + a::before,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a.is-active::before {
    opacity: 0;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__number,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__arrow {
    display: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__copy {
    width: 100%;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__copy strong {
    color: inherit;
    font-size: 14px;
    line-height: 19px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__copy small,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a.is-active .dr88aph-wheel-rule-tab__copy small {
    display: block;
    margin-top: 3px;
    overflow: visible;
    color: #d9c4bf;
    font-size: 10.5px;
    font-weight: 600;
    line-height: 15px;
    white-space: normal;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a.is-active .dr88aph-wheel-rule-tab__copy small {
    color: #f8ddbb;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid,
  .dr88aph[data-view="wheel"] .dr88aph-live-rules,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog,
  .dr88aph[data-view="wheel"] .dr88aph-claim-card {
    border: 1px solid #e4d3c6;
    border-radius: 14px;
    background: #fffdf9;
    box-shadow: 0 12px 30px rgba(70, 25, 16, 0.08);
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel > div {
    min-height: 104px;
    padding: 17px 16px;
    border: 1px solid #ead2bd;
    border-radius: 13px;
    background: linear-gradient(145deg, #fffefb, #fff3e8);
    box-shadow: 0 9px 22px rgba(112, 39, 22, 0.09);
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel > div + div {
    border-left: 1px solid #ead2bd;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel b {
    border: 1px solid #d8b65a;
    background: linear-gradient(145deg, #d9212c, #a50b13);
    color: #f6d878;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules {
    padding: 22px;
    background: linear-gradient(115deg, #fff9ed, #fffdfa);
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules h2,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid h2,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header h2,
  .dr88aph[data-view="wheel"] .dr88aph-claim-card h2 {
    color: #4a0509;
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules li,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid li {
    position: relative;
    min-height: 52px;
    padding: 12px 14px 12px 46px;
    border: 1px solid #ead6c3;
    border-radius: 12px;
    background: #fffdf9;
    box-shadow: 0 7px 18px rgba(91, 28, 16, 0.07);
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules ul,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid ul {
    counter-reset: dr88-wheel-rule-item;
    list-style: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules li::before,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid li::before {
    content: counter(dr88-wheel-rule-item, decimal-leading-zero);
    position: absolute;
    top: 50%;
    left: 12px;
    display: grid;
    place-items: center;
    width: 25px;
    height: 25px;
    transform: translateY(-50%);
    border-radius: 8px;
    background: #cf1722;
    color: #fff5d7;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    counter-increment: dr88-wheel-rule-item;
  }

  .dr88aph[data-view="wheel"] .dr88aph-live-rules strong {
    display: inline-flex;
    margin-left: 3px;
    padding: 2px 7px;
    border-radius: 7px;
    background: #fff0b8;
    color: #a50810;
    font-weight: 900;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid {
    gap: 12px;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid > section {
    padding: 22px;
    border: 1px solid #e6cfba;
    border-radius: 14px;
    background: linear-gradient(150deg, #fffdf9, #fff6ec);
    box-shadow: 0 10px 26px rgba(93, 28, 15, 0.08);
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid > section + section {
    border-left: 1px solid #e6cfba;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-policy-grid ul {
    gap: 7px;
    padding-left: 0;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog {
    padding: 20px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header {
    padding-bottom: 14px;
    border-bottom: 1px solid #e8ddd5;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > header > span {
    border: 1px solid rgba(231, 190, 83, 0.55);
    background: #4a0509;
    color: #f6dc82;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div {
    gap: 9px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item] {
    border-color: #eadfd5;
    background: #faf5ef;
    box-shadow: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog > div > [data-prize-catalog-item]:first-child {
    border-color: #d6ad43;
    background: #fff8df;
  }

  .dr88aph[data-view="wheel"] .dr88aph-claim-card {
    overflow: hidden;
  }

  .dr88aph[data-view="wheel"] .dr88aph-claim-card > header {
    border-bottom: 1px solid #e8ddd5;
    background: #faf4ed;
  }
}

/* V1.18: native typography and a collision-free prize reel. */
.dr88aph,
.dr88aph * {
  font-family: var(--dr88-font-ui) !important;
}

.dr88aph-main {
  scroll-margin-top: 76px;
}

body.admin-bar .dr88aph-main {
  scroll-margin-top: 108px;
}

.dr88aph-wheel-card {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: stretch;
  justify-content: stretch;
  overflow: hidden;
}

.dr88aph-wheel-card > .dr88aph-wheel-card__visual,
.dr88aph-wheel-card > .dr88aph-wheel-card__visual.has-prize-image {
  position: relative;
  inset: auto;
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 6px 10px 0;
}

.dr88aph-wheel-card > .dr88aph-wheel-card__visual .dr88aph-prize-image-crop {
  width: min(100%, 134px);
  height: 100%;
  min-height: 0;
}

.dr88aph-wheel-card > .dr88aph-wheel-card__info {
  align-self: end;
  min-height: 67px;
  padding: 7px 10px 8px;
}

.dr88aph-wheel-card > .dr88aph-wheel-card__info strong {
  min-height: 34px;
}

@media (min-width: 1101px) {
  .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph-main-nav > .dr88aph-nav-overflow > .dr88aph-nav-link {
    padding-inline: 9px;
    font-size: 13px;
    white-space: nowrap;
  }

  .dr88aph[data-view="wheel"] .dr88aph-main {
    align-items: start;
    padding-block: 12px 36px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-page {
    padding: 20px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-page .dr88aph-page-head {
    padding-bottom: 14px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-subnav {
    margin-block: 12px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-console {
    padding: 14px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-console > header {
    margin-bottom: 10px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-stage {
    height: 196px;
    padding-block: 10px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-card {
    flex-basis: 188px;
    height: 174px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions {
    margin-top: 10px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions p {
    display: block;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-disclaimer {
    margin-top: 8px;
    padding-top: 7px;
  }
}

/* Navigation icon suite and a finished brand footer. */
.dr88aph-main-nav .dr88aph-nav-icon {
  flex: 0 0 auto;
  overflow: visible;
  stroke: currentColor;
  vector-effect: non-scaling-stroke;
}

.dr88aph-footer {
  border-top: 1px solid rgba(241, 203, 104, 0.42);
  background:
    radial-gradient(circle at 12% 0%, rgba(190, 39, 36, 0.3), transparent 36%),
    linear-gradient(112deg, #310003, #5f070d 58%, #3b0105);
  color: #f8ead1;
}

.dr88aph-footer > .dr88aph-shell {
  display: grid;
  grid-template-columns: minmax(230px, 1fr) minmax(250px, 1fr);
  align-items: center;
  gap: 24px 36px;
}

.dr88aph-footer__trust > span {
  display: grid;
  gap: 2px;
}

.dr88aph-footer__trust small {
  color: #d9b9ad;
  font-size: 11px;
  line-height: 16px;
}

.dr88aph-footer__trust {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  min-height: 62px;
  padding: 11px 14px;
  border: 1px solid rgba(239, 202, 104, 0.36);
  border-radius: 12px;
  background: rgba(31, 0, 2, 0.3);
  justify-self: stretch;
}

.dr88aph-footer__trust > svg {
  width: 28px;
  height: 28px;
  color: #f0c95f;
}

.dr88aph-footer__trust strong {
  color: #fff1c7;
  font-size: 12px;
  font-weight: 850;
  line-height: 17px;
}

.dr88aph-footer__base {
  display: flex;
  align-items: center;
  justify-content: stretch;
  min-width: 0;
}

.dr88aph-footer__support {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  box-sizing: border-box;
  width: 100%;
  min-height: 62px;
  padding: 8px 12px;
  border: 1px solid rgba(241, 203, 104, 0.58);
  border-radius: 12px;
  background: linear-gradient(135deg, #5f070d, #310003);
  color: #fff8e7;
  text-align: left;
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.dr88aph-footer__support-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #229ed9;
  color: #fff;
}

.dr88aph-footer__support-icon svg {
  width: 21px;
  height: 21px;
}

.dr88aph-footer__support-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.dr88aph-footer__support-copy strong {
  color: #fff8e7;
  font-size: 13px;
  font-weight: 850;
  line-height: 17px;
}

.dr88aph-footer__support-copy small {
  color: #efd477;
  font-size: 11px;
  font-weight: 700;
  line-height: 15px;
}

.dr88aph-footer__support-arrow {
  display: grid;
  place-items: center;
  color: #f0c95f;
}

.dr88aph-footer__support-arrow svg {
  width: 18px;
  height: 18px;
}

@media (hover: hover) and (pointer: fine) {
  .dr88aph-footer__support:hover {
    transform: translateY(-2px);
    border-color: #f0c95f;
    background: linear-gradient(135deg, #7c070d, #5f070d);
    color: #fff;
  }
}

.dr88aph-footer__support:focus-visible {
  outline: 3px solid #f6cf61;
  outline-offset: 3px;
}

@media (max-width: 680px) {
  .dr88aph .dr88aph-main-nav {
    min-height: 72px;
    padding: 6px 2px max(6px, env(safe-area-inset-bottom));
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link {
    grid-template-rows: 20px 24px;
    align-content: center;
    justify-items: center;
    gap: 3px;
    min-height: 60px;
    padding: 5px 1px;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > span {
    display: grid;
    place-items: center;
    font-weight: 800;
  }

  .dr88aph-footer > .dr88aph-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    width: min(calc(100% - 36px), 430px);
  }

  .dr88aph-footer__trust {
    width: 100%;
    min-height: 54px;
    padding: 8px 12px;
    justify-self: stretch;
  }

  .dr88aph-footer__base {
    width: 100%;
  }

  .dr88aph-footer__support {
    width: 100%;
  }
}

@media (max-width: 350px) {

}

@media (max-width: 1100px) {
  .dr88aph-main,
  body.admin-bar .dr88aph-main {
    scroll-margin-top: 0;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-stage {
    height: 204px;
    padding-block: 10px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-card {
    flex-basis: 170px;
    height: 180px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-card > .dr88aph-wheel-card__info {
    min-height: 77px;
  }
}

@media (min-width: 1101px) {
  .dr88aph[data-view="rules"] .dr88aph-scoring-order {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    align-self: stretch;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-order ol {
    display: grid;
    grid-template-rows: repeat(3, minmax(48px, 1fr));
    align-content: stretch;
    margin: 10px 0 0;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-order li {
    align-content: center;
    min-height: 48px;
    padding-block: 8px;
  }

  .dr88aph[data-view="rules"] .dr88aph-scoring-order .dr88aph-rules-compact-cta {
    width: auto;
    justify-self: stretch;
    justify-content: center;
    margin-top: 12px;
  }
}

/* Top podium hierarchy: honor first, player and reward together, performance last. */
.dr88aph[data-view="top"] .dr88aph-top-band-nav a {
  grid-template-columns: 36px minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  gap: 1px 6px;
  padding-inline: 7px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav__mark {
  grid-row: 1 / span 2;
  width: 36px;
  height: 36px;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) {
  display: contents;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) > strong {
  grid-column: 2 / 4;
  grid-row: 1;
  align-self: end;
  min-width: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) > small {
  grid-column: 2;
  grid-row: 2;
  align-self: center;
  min-width: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket {
  grid-column: 3;
  grid-row: 2;
  align-self: center;
  justify-self: end;
  margin: 0;
}

@media (min-width: 1101px) {
  .dr88aph[data-view="top"] .dr88aph-top-band-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a {
    grid-template-columns: 32px minmax(0, 1fr) auto;
    gap: 1px 4px;
    padding-inline: 5px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav__mark {
    width: 32px;
    height: 32px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) > small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (min-width: 521px) {
  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket {
    min-width: 62px;
    padding-inline: 7px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket.is-range {
    min-width: 78px;
    font-size: 10px;
  }
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card__head {
  grid-template-columns: minmax(0, 1fr);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card .dr88aph-top-rank b {
  width: 40px;
  height: 80px;
  background-position-y: top;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-rank b {
  width: 52px;
  background-position-x: -88px;
}

.dr88aph[data-view="top"] .dr88aph-top-honor {
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 9px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] .dr88aph-top-honor {
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 8px;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card__reward {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 230, 151, 0.16);
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member {
  display: grid;
  align-content: center;
  min-width: 0;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member strong,
.dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-prize {
  align-self: center;
  justify-self: end;
  margin: 0;
}

@media (max-width: 1100px) {
  .dr88aph[data-view="top"] .dr88aph-top-podium-card,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card[data-top-rank="1"] {
    grid-template-areas: "podium-head" "podium-reward" "podium-metrics";
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card__reward {
    grid-area: podium-reward;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member strong,
  .dr88aph[data-view="top"] .dr88aph-top-podium-card__reward .dr88aph-top-member small {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }
}

@media (max-width: 520px) {
  .dr88aph[data-view="top"] .dr88aph-top-band-nav a {
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 1px 7px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    align-self: end;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) > strong,
  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > span:not(.dr88aph-top-band-nav__mark) > small {
    grid-column: auto;
    grid-row: auto;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav__mark {
    grid-row: 1 / span 2;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav a > b.dr88aph-code-ticket {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
  }
}

@media (min-width: 1101px) {
  .dr88aph[data-view="top"] .dr88aph-top-ranking {
    align-items: start;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief {
    position: sticky;
    top: 82px;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    align-self: start;
    height: auto;
    min-height: 0;
    grid-template-rows: repeat(5, auto);
    align-content: start;
    row-gap: 24px;
  }

  body.admin-bar .dr88aph[data-view="top"] .dr88aph-top-brief {
    top: 114px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-score-rules,
  .dr88aph[data-view="top"] .dr88aph-top-tiebreak,
  .dr88aph[data-view="top"] .dr88aph-top-code-delivery,
  .dr88aph[data-view="top"] .dr88aph-top-brief__actions {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-top: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__actions .dr88aph-primary {
    box-sizing: border-box;
    max-width: 100%;
  }

  .dr88aph[data-view="top"] .dr88aph-top-brief__actions {
    align-self: auto;
  }
}

/* Authoritative history composition after legacy review and responsive layers. */
.dr88aph-history-page {
  padding: 0;
}

.dr88aph-history-page.is-review-preview .dr88aph-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  margin: 0 0 18px;
  border-radius: 0 0 14px 14px;
  background: linear-gradient(110deg, #4b0508, #710a0f 56%, #430205);
  box-shadow: 0 13px 28px rgba(48, 2, 4, 0.16);
}

.dr88aph-history-page.is-review-preview .dr88aph-summary > div {
  padding: 13px 10px 15px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.dr88aph-history-page.is-review-preview .dr88aph-ticket-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  max-height: min(58vh, 620px);
  padding: 4px 8px 10px 4px;
  overflow-y: auto;
}

.dr88aph-history-page.is-review-preview .dr88aph-ticket {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 14px;
  min-height: 166px;
  padding: 15px 16px 14px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(145deg, #fffdf8, #fff5e9);
  box-shadow: 0 10px 24px rgba(77, 17, 10, 0.11), inset 0 1px rgba(255, 255, 255, 0.9);
}

@media (max-width: 1100px) {
  .dr88aph-history-page {
    padding: 0;
  }

  .dr88aph-history-page.is-review-preview .dr88aph-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph-history-page.is-review-preview .dr88aph-summary > div:nth-child(4)::before {
    display: none;
  }

  .dr88aph-history-page.is-review-preview .dr88aph-summary > div:nth-child(n + 4) {
    border-top: 1px solid rgba(239, 207, 131, 0.2);
  }

  .dr88aph-history-page.is-review-preview .dr88aph-ticket-list {
    grid-template-columns: minmax(0, 1fr);
    max-height: min(58vh, 620px);
    overflow-y: auto;
  }

  .dr88aph-history-page.is-review-preview .dr88aph-ticket {
    min-height: 0;
    padding: 14px;
  }
}

/* History trophy gallery: editorial cases, physical tickets, one restrained foil moment. */
.dr88aph-history-page .dr88aph-member-head {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 150px;
  padding: 12px 22px 0;
}

.dr88aph-history-page .dr88aph-member-head__visual {
  align-self: end;
  width: 116px;
  height: 136px;
  background: url("../images/ranking-star-awards-v1.png") center bottom / 408px 136px no-repeat;
  filter: drop-shadow(0 12px 16px rgba(18, 0, 2, 0.36));
  animation: dr88aph-history-trophy-reveal 720ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.dr88aph-history-page .dr88aph-member-head__identity {
  min-width: 0;
}

.dr88aph-history-page .dr88aph-member-head__identity h2 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dr88aph-history-page .dr88aph-member-head__identity small {
  display: block;
  margin-top: 7px;
  color: #e8c985;
  font-size: 11px;
  font-weight: 750;
  line-height: 16px;
}

.dr88aph-history-page .dr88aph-member-head__standing {
  display: grid;
  justify-items: end;
  gap: 7px;
}

.dr88aph-history-page .dr88aph-member-head__rank {
  min-width: 144px;
  padding: 13px 18px 14px;
  border-radius: 12px;
  background: linear-gradient(145deg, #f4d57a, #d6a936 62%, #efca61);
  color: #4b2900;
  box-shadow: 0 12px 24px rgba(25, 0, 2, 0.3), inset 0 1px rgba(255, 253, 226, 0.78);
  text-align: center;
}

.dr88aph-history-page .dr88aph-member-head__rank span {
  display: block;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 13px;
}

.dr88aph-history-page .dr88aph-member-head__rank b {
  display: block;
  margin-top: 2px;
  font-size: 30px;
  font-weight: 950;
  letter-spacing: -0.03em;
  line-height: 34px;
}

/* History achievement plaque: one engraved scoreboard with the total at its center. */
.dr88aph-history-page .dr88aph-summary,
.dr88aph-history-page.is-review-preview .dr88aph-summary {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(180px, 1.34fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  min-height: 104px;
  padding: 10px 16px;
  overflow: hidden;
  clip-path: polygon(14px 0, calc(100% - 14px) 0, 100% 14px, 100% calc(100% - 14px), calc(100% - 14px) 100%, 14px 100%, 0 calc(100% - 14px), 0 14px);
  background:
    radial-gradient(circle at 50% 0%, rgba(201, 55, 45, 0.28), transparent 36%),
    linear-gradient(105deg, #430306, #741015 48%, #3c0205);
  box-shadow:
    inset 0 0 0 1px #edcf79,
    inset 0 0 0 4px #5d100d,
    inset 0 0 0 5px rgba(244, 213, 121, 0.56),
    0 14px 28px rgba(45, 0, 2, 0.24);
}

.dr88aph-history-page .dr88aph-summary > div,
.dr88aph-history-page.is-review-preview .dr88aph-summary > div {
  isolation: isolate;
  display: grid;
  align-content: center;
  min-height: 84px;
  padding: 12px 14px;
  overflow: hidden;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dr88aph-history-page .dr88aph-summary [data-summary-metric="exact"] { grid-column: 1; grid-row: 1; }
.dr88aph-history-page .dr88aph-summary [data-summary-metric="corners"] { grid-column: 2; grid-row: 1; }
.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"] { grid-column: 3; grid-row: 1; }
.dr88aph-history-page .dr88aph-summary [data-summary-metric="combo"] { grid-column: 4; grid-row: 1; }
.dr88aph-history-page .dr88aph-summary [data-summary-metric="pending"] { grid-column: 5; grid-row: 1; }

.dr88aph-history-page .dr88aph-summary [data-summary-metric="corners"]::before,
.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"]::before,
.dr88aph-history-page .dr88aph-summary [data-summary-metric="combo"]::before,
.dr88aph-history-page .dr88aph-summary [data-summary-metric="pending"]::before {
  display: block;
  position: absolute;
  top: 25%;
  bottom: 25%;
  left: 0;
  width: 1px;
  background: linear-gradient(transparent, rgba(247, 216, 132, 0.72), transparent);
  content: "";
}

.dr88aph-history-page .dr88aph-summary span {
  color: #f1dca9;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: -0.01em;
}

.dr88aph-history-page .dr88aph-summary b {
  margin-top: 4px;
  color: #ffe286;
  font-size: 27px;
  font-variant-numeric: tabular-nums;
  line-height: 30px;
}

.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"],
.dr88aph-history-page.is-review-preview .dr88aph-summary [data-summary-metric="points"] {
  z-index: 2;
  min-height: 94px;
  margin-block: -5px;
  padding-inline: 54px;
  border-radius: 16px;
  background-color: #e4b84c;
  background-image:
    url("../images/history-laurel.svg"),
    linear-gradient(145deg, #fff0ae, #e4b84c 54%, #b87916);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  box-shadow:
    inset 0 0 0 1px rgba(255, 250, 216, 0.92),
    inset 0 -5px 12px rgba(112, 57, 0, 0.22),
    0 10px 22px rgba(25, 0, 1, 0.38);
}

.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"] span {
  color: #542700;
  font-size: 15px;
  font-weight: 900;
}

.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"] b {
  color: #4b1700;
  font-size: 42px;
  line-height: 42px;
}

.dr88aph-history-page .dr88aph-summary [data-summary-metric="points"]::after {
  position: absolute;
  z-index: -1;
  inset: -45% auto -45% -32%;
  width: 18%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 240, 0.4), transparent);
  content: "";
  transform: skewX(-18deg) translateX(-220%);
  animation: dr88aph-history-foil 6.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  pointer-events: none;
}

.dr88aph-history-page .dr88aph-ticket-list.dr88aph-results-list,
.dr88aph-history-page.is-review-preview .dr88aph-ticket-list.dr88aph-results-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  max-height: min(58vh, 620px);
  padding: 4px 8px 10px 4px;
  overflow-y: auto;
}

.dr88aph-history-page .dr88aph-history-result-row .dr88aph-result-row__meta span {
  color: #8d0d15;
}

.dr88aph-history-page .dr88aph-history-result-row.is-pending .dr88aph-result-row__verdict i {
  background: #e4b945;
  box-shadow: 0 0 0 3px rgba(228, 185, 69, 0.14);
}

.dr88aph-history-page .dr88aph-history-result-row.is-incorrect .dr88aph-result-row__verdict i {
  background: #b9aaa2;
  box-shadow: 0 0 0 3px rgba(185, 170, 162, 0.14);
}

.dr88aph-history-page .dr88aph-history-result-row .dr88aph-result-row__facts > div.is-hit dd {
  color: #17653a;
}

.dr88aph-history-page .dr88aph-history-result-row .dr88aph-result-row__facts > div.is-miss dd {
  color: #76645c;
}

.dr88aph-history-page .dr88aph-history-result-row .dr88aph-result-row__facts > div.is-pending dd {
  color: #8b5d21;
}

@keyframes dr88aph-history-trophy-reveal {
  from {
    clip-path: inset(100% 0 0);
    filter: drop-shadow(0 4px 6px rgba(18, 0, 2, 0.08));
  }
  to {
    clip-path: inset(0);
    filter: drop-shadow(0 12px 16px rgba(18, 0, 2, 0.36));
  }
}

@keyframes dr88aph-history-foil {
  0%, 70% { transform: skewX(-18deg) translateX(-220%); }
  84%, 100% { transform: skewX(-18deg) translateX(760%); }
}

@media (max-width: 1100px) {
	.dr88aph-history-page .dr88aph-ticket-list.dr88aph-results-list,
	.dr88aph-history-page.is-review-preview .dr88aph-ticket-list.dr88aph-results-list {
		grid-template-columns: minmax(0, 1fr);
	}

  .dr88aph-history-page .dr88aph-member-head {
    grid-template-columns: 94px minmax(0, 1fr) auto;
    gap: 12px;
    min-height: 126px;
    padding-inline: 16px;
  }

  .dr88aph-history-page .dr88aph-member-head__visual {
    width: 94px;
    height: 112px;
    background-size: 336px 112px;
  }

  .dr88aph-history-page .dr88aph-member-head__rank {
    min-width: 112px;
    padding-inline: 12px;
  }

  .dr88aph-history-page .dr88aph-summary,
  .dr88aph-history-page.is-review-preview .dr88aph-summary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(160px, 1.28fr) minmax(0, 1fr) minmax(0, 1fr);
    padding-inline: 12px;
  }

  .dr88aph-history-page .dr88aph-summary > div,
  .dr88aph-history-page.is-review-preview .dr88aph-summary > div {
    padding-inline: 8px;
  }

  .dr88aph-history-page .dr88aph-summary [data-summary-metric="points"],
  .dr88aph-history-page.is-review-preview .dr88aph-summary [data-summary-metric="points"] {
    padding-inline: 42px;
  }
}

@media (max-width: 600px) {
  .dr88aph-history-page .dr88aph-member-head {
    grid-template-columns: 72px minmax(0, 1fr) 78px;
    gap: 9px;
    min-height: 112px;
    padding: 10px 10px 0;
  }

  .dr88aph-history-page .dr88aph-member-head__visual {
    width: 72px;
    height: 92px;
    background-size: 276px 92px;
  }

  .dr88aph-history-page .dr88aph-member-head__identity h2 {
    font-size: 17px;
    line-height: 22px;
  }

  .dr88aph-history-page .dr88aph-member-head__identity small {
    margin-top: 4px;
    font-size: 10px;
    line-height: 13px;
  }

  .dr88aph-history-page .dr88aph-member-head__rank {
    min-width: 0;
    width: 78px;
    padding: 10px 5px;
  }

  .dr88aph-history-page .dr88aph-member-head__rank span {
    font-size: 10px;
    letter-spacing: 0.04em;
  }

  .dr88aph-history-page .dr88aph-member-head__rank b {
    font-size: 25px;
    line-height: 29px;
  }

  .dr88aph-history-page .dr88aph-summary,
  .dr88aph-history-page.is-review-preview .dr88aph-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-height: 0;
    padding: 10px;
  }

  .dr88aph-history-page .dr88aph-summary [data-summary-metric="points"],
  .dr88aph-history-page.is-review-preview .dr88aph-summary [data-summary-metric="points"] {
    grid-column: 1 / -1;
    grid-row: 1;
    min-height: 82px;
    margin: 0 0 4px;
    padding-inline: 62px;
  }

  .dr88aph-history-page .dr88aph-summary > div,
  .dr88aph-history-page.is-review-preview .dr88aph-summary > div {
    min-height: 62px;
    padding: 9px 8px;
  }

  .dr88aph-history-page .dr88aph-summary [data-summary-metric="exact"] { grid-column: 1; grid-row: 2; }
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="corners"] { grid-column: 2; grid-row: 2; }
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="combo"] { grid-column: 1; grid-row: 3; }
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="pending"] { grid-column: 2; grid-row: 3; }

  .dr88aph-history-page .dr88aph-summary [data-summary-metric="points"]::before,
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="combo"]::before {
    display: none;
  }

  .dr88aph-history-page .dr88aph-summary [data-summary-metric="corners"]::before,
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="pending"]::before {
    top: 18%;
    bottom: 18%;
  }

  .dr88aph-history-page .dr88aph-summary [data-summary-metric="combo"]::after,
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="pending"]::after {
    position: absolute;
    top: 0;
    right: 16%;
    left: 16%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(247, 216, 132, 0.48), transparent);
    content: "";
  }

}

@media (prefers-reduced-motion: reduce) {
  .dr88aph-history-page .dr88aph-member-head__visual,
  .dr88aph-history-page .dr88aph-summary [data-summary-metric="points"]::after {
    animation: none;
  }
}

/* Final mobile cascade lock: keeps later feature layers from undoing the adaptation. */
@media (max-width: 680px) {
  .dr88aph[data-view="home"] .dr88aph-home-benefits {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a {
    min-height: 76px;
    padding: 8px 5px;
    place-items: center;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy {
    justify-items: center;
    text-align: center;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy small {
    line-height: 11px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
    font-size: 10.5px;
    line-height: 14px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a > .dr88aph-inline-icon {
    display: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    padding: 4px;
    overflow: visible;
    gap: 4px;
    border-radius: 12px;
    background: #f2ece8;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tabs a {
    min-width: 0;
    min-height: 46px;
    padding: 7px 5px;
    border-radius: 9px;
    text-align: center;
  }

  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__number,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__copy small,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-rule-tab__arrow {
    display: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-rule-summary.is-wheel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dr88aph[data-view="wheel"] .dr88aph-slot-cta {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .dr88aph[data-view="wheel"] .dr88aph-slot-cta > span:nth-child(2) {
    min-width: 0;
    white-space: normal;
  }

  .dr88aph[data-view="matches"] .dr88aph-match.is-compact > .dr88aph-primary,
  .dr88aph-results-page .dr88aph-review-launcher,
  .dr88aph-results-page .dr88aph-results-subnav a,
  .dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a,
  .dr88aph[data-view="top"] .dr88aph-top-brief__actions .dr88aph-text-link {
    min-height: 44px !important;
  }

  .dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }

  .dr88aph-results-page .dr88aph-ranking-board__head .dr88aph-filters a {
    min-width: 0;
    padding-inline: 4px;
  }

  .dr88aph[data-view="mine"] .dr88aph-result-row__facts dd {
    min-width: 0;
    overflow: visible;
    overflow-wrap: anywhere;
    text-overflow: clip;
    white-space: normal;
  }

  .dr88aph[data-view="top"] .dr88aph-top-podium-card {
    overflow: hidden;
  }
}

@media (max-width: 340px) {
  .dr88aph-history-page .dr88aph-member-head {
    grid-template-columns: 58px minmax(0, 1fr) 68px;
    gap: 7px;
  }

  .dr88aph-history-page .dr88aph-member-head__visual {
    width: 58px;
    height: 82px;
    background-size: 246px 82px;
  }

  .dr88aph-history-page .dr88aph-member-head__rank {
    width: 68px;
  }

  .dr88aph-history-page .dr88aph-member-head__identity h2 {
    font-size: 15px;
    line-height: 19px;
    overflow-wrap: anywhere;
    white-space: normal;
  }
}

/* Premium mobile navigation: one optical grid, one restrained active jewel. */
@media (max-width: 680px) {
  .dr88aph .dr88aph-header,
  body.admin-bar .dr88aph .dr88aph-header {
    position: fixed !important;
    z-index: 120;
    top: 0 !important;
    right: 0;
    left: 0;
    width: 100%;
    transform: none !important;
  }

  body.admin-bar .dr88aph .dr88aph-header { top: 0 !important; }

  .dr88aph .dr88aph-main-nav {
    position: fixed !important;
    z-index: 125;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    grid-template-rows: minmax(64px, auto) !important;
    grid-auto-flow: column;
    gap: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 76px;
    padding: 6px 3px max(6px, env(safe-area-inset-bottom));
    overflow: visible;
    border: 0;
    border-top: 1px solid rgba(142, 20, 29, 0.14);
    border-radius: 18px 18px 0 0;
    background: rgba(255, 253, 249, 0.99);
    box-shadow: 0 -12px 34px rgba(47, 3, 7, 0.2);
    backdrop-filter: blur(16px);
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link:hover,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link.is-active {
    grid-column: auto !important;
    grid-row: 1 !important;
    grid-template-rows: 30px 24px;
    align-content: center;
    justify-items: center;
    gap: 2px;
    min-width: 0;
    min-height: 64px;
    padding: 4px 1px;
    border-radius: 0;
    background: transparent;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link::after,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link.is-active::after {
    display: none;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > .dr88aph-nav-icon {
    box-sizing: content-box;
    align-self: center;
    width: 18px;
    height: 18px;
    margin: 0;
    padding: 6px;
    overflow: visible;
    border-radius: 10px;
    color: #747987;
    stroke-width: 2.05;
    transition:
      color 180ms ease-out,
      background-color 180ms ease-out,
      box-shadow 220ms ease-out;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link.is-active > .dr88aph-nav-icon {
    color: #fff2bd;
    background: linear-gradient(145deg, #bd1622, #81060d 72%);
    box-shadow:
      inset 0 0 0 1px rgba(255, 222, 123, 0.72),
      0 7px 15px rgba(113, 3, 12, 0.3);
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > span {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 100%;
    height: 24px;
    min-height: 24px;
    margin: 0;
    overflow: visible;
    color: #626875;
    font-size: 10px;
    font-weight: 750;
    line-height: 11px;
    text-align: center;
    white-space: nowrap;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link.is-active > span {
    color: #a30a14;
    font-weight: 900;
  }

  .dr88aph .dr88aph-main-nav .dr88aph-nav-link.is-top > span::after {
    font-size: 10px;
    font-weight: inherit;
    line-height: 11px;
  }
}

@media (max-width: 350px) {
  .dr88aph .dr88aph-main-nav {
    padding-inline: 2px;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > .dr88aph-nav-icon {
    width: 17px;
    height: 17px;
    padding: 6px;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > span,
  .dr88aph .dr88aph-main-nav .dr88aph-nav-link.is-top > span::after {
    font-size: 10px;
    line-height: 11px;
  }
}

/* Mobile optical alignment: center the conversion mark and pair each honor title with its trophy. */
@media (max-width: 620px) {
  .dr88aph[data-view="home"] .dr88aph-home__conversion-icon {
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: center;
  }

  .dr88aph[data-view="top"] .dr88aph-top-honor > .dr88aph-top-rank {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }

  .dr88aph[data-view="top"] .dr88aph-top-honor__copy {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }

  .dr88aph[data-view="matches"] .dr88aph-match.is-compact .dr88aph-corners legend {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 17px;
    gap: 8px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match.is-compact .dr88aph-corners legend b,
  .dr88aph[data-view="matches"] .dr88aph-match.is-compact .dr88aph-corners legend small {
    align-self: center;
    margin: 0;
    padding: 0;
  }
}

/* Authoritative mobile repair for the campaign CTA, Top board and history hero. */
.dr88aph { z-index: 2; }

/* Flat mobile top bar: full-width white utility surface without a decorative frame. */
@media (max-width: 680px) {
  .dr88aph .dr88aph-header,
  body.admin-bar .dr88aph .dr88aph-header {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  .dr88aph .dr88aph-header .dr88aph-header__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    width: 100%;
    max-width: none;
    margin: 0;
    padding-inline: 8px;
    gap: 8px;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  .dr88aph .dr88aph-header .dr88aph-header-cta.dr88aph-attention-cta {
    width: 100%;
    max-width: none;
    margin-left: 0;
    justify-self: stretch;
  }

  /* Keep the mobile prediction CTA optically anchored to the card floor. */
  .dr88aph[data-view="matches"] .dr88aph-match.is-compact {
    padding-bottom: 6px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match.is-compact > .dr88aph-primary {
    margin-top: 13px;
  }

  /* Match every Rules destination CTA to the inset claim-registration action. */
  .dr88aph[data-view="rules"] .dr88aph-rules-action.dr88aph-rules-compact-cta {
    box-sizing: border-box;
    width: min(300px, calc(100vw - 90px), 100%);
    min-width: 0;
    margin-right: 0 !important;
    margin-left: 0 !important;
    position: relative;
    left: 50%;
    translate: -50% 0;
    justify-content: center;
  }
}

/* A hidden WordPress toolbar can leave a desktop or mobile root offset behind. */
html.dr88aph-admin-bar-hidden {
  margin-top: 0 !important;
}

/* Mobile viewport contract: reserve exactly the fixed navigation. */
@media (max-width: 680px) {
  html.dr88aph-admin-bar-hidden body.admin-bar [data-dr88aph-app].dr88aph[data-view] > .dr88aph-header {
    top: 0 !important;
  }

  .dr88aph,
  body.admin-bar .dr88aph {
    --dr88aph-mobile-nav-clearance: calc(71px + max(6px, env(safe-area-inset-bottom)));
  }

  .dr88aph[data-view] {
    padding-bottom: var(--dr88aph-mobile-nav-clearance);
  }

  .dr88aph[data-view] .dr88aph-footer {
    padding: 12px 0;
  }
}

@media (max-width: 680px) {
  .dr88aph-footer__trust {
    box-sizing: border-box;
    max-width: 100%;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a {
    min-height: 60px;
    padding: 10px 42px 10px 16px;
    place-items: center start;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy {
    justify-items: start;
    text-align: left;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy small {
    font-size: 10px;
    line-height: 14px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
    font-size: 13px;
    line-height: 18px;
  }

  .dr88aph[data-view="home"] .dr88aph-home-benefits a > .dr88aph-inline-icon {
    display: block;
    right: 14px;
  }

  .dr88aph[data-view="top"] .dr88aph-top-page {
    padding-right: 0;
    padding-left: 0;
    overflow: hidden;
    border-radius: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-main > .dr88aph-shell {
    width: 100%;
  }

  .dr88aph[data-view="top"] .dr88aph-top-head {
    padding-right: 14px;
    padding-left: 14px;
  }

  .dr88aph[data-view="top"] :where(.dr88aph-top-ranking, .dr88aph-top-board, .dr88aph-top-ladder, .dr88aph-top-band-panels, .dr88aph-top-band-panel, .dr88aph-top-tier-panels) {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-top-ranking {
    margin-right: 0;
    margin-left: 0;
  }

  /* V1.18.39: keep the three score cells inside the narrow Top card. */
  .dr88aph[data-view="top"] :where(
    .dr88aph-top-board,
    .dr88aph-top-brief,
    .dr88aph-top-score-rules,
    .dr88aph-top-tiebreak,
    .dr88aph-top-code-delivery,
    .dr88aph-top-brief__actions
  ) {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-top-score-rules {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dr88aph[data-view="top"] .dr88aph-top-score-rules > div,
  .dr88aph[data-view="top"] .dr88aph-top-score-rules :where(dt, dd) {
    min-width: 0;
  }

  .dr88aph[data-view="top"] .dr88aph-top-score-rules dd {
    overflow-wrap: normal;
    font-size: clamp(9px, 3vw, 11.5px);
    white-space: nowrap;
  }

  .dr88aph[data-view="top"] .dr88aph-top-band-nav,
  .dr88aph[data-view="top"] .dr88aph-top-podium {
    padding-right: 0;
    padding-left: 0;
  }

  .dr88aph[data-view="top"] :where(.dr88aph-top-podium-card, .dr88aph-top-tier) {
    width: 100%;
  }

  .dr88aph-history-page .dr88aph-member-head {
    grid-template-columns: 72px minmax(0, 1fr) 82px;
    gap: 8px;
    min-height: 120px;
    padding: 10px 10px 8px;
  }

  .dr88aph-history-page .dr88aph-member-head__standing {
    align-self: center;
    justify-items: stretch;
    width: 82px;
  }

  .dr88aph-history-page .dr88aph-member-head__rank,
  .dr88aph-history-page .dr88aph-member-head .dr88aph-text-button {
    box-sizing: border-box;
    width: 82px;
  }

  .dr88aph-history-page .dr88aph-member-head .dr88aph-text-button {
    min-height: 30px;
    padding: 5px 4px;
    overflow-wrap: normal;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    white-space: nowrap;
  }

  .dr88aph-history-page .dr88aph-summary,
  .dr88aph-history-page.is-review-preview .dr88aph-summary {
    margin-top: 10px;
  }
}

@media (max-width: 350px) {
  .dr88aph-history-page .dr88aph-member-head {
    grid-template-columns: 62px minmax(0, 1fr) 76px;
    gap: 7px;
  }

  .dr88aph-history-page .dr88aph-member-head__standing,
  .dr88aph-history-page .dr88aph-member-head__rank,
  .dr88aph-history-page .dr88aph-member-head .dr88aph-text-button {
    width: 76px;
  }
}

/* Full-width empty history and compact, unbroken benefit copy. */
.dr88aph .dr88aph-profile-reward-cta {
  display: flex; justify-content: center;
  width: fit-content; max-width: 100%; margin: 12px auto 16px; padding: 12px 20px;
  border: 1px solid #e9bd52; border-radius: 14px; color: #fff3bd;
  background: linear-gradient(115deg, #650409, #a40b16, #650409);
  text-decoration: none; text-align: center; animation: dr88aph-profile-glow 2.8s ease-in-out infinite;
}
.dr88aph-profile-reward-cta strong, .dr88aph-profile-reward-cta small { display: block; }
.dr88aph-profile-reward-cta strong { font-size: 14px; line-height: 1.4; }
.dr88aph-profile-reward-cta small { font-size: 12px; margin-top: 3px; color: #efdbb9; }
.dr88aph-profile-reward-cta svg { width: 18px; flex: 0 0 18px; }
@keyframes dr88aph-profile-glow {
  0%, 100% { box-shadow: 0 3px 10px #6c090d22; }
  50% { box-shadow: 0 3px 18px #d3a32d66; }
}
.dr88aph .dr88aph-prize-dialog { width: min(760px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero { min-height: 0; padding: 16px 60px 16px 20px; gap: 14px; }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__visual { width: 86px; height: 76px; flex: 0 0 86px; padding: 4px; }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__visual:not([hidden]):not(:empty) { display: grid; }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__visual .dr88aph-wheel-card__visual,
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__visual .dr88aph-prize-image-crop {
  position: static; inset: auto; width: 100%; height: 100%; min-width: 0; min-height: 0;
  margin: 0; padding: 0; transform: none; display: grid; place-items: center;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__visual img {
  position: static; inset: auto; width: 100%; height: 100%; max-width: 100%; max-height: 68px;
  object-fit: contain; object-position: center; transform: none; margin: 0;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__copy h2 { font-size: clamp(20px, 3vw, 28px); line-height: 1.2; }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__body { padding: 16px 20px; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-profile-form { gap: 12px; margin: 0; padding: 0; }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__body > section { margin-inline: 0; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-group { padding: 12px; margin: 0; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid { gap: 10px 12px; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid.is-delivery { grid-template-columns: minmax(0, 1fr); }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid.is-delivery > label { grid-column: 1 / -1; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid input,
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid input[type="tel"],
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid textarea { border-radius: 12px; width: 100%; box-sizing: border-box; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-profile-form > .dr88aph-profile-reward-cta { width: 100%; height: auto; white-space: normal; margin: 0; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid label { gap: 5px; min-width: 0; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid input,
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid input[type="tel"] {
  display: block;
  height: 48px;
  min-height: 48px;
  margin: 0;
  padding: 11px 12px;
  border-width: 1px;
  line-height: 24px;
  appearance: none;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid textarea { min-height: 58px; padding: 9px 12px; }
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-profile-status { margin: 10px 0 0; }
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__disclaimer { margin-top: 10px; padding-top: 10px; }
.dr88aph .dr88aph-wheel-layout.is-console-only { gap: 16px; margin-top: 12px; }
@media (max-width: 600px) {
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero { padding: 14px 44px 14px 14px; gap: 10px; }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__body { padding: 12px; }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__visual { width: 64px; height: 64px; flex-basis: 64px; }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid.is-recipient > label:first-child { grid-column: 1 / -1; }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid.is-delivery { grid-template-columns: minmax(0, 1fr); }
  .dr88aph .dr88aph-profile-reward-cta { padding: 10px 12px; gap: 8px; }
  .dr88aph-profile-reward-cta strong { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .dr88aph .dr88aph-profile-reward-cta { animation: none; } }
.dr88aph [data-member-predictions] > .dr88aph-empty {
  grid-column: 1 / -1;
  width: 100%;
  margin: 0;
  text-align: center;
}
[data-dr88aph-app].dr88aph[data-view="home"] .dr88aph-home-benefit__copy strong {
  font-size: 12px;
  white-space: nowrap;
}
@media (min-width: 1101px) {
  [data-dr88aph-app].dr88aph[data-view]:has(.dr88aph-member-bar) {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }
}


/* Tablet authority: wide touch layout, compact conversion CTA and footer anchored above navigation. */
@media (min-width: 681px) and (max-width: 1100px) {
  [data-dr88aph-app].dr88aph[data-view] {
    display: flex;
    min-height: var(--dr88aph-viewport);
    flex-direction: column;
  }

  .dr88aph-shell {
    width: min(960px, calc(100% - 32px));
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-main {
    min-height: 0;
    flex: 1 0 auto;
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-footer {
    width: 100%;
    margin-top: auto;
    padding: 12px 0 calc(84px + env(safe-area-inset-bottom));
  }

  [data-dr88aph-app].dr88aph[data-view] > .dr88aph-footer > .dr88aph-shell {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  .dr88aph-workspace,
  .dr88aph-wheel-page,
  .dr88aph-rules-page,
  .dr88aph-results-page,
  .dr88aph-history-page,
  .dr88aph-top-page {
    min-height: 0;
  }

  .dr88aph-header-cta {
    width: auto;
    min-width: 285px;
    max-width: none;
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .dr88aph-main-nav {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .dr88aph-nav-link {
    min-width: 0;
    min-height: 68px;
    padding: 8px 3px 7px;
    font-size: 10.5px;
    line-height: 13px;
  }

  .dr88aph-nav-icon {
    width: 23px;
    height: 23px;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook,
  .dr88aph-home__content > .dr88aph-home__conversion-hook.is-verdict {
    grid-template-columns: 40px minmax(0, 1fr) auto 18px;
    grid-template-rows: 40px;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 7px 12px;
  }

  .dr88aph-home__conversion-icon {
    width: 40px;
    height: 40px;
  }

  .dr88aph-promo-ticket-icon {
    width: 28px;
    height: 28px;
  }

  .dr88aph-home__conversion-copy,
  .dr88aph-home__conversion-prize {
    gap: 1px;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-home__conversion-prize,
  .dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-inline-icon {
    grid-column: auto;
    grid-row: auto;
  }

  .dr88aph-home__content > .dr88aph-home__conversion-hook > .dr88aph-inline-icon {
    width: 18px;
    height: 18px;
  }

  .dr88aph-top-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .dr88aph-top-head > div:first-child,
  .dr88aph-top-head h1 {
    width: 100%;
    min-width: 0;
  }
}

/* V1.18.73: designer-authored cards for the featured prize catalogue. */
.dr88aph-wheel-prize-catalog.has-designed-cards > div {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.dr88aph-wheel-prize-catalog.has-designed-cards > div > [data-prize-catalog-item],
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog.has-designed-cards > div > [data-prize-catalog-item] {
  display: block;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
  aspect-ratio: 10 / 7;
}

.dr88aph-wheel-prize-catalog.has-designed-cards .dr88aph-prize-catalog__card {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 1100px) {
  .dr88aph-wheel-prize-catalog.has-designed-cards > div {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .dr88aph-wheel-prize-catalog.has-designed-cards > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .dr88aph-wheel-prize-catalog.has-designed-cards > div > [data-prize-catalog-item],
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog.has-designed-cards > div > [data-prize-catalog-item] {
    border-radius: 9px;
  }
}


/* V1.18.84: prediction-page polish — contained desktop CTA, premium finished cards and mobile DR Live CTA. */
@media (min-width: 1101px) and (max-width: 1500px) {
  .dr88aph-header__inner {
    gap: 10px;
  }

  .dr88aph-main-nav {
    min-width: 0;
    gap: 2px;
  }

  .dr88aph-main-nav a {
    padding-inline: clamp(6px, 0.5vw, 10px);
    font-size: 13px;
  }

  .dr88aph-header__actions {
    flex: 0 1 auto;
    min-width: 0;
    gap: 7px;
  }

  .dr88aph-site-link {
    min-height: 42px;
    padding-inline: 10px;
    font-size: 12px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    flex: 0 1 214px;
    width: 214px;
    min-width: 0;
    max-width: 214px;
    min-height: 42px;
    padding: 7px 10px;
    gap: 6px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    min-width: 0;
    font-size: 10.5px;
    line-height: 13px;
    white-space: normal;
    text-wrap: balance;
  }
}

/* Finished match cards: stronger result hierarchy inspired by the approved World Cup result treatment. */
.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] {
  border-color: rgba(195, 143, 24, 0.72);
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 232, 154, 0.18), transparent 38%),
    linear-gradient(180deg, #fffefb 0%, #fff 58%, #fff8e8 100%);
  box-shadow: 0 12px 28px rgba(54, 22, 4, 0.12), inset 0 1px 0 #fff;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"]::before {
  height: 3px;
  background: linear-gradient(90deg, #0d2d7a 0%, #2863dc 45%, #e1ad2d 72%, #9a0a11 100%);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-match__meta {
  border-bottom-color: rgba(205, 179, 115, 0.42);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-status.is-result_published {
  border: 1px solid rgba(39, 83, 170, 0.18);
  background: linear-gradient(145deg, #112a67, #2458c8);
  box-shadow: 0 4px 10px rgba(20, 55, 132, 0.16), inset 0 1px 0 rgba(255,255,255,0.18);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-status.is-result_published i {
  background: #61e6a8;
  box-shadow: 0 0 0 4px rgba(97, 230, 168, 0.14);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score {
  gap: 10px;
  margin: 18px 0 14px;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong {
  min-width: 88px;
  min-height: 54px;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid rgba(255, 218, 95, 0.78);
  border-radius: 14px;
  background: linear-gradient(145deg, #102b70 0%, #174fbd 58%, #0c2b72 100%);
  box-shadow: 0 8px 18px rgba(14, 49, 125, 0.22), inset 0 1px 0 rgba(255,255,255,0.2);
  font-size: 29px;
  line-height: 34px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.22);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong span {
  color: #f4c845;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-team__flag {
  border-color: #e3c45d;
  background: #fff;
  box-shadow: 0 6px 14px rgba(38, 51, 77, 0.11), 0 0 0 3px rgba(255,255,255,0.9);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-corners-result {
  display: grid;
  gap: 5px;
  margin-top: 2px;
  padding: 10px 12px 11px;
  border: 1px solid rgba(27, 70, 166, 0.16);
  border-radius: 12px;
  background: linear-gradient(135deg, #f6f9ff 0%, #eef4ff 55%, #fff7df 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
  color: #26344f;
  font-size: 12px;
  font-weight: 700;
  line-height: 17px;
  text-align: center;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-corners-result::before {
  content: "KẾT QUẢ CHUNG CUỘC";
  justify-self: center;
  padding: 3px 9px;
  border-radius: 999px;
  background: linear-gradient(145deg, #153983, #245bd0);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  line-height: 13px;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-corners-result strong {
  color: #9a0a12;
  font-size: 14px;
}

/* DR Live remains visible on prediction view across tablet/mobile instead of being desktop-only. */
@media (max-width: 1100px) {

  .dr88aph[data-view="matches"] .dr88aph-live-cta {
    display: inline-flex;
  }
}

@media (max-width: 680px) {

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong {
    min-width: 80px;
    min-height: 50px;
    padding-inline: 9px;
    font-size: 26px;
    line-height: 30px;
  }
}

/* V1.18.85: hotfix — contain desktop registration CTA, luxury result summary, always-show mobile DR Live. */
@media (min-width: 1101px) {
  .dr88aph-header__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
  }

  .dr88aph-main-nav {
    min-width: 0;
  }

  .dr88aph-header__actions {
    min-width: 0;
    justify-content: flex-end;
    gap: 8px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    flex: 0 1 auto;
    width: auto;
    max-width: clamp(208px, 18vw, 252px);
    padding: 8px 12px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    text-wrap: balance;
    line-height: 14px;
  }
}

@media (min-width: 1101px) and (max-width: 1320px) {
  .dr88aph-site-link {
    padding-inline: 10px;
    font-size: 12px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    max-width: 216px;
    gap: 6px;
    padding-inline: 10px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 10.5px;
    line-height: 13px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta .dr88aph-inline-icon {
    display: none;
  }
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(209, 154, 25, 0.72);
  background:
    radial-gradient(circle at top right, rgba(255, 227, 150, 0.22), transparent 30%),
    linear-gradient(180deg, #fffdf7 0%, #fffaf0 58%, #fff6e4 100%);
  box-shadow: 0 14px 28px rgba(99, 34, 12, 0.10), inset 0 1px 0 rgba(255,255,255,0.92);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"]::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  background: linear-gradient(90deg, #b50f17 0%, #df5d26 35%, #e0b23a 72%, #9d0a11 100%);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-match__meta {
  border-bottom-color: rgba(210, 189, 133, 0.48);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-status.is-result_published {
  border: 1px solid rgba(18, 53, 134, 0.18);
  background: linear-gradient(145deg, #163a86, #275fcc);
  box-shadow: 0 6px 12px rgba(20, 55, 132, 0.16), inset 0 1px 0 rgba(255,255,255,0.18);
  color: #fff;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 14px;
  margin: 18px 0 16px;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong {
  min-width: 96px;
  justify-content: center;
  gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(241, 196, 63, 0.95);
  border-radius: 16px;
  background: linear-gradient(180deg, #1f58c6 0%, #173f97 100%);
  box-shadow: 0 10px 18px rgba(14, 49, 125, 0.20), inset 0 1px 0 rgba(255,255,255,0.24);
  font-size: 32px;
  line-height: 36px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.18);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong span {
  color: #ffd54f;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-team__flag {
  border-color: #e8ca69;
  background: linear-gradient(180deg, #fffefb, #fff5df);
  box-shadow: 0 6px 14px rgba(38, 51, 77, 0.10), inset 0 1px 0 rgba(255,255,255,0.96);
}

.dr88aph[data-view="matches"] .dr88aph-result-summary {
  display: grid;
  padding: 12px 14px 14px;
  border: 1px solid rgba(219, 193, 129, 0.72);
  border-radius: 16px;
  background: linear-gradient(180deg, #fffefb 0%, #fff8eb 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.94);
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__eyebrow {
  background: linear-gradient(180deg, #204faa 0%, #173d8f 100%);
  box-shadow: 0 4px 10px rgba(17, 52, 131, 0.16);
  color: #fff;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric {
  display: grid;
  gap: 5px;
  min-height: 78px;
  padding: 10px 8px;
  border: 1px solid rgba(207, 213, 226, 0.9);
  border-radius: 12px;
  background: linear-gradient(180deg, #f9fbff 0%, #f3f6fc 100%);
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric > span {
  color: #6a7383;
  font-size: 11px;
  font-weight: 700;
  line-height: 15px;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric > strong {
  color: #9b0e14;
  font-size: 25px;
  line-height: 28px;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric.is-market > strong {
  color: #24324b;
  font-size: 17px;
  line-height: 22px;
}

@media (max-width: 1100px) {
  .dr88aph[data-view="matches"] .dr88aph-page-head.is-prediction {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .dr88aph[data-view="matches"] .dr88aph-live-cta {
    display: inline-flex !important;
    width: auto;
    max-width: 100%;
    margin: 0;
    flex: 0 0 auto;
  }
}

@media (max-width: 680px) {
  .dr88aph[data-view="matches"] .dr88aph-page-head.is-prediction {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-live-cta {
    display: inline-flex !important;
    justify-self: stretch;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 8px 12px;
    border-radius: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-live-cta img {
    width: 88px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score {
    gap: 8px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong {
    min-width: 84px;
    min-height: 52px;
    padding-inline: 10px;
    font-size: 28px;
    line-height: 32px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary {
    padding: 11px 11px 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__body {
    gap: 8px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__metric {
    min-height: 72px;
    padding: 9px 7px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__metric > strong {
    font-size: 22px;
    line-height: 24px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__metric.is-market > strong {
    font-size: 15px;
    line-height: 19px;
  }
}


/* V1.18.86 — cache-busted visual correction: DR88 red/gold finished state + contained desktop header CTA. */
@media (min-width: 1101px) {
  .dr88aph-header > .dr88aph-header__inner,
  .dr88aph-header .dr88aph-header__inner {
    width: min(1280px, calc(100% - 40px));
    grid-template-columns: auto minmax(0, 1fr) auto;
    overflow: hidden;
  }

  .dr88aph-header__actions {
    max-width: 390px;
    overflow: hidden;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    width: min(100%, 246px);
    max-width: 246px;
    min-width: 0;
    flex: 0 1 246px;
    padding: 8px 11px;
    border-radius: 12px;
    overflow: hidden;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    display: block;
    min-width: 0;
    overflow: hidden;
    font-size: 10.5px;
    line-height: 13px;
    white-space: normal;
    text-align: center;
  }
}

@media (min-width: 1101px) and (max-width: 1220px) {
  .dr88aph-header > .dr88aph-header__inner,
  .dr88aph-header .dr88aph-header__inner {
    width: min(1180px, calc(100% - 24px));
    gap: 7px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    max-width: 205px;
    flex-basis: 205px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 9.8px;
  }
}

/* Finished match card — DR88 event palette: ivory / deep red / muted gold. */
.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] {
  border-color: #d5a62b;
  background:
    radial-gradient(circle at 85% 0%, rgba(233, 188, 73, 0.16), transparent 34%),
    linear-gradient(180deg, #fffdf7 0%, #fff9eb 100%);
  box-shadow: 0 12px 26px rgba(104, 12, 17, 0.10), inset 0 1px 0 rgba(255,255,255,0.95);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"]::before {
  height: 4px;
  background: linear-gradient(90deg, #7d070b 0%, #c0141c 46%, #e0b13b 100%);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-status.is-result_published {
  border: 1px solid rgba(185, 132, 21, 0.48);
  background: linear-gradient(180deg, #fff6da 0%, #f6e5aa 100%);
  box-shadow: 0 4px 10px rgba(91, 33, 9, 0.10), inset 0 1px 0 #fff;
  color: #85090f;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-status.is-result_published i {
  background: #b70d16;
  box-shadow: 0 0 0 4px rgba(183, 13, 22, 0.10);
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong {
  min-width: 98px;
  min-height: 58px;
  border: 1px solid #e1b441;
  background: linear-gradient(180deg, #a90b12 0%, #7f070c 100%);
  box-shadow: 0 8px 18px rgba(103, 9, 14, 0.18), inset 0 1px 0 rgba(255,255,255,0.18);
  color: #fff;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong span {
  color: #f3cd68;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-team__flag {
  border-color: #dcb557;
  background: #fffdf8;
  box-shadow: 0 5px 12px rgba(85, 36, 8, 0.09), inset 0 1px 0 #fff;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary {
  display: grid !important;
  gap: 10px;
  margin-top: 2px;
  padding: 12px;
  border: 1px solid #e0c77f;
  border-radius: 14px;
  background: linear-gradient(180deg, #fffdfa 0%, #fff5df 100%);
  box-shadow: 0 7px 16px rgba(83, 33, 9, 0.07), inset 0 1px 0 #fff;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__eyebrow {
  justify-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 12px;
  border: 1px solid #e0b33f;
  border-radius: 999px;
  background: linear-gradient(180deg, #990a10 0%, #730508 100%);
  box-shadow: 0 4px 10px rgba(104, 8, 13, 0.14);
  color: #fff7da;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__body {
  display: grid !important;
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  gap: 9px;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric {
  display: grid !important;
  justify-items: center;
  align-content: center;
  gap: 4px;
  min-width: 0;
  min-height: 72px;
  padding: 9px 8px;
  border: 1px solid #eadbb3;
  border-radius: 11px;
  background: #fffaf0;
  box-shadow: inset 0 1px 0 #fff;
  text-align: center;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric > span {
  color: #75634b;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric > strong {
  color: #a30b12;
  font-size: 27px;
  font-weight: 800;
  line-height: 30px;
  white-space: nowrap;
}

.dr88aph[data-view="matches"] .dr88aph-result-summary__metric.is-market > strong {
  color: #2d2730;
  font-size: 16px;
  line-height: 20px;
}

@media (max-width: 680px) {
  .dr88aph[data-view="matches"] .dr88aph-result-summary__body {
    grid-template-columns: 1fr 1.25fr;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__metric {
    min-height: 68px;
    padding-inline: 6px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__metric > strong {
    font-size: 23px;
    line-height: 26px;
  }

  .dr88aph[data-view="matches"] .dr88aph-result-summary__metric.is-market > strong {
    font-size: 14px;
    line-height: 18px;
  }
}


/* V1.18.87 — result-card vertical balance + desktop header label polish. */
.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] {
  display: flex;
  flex-direction: column;
}

.dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary {
  margin-top: auto;
  margin-bottom: 2px;
}

@media (min-width: 1101px) {
  .dr88aph-site-link {
    text-transform: uppercase;
    letter-spacing: 0.01em;
  }

  .dr88aph-header-cta.dr88aph-attention-cta {
    width: min(100%, 224px);
    max-width: 224px;
    flex: 0 1 224px;
    min-height: 42px;
    padding: 7px 10px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 10px;
    line-height: 12.5px;
  }
}

@media (min-width: 1101px) and (max-width: 1220px) {
  .dr88aph-header-cta.dr88aph-attention-cta {
    max-width: 196px;
    flex-basis: 196px;
  }

  .dr88aph-header-cta.dr88aph-attention-cta > span {
    font-size: 9.5px;
    line-height: 12px;
  }
}


/* V1.18.88 — mobile wheel utility alignment + history spacing + desktop header hover clipping fix. */

/* Desktop only: header actions must not translate outside the clipped header shell on hover. */
@media (min-width: 1101px) {
  .dr88aph-header__actions .dr88aph-site-link:hover,
  .dr88aph-header__actions .dr88aph-site-link:active,
  .dr88aph-header__actions .dr88aph-header-cta:hover,
  .dr88aph-header__actions .dr88aph-header-cta:active {
    transform: none;
  }

  .dr88aph-header__actions .dr88aph-site-link:hover {
    border-color: #d9a62e;
    background: linear-gradient(145deg, #fffefb, #fff4df);
    box-shadow: 0 7px 16px rgba(94, 0, 12, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.94);
  }

  .dr88aph-header__actions .dr88aph-header-cta:hover {
    border-color: #ffdd62;
    background:
      linear-gradient(118deg, rgba(255, 255, 255, 0.17) 0 10%, transparent 26% 58%, rgba(255, 219, 94, 0.13) 78%, transparent 91%),
      linear-gradient(145deg, #8f080e 0%, #c7151d 52%, #79070c 100%);
    box-shadow: 0 9px 20px rgba(86, 5, 10, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.23);
    filter: none;
  }
}

@media (max-width: 680px) {
  /* Authenticated member bar: make Turns and Account two equal utility tiles. */
  .dr88aph-member-bar__account {
    grid-template-columns: minmax(0, 1fr) 72px 72px;
    gap: 7px;
    align-items: stretch;
  }

  .dr88aph-member-bar__turns,
  .dr88aph-account-menu,
  .dr88aph-account-menu > summary.dr88aph-member-bar__action {
    box-sizing: border-box;
    width: 72px;
    min-width: 72px;
    max-width: 72px;
    min-height: 50px;
    height: 50px;
  }

  .dr88aph-member-bar__turns {
    place-content: center;
    padding: 6px 5px;
    border-radius: 10px;
  }

  .dr88aph-member-bar__turns b {
    font-size: 17px;
    line-height: 19px;
  }

  .dr88aph-member-bar__turns small {
    font-size: 9px;
    line-height: 11px;
    white-space: nowrap;
  }

  .dr88aph-account-menu {
    display: block;
    margin: 0;
  }

  .dr88aph .dr88aph-account-menu > summary.dr88aph-member-bar__action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 6px 5px;
    border-radius: 10px;
    font-size: 9.5px;
    line-height: 12px;
    text-align: center;
  }

  /* Wheel history: cleaner refresh control and clear separation from the prize showcase. */
  .dr88aph[data-view="wheel"] .dr88aph-spin-history {
    margin-top: 14px;
    margin-bottom: 16px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-spin-history > header {
    min-height: 58px;
    gap: 10px;
    padding: 10px 12px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-spin-history h2 {
    min-width: 0;
    font-size: 16px;
    line-height: 21px;
    white-space: normal;
  }

  .dr88aph[data-view="wheel"] .dr88aph-spin-history > header > button[data-spin-history-refresh] {
    flex: 0 0 auto;
    min-width: 90px;
    width: 90px;
    min-height: 34px;
    height: 34px;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255, 224, 109, 0.86);
    border-radius: 9px;
    background: rgba(255, 248, 231, 0.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.10);
    color: #fff8e7;
    font-size: 11px;
    line-height: 14px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-spin-history > header > button[data-spin-history-refresh] svg {
    width: 14px;
    height: 14px;
    flex-basis: 14px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-spin-history > header > button[data-spin-history-refresh]:hover,
  .dr88aph[data-view="wheel"] .dr88aph-spin-history > header > button[data-spin-history-refresh]:active {
    background: rgba(255, 227, 76, 0.14);
    transform: none;
  }

  .dr88aph[data-view="wheel"] .dr88aph-spin-history + .dr88aph-wheel-prize-catalog {
    margin-top: 0;
  }
}


/* V1.18.89 — desktop header shell cleanup: remove translucent/ghost layer around action buttons. */
@media (min-width: 1101px) {
  .dr88aph-header > .dr88aph-header__inner,
  .dr88aph-header .dr88aph-header__inner {
    padding-top: 6px;
    padding-right: 6px;
    padding-bottom: 6px;
    background: #ffffff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .dr88aph-header__actions {
    align-self: stretch;
    align-items: center;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .dr88aph-header__actions::before,
  .dr88aph-header__actions::after {
    content: none !important;
    display: none !important;
  }
}


/* V1.18.90 — desktop action shell removal: buttons sit directly on the wine background. */
@media (min-width: 1101px) {
  .dr88aph-header > .dr88aph-header__inner,
  .dr88aph-header .dr88aph-header__inner {
    gap: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  .dr88aph-header .dr88aph-brand {
    align-self: stretch;
    min-height: 58px;
    padding: 7px 0 7px 14px;
    border-radius: 16px 0 0 16px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(18, 1, 4, 0.20);
  }

  .dr88aph-header .dr88aph-main-nav {
    align-self: stretch;
    min-height: 58px;
    padding: 7px 12px;
    border-radius: 0 16px 16px 0;
    background: #fff;
    box-shadow: 10px 16px 38px rgba(18, 1, 4, 0.20);
  }

  .dr88aph-header .dr88aph-header__actions {
    margin-left: 10px;
    overflow: visible !important;
  }
}

/* V1.18.94 — prediction rail pages and a single, calm header surface. */
.dr88aph-header__inner {
  box-shadow: 0 5px 16px rgba(18, 1, 4, 0.14);
}

@media (min-width: 1101px) {
  .dr88aph[data-view="matches"] .dr88aph-match-grid {
    display: flex;
    width: 100%;
    min-width: 100%;
    gap: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-page {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(2, auto);
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
    gap: 12px;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-page > .dr88aph-match.is-compact {
    width: auto;
    min-width: 0;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score {
    gap: 6px;
    margin: 8px 0 4px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-score > strong {
    min-width: 76px;
    min-height: 46px;
    padding: 5px 9px;
    border-radius: 11px;
    font-size: 24px;
    line-height: 28px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary {
    gap: 5px;
    padding: 3px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary__eyebrow {
    min-height: 20px;
    padding: 2px 8px;
    box-shadow: none;
    font-size: 8px;
    line-height: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary__body {
    gap: 6px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary__metric {
    min-height: 52px;
    gap: 2px;
    padding: 6px;
    border-radius: 9px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary__metric > span {
    font-size: 9px;
    line-height: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary__metric > strong {
    font-size: 19px;
    line-height: 22px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match[data-status="result_published"] .dr88aph-result-summary__metric.is-market > strong {
    font-size: 13px;
    line-height: 17px;
  }

  .dr88aph-header > .dr88aph-header__inner,
  .dr88aph-header .dr88aph-header__inner {
    gap: 12px !important;
    min-height: 58px;
    padding: 7px 10px 7px 14px !important;
    overflow: visible !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 6px 18px rgba(18, 1, 4, 0.16) !important;
  }

  .dr88aph-header .dr88aph-brand,
  .dr88aph-header .dr88aph-main-nav {
    align-self: center;
    min-height: 44px;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .dr88aph-header .dr88aph-main-nav {
    flex: 1 1 auto;
    min-width: 0;
  }

  .dr88aph-header .dr88aph-header__actions {
    align-self: center;
    min-height: 0;
    margin-left: auto;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 1100px) {
}


/* V1.18.95 — mobile prediction batches: four matches per rail page and compact filter row. */
.dr88aph-filter-label-short { display: none; }
.dr88aph-match-mobile-page { display: contents; }

@media (max-width: 1100px) {
  .dr88aph[data-view="matches"] .dr88aph-match-grid {
    display: flex;
    align-items: flex-start;
    width: 100%;
    min-width: 100%;
    gap: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-page { display: contents; }

  .dr88aph[data-view="matches"] .dr88aph-match-mobile-page {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
    gap: 12px;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-mobile-page > .dr88aph-match.is-compact {
    width: auto;
    min-width: 0;
  }
}

@media (max-width: 680px) {
  .dr88aph[data-view="matches"] .dr88aph-match-toolbar .dr88aph-filters {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-toolbar .dr88aph-filters a {
    min-width: 0;
    min-height: 42px;
    padding: 7px 3px;
    font-size: 10.5px;
    line-height: 14px;
    white-space: nowrap;
  }

  .dr88aph[data-view="matches"] .dr88aph-filter-label-long { display: none; }
  .dr88aph[data-view="matches"] .dr88aph-filter-label-short { display: inline; }

  .dr88aph[data-view="matches"] .dr88aph-match-mobile-page {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-rail-controls output {
    min-width: 92px;
  }
}

/* V1.18.96 — desktop regression fix after mobile four-match batching.
 * Keep the mobile batch wrapper structurally transparent on desktop and restore
 * the original 4 x 2 desktop grid sizing for the nested match cards. */
@media (min-width: 1101px) {
  .dr88aph[data-view="matches"] .dr88aph-match-page > .dr88aph-match-mobile-page {
    display: contents;
  }

  .dr88aph[data-view="matches"] .dr88aph-match-page > .dr88aph-match-mobile-page > .dr88aph-match.is-compact {
    flex: initial;
    width: auto;
    min-width: 0;
    max-width: none;
  }
}

/* 1.18.97 — dedicated no-prize / "Chúc may mắn" wheel state. */
.dr88aph-wheel-card.is-luck {
  --dr88aph-prize-accent: #ffe06b;
  border-color: rgba(255, 224, 107, 0.72);
  background:
    radial-gradient(circle at 50% 27%, rgba(255, 235, 143, 0.2), transparent 34%),
    linear-gradient(155deg, #731318 0%, #3d0508 58%, #190103 100%);
  box-shadow: 0 13px 24px rgba(0, 0, 0, 0.58), 0 0 0 1px rgba(255, 214, 82, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}
.dr88aph-wheel-card.is-luck::before {
  background:
    radial-gradient(circle at 24% 24%, rgba(255,255,255,.7) 0 1px, transparent 2px),
    radial-gradient(circle at 74% 38%, rgba(255,225,104,.75) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 60% 13%, rgba(255,255,255,.55) 0 1px, transparent 2px),
    linear-gradient(125deg, transparent 30%, rgba(255, 227, 76, 0.18) 62%, transparent 84%);
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual { color: #ffe886; }
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual svg {
  width: 74px;
  height: 74px;
  fill: rgba(255, 224, 107, 0.15);
  stroke: #ffe886;
  filter: drop-shadow(0 0 10px rgba(255, 224, 107, 0.42)) drop-shadow(0 9px 12px rgba(0,0,0,.5));
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual small {
  border-color: rgba(255, 224, 107, 0.7);
  background: rgba(67, 6, 10, 0.9);
  color: #fff3b1;
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info {
  border-top-color: #ffe06b;
  background: linear-gradient(95deg, #821019, #4b0509);
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info strong { color: #fff5bd; }
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info small { color: #f6d876; }
.dr88aph-wheel-result.is-no-win {
  border: 1px solid rgba(194, 133, 13, 0.34);
  background: linear-gradient(135deg, #fff8dd, #fff0b9);
  box-shadow: 0 8px 24px rgba(126, 81, 0, 0.1);
}
.dr88aph-wheel-result.is-no-win strong { color: #7e5200; }
.dr88aph-wheel-result.is-no-win strong > small { color: #9a6b0b; }
.dr88aph-spin-history__image.is-no-prize {
  display: grid;
  place-items: center;
  border-color: rgba(214, 163, 42, .42);
  background: linear-gradient(145deg, #fff9df, #ffefb8);
  color: #8a5c00;
  font-size: 21px;
  line-height: 1;
}
.dr88aph-spin-history__status.is-no_prize,
.dr88aph-spin-history__status.is-no-prize {
  border-color: rgba(214, 163, 42, .38);
  background: #fff6d5;
  color: #7b5300;
}


/* 1.18.98 — cleanup: keep wheel availability sentence on one desktop line. */
@media (min-width: 821px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-actions p[data-wheel-status] {
    width: auto;
    max-width: none;
    white-space: nowrap;
    text-wrap: nowrap;
  }
}


/* 1.19.00 — refine no-prize "Chúc may mắn" card with DR88 gold logo and single-line helper text. */
.dr88aph-wheel-card.is-luck {
  background:
    radial-gradient(circle at 50% 22%, rgba(255, 233, 154, 0.34), transparent 34%),
    linear-gradient(145deg, #7d1418 0%, #4b080c 54%, #260204 100%);
  box-shadow: 0 14px 28px rgba(0,0,0,.58), 0 0 0 1px rgba(255,214,82,.22), inset 0 1px 0 rgba(255,255,255,.18);
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual.has-prize-image {
  padding-top: 8px;
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual .dr88aph-prize-image-crop {
  width: min(100%, 118px);
  display: grid;
  place-items: center;
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual img {
  width: 82px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 12px rgba(255, 220, 90, 0.44)) drop-shadow(0 10px 16px rgba(0,0,0,.42));
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__visual small {
  border-color: rgba(255, 221, 110, 0.82);
  background: linear-gradient(180deg, rgba(108, 10, 13, 0.96), rgba(61, 4, 7, 0.96));
  color: #fff2ab;
  letter-spacing: .18em;
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info {
  border-top-color: #ffd54c;
  background: linear-gradient(95deg, #8f1118, #56070c);
  box-shadow: 0 -10px 18px rgba(255, 195, 56, 0.14);
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info strong {
  color: #fff4b7;
  text-align: center;
  min-height: 0;
}
.dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info small {
  color: #ffe08a;
  text-align: center;
  text-transform: none;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 8px;
  line-height: 1.2;
}
@media (min-width: 821px) {
  .dr88aph[data-view="wheel"] .dr88aph-wheel-card.is-luck .dr88aph-wheel-card__info small {
    font-size: 8.5px;
  }
}


/* 1.19.01 — clear spacing between wheel history and featured prize catalog. */
.dr88aph[data-view="wheel"] .dr88aph-spin-history + .dr88aph-wheel-prize-catalog,
.dr88aph[data-view="wheel"] [data-spin-history] + .dr88aph-wheel-prize-catalog,
.dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog.is-wheel-showcase {
  margin-top: 18px !important;
}
.dr88aph[data-view="wheel"] .dr88aph-spin-history {
  margin-bottom: 0;
}
@media (max-width: 820px) {
  .dr88aph[data-view="wheel"] .dr88aph-spin-history + .dr88aph-wheel-prize-catalog,
  .dr88aph[data-view="wheel"] [data-spin-history] + .dr88aph-wheel-prize-catalog,
  .dr88aph[data-view="wheel"] .dr88aph-wheel-prize-catalog.is-wheel-showcase {
    margin-top: 14px !important;
  }
}


/* 1.19.02 — mobile prize dialog polish */
.dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close {
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  border-width: 1px;
  background: rgba(80, 0, 6, 0.62);
  box-shadow: 0 6px 18px rgba(0,0,0,.22);
}
.dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close svg {
  width: 15px;
  height: 15px;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero {
  padding-right: 58px;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__copy {
  gap: 4px;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero [data-prize-dialog-result] {
  margin-top: 2px;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-group {
  border-radius: 16px;
  background: linear-gradient(180deg, #fffdfa 0%, #fdf7ef 100%);
}
.dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid textarea {
  min-height: 72px;
}
.dr88aph .dr88aph-profile-reward-cta {
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 16px;
  text-align: left;
}
.dr88aph .dr88aph-profile-reward-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
  flex: 1 1 auto;
}
.dr88aph .dr88aph-profile-reward-cta strong,
.dr88aph .dr88aph-profile-reward-cta small {
  display: block;
}
.dr88aph .dr88aph-profile-reward-cta strong {
  font-size: 16px;
  line-height: 1.22;
  color: #fff8ee;
}
.dr88aph .dr88aph-profile-reward-cta strong > span {
  display: block;
  margin-top: 2px;
  color: #ffe366;
}
.dr88aph .dr88aph-profile-reward-cta small {
  margin-top: 0;
  font-size: 12px;
  line-height: 1.32;
  color: #f5e6c8;
}
.dr88aph .dr88aph-profile-reward-cta svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  align-self: center;
}
@media (max-width: 600px) {
  .dr88aph .dr88aph-prize-dialog {
    width: min(100vw - 14px, 420px);
    max-height: calc(100dvh - 14px);
    border-radius: 18px;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero {
    min-height: 0;
    padding: 16px 54px 14px 14px;
    gap: 8px;
    align-items: flex-start;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__copy h2 {
    font-size: 24px;
    line-height: 1.08;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero [data-prize-dialog-result] > strong {
    font-size: 13px;
    line-height: 1.25;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero [data-prize-dialog-result] > small {
    font-size: 10px;
    line-height: 1.2;
    letter-spacing: .03em;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__body {
    padding: 10px;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-group {
    padding: 10px;
    border-radius: 14px;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-group legend {
    font-size: 11px;
    line-height: 1.2;
    padding: 0 8px;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid label > .dr88aph-field-label {
    font-size: 11px;
    line-height: 1.3;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid input,
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid input[type="tel"],
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid textarea {
    font-size: 14px;
    line-height: 1.35;
    padding: 11px 12px;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-claim-grid textarea {
    min-height: 74px;
  }
  .dr88aph .dr88aph-profile-reward-cta {
    gap: 10px;
    padding: 12px 14px;
    border-radius: 15px;
  }
  .dr88aph .dr88aph-profile-reward-copy {
    gap: 4px;
  }
  .dr88aph .dr88aph-profile-reward-cta strong {
    font-size: 15px;
    line-height: 1.2;
  }
  .dr88aph .dr88aph-profile-reward-cta strong > span {
    font-size: 15px;
  }
  .dr88aph .dr88aph-profile-reward-cta small {
    font-size: 11px;
    line-height: 1.3;
  }
  .dr88aph .dr88aph-prize-dialog__disclaimer {
    font-size: 12px;
    line-height: 1.45;
  }
}


/* 1.19.03 — concise reward CTA: action + benefit only. */
.dr88aph .dr88aph-profile-reward-cta {
  min-height: 72px;
  padding-block: 12px;
}
.dr88aph .dr88aph-profile-reward-copy { gap: 0; }
.dr88aph .dr88aph-profile-reward-cta strong { margin: 0; }
@media (max-width: 600px) {
  .dr88aph .dr88aph-profile-reward-cta {
    min-height: 70px;
    padding: 11px 14px;
  }
}



/* 1.19.05 — move close button to a cleaner modal-corner treatment. */
.dr88aph .dr88aph-prize-dialog {
  position: relative;
}
.dr88aph .dr88aph-prize-dialog > form:first-child {
  position: absolute;
  z-index: 8;
  top: 0;
  right: 0;
}
.dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close {
  width: 26px;
  height: 26px;
  min-width: 26px;
  min-height: 26px;
  top: 10px;
  right: 10px;
  border-radius: 999px;
  border: 1px solid rgba(214, 171, 63, 0.44);
  background: rgba(255, 248, 238, 0.96);
  color: #761016;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.8);
}
.dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close:hover,
.dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close:focus-visible {
  background: #fffdf8;
  border-color: rgba(214, 171, 63, 0.64);
  color: #5d0b0f;
  box-shadow: 0 8px 18px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.9);
}
.dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close svg {
  width: 10px;
  height: 10px;
}
.dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero {
  padding-right: 46px;
}
@media (max-width: 600px) {
  .dr88aph .dr88aph-prize-dialog > form:first-child .dr88aph-dialog__close {
    top: 10px;
    right: 10px;
    width: 25px;
    height: 25px;
    min-width: 25px;
    min-height: 25px;
  }
  .dr88aph .dr88aph-prize-dialog .dr88aph-prize-dialog__hero {
    padding-right: 42px;
  }
}


/* 1.19.01 — Final fixture follows natural chronological grid flow.
 * Published matches are removed server-side; the Final automatically shifts
 * forward into the next available grid cell on desktop and mobile. */
.dr88aph[data-view="home"] .dr88aph-fixture-tab.is-final {
  grid-column: auto !important;
}


/* 1.19.02 — prominent onboarding CTA on prediction page. */
.dr88aph-prediction-guide-cta {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin: 12px 0 14px;
  padding: 10px 12px;
  border: 1px solid rgba(217, 156, 30, 0.62);
  border-radius: 14px;
  background:
    radial-gradient(circle at 7% 25%, rgba(255, 215, 83, .24), transparent 28%),
    linear-gradient(100deg, #fff8e7 0%, #fffdf8 56%, #fff2c8 100%);
  box-shadow: 0 6px 18px rgba(111, 55, 5, .08), inset 0 1px 0 rgba(255,255,255,.85);
  color: #6f090e;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.dr88aph-prediction-guide-cta:hover,
.dr88aph-prediction-guide-cta:focus-visible {
  border-color: rgba(202, 125, 5, .78);
  box-shadow: 0 9px 22px rgba(111, 55, 5, .12), inset 0 1px 0 rgba(255,255,255,.9);
  transform: translateY(-1px);
}
.dr88aph-prediction-guide-cta__icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: linear-gradient(145deg, #a70b13, #650509);
  box-shadow: 0 5px 12px rgba(105, 4, 9, .2), inset 0 1px 0 rgba(255,255,255,.14);
  color: #ffe06b;
  font-size: 20px;
  font-weight: 900;
  line-height: 1;
}
.dr88aph-prediction-guide-cta__copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.dr88aph-prediction-guide-cta__copy small {
  color: #9d6b17;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.2;
  letter-spacing: .08em;
}
.dr88aph-prediction-guide-cta__copy strong {
  color: #6f090e;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.3;
}
.dr88aph-prediction-guide-cta__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 10px;
  background: #850910;
  color: #fff7e5;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}
.dr88aph-prediction-guide-cta__action svg {
  width: 14px;
  height: 14px;
}
@media (max-width: 680px) {
  .dr88aph-prediction-guide-cta {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 8px;
    margin: 10px 0 12px;
    padding: 9px 10px;
    border-radius: 13px;
  }
  .dr88aph-prediction-guide-cta__icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 18px;
  }
  .dr88aph-prediction-guide-cta__copy small {
    font-size: 9px;
  }
  .dr88aph-prediction-guide-cta__copy strong {
    font-size: 12px;
    line-height: 1.25;
  }
  .dr88aph-prediction-guide-cta__action {
    min-height: 32px;
    padding: 6px 8px;
  }
  .dr88aph-prediction-guide-cta__action svg {
    width: 12px;
    height: 12px;
  }
}
@media (max-width: 390px) {
  .dr88aph-prediction-guide-cta {
    grid-template-columns: 32px minmax(0, 1fr) 46px;
  }
  .dr88aph-prediction-guide-cta__action {
    width: 46px;
    padding-inline: 0;
  }
}


/* 1.19.03 — prediction guide CTA responsive polish. */
.dr88aph-prediction-guide-cta__action {
  position: relative;
  isolation: isolate;
  min-width: 112px;
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid rgba(255, 215, 90, 0.34);
  border-radius: 12px;
  background: linear-gradient(135deg, #a30a12 0%, #79070d 72%, #5b0408 100%);
  box-shadow: 0 7px 16px rgba(111, 6, 11, .2), inset 0 1px 0 rgba(255,255,255,.14);
  font-size: 12px;
  letter-spacing: .02em;
  overflow: hidden;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.dr88aph-prediction-guide-cta__action::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: -65%;
  left: -40%;
  width: 34%;
  height: 230%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
  transform: rotate(18deg);
  transition: left .45s ease;
}
.dr88aph-prediction-guide-cta:hover .dr88aph-prediction-guide-cta__action,
.dr88aph-prediction-guide-cta:focus-visible .dr88aph-prediction-guide-cta__action {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(111, 6, 11, .28), inset 0 1px 0 rgba(255,255,255,.18);
}
.dr88aph-prediction-guide-cta:hover .dr88aph-prediction-guide-cta__action::after,
.dr88aph-prediction-guide-cta:focus-visible .dr88aph-prediction-guide-cta__action::after {
  left: 118%;
}
.dr88aph-prediction-guide-cta:hover .dr88aph-prediction-guide-cta__action svg,
.dr88aph-prediction-guide-cta:focus-visible .dr88aph-prediction-guide-cta__action svg {
  transform: translateX(3px);
}
.dr88aph-prediction-guide-cta__action svg {
  transition: transform .16s ease;
}
@media (max-width: 680px) {
  .dr88aph-prediction-guide-cta {
    grid-template-columns: 34px minmax(0, 1fr) 64px;
  }
  .dr88aph-prediction-guide-cta__action {
    min-width: 64px;
    width: 64px;
    min-height: 34px;
    padding: 7px 8px;
    gap: 4px;
    border-radius: 9px;
    font-size: 9px;
  }
  .dr88aph-prediction-guide-cta__action svg {
    width: 11px;
    height: 11px;
  }
}
@media (max-width: 390px) {
  .dr88aph-prediction-guide-cta {
    grid-template-columns: 32px minmax(0, 1fr) 60px;
    gap: 7px;
  }
  .dr88aph-prediction-guide-cta__action {
    width: 60px;
    min-width: 60px;
    padding-inline: 7px;
    font-size: 0;
  }
  .dr88aph-prediction-guide-cta__action::before {
    content: 'XEM';
    font-size: 9px;
    line-height: 1;
  }
  .dr88aph-prediction-guide-cta__action svg {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .dr88aph-prediction-guide-cta__action,
  .dr88aph-prediction-guide-cta__action::after,
  .dr88aph-prediction-guide-cta__action svg {
    transition: none;
  }
}



/* 1.20.06 — mobile bottom-nav: keep uppercase labels on a single line with smaller text, no wrapping. */
@media (max-width: 680px) {
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link:hover,
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link.is-active {
    grid-template-rows: 30px 14px !important;
    min-width: 0 !important;
    overflow: hidden;
    min-height: 58px !important;
    padding: 4px 0 !important;
    gap: 1px !important;
  }

  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > span {
    display: block !important;
    box-sizing: border-box;
    overflow-wrap: normal !important;
    word-break: normal !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 14px !important;
    min-height: 14px !important;
    padding: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    text-wrap: nowrap !important;
    line-height: 14px !important;
    font-size: 8px !important;
    letter-spacing: -0.02em !important;
    text-align: center !important;
  }

  .dr88aph .dr88aph-main-nav .dr88aph-nav-link.is-top > span::after {
    font-size: 8px !important;
    line-height: 14px !important;
  }
}

@media (max-width: 380px) {
  .dr88aph .dr88aph-main-nav > .dr88aph-nav-link > span,
  .dr88aph .dr88aph-main-nav .dr88aph-nav-link.is-top > span::after {
    font-size: 7.5px !important;
    letter-spacing: -0.025em !important;
  }
}

/* 1.20.15 — smart member alerts: valid CSS + stable placement below member bar. */
.dr88aph-member-alerts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: min(100% - 24px, var(--dr88-shell, 1180px));
  margin: 8px auto 10px;
  padding: 0;
}
.dr88aph-member-alerts[hidden] { display: none !important; }
.dr88aph-member-alert {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 58px;
  padding: 10px 12px;
  overflow: hidden;
  border: 1px solid rgba(177, 124, 14, .28);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255,252,241,.99), rgba(255,246,220,.99));
  box-shadow: 0 7px 20px rgba(60, 24, 0, .11);
  color: #4b1015;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.dr88aph-member-alert:hover,
.dr88aph-member-alert:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(177, 124, 14, .46);
  box-shadow: 0 10px 24px rgba(60, 24, 0, .14);
}
.dr88aph-member-alert.is-prize {
  border-color: rgba(161, 8, 17, .25);
  background: linear-gradient(135deg, #fffaf0, #fff1d7);
}
.dr88aph-member-alert__badge {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #970b13;
  color: #ffe66f;
  font-size: 17px;
  line-height: 1;
  box-shadow: inset 0 0 0 1px rgba(255,224,105,.35);
}
.dr88aph-member-alert.is-top .dr88aph-member-alert__badge {
  background: linear-gradient(145deg, #8d0a12, #5f070b);
}
.dr88aph-member-alert__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.dr88aph-member-alert__copy strong {
  color: #8f0912;
  font-size: 12px;
  line-height: 16px;
  font-weight: 900;
}
.dr88aph-member-alert__copy small {
  overflow: hidden;
  color: #5f5b60;
  font-size: 10px;
  line-height: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dr88aph-member-alert__cta {
  flex: 0 0 auto;
  color: #8f0912;
  font-size: 10px;
  line-height: 14px;
  font-weight: 900;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .dr88aph-member-alerts {
    grid-template-columns: 1fr;
    gap: 6px;
    width: calc(100% - 20px);
    margin-top: 6px;
    margin-bottom: 8px;
  }
  .dr88aph-member-alert {
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 8px;
    min-height: 52px;
    padding: 8px 10px;
    border-radius: 12px;
  }
  .dr88aph-member-alert__badge {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 15px;
  }
  .dr88aph-member-alert__copy strong {
    font-size: 11px;
    line-height: 14px;
  }
  .dr88aph-member-alert__copy small {
    font-size: 9px;
    line-height: 12px;
  }
  .dr88aph-member-alert__cta {
    font-size: 9px;
    line-height: 12px;
  }
}
@media (max-width: 390px) {
  .dr88aph-member-alert {
    grid-template-columns: 28px minmax(0, 1fr);
  }
  .dr88aph-member-alert__badge {
    width: 28px;
    height: 28px;
  }
  .dr88aph-member-alert__copy small {
    white-space: normal;
  }
  .dr88aph-member-alert__cta {
    grid-column: 2;
    justify-self: start;
    margin-top: 1px;
  }
}


/* 1.20.16 — desktop member alerts: if only one alert is visible, let it span full width for cleaner balance. */
@media (min-width: 761px) {
  .dr88aph-member-alerts[data-visible-count="1"] {
    grid-template-columns: minmax(0, 1fr);
  }

  .dr88aph-member-alerts[data-visible-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* Division 2 has a separate presentation but uses the same scoring and reward policy. */
.dr88aph .dr88aph-division-switch {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px;
  margin: 12px 0 10px;
}
.dr88aph .dr88aph-division-switch > a {
  display: grid; gap: 3px; align-content: center; min-width: 0; min-height: 56px;
  padding: 9px 14px; border: 1px solid #e5c993; border-radius: 12px;
  background: #fffaf2; color: #63151c; font-size: 13px; font-weight: 900;
  line-height: 17px; text-decoration: none; transition: .2s ease;
}
.dr88aph .dr88aph-division-switch > a small { font-size: 10px; font-weight: 750; color: #987443; line-height: 14px; }
.dr88aph .dr88aph-division-switch > a.is-active {
  border-color: #c89a38; background: linear-gradient(115deg, #790811, #420609);
  color: #fff2d0; box-shadow: 0 4px 13px #6e070d22;
}
.dr88aph .dr88aph-division-switch > a.is-active small { color: #f6d996; }
.dr88aph .dr88aph-division-switch > a:hover { transform: translateY(-1px); box-shadow: 0 6px 16px #6e070d18; }
.dr88aph .dr88aph-div2-note {
  display: grid; gap: 4px; margin: 0 0 12px; padding: 11px 13px;
  background: #fff6dc; border: 1px solid #eec878; border-left: 4px solid #a30c16;
  border-radius: 10px; color: #674123; font-size: 11px; line-height: 1.55;
}
.dr88aph .dr88aph-div2-note strong { color: #870a13; font-size: 12px; }
.dr88aph .dr88aph-div2-home-teaser {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  margin: 12px 0 0; padding: 12px 16px; border: 1px solid #d3a349; border-radius: 13px;
  background: linear-gradient(115deg, #650711 0%, #9d1320 75%, #60040d 100%);
  color: #fff3d6; text-decoration: none; box-shadow: 0 6px 20px #42000023;
}
.dr88aph .dr88aph-div2-home-teaser > span { display: grid; gap: 3px; min-width: 0; }
.dr88aph .dr88aph-div2-home-teaser small { color: #f9d38b; font-size: 10px; font-weight: 750; }
.dr88aph .dr88aph-div2-home-teaser strong { font-size: 13px; line-height: 17px; color: #fffaf0; }
.dr88aph .dr88aph-div2-home-teaser em { font-style: normal; font-size: 10px; color: #f8d7b0; line-height: 14px; }
.dr88aph .dr88aph-div2-home-teaser > b { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; color: #fff2c8; font-size: 10px; white-space: nowrap; }
.dr88aph .dr88aph-div2-home-teaser > b svg { width: 14px; }
@media(max-width:680px) {
  .dr88aph .dr88aph-division-switch { gap: 6px; margin-block: 10px; }
  .dr88aph .dr88aph-division-switch > a { padding: 8px 9px; min-height: 53px; font-size: 11px; line-height: 14px; }
  .dr88aph .dr88aph-division-switch > a small { font-size: 9px; line-height: 12px; }
  .dr88aph .dr88aph-div2-home-teaser { margin-top: 9px; padding: 10px 11px; gap: 7px; }
  .dr88aph .dr88aph-div2-home-teaser strong { font-size: 11px; line-height: 15px; }
  .dr88aph .dr88aph-div2-home-teaser em { font-size: 9px; }
  .dr88aph .dr88aph-div2-home-teaser > b { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) { .dr88aph .dr88aph-division-switch > a { transition: none; } }

/* Three balanced filter pills for the extra division, without touching the 5 main chips. */
.dr88aph .dr88aph-match-toolbar.is-div2 .dr88aph-filters { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); }
@media (max-width: 680px) {
  .dr88aph[data-view="matches"] .dr88aph-match-toolbar.is-div2 .dr88aph-filters { grid-template-columns: repeat(4, minmax(0,1fr)); }
}


/* 1.20.20 — Desktop Division 2 teaser visibility fix.
 * The older desktop hero was height-capped with minmax(0, 1fr). Adding the
 * Division 2 CTA made its content taller than the first grid row, so the
 * schedule (row two) visually covered the CTA. Allow natural height only
 * when the extra CTA exists; leave the original desktop/mobile hero intact. */
@media (min-width: 1101px) {
  .dr88aph[data-view="home"] .dr88aph-home.has-div2-teaser {
    height: auto;
    min-height: 0;
    grid-template-rows: minmax(min-content, auto) auto;
  }

  .dr88aph[data-view="home"] .dr88aph-home.has-div2-teaser > .dr88aph-home__content {
    grid-column: 2;
    grid-row: 1;
    align-self: stretch;
    padding-bottom: 22px;
  }

  .dr88aph[data-view="home"] .dr88aph-home.has-div2-teaser > .dr88aph-home__poster {
    grid-column: 1;
    grid-row: 1;
    height: auto;
    min-height: 0;
    align-self: stretch;
  }

  .dr88aph[data-view="home"] .dr88aph-home.has-div2-teaser > .dr88aph-home__poster picture,
  .dr88aph[data-view="home"] .dr88aph-home.has-div2-teaser > .dr88aph-home__poster img {
    height: 100%;
    min-height: 0;
  }

  .dr88aph[data-view="home"] .dr88aph-home.has-div2-teaser > .dr88aph-home__schedule {
    grid-column: 1 / -1;
    grid-row: 2;
    position: relative;
    z-index: 0;
  }
}


/* 1.20.25 — symmetric footer cards: same geometry, baseline and typography. */
.dr88aph .dr88aph-footer > .dr88aph-shell {
  align-items: stretch;
  gap: 16px;
}
.dr88aph .dr88aph-footer__base,
.dr88aph .dr88aph-footer__trust {
  box-sizing: border-box;
  min-width: 0;
  margin: 0;
  align-self: stretch;
}
.dr88aph .dr88aph-footer__base {
  display: flex;
  align-items: stretch;
}
.dr88aph .dr88aph-footer__support,
.dr88aph .dr88aph-footer__trust {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 18px;
  align-items: center;
  column-gap: 10px;
  width: 100%;
  height: 54px;
  min-height: 54px;
  padding: 8px 12px;
  border-radius: 12px;
}
.dr88aph .dr88aph-footer__support-icon,
.dr88aph .dr88aph-footer__trust-icon {
  box-sizing: border-box;
  display: grid;
  place-items: center;
  justify-self: center;
  width: 34px;
  height: 34px;
  flex: none;
}
.dr88aph .dr88aph-footer__trust-icon > svg {
  display: block;
  width: 28px;
  height: 28px;
  color: #f0c95f;
}
.dr88aph .dr88aph-footer__support-copy,
.dr88aph .dr88aph-footer__trust-copy {
  display: grid;
  align-content: center;
  min-width: 0;
  gap: 1px;
}
.dr88aph .dr88aph-footer__support-copy strong,
.dr88aph .dr88aph-footer__trust-copy strong {
  font-size: 13px;
  font-weight: 850;
  line-height: 17px;
}
.dr88aph .dr88aph-footer__support-copy small,
.dr88aph .dr88aph-footer__trust-copy small {
  font-size: 11px;
  font-weight: 650;
  line-height: 15px;
}
/* Reserve the same 18px trailing slot as Telegram's arrow; this card is not clickable. */
.dr88aph .dr88aph-footer__trust::after {
  content: '';
  display: block;
  width: 18px;
  height: 18px;
}
@media (max-width: 680px) {
  .dr88aph .dr88aph-footer > .dr88aph-shell {
    gap: 10px;
  }
}

/* 1.20.46 — public, privacy-safe winner ticker on the wheel page. */
.dr88aph[data-view="wheel"] .dr88aph-winner-ticker {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: stretch;
  min-height: 52px;
  margin: -3px 0 15px;
  overflow: hidden;
  border: 1px solid #e2ba57;
  border-radius: 13px;
  background: #fffdf6;
  box-shadow: 0 8px 18px rgba(91, 8, 12, 0.10), inset 0 1px 0 rgba(255,255,255,0.48);
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label {
  display: inline-flex;
  align-items: center;
  align-self: stretch;
  gap: 7px;
  padding: 8px 15px;
  color: #fff3c7;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.025em;
  line-height: 15px;
  text-decoration: none;
  white-space: nowrap;
  background: linear-gradient(100deg, #5e060a 0%, #860b10 100%);
}

.dr88aph[data-view="wheel"] a.dr88aph-winner-ticker__label:hover,
.dr88aph[data-view="wheel"] a.dr88aph-winner-ticker__label:focus-visible {
  color: #fff;
  background: rgba(255,255,255,0.09);
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label > .dr88aph-winner-ticker__mark {
  position: relative;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border: 1px solid rgba(255,226,128,0.35);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.02) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), 0 4px 10px rgba(62, 4, 9, 0.20);
  color: transparent;
  font-size: 0;
  line-height: 1;
  overflow: hidden;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label > .dr88aph-winner-ticker__mark::before {
  content: '';
  width: 18px;
  height: 18px;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2264%22%20height%3D%2264%22%20viewBox%3D%220%200%2064%2064%22%20fill%3D%22none%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22a%22%20x1%3D%2216%22%20y1%3D%2218%22%20x2%3D%2248%22%20y2%3D%2249%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FFD86B%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23F6A800%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%2213%22%20y1%3D%2224%22%20x2%3D%2250%22%20y2%3D%2253%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FF6A61%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23C01821%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22c%22%20x1%3D%2224%22%20y1%3D%2212%22%20x2%3D%2239%22%20y2%3D%2230%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FFE58F%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23F3B000%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cellipse%20cx%3D%2232%22%20cy%3D%2255%22%20rx%3D%2218%22%20ry%3D%225%22%20fill%3D%22%237F0C12%22%20fill-opacity%3D%22.22%22/%3E%3Crect%20x%3D%2212%22%20y%3D%2222%22%20width%3D%2240%22%20height%3D%2212%22%20rx%3D%225%22%20fill%3D%22url%28%23a%29%22/%3E%3Cpath%20d%3D%22M14%2032a5%205%200%200%201%205-5h26a5%205%200%200%201%205%205v15a7%207%200%200%201-7%207H21a7%207%200%200%201-7-7V32Z%22%20fill%3D%22url%28%23b%29%22/%3E%3Cpath%20d%3D%22M28%2022h8v32h-8z%22%20fill%3D%22%23FFE07B%22/%3E%3Cpath%20d%3D%22M22.5%2014.2c3.6-1.9%207.1.8%209.5%205.2-4.3%201.7-8.2%202.2-10.8%201-.8-.4-1.4-1.2-1.7-2.1-.7-2%20.2-3.2%203-4.1Z%22%20fill%3D%22url%28%23c%29%22/%3E%3Cpath%20d%3D%22M41.5%2014.2c-3.6-1.9-7.1.8-9.5%205.2%204.3%201.7%208.2%202.2%2010.8%201%20.8-.4%201.4-1.2%201.7-2.1.7-2-.2-3.2-3-4.1Z%22%20fill%3D%22url%28%23c%29%22/%3E%3Cpath%20d%3D%22M20%2027.5h24%22%20stroke%3D%22%23FFF2B4%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.55%22/%3E%3Cpath%20d%3D%22M19%2035.5h30%22%20stroke%3D%22%23FFB0A4%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.35%22/%3E%3C/svg%3E");
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__viewport {
  min-width: 0;
  overflow: hidden;
  outline: none;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__viewport:focus-visible {
  box-shadow: inset 0 0 0 3px rgba(181, 13, 22, 0.28);
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track {
  display: flex;
  align-items: stretch;
  width: max-content;
  min-width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  animation: dr88aph-winner-ticker 42s linear infinite;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  align-self: stretch;
  flex: 0 0 auto;
  gap: 6px;
  min-height: 52px;
  padding: 8px 26px;
  border-right: none;
  color: #76624b;
  font-size: 12px;
  line-height: 16px;
  white-space: nowrap;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track > li::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 1px;
  background: rgba(128, 84, 20, 0.16);
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track > li::before {
  content: '';
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: #d19a19;
  box-shadow: 0 0 0 3px rgba(209,154,25,0.12);
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track strong {
  color: #830a11;
  font-weight: 900;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track b {
  color: #302832;
  font-weight: 850;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track small {
  color: #9c8871;
  font-size: 10px;
  font-weight: 700;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__viewport:hover .dr88aph-winner-ticker__track,
.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__viewport:focus .dr88aph-winner-ticker__track {
  animation-play-state: paused;
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker.is-empty {
  grid-template-columns: max-content minmax(0, 1fr);
}

.dr88aph[data-view="wheel"] .dr88aph-winner-ticker.is-empty p {
  align-self: center;
  margin: 0;
  padding: 8px 16px;
  color: #796650;
  font-size: 12px;
  font-weight: 650;
  line-height: 17px;
}

/* 1.20.55 — one uniform ticker for confirmed event winners and system wins. */
.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__title-short { display: none; }
.dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track {
  animation-duration: var(--dr88-ticker-duration, 42s);
}
@media (max-width: 680px) {
  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label .dr88aph-winner-ticker__title-full { display: none; }
  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label .dr88aph-winner-ticker__title-short {
    display: inline; width: auto; height: auto; border: 0; border-radius: 0; color: inherit;
    font-size: inherit; line-height: inherit;
  }
}

@keyframes dr88aph-winner-ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 680px) {
  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker {
    min-height: 48px;
    margin: -5px 0 12px;
    border-radius: 11px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label {
    gap: 5px;
    padding-inline: 10px;
    font-size: 9.5px;
    letter-spacing: 0;
  }

  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label > .dr88aph-winner-ticker__mark {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__label > .dr88aph-winner-ticker__mark::before {
    width: 15px;
    height: 15px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track > li {
    min-height: 48px;
    gap: 5px;
    padding: 7px 18px;
    font-size: 11px;
    line-height: 15px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track small {
    font-size: 9px;
  }

  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker.is-empty p {
    padding-inline: 10px;
    font-size: 10.5px;
    line-height: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dr88aph[data-view="wheel"] .dr88aph-winner-ticker__track {
    animation: none;
  }
}