/* Quests, the live Growth book, and referrals share the left game column. */
body.layout-basic .play-grid > .quest-hub {
  grid-area: quests;
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: .375rem;
  padding: .55rem;
}
body.layout-basic .play-grid .quest-hub > app-quest-panel { display: block; min-width: 0; }
body.layout-basic .play-grid .quest-hub .app-quest-panel {
  height: auto;
  padding: 0;
  gap: .4rem;
  overflow: visible;
}
body.layout-basic .play-grid .quest-hub .qst-header {
  min-height: 2.4rem;
  gap: .3rem;
}
body.layout-basic .play-grid .quest-hub .qst-header h2 { font-size: 1rem; letter-spacing: .07em; }
body.layout-basic .play-grid .quest-hub .qst-streak-chip { padding: .25rem .4rem; }
body.layout-basic .play-grid .quest-hub .qst-score-control { min-width: 0; padding: .3rem .4rem; }
body.layout-basic .play-grid .quest-hub .qst-slots {
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: minmax(5.25rem, 1fr);
  gap: .375rem;
}
body.layout-basic .play-grid .quest-hub .qst-slot {
  container: quest-card / size;
  height: auto;
  min-height: 5.25rem;
  gap: .2rem;
  padding: .3rem .5rem;
  border-radius: 7px;
  box-shadow: inset 0 1px #ffffff09;
}
body.layout-basic .play-grid .quest-hub .qst-slot-role { font-size: .7rem; letter-spacing: .08em; }
body.layout-basic .play-grid .quest-hub .qst-slot-status { padding: .18rem .3rem; font-size: .7rem; letter-spacing: .025em; }
body.layout-basic .play-grid .quest-hub .qst-slot-core { gap: .4rem; }
body.layout-basic .play-grid .quest-hub .qst-slot-icon { flex-basis: 2rem; width: 2rem; height: 2rem; }
body.layout-basic .play-grid .quest-hub .qst-slot-icon img { width: 1.8rem; height: 1.8rem; }
body.layout-basic .play-grid .quest-hub .qst-slot-copy {
  flex: 1;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .2rem .4rem;
}
body.layout-basic .play-grid .quest-hub :is(.qst-slot-name, .qst-slot-note) { grid-column: 1 / -1; }
body.layout-basic .play-grid .quest-hub .qst-slot-name { font-size: .95rem; line-height: 1.2; }
body.layout-basic .play-grid .quest-hub .qst-slot-note { font-size: .75rem; }
body.layout-basic .play-grid .quest-hub .qst-slot-reward { gap: .2rem; font-size: .75rem; letter-spacing: 0; }
body.layout-basic .play-grid .quest-hub .qst-slot-reward-logo { width: .9rem; height: .9rem; flex-basis: .9rem; }
body.layout-basic .play-grid .quest-hub .qst-slot-reward-extra { font-size: .7rem; letter-spacing: .025em; white-space: nowrap; }
body.layout-basic .play-grid .quest-hub .qst-meter { height: .25rem; }

/* Use the space the card already has. Size containment keeps larger text
   from making the shared game row taller or changing the query's own size. */
@container quest-card (min-width: 18rem) and (min-height: 3.7rem) {
  body.layout-basic .play-grid .quest-hub .qst-slot-name { font-size: 1.1rem; }
}
@container quest-card (min-width: 14rem) and (min-height: 5.25rem) {
  body.layout-basic .play-grid .quest-hub .qst-slot-name { font-size: 1.15rem; }
}
@container quest-card (max-width: 15rem) {
  body.layout-basic .play-grid .quest-hub .qst-slot-copy { grid-template-columns: minmax(0, 1fr); }
}

body.layout-basic .play-grid .quest-hub__rewards { display: grid; gap: .375rem; min-width: 0; }
body.layout-basic .play-grid .quest-hub .side-bets-rail { margin: 0; min-width: 0; }
body.layout-basic .play-grid .quest-hub .side-bets-rail:not(:has(.has-live-book, .pari-error:not([hidden]))) { display: none; }
body.layout-basic .play-grid .quest-hub .app-parimutuel,
body.layout-basic .play-grid .quest-hub .pari-bet-container,
body.layout-basic .play-grid .quest-hub .pari-books {
  display: block;
  width: 100%;
  height: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.layout-basic .play-grid .quest-hub .pari-bet-container[hidden],
body.layout-basic .play-grid .quest-hub .pari-books[hidden] { display: none; }
/* Growth is a fourth quest: status, reward, and one short betting row. */
body.layout-basic .play-grid .quest-hub .pari-book {
  position: relative;
  display: grid;
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  grid-template-rows: auto auto 2rem auto;
  grid-template-areas: none;
  align-content: center;
  align-items: center;
  height: auto;
  min-height: 6.75rem;
  min-width: 0;
  margin: 0;
  padding: .35rem .5rem .55rem;
  gap: .2rem .4rem;
  border: 1px solid #dcae5e61;
  border-radius: 7px;
  background: radial-gradient(circle at 92% 12%, #dcae5e16, transparent 45%), linear-gradient(145deg, #dcae5e0d, #080a15a3);
  box-shadow: inset 0 1px #ffffff09;
}
body.layout-basic .play-grid .quest-hub .pari-book[hidden] { display: none; }
body.layout-basic .play-grid .quest-hub .pari-book__head,
body.layout-basic .play-grid .quest-hub .pari-today,
body.layout-basic .play-grid .quest-hub .pari-sides,
body.layout-basic .play-grid .quest-hub .pari-side { display: contents; }
body.layout-basic .play-grid .quest-hub .pari-quest__role {
  grid-area: 1 / 1 / 2 / 3;
  color: #f1c775;
  font: 950 .7rem/1 Inter, sans-serif;
  letter-spacing: .1em;
}
body.layout-basic .play-grid .quest-hub .pari-quest__role::before { content: '\25f7\20'; font-size: .8rem; vertical-align: -.04em; }
body.layout-basic .play-grid .quest-hub .pari-clock {
  display: block;
  grid-area: 1 / 2 / 2 / 4;
  justify-self: end;
  padding: .15rem .3rem;
  border: 1px solid #dcae5e59;
  border-radius: 999px;
  background: #dcae5e17;
  color: #f1c775;
  font: 850 .65rem/1 Inter, sans-serif;
}
body.layout-basic .play-grid .quest-hub .pari-book__title {
  grid-area: 2 / 1 / 3 / 4;
  margin: 0;
  font-size: .95rem;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
  white-space: normal;
  overflow: visible;
  overflow-wrap: anywhere;
}
body.layout-basic .play-grid .quest-hub .pari-book__context {
  grid-area: 3 / 2;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: .12rem;
  margin: 0;
}
body.layout-basic .play-grid .quest-hub .pari-book__offered { display: block; margin: 0; font-size: 1rem; line-height: 1.1; white-space: nowrap; }
body.layout-basic .play-grid .quest-hub .pari-quest__stake { color: #bcb0a0; font: 800 .6rem/1.1 Inter, sans-serif; white-space: nowrap; }
body.layout-basic .play-grid .quest-hub .pari-side__cta {
  width: 100%;
  min-height: 2rem;
  padding: .2rem;
  border-radius: 5px;
}
body.layout-basic .play-grid .quest-hub .pari-side--under .pari-side__cta { grid-area: 3 / 1; }
body.layout-basic .play-grid .quest-hub .pari-side--over .pari-side__cta { grid-area: 3 / 3; }
body.layout-basic .play-grid .quest-hub .pari-side__verb { font-size: .8rem; }
body.layout-basic .play-grid .quest-hub .pari-prebet-bonus {
  grid-area: 4 / 1 / 5 / 4;
  justify-self: start;
  margin: 0;
  padding: 0;
  border: 0;
  gap: 0;
}
body.layout-basic .play-grid .quest-hub .pari-prebet-bonus__label { display: none; }
body.layout-basic .play-grid .quest-hub .pari-prebet-bonus__value { font-size: .7rem; letter-spacing: 0; white-space: nowrap; }
body.layout-basic .play-grid .quest-hub .pari-quest__reward {
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: .25rem .4rem;
  white-space: normal;
}
body.layout-basic .play-grid .quest-hub .pari-split { position: absolute; right: .5rem; bottom: .2rem; left: .5rem; height: 3px; margin: 0; }
body.layout-basic .play-grid .quest-hub .pari-split__labels {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
body.layout-basic .play-grid .quest-hub .pari-your-bet {
  grid-area: 3 / 1 / 4 / 4;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: center;
  gap: .2rem .4rem;
  margin: 0;
  border-color: #ffffff24;
  background: #ffffff08;
}
body.layout-basic .play-grid .quest-hub :is(.pari-your-bet__label, .pari-your-bet__pick, .pari-your-bet__payout) { font-size: .75rem; color: #d5dae3; }
body.layout-basic .play-grid .quest-hub .pari-book--quest-complete {
  grid-template-rows: auto auto;
  min-height: 3.75rem;
  padding: .4rem .5rem;
  border-color: #4ade806e;
  background: radial-gradient(circle at 92% 12%, #4ade801b, transparent 45%), linear-gradient(145deg, #4ade8012, #080a15a3);
}
body.layout-basic .play-grid .quest-hub .pari-book--quest-complete :is(.pari-quest__role, .pari-clock) { color: #9af3b6; }
body.layout-basic .play-grid .quest-hub .pari-book--quest-complete .pari-clock { border-color: #4ade8059; background: #4ade8017; }
body.layout-basic .play-grid .quest-hub .pari-book__prediction--over { color: #4ade80; }
body.layout-basic .play-grid .quest-hub .pari-book__prediction--under { color: #f87171; }
body.layout-basic .play-grid .quest-hub .pari-book__reward {
  display: inline-flex;
  align-items: center;
  gap: .2em;
  vertical-align: middle;
  white-space: nowrap;
}
body.layout-basic .play-grid .quest-hub .pari-book__reward > img {
  display: block;
  flex: 0 0 auto;
  width: 1em;
  height: 1em;
  object-fit: contain;
}
body.layout-basic .play-grid .quest-hub .pari-error { margin: .25rem 0 0; font-size: .7rem; }

/* The ad is a ticket: coin, invitation and reward on the body, COPY LINK as its gold stub. */
body.layout-basic .play-grid .quest-hub .referral-strip { --utility-height: 3.75rem; width: 100%; max-width: 26rem; margin: 0; container: referral-ad / inline-size; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card {
  --ad-stub: 4.1rem;
  --ad-edge: #e6b866a6;
  grid-template-columns: 2.4rem minmax(0, 1fr) var(--ad-stub);
  grid-template-rows: minmax(0, 1fr) auto auto minmax(0, 1fr);
  gap: 0 .5rem;
  padding: 0 0 0 .5rem;
  border-color: var(--ad-edge);
  border-radius: 8px;
  background:
    radial-gradient(circle at 1.7rem 50%, #ffc2573d, transparent 2.3rem),
    radial-gradient(120% 90% at 55% -30%, #ff4f8a26, transparent 60%),
    linear-gradient(100deg, #45183f, #301838 52%, #22172e);
  box-shadow: inset 0 1px #ffe6b524, 0 4px 14px #0006;
}
/* Tear-off notches where the body meets the stub. */
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card::before {
  position: absolute;
  z-index: 2;
  top: -1px;
  right: calc(var(--ad-stub) - .3rem);
  bottom: -1px;
  width: .6rem;
  background:
    radial-gradient(circle at 50% 0, var(--site-surface, #17151f) .26rem, var(--ad-edge) .27rem .33rem, transparent .34rem),
    radial-gradient(circle at 50% 100%, var(--site-surface, #17151f) .26rem, var(--ad-edge) .27rem .33rem, transparent .34rem);
  content: '';
  pointer-events: none;
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__coin {
  grid-area: 1 / 1 / -1 / 2;
  align-self: center;
  width: 2.4rem;
  height: 2.4rem;
  filter: drop-shadow(0 0 .45rem #ffb54a59) drop-shadow(0 2px 3px #0008);
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__heading { grid-area: 2 / 2; display: flex; align-items: center; gap: .2rem; min-width: 0; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__heading h2 {
  color: #f3c977;
  font: 850 .56rem/1.2 Inter, sans-serif;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-shadow: none;
  white-space: nowrap;
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__info-btn {
  width: 1.1rem;
  min-width: 1.1rem;
  height: 1.1rem;
  min-height: 1.1rem;
  margin: -.2rem 0;
  outline-color: #f3c97799;
  outline-offset: -.18rem;
  color: #f3c977;
  font-size: .58rem;
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy { grid-area: 3 / 2; align-self: start; min-height: auto; margin: .22rem 0 0; padding: 0; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy > strong { flex-wrap: wrap; align-items: baseline; gap: 0 .28rem; white-space: nowrap; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy > strong > span,
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy .deg-referral-card__forever {
  color: #fff4e0;
  font-size: .9rem;
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: .01em;
  text-shadow: 0 1px 2px #0007;
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy .deg-referral-card__earn { color: #d9cbe0; font-size: .66rem; font-weight: 650; letter-spacing: 0; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__free { color: #9ef7c2; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__flip { color: #fff4e0; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy .deg-referral-card__forever { gap: .25rem; color: #ffd678; }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy-btn {
  grid-area: 1 / 3 / -1 / 4;
  align-self: stretch;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: .18rem;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: .3rem .35rem;
  border: 0;
  border-left: 1px dashed #6b451a8c;
  border-radius: 0 7px 7px 0;
  background:
    radial-gradient(90% 60% at 50% 0, #fff6d680, transparent 70%),
    linear-gradient(180deg, #ffe39c, #efbd5f 55%, #d69b3c);
  box-shadow: inset 0 1px #fff7, inset 0 -1px #8a5a1f59;
  color: #2c1c0a;
  font: 950 .6rem/1.1 Inter, sans-serif;
  letter-spacing: .09em;
  text-align: center;
  white-space: normal;
}
/* A pseudo-element icon survives the label swaps (COPYING…, CODE COPIED). */
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy-btn::before {
  width: .85rem;
  height: .85rem;
  background: currentColor;
  content: '';
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.5.5l3-3a5 5 0 0 0-7-7l-1.7 1.7'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.5-.5l-3 3a5 5 0 0 0 7 7l1.7-1.7'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.5.5l3-3a5 5 0 0 0-7-7l-1.7 1.7'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.5-.5l-3 3a5 5 0 0 0 7 7l1.7-1.7'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy-btn:hover:not(:disabled) {
  background:
    radial-gradient(90% 60% at 50% 0, #fffbe8a6, transparent 70%),
    linear-gradient(180deg, #ffeab3, #f5c870 55%, #e0a748);
}
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy-btn:disabled { opacity: .85; filter: saturate(.75); }
body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy-btn:focus-visible { outline-color: #2c1c0a; outline-offset: -4px; }
/* Wider cards fit the reward on one larger line. */
@container referral-ad (min-width: 20rem) {
  body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card { --ad-stub: 4.6rem; grid-template-columns: 2.6rem minmax(0, 1fr) var(--ad-stub); gap: 0 .6rem; padding-left: .6rem; }
  body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__coin { width: 2.6rem; height: 2.6rem; }
  body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy > strong > span,
  body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy .deg-referral-card__forever { font-size: 1rem; }
  body.layout-basic .play-grid .quest-hub .referral-strip .deg-referral-card__copy .deg-referral-card__earn { font-size: .7rem; }
}

@media (min-width: 1100px) {
  body.layout-basic .play-grid .quest-hub > app-quest-panel { flex: 1; }
  body.layout-basic .play-grid .quest-hub .app-quest-panel { height: 100%; }
  body.layout-basic .play-grid .quest-hub .qst-slots { flex: 1; }
}
@media (min-width: 700px) and (max-width: 1099px) {
  body.layout-basic .play-grid .quest-hub .qst-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(7rem, 1fr); }
  body.layout-basic .play-grid .quest-hub .qst-slot { grid-column: auto; min-height: 7rem; }
  body.layout-basic .play-grid .quest-hub__rewards { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
  body.layout-basic .play-grid .quest-hub .referral-strip { --utility-height: 6.75rem; }
  body.layout-basic .play-grid .quest-hub__rewards:not(:has(.has-live-book)) .referral-strip { --utility-height: 3.75rem; }
  body.layout-basic .play-grid .quest-hub__rewards:has(.has-live-book) .referral-strip .deg-referral-card { grid-template-columns: 3.2rem minmax(0, 1fr) var(--ad-stub); }
  body.layout-basic .play-grid .quest-hub__rewards:has(.has-live-book) .referral-strip .deg-referral-card__coin { width: 3.2rem; height: 3.2rem; }
}