/* Runtime audit, 2026-09-04.
 * Full legacy mobile capture keeps the locally loaded Code Pro faces for the
 * page-top and promo display headings; the former serif fallback came from
 * an incomplete font load, not from home_games.css. */
.legacy-public:has(.homegames) .page-top .homegames-page-title,
.legacy-public .homegames .homegames-promo__title {
  font-family: 'Code Pro Black', 'Arial Black', sans-serif;
  font-weight: 400;
}

/* `inner.php` renders the imported 1920×345 source photo as a single cover
 * image.  The generic FastAPI page-top otherwise repeats it at natural size. */
.legacy-public:has(.homegames) .page-top {
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
}

.legacy-public .homegames-promo-top { padding-top: 0; }
.legacy-public .homegames-promo__title {
  margin: 0 0 50px;
  font-size: 36px;
  line-height: 1.15;
}
.legacy-public .homegames-promo__title::before { top: 12px; left: -15px; }
/* Source columns already reserve their horizontal gutters. Do not also
   subtract a second gap from their share of the catalogue row. */
@media (min-width: 1200px) {
  .legacy-public .homegames .homegames-column { flex-basis: 25%; max-width: 25%; }
}
@media (min-width: 1011px) and (max-width: 1199px) {
  .legacy-public .homegames .homegames-column { flex-basis: 33.333%; max-width: 33.333%; }
}
.legacy-public .homegames-promo__logo::before { top: 6px; z-index: 0; }
.legacy-public .homegames-promo__logo span { z-index: 1; }
.legacy-public .homegames-promo-body { padding: 30px 0 40px; }
.legacy-public .homegames-promo-details-btnwrap { position: relative; }
.legacy-public .homegames-promo-details-btnwrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
}
.legacy-public .homegames-promo-details__btn { grid-column: 2; grid-row: 1; }
.legacy-public .homegames-promo-details__note {
  position: relative;
  grid-column: 3;
  grid-row: 1;
  justify-self: start;
  min-width: 0;
  top: auto;
  left: auto;
  width: 180px;
  max-width: calc(100% - 64px);
  margin: 0 0 0 64px;
  transform: none !important;
}
/* The 57px source curve fits between the caption and the actual CTA edge,
 * with seven pixels before the button so its tip never covers the label. */
.legacy-public .homegames-promo-details__note::before { top: 50%; left: -57px; transform: translateY(-100%); pointer-events: none; }
.legacy-public .homegames-promo-features { margin-bottom: 50px; }
.legacy-public .homegames-promo-features-item__title {
  margin-bottom: 15px;
  font-size: 20px;
  line-height: 24px;
}
.legacy-public .homegames-item__title { padding: 16px 12px 12px; overflow-wrap: anywhere; }
/* The literal home_games.css card waves are positive-z pseudo-elements on
 * .homegames-item. The former FastAPI layer promoted the white title/price
 * panels above them, flattening both torn paper edges. */
.legacy-public .homegames-item__title,
.legacy-public .homegames-item__price { z-index: auto; }
.legacy-public .homegames-item__title::before,
.legacy-public .homegames-item__price::before {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 2px;
  content: '';
  background: linear-gradient(to right, #fff 70%, transparent 30%) 0 100% / 25px 2px repeat-x;
}
.legacy-public .homegames-item__title::before { bottom: -7px; }
.legacy-public .homegames-item__event {
  display: flex;
  height: auto;
  min-height: 80px;
  align-items: center;
  padding: 12px 16px 12px 76px;
  font-size: 17px;
  line-height: 21px;
}
.legacy-public .homegames-item__event span { position: absolute; top: 50%; left: 0; width: 68px; margin: 0; transform: translateY(-50%); }
.legacy-public .homegames-item__event img { width: 100%; height: auto; max-height: 100%; }
.legacy-public .homegames-item-content { padding: 14px 0; }
.legacy-public .homegames-item-features { gap: 0; }
.legacy-public .homegames-item-features__item {
  left: -15px;
  margin: 0 15px 12px 0;
  padding: 6px 36px 6px 24px;
  font-size: 15px;
  overflow-wrap: anywhere;
}
.legacy-public .homegames-item-features__item:last-child { margin-bottom: 8px; }
.legacy-public .homegames-item-features__item::before {
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 0;
  height: 0;
  content: '';
  border-style: solid;
  border-width: 0 0 11px 15px;
  border-color: transparent transparent #a09fa6;
}
.legacy-public .homegames-item__text { margin: 0; padding: 0 15px; line-height: 21px; font-weight: 300; overflow-wrap: anywhere; }
.legacy-public .homegames-item__price { padding: 10px 12px 12px; font-size: 21px; }
.legacy-public .homegames-item__price::before { top: -7px; }
.legacy-public .homegames-item__price strong { padding-left: 35px; background-size: 26px 17px; font-size: 30px; }
/* Stretch tickets to their own row's natural height without a fixed minimum
 * or a second row gap. Column padding contains each 15px ribbon overhang. */
.legacy-public .homegames .homegames-row { row-gap: 40px; column-gap: 0; }
.legacy-public .homegames .homegames-column { display: flex; min-height: 0; margin-bottom: 0; align-self: stretch; }
.legacy-public .homegames .homegames-item { flex: 1; height: auto; overflow: visible; }
.legacy-public .homegames .homegames-item:not(.homegames-item_coming) { min-height: 0; }
.legacy-public .homegames .homegames-item__btn { min-height: 44px; max-width: calc(100% - 32px); margin-bottom: 16px; }
.legacy-public .homegames .homegames-item__price strong { max-width: 100%; overflow-wrap: anywhere; }
/* The source SVG deliberately leaves the upper part of its bottom wave
 * transparent so the white price panel forms the torn edge.  A fractional
 * raster seam could nevertheless reveal a white line below that wave on some
 * cards.  Keep the source drawing and cover only that outside seam with the
 * page background. */
.legacy-public .homegames-item::after { bottom: -1px; height: 9px; box-shadow: 0 1px 0 #2f2e42; }
/* Use the main-page type tiles: icon and label above an independent details
 * control. The filter remains a real link, including its selected URL. */
.legacy-public .homegames-type-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 0; margin: -12px 0 34px; background: #2f2e42; }
.legacy-public .homegames-type-option { display: flex; min-width: 0; min-height: 184px; flex-direction: column; background: #2f2e42; transition: background-color .2s ease; }
.legacy-public .homegames-type-option.is-selected { background: #3a3851; }
.legacy-public .homegames-type-filter { display: flex; min-width: 0; min-height: 124px; flex: 1; align-items: center; justify-content: center; flex-direction: column; gap: 12px; padding: 20px 12px 12px; border: 0; border-bottom: 3px solid transparent; color: #fff; font-size: 14px; font-weight: 400; line-height: 1.25; text-align: center; text-decoration: none; overflow-wrap: anywhere; transition: background-color .2s ease, border-color .2s ease; }
.legacy-public .homegames-type-filter:focus-visible { outline: 3px solid #fcea1c; outline-offset: -4px; }
.legacy-public .homegames-type-filter.is-active { border-bottom-color: #fcea1c; background: #3a3851; color: #fff; }
.legacy-public .homegames-type-filter img { display: block; width: 48px; height: 48px; object-fit: contain; transition: transform .3s ease; }
.legacy-public .homegames-type-option_all img { width: 64px; height: 64px; }
.legacy-public .homegames-type-more { min-width: 100px; min-height: 44px; max-width: calc(100% - 24px); align-self: center; margin: 6px 12px 12px; padding: 10px 16px; border: 0; border-radius: 24px; color: #302509; background: #fcea1c; font: inherit; font-size: 11px; line-height: 1.25; text-transform: uppercase; cursor: pointer; }
.legacy-public .homegames-type-more:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (hover: hover) {
  .legacy-public .homegames-type-filter:hover { background: #333248; }
  .legacy-public .homegames-type-filter:hover img { transform: scale(1.2); }
  .legacy-public .homegames-type-more:hover { background: #fff06a; }
}
.legacy-public .homegames-type-filter:focus-visible img { transform: scale(1.2); }
.legacy-public .homegames-type-dialog { position: fixed; inset: 0; width: min(760px, calc(100% - 32px)); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); margin: auto; padding: 0; overflow: hidden; border: 3px solid #fcea1c; color: #5d5c75; background: #fff; }
.legacy-public .homegames-type-dialog[open] { display: flex; flex-direction: column; }
.legacy-public .homegames-type-dialog::backdrop { background: rgba(20,17,30,.72); }
.legacy-public .homegames-type-dialog__header { display: flex; flex: 0 0 auto; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 24px; }
.legacy-public .homegames-type-dialog__header h2 { min-width: 0; margin: 0; color: #2f2e42; font-size: clamp(22px, 4vw, 32px); line-height: 1.2; text-transform: uppercase; overflow-wrap: anywhere; }
.legacy-public .homegames-type-dialog__close { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #302f40; background: #f0eff5; font: inherit; font-size: 28px; cursor: pointer; }
.legacy-public .homegames-type-dialog__close:focus-visible { outline: 3px solid #302f40; outline-offset: 2px; }
.legacy-public .homegames-type-dialog__content { min-height: 0; padding: 0 24px 24px; overflow: auto; color: #5d5c75; font-size: 18px; line-height: 1.5; overflow-wrap: anywhere; overscroll-behavior: contain; }
.legacy-public .homegames-type-dialog__content:focus-visible { outline: 3px solid #fcea1c; outline-offset: -3px; }
.legacy-public .homegames-type-dialog__content > :first-child { margin-top: 0; }
.legacy-public .homegames-type-dialog__content > :last-child { margin-bottom: 0; }
.legacy-public .homegames-type-dialog__content img { max-width: 100%; height: auto; }
.legacy-public .homegames-type-dialog__content a { color: #4b4380; text-decoration: underline; }
@media (prefers-reduced-motion: reduce) {
  .legacy-public .homegames-type-option,
  .legacy-public .homegames-type-filter,
  .legacy-public .homegames-type-filter img { transition: none; }
  .legacy-public .homegames-type-filter:hover img,
  .legacy-public .homegames-type-filter:focus-visible img { transform: none; }
}
/* The old standalone dialog CSS makes every form a two-column grid.  This
 * route uses the source register-modal rows, so keep their summary and status
 * in the intended one-column document flow. */
.legacy-public .legacy-home-game-modal .register-modal__form { display: block; }
.legacy-public .home-game-price-breakdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: -15px 0 27px; background: #e4e3e9; }
.legacy-public .home-game-price-breakdown div { min-width: 0; padding: 10px 11px; background: #f7f6f8; }
.legacy-public .home-game-price-breakdown dt { color: #716f9a; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.legacy-public .home-game-price-breakdown dd { overflow: hidden; margin: 5px 0 0; color: #2f2e42; font-size: 14px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.legacy-public [data-home-game-status][data-state="checking"] { background: #f2f1f5; color: #716f9a; }
.legacy-public [data-home-game-status][data-state="success"] { background: #eef8ef; color: #287738; }
.legacy-public .home-game-promo-control button:disabled,
.legacy-public .legacy-home-game-modal .register-modal__button:disabled { cursor: wait; opacity: .64; }
.legacy-public .home-game-promo-control button[aria-busy="true"]::after,
.legacy-public .legacy-home-game-modal .register-modal__button[aria-busy="true"]::after { display: inline-block; width: .82em; height: .82em; margin-left: .48em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; content: ''; animation: home-game-button-spin .7s linear infinite; vertical-align: -.08em; }
@keyframes home-game-button-spin { to { transform: rotate(360deg); } }
.legacy-public .homegames-item_coming { align-items: center; min-height: 400px; padding: 80px 20px; font-size: 40px; line-height: 45px; }
.legacy-public .homegames-item_coming > span { position: relative; display: block; width: max-content; max-width: 100%; padding-left: 0; text-align: left; }
.legacy-public .homegames-item_coming > span::before { position: absolute; top: -50px; left: 50%; width: 40px; height: 40px; margin-left: -20px; content: ''; background: url('/static/site-assets/home-games/icon-plus.svg') center/contain no-repeat; }
.legacy-public .homegames-item_coming > span span { padding-left: 1.2em; }

/* The actual source attributes are rendered by the Jinja port.  Motion itself
 * is controlled locally in legacy-home-games.js, so no legacy AOS/jQuery
 * bundle can hide content when JavaScript is unavailable. */
html.legacy-home-games-motion-ready .legacy-public .homegames .legacy-home-games-aos-node {
  opacity: 0;
  transition: opacity .4s ease;
}
html.legacy-home-games-motion-ready .legacy-public .homegames .legacy-home-games-aos-animate { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .legacy-public .homegames .legacy-home-games-aos-node { opacity: 1 !important; animation: none !important; transition: none !important; }
}

@media (max-width: 1599px) {
  .legacy-public .homegames-promo-features-item { position: static; }
  .legacy-public .homegames-promo-features-item__title { flex-grow: 1; margin-bottom: 30px; }
}
@media (max-width: 767px) {
  .legacy-public .homegames-item_coming > span,
  .legacy-public .homegames-item_coming > span span { padding-left: 0; text-align: center; }
}
@media (max-width: 639px) {
  .legacy-public:has(.homegames) .page-top { padding-right: 0; padding-left: 0; }
  .legacy-public:has(.homegames) .page-top .homegames-page-title { font-family: 'Code Pro Black', 'Arial Black', sans-serif; font-size: 30px; line-height: 45px; }
  .legacy-public .homegames .homegames-promo__title { font-family: 'Code Pro Black', 'Arial Black', sans-serif; }
  .legacy-public .homegames .homegames-promo__title .thin-text { font-family: 'Code Pro Light', Arial, sans-serif; }
  /* Literal `home_games.css` compact feature copy.  The wider audit selector
     above must not retain its desktop 20px/30px box at the source breakpoint. */
  .legacy-public .homegames-promo-features-item__title { margin-bottom: 15px; font-size: 17px; }
  .legacy-public .homegames-type-filter { font-size: 13px; }
  .legacy-public .homegames-type-dialog__header { gap: 12px; padding: 18px; }
  .legacy-public .homegames-type-dialog__content { padding: 0 18px 18px; }
  .legacy-public .home-game-price-breakdown { grid-template-columns: 1fr; margin-top: -14px; }
  .legacy-public .home-game-price-breakdown div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
  .legacy-public .home-game-price-breakdown dd { margin-top: 0; }
}
@media (max-width: 479px) {
  .legacy-public .homegames-promo-features-item__title { margin-bottom: 20px; font-size: 20px; }
}

/* The source connected diagram is only shown from 1600px. Scale its 1300px
 * geometry by the shared density token to fit the current 1040px wrapper.
 * Below this breakpoint the source compact grid keeps the arrows hidden. */
@media (min-width: 1600px) {
  .legacy-public .homegames-promo-body::before,
  .legacy-public .homegames-promo-body::after { display: block; }
  .legacy-public .homegames-promo-features {
    --homegames-diagram-density: var(--public-followup-density, .8);
    display: flex;
    flex-wrap: nowrap;
    align-items: initial;
    justify-content: initial;
    gap: 0;
    margin-bottom: calc(50px * var(--homegames-diagram-density));
    padding: 0 calc(110px * var(--homegames-diagram-density));
  }
  .legacy-public .homegames-promo-features-item,
  .legacy-public .homegames-promo-features-item:nth-child(1),
  .legacy-public .homegames-promo-features-item:nth-child(2),
  .legacy-public .homegames-promo-features-item:nth-child(3),
  .legacy-public .homegames-promo-features-item:nth-child(5) {
    position: relative;
    flex: 1 1 25%;
    max-width: 25%;
    margin: 0;
    text-align: left;
    transform: none;
  }
  .legacy-public .homegames-promo-features-item::after {
    position: absolute;
    display: block;
    content: '';
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    pointer-events: none;
  }
  .legacy-public .homegames-promo-features-item-body { display: block; height: auto; cursor: pointer; }
  .legacy-public .homegames-promo-features-item__title {
    min-height: 0;
    margin: 0 0 calc(15px * var(--homegames-diagram-density));
    padding: 0;
    color: #fff;
    font-size: calc(20px * var(--homegames-diagram-density));
    line-height: calc(24px * var(--homegames-diagram-density));
  }
  .legacy-public .homegames-promo-features-item__icon { width: auto; height: calc(140px * var(--homegames-diagram-density)); margin: 0; }
  .legacy-public .homegames-promo-features-item__icon img { width: calc(140px * var(--homegames-diagram-density)); height: calc(140px * var(--homegames-diagram-density)); }
  .legacy-public .homegames-promo-features-item_1 { margin-top: calc(80px * var(--homegames-diagram-density)) !important; }
  .legacy-public .homegames-promo-features-item_1::after {
    top: calc(8px * var(--homegames-diagram-density));
    left: calc(200px * var(--homegames-diagram-density));
    width: calc(195px * var(--homegames-diagram-density));
    height: calc(150px * var(--homegames-diagram-density));
    background-image: url('/static/legacy-source/images/homegames-arrow1.svg');
  }
  .legacy-public .homegames-promo-features-item_1 .homegames-promo-features-item__title { max-width: calc(175px * var(--homegames-diagram-density)); margin-bottom: calc(50px * var(--homegames-diagram-density)); }
  .legacy-public .homegames-promo-features-item_2 { margin-top: calc(250px * var(--homegames-diagram-density)) !important; }
  .legacy-public .homegames-promo-features-item_2::after {
    top: calc(-240px * var(--homegames-diagram-density));
    left: calc(120px * var(--homegames-diagram-density));
    width: calc(159px * var(--homegames-diagram-density));
    height: calc(248px * var(--homegames-diagram-density));
    background-image: url('/static/legacy-source/images/homegames-arrow2.svg');
  }
  .legacy-public .homegames-promo-features-item_2 .homegames-promo-features-item__title { max-width: calc(175px * var(--homegames-diagram-density)); }
  .legacy-public .homegames-promo-features-item_3 { margin-top: calc(35px * var(--homegames-diagram-density)) !important; }
  .legacy-public .homegames-promo-features-item_3::after {
    top: calc(5px * var(--homegames-diagram-density));
    left: calc(240px * var(--homegames-diagram-density));
    width: calc(154px * var(--homegames-diagram-density));
    height: calc(101px * var(--homegames-diagram-density));
    background-image: url('/static/legacy-source/images/homegames-arrow3.svg');
  }
  .legacy-public .homegames-promo-features-item_3 .homegames-promo-features-item__title { max-width: calc(230px * var(--homegames-diagram-density)); }
  .legacy-public .homegames-promo-features-item_4 {
    position: absolute;
    top: calc(-15px * var(--homegames-diagram-density));
    right: 0;
    width: calc(270px * var(--homegames-diagram-density));
    max-width: none;
  }
  .legacy-public .homegames-promo-features-item_4::after {
    top: calc(100% - 178px * var(--homegames-diagram-density));
    left: calc(170px * var(--homegames-diagram-density));
    width: calc(107px * var(--homegames-diagram-density));
    height: calc(266px * var(--homegames-diagram-density));
    background-image: url('/static/legacy-source/images/homegames-arrow4.svg');
  }
  .legacy-public .homegames-promo-features-item_4 .homegames-promo-features-item__title { margin-bottom: calc(50px * var(--homegames-diagram-density)); }
  .legacy-public .homegames-promo-features-item_5 { margin-top: calc(250px * var(--homegames-diagram-density)) !important; }
}