/* Portfolio styles: upcoming events, PIX/tickets, crew pass and pass features.
   Source: portfolio.html split for cacheability and ownership. */
    /* ============ UPCOMING EVENTS ============ */
    .upcoming {
      display: grid;
      grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
      gap: 28px;
      align-items: stretch;
    }

    .upcoming__aside {
      display: grid;
      align-content: end;
      gap: 18px;
      min-height: 420px;
      padding: 30px;
      border: 1px solid var(--line);
      background:
        linear-gradient(180deg, rgba(255, 138, 61, .07), transparent 42%),
        rgba(9, 9, 11, .72);
    }

    .upcoming__aside span {
      width: fit-content;
    }

    .upcoming__aside p {
      max-width: 34ch;
      color: var(--ink-dim);
      font-size: 15px;
      line-height: 1.65;
    }

    .upcoming-card {
      position: relative;
      min-height: 520px;
      overflow: hidden;
      isolation: isolate;
      display: grid;
      align-content: stretch;
      padding: 0;
      border: 1px solid rgba(255, 138, 61, .28);
      border-top: 2px solid rgba(255, 174, 88, .55);
      background:
        radial-gradient(circle at 72% 16%, rgba(255, 138, 61, .13), transparent 44%),
        radial-gradient(circle at 16% 88%, rgba(70, 28, 100, .06), transparent 38%),
        linear-gradient(158deg, rgba(18, 12, 10, .97), rgba(7, 7, 9, .99));
      box-shadow:
        0 52px 128px rgba(0, 0, 0, .56),
        0 0 0 1px rgba(255, 174, 88, .06),
        inset 0 1px 0 rgba(255, 222, 176, .14);
      transform: translateY(0);
      animation: upcomingFloat 7s cubic-bezier(.45, 0, .2, 1) infinite;
    }

    .upcoming-card::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background:
        radial-gradient(ellipse 74% 50% at 65% 24%, rgba(255, 138, 61, .09), transparent),
        radial-gradient(ellipse 38% 26% at 12% 82%, rgba(80, 22, 110, .06), transparent);
      mix-blend-mode: screen;
    }

    .upcoming-card::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(7, 7, 9, .58) 0%, transparent 18%, transparent 82%, rgba(7, 7, 9, .58) 100%),
        linear-gradient(180deg, rgba(7, 7, 9, .32) 0%, transparent 20%, transparent 66%, rgba(7, 7, 9, .76) 100%);
    }

    .upcoming-card canvas {
      position: absolute;
      inset: -18% -24%;
      z-index: 0;
      width: 148%;
      height: 136%;
      pointer-events: none;
    }

    .upcoming-card__ticket-id {
      position: absolute;
      top: 18px;
      right: 20px;
      z-index: 3;
      font-family: var(--mono);
      font-size: 9px;
      letter-spacing: .24em;
      text-transform: uppercase;
      color: rgba(255, 166, 72, .34);
      pointer-events: none;
      user-select: none;
    }

    @media (prefers-reduced-motion: reduce) {
      .upcoming-card {
        animation: none;
      }
    }

    .upcoming-card__content {
      position: relative;
      z-index: 3;
      display: grid;
      grid-template-rows: 1fr auto auto;
      min-height: inherit;
    }

    .upcoming-card__hero {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 20px;
      padding: clamp(24px, 4vw, 46px) clamp(24px, 4vw, 46px) 28px;
    }

    .upcoming-card__top {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
      justify-content: space-between;
    }

    .upcoming-card__title-block {
      display: grid;
      gap: 13px;
    }

    .upcoming-card__tear {
      position: relative;
      height: 1px;
      background: repeating-linear-gradient(
        90deg,
        rgba(255, 138, 61, .40) 0,
        rgba(255, 138, 61, .40) 5px,
        transparent 5px,
        transparent 11px
      );
    }

    .upcoming-card__tear::before,
    .upcoming-card__tear::after {
      content: "";
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 22px;
      height: 22px;
      border-radius: 50%;
      background: var(--bg);
      box-shadow: inset 0 0 0 1px rgba(255, 138, 61, .28);
    }

    .upcoming-card__tear::before { left: -12px; }
    .upcoming-card__tear::after  { right: -12px; }

    .upcoming-card__logistics {
      display: grid;
      gap: 14px;
      padding: clamp(18px, 2.8vw, 30px) clamp(24px, 4vw, 46px) clamp(22px, 3.5vw, 40px);
      background: linear-gradient(180deg, rgba(0, 0, 0, .40) 0%, rgba(0, 0, 0, .24) 100%);
    }

    .upcoming-card__meta-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px 14px;
    }

    .upcoming-card__date {
      font-family: var(--mono);
      font-size: 13px;
      letter-spacing: .18em;
      color: rgba(255, 180, 90, .92);
      text-transform: uppercase;
      flex-shrink: 0;
    }

    .upcoming-card__meta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }

    .upcoming-card h3 {
      font-size: clamp(52px, 8vw, 108px);
      font-weight: 500;
      line-height: .86;
      letter-spacing: -.065em;
      text-wrap: balance;
    }

    .upcoming-card p {
      max-width: 44ch;
      color: rgba(243, 241, 236, .70);
      font-size: 16px;
      line-height: 1.58;
    }

    .upcoming-card__actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      align-items: center;
      justify-content: space-between;
    }

    .upcoming-card__price {
      font-family: var(--mono);
      font-size: 12px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255, 166, 72, .72);
    }

    @keyframes upcomingFloat {

      0%,
      100% {
        transform: translateY(0) rotateX(0deg);
      }

      50% {
        transform: translateY(-10px) rotateX(1.2deg);
      }
    }

    @media(max-width:780px) {
      .tl-row {
        grid-template-columns: 80px 1fr;
        gap: 14px
      }

      .tl-row .meta {
        grid-column: 2;
        gap: 0;
      }

      .tl-row .meta__detail,
      .tl-row .arrow {
        display: none
      }

      .upcoming {
        grid-template-columns: 1fr;
      }

      .upcoming__aside,
      .upcoming-card {
        min-height: auto;
      }

      .upcoming-card__hero {
        padding: 22px 22px 22px;
      }

      .upcoming-card__logistics {
        padding: 16px 22px 22px;
      }

      .upcoming-card h3 {
        font-size: clamp(44px, 16vw, 76px);
      }
    }

    /* ============ PASS / TICKETS ============ */
    #tickets {
      overflow: hidden;
      padding-top: calc(clamp(100px, 5vh, 71px) + var(--sticky-header-height)) !important;
      display: grid;
      align-content: center;
    }

    .ticket-ambient {
      position: absolute;
      inset: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      opacity: .62;
      mix-blend-mode: screen;
    }

    #tickets .section__head {
      position: relative;
      z-index: 1;
    }

    .tickets-console-wrap {
      position: relative;
      z-index: 1;
      width: min(100%, 920px);
      margin-inline: auto;
      transform: translateY(clamp(-42px, -4vh, -22px));
    }

    .ticket-system {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(360px, .88fr) minmax(430px, 1.12fr);
      gap: 1px;
      border: 1px solid var(--line);
      border-radius: 24px;
      background:
        linear-gradient(90deg, rgba(255, 138, 61, .08), rgba(243, 241, 236, .08) 41%, rgba(243, 241, 236, .065)),
        rgba(9, 9, 11, .92);
      overflow: hidden;
      isolation: isolate;
      box-shadow:
        0 34px 110px rgba(0, 0, 0, .34),
        inset 0 1px 0 rgba(255, 255, 255, .045);
    }

    .ticket-system::before,
    .ticket-system::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
    }

    .ticket-system::before {
      background:
        radial-gradient(45% 80% at 24% 50%, rgba(255, 138, 61, .11), transparent 72%),
        radial-gradient(34% 56% at 72% 48%, rgba(255, 210, 155, .035), transparent 68%),
        linear-gradient(90deg, rgba(255, 138, 61, .045), transparent 32%, rgba(0, 0, 0, .2) 74%);
      opacity: .9;
    }

    .ticket-system::after {
      background:
        linear-gradient(118deg, transparent 0 18%, rgba(255, 255, 255, .035) 18.4%, transparent 19.7% 49%, rgba(255, 138, 61, .032) 49.3%, transparent 50.6%),
        linear-gradient(90deg, transparent, rgba(0, 0, 0, .22) 62%, rgba(0, 0, 0, .38));
      mask-image: linear-gradient(90deg, rgba(0, 0, 0, .95), rgba(0, 0, 0, .5) 54%, rgba(0, 0, 0, .22));
      -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, .95), rgba(0, 0, 0, .5) 54%, rgba(0, 0, 0, .22));
      opacity: .78;
    }

    .ticket-system>.ticket-ambient {
      z-index: 0;
    }

    .ticket-pass,
    .ticket-events {
      position: relative;
      z-index: 2;
      background: rgba(8, 8, 10, .78);
    }

    .ticket-pass {
      --pass-radius: clamp(20px, 1.8vw, 28px);
      --pass-pad: clamp(9px, .9vw, 14px);
      --pass-gap: clamp(3px, .32vw, 5px);
      --pass-front-y: 0deg;
      --pass-back-y: -180deg;
      --pass-tilt-x: 0deg;
      --pass-tilt-y: 0deg;
      --pass-depth: 0px;
      --pass-scale: 1;
      position: relative;
      min-height: var(--tickets-stage-height);
      overflow: hidden;
      isolation: isolate;
      perspective: 1200px;
      user-select: none;
      display: grid;
      place-items: center;
      padding: clamp(26px, 4.2vw, 56px);
      cursor: pointer;
      background:
        radial-gradient(68% 58% at 50% 49%, rgba(255, 138, 61, .105), transparent 67%),
        radial-gradient(92% 82% at 42% 53%, rgba(255, 190, 120, .04), transparent 72%),
        radial-gradient(84% 74% at 82% 92%, rgba(68, 24, 98, .032), transparent 64%),
        linear-gradient(180deg, rgba(12, 11, 11, .92), rgba(8, 8, 10, .82));
    }

    .ticket-pass::before {
      content: "";
      position: absolute;
      z-index: 0;
      width: min(76%, 540px);
      aspect-ratio: 1.586 / 1;
      border-radius: 999px;
      background:
        radial-gradient(closest-side, rgba(255, 171, 92, .18), rgba(255, 138, 61, .09) 46%, transparent 74%);

      pointer-events: none;
    }

    .ticket-pass::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        repeating-radial-gradient(ellipse at 51% 50%, transparent 0 26px, rgba(255, 184, 112, .018) 27px 28px, transparent 29px 72px),
        linear-gradient(120deg, transparent 0 42%, rgba(255, 255, 255, .022) 42.35%, transparent 43.4% 70%, rgba(255, 138, 61, .024) 70.35%, transparent 71.2%),
        radial-gradient(circle at 50% 50%, transparent 0 38%, rgba(0, 0, 0, .34) 84%);
      opacity: .96;
    }

    .ticket-pass:focus-visible {
      outline: 2px solid rgba(255, 138, 61, .86);
      outline-offset: 8px;
    }

    .ticket-pass canvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      opacity: .22;
      mix-blend-mode: screen;
      pointer-events: none;
    }

    .ticket-pass__content {
      --pass-thickness: 1.4px;
      position: relative;
      z-index: 2;
      width: min(100%, 520px);
      max-width: 100%;
      aspect-ratio: 1.586 / 1;
      overflow: hidden;
      min-height: 0;
      transform-style: preserve-3d;
      transform:
        translateZ(var(--pass-depth)) rotateX(var(--pass-tilt-x)) rotateY(var(--pass-tilt-y)) scale(var(--pass-scale));
      transform-origin: center center;
      transition:
        transform 720ms cubic-bezier(0.22, 1, 0.36, 1),
        filter 260ms ease;
      will-change: transform;
      pointer-events: none;
      border-radius: var(--pass-radius);
      filter:
        drop-shadow(0 28px 58px rgba(0, 0, 0, .48)) drop-shadow(0 0 18px rgba(255, 138, 61, .055));
    }

    .ticket-pass__content::before {
      content: "";
      position: absolute;
      inset: 1px;
      z-index: 0;
      border-radius: inherit;
      transform: translateZ(0);
      pointer-events: none;
      box-shadow:
        inset 0 0 0 1px rgba(255, 138, 61, .1),
        0 0 0 var(--pass-thickness) rgba(24, 15, 10, .9),
        0 0 32px rgba(255, 138, 61, .075);
    }

    .ticket-pass.is-flipped {
      --pass-front-y: 180deg;
      --pass-back-y: 0deg;
    }

    .ticket-pass:hover .ticket-pass__content,
    .ticket-pass:focus-visible .ticket-pass__content {
      filter:
        drop-shadow(0 32px 72px rgba(0, 0, 0, .52)) drop-shadow(0 0 24px rgba(255, 138, 61, .11));
    }

    @media (hover: hover) and (pointer: fine) {
      .ticket-pass:hover .ticket-pass__content {
        --pass-scale: 1.035;
      }
    }

    .ticket-pass__plate {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      border-radius: inherit;
      transform-style: preserve-3d;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      transition: transform 720ms cubic-bezier(0.22, 1, 0.36, 1);
      will-change: transform;
    }

    .ticket-pass__plate--front {
      z-index: 2;
      transform: rotateY(var(--pass-front-y)) translateZ(var(--pass-thickness));
    }

    .ticket-pass__plate--back {
      z-index: 1;
      transform: rotateY(var(--pass-back-y)) translateZ(var(--pass-thickness));
    }

    .ticket-pass.is-flipped .ticket-pass__plate--front {
      z-index: 1;
    }

    .ticket-pass.is-flipped .ticket-pass__plate--back {
      z-index: 2;
    }

    .ticket-pass__face {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      padding: var(--pass-pad);
      display: grid;
      border: 1px solid rgba(245, 241, 234, .15);
      border-radius: inherit;
      overflow: hidden;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      transform-style: preserve-3d;
      transform: translateZ(.01px);
      color: var(--ink);
      background:
        radial-gradient(78% 70% at 82% 8%, rgba(255, 138, 61, .13), transparent 62%),
        radial-gradient(70% 80% at 8% 100%, rgba(125, 240, 255, .034), transparent 66%),
        linear-gradient(135deg, rgba(255, 255, 255, .125), rgba(255, 255, 255, .03) 37%, rgba(255, 138, 61, .062)),
        rgba(9, 8, 8, .89);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .19),
        inset 0 -1px 0 rgba(0, 0, 0, .36),
        inset 1px 0 0 rgba(255, 255, 255, .07),
        inset -1px 0 0 rgba(255, 138, 61, .12),
        inset 0 0 28px rgba(255, 138, 61, .028);
    }

    .ticket-pass:hover .ticket-pass__face,
    .ticket-pass:focus-visible .ticket-pass__face {
      border-color: rgba(255, 177, 98, .3);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .22),
        inset 0 -1px 0 rgba(0, 0, 0, .36),
        inset 1px 0 0 rgba(255, 255, 255, .09),
        inset -1px 0 0 rgba(255, 138, 61, .16);
    }

    .ticket-pass__face--front {
      transform: translateZ(.01px);
    }

    .ticket-pass__face--back {
      transform: translateZ(.01px);
      --pass-back-bronze: rgba(255, 148, 68, .18);
      --pass-back-bronze-soft: rgba(255, 202, 142, .075);
      --pass-back-etch: rgba(255, 222, 182, .04);
      background:
        radial-gradient(78% 90% at 86% 10%, var(--pass-back-bronze), transparent 59%),
        radial-gradient(64% 82% at 10% 96%, var(--pass-back-bronze-soft), transparent 64%),
        linear-gradient(112deg, rgba(255, 255, 255, .095), rgba(255, 255, 255, .024) 31%, rgba(255, 138, 61, .055) 68%, rgba(0, 0, 0, .18)),
        repeating-linear-gradient(92deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 18px),
        linear-gradient(180deg, rgba(16, 13, 12, .99), rgba(5, 5, 6, .995));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .19),
        inset 0 -1px 0 rgba(0, 0, 0, .46),
        inset 1px 0 0 rgba(255, 255, 255, .06),
        inset -1px 0 0 rgba(255, 138, 61, .15),
        inset 0 0 42px rgba(255, 138, 61, .035);
    }

    .ticket-pass__surface {
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .18), transparent 22%, transparent 74%, rgba(0, 0, 0, .22)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 18px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 18px),
        linear-gradient(118deg, transparent 0 39%, rgba(255, 209, 158, .08) 39.35%, transparent 41% 68%, rgba(255, 255, 255, .038) 68.35%, transparent 70%),
        radial-gradient(circle at 82% 17%, rgba(255, 138, 61, .13), transparent 31%);
      opacity: .82;
      mask-image: radial-gradient(ellipse at 52% 50%, rgba(0, 0, 0, .94), rgba(0, 0, 0, .76) 62%, rgba(0, 0, 0, .48) 100%);
      -webkit-mask-image: radial-gradient(ellipse at 52% 50%, rgba(0, 0, 0, .94), rgba(0, 0, 0, .76) 62%, rgba(0, 0, 0, .48) 100%);
    }

    .ticket-pass__surface::before {
      content: "";
      position: absolute;
      inset: -46% -30%;
      transform: translateX(-20%) rotate(17deg);
      background: linear-gradient(90deg, transparent 24%, rgba(255, 255, 255, .12), transparent 72%);
      opacity: .27;
      transition: transform .42s ease, opacity .28s ease;
    }

    .ticket-pass__surface::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 30% 24%, rgba(255, 255, 255, .035), transparent 22%),
        linear-gradient(180deg, rgba(255, 255, 255, .025), transparent 30%, rgba(0, 0, 0, .16));
      opacity: .78;
    }

    .ticket-pass:hover .ticket-pass__surface::before,
    .ticket-pass:focus-visible .ticket-pass__surface::before {
      transform: translateX(12%) rotate(17deg);
      opacity: .44;
    }

    .ticket-pass__face--back .ticket-pass__surface {
      background:
        radial-gradient(52% 70% at 77% 52%, rgba(255, 156, 73, .135), transparent 63%),
        radial-gradient(30% 44% at 18% 20%, rgba(255, 231, 197, .055), transparent 72%),
        url("../logo-mark.png") 81% 52% / min(42%, 176px) auto no-repeat,
        repeating-radial-gradient(ellipse at 76% 52%, transparent 0 14px, var(--pass-back-etch) 15px 16px, transparent 17px 38px),
        repeating-conic-gradient(from 18deg at 74% 52%, transparent 0 7deg, rgba(255, 190, 116, .025) 7.2deg 7.8deg, transparent 8deg 18deg),
        repeating-linear-gradient(126deg, rgba(255, 214, 160, .026) 0 1px, transparent 1px 10px),
        repeating-linear-gradient(54deg, transparent 0 15px, rgba(255, 138, 61, .016) 15px 16px, transparent 16px 34px),
        linear-gradient(90deg, rgba(0, 0, 0, .5), transparent 25%, transparent 77%, rgba(0, 0, 0, .36)),
        linear-gradient(180deg, rgba(255, 255, 255, .034), transparent 32%, rgba(0, 0, 0, .22));
      opacity: .92;
      background-blend-mode: screen, screen, soft-light, screen, screen, normal, normal, normal, normal;
      mask-image: radial-gradient(ellipse at 56% 52%, rgba(0, 0, 0, .98), rgba(0, 0, 0, .83) 58%, rgba(0, 0, 0, .48) 100%);
      -webkit-mask-image: radial-gradient(ellipse at 56% 52%, rgba(0, 0, 0, .98), rgba(0, 0, 0, .83) 58%, rgba(0, 0, 0, .48) 100%);
    }

    .ticket-pass__face--back .ticket-pass__surface::before {
      inset: 24% -3% auto;
      height: 26%;
      transform: none;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .96), rgba(18, 12, 9, .88) 42%, rgba(0, 0, 0, .78)),
        repeating-linear-gradient(90deg, rgba(255, 228, 190, .05) 0 1px, transparent 1px 10px),
        repeating-linear-gradient(90deg, transparent 0 42px, rgba(255, 138, 61, .04) 42px 45px, transparent 45px 76px),
        linear-gradient(180deg, rgba(255, 204, 139, .075), transparent 46%, rgba(255, 138, 61, .055));
      border-top: 1px solid rgba(255, 224, 185, .075);
      border-bottom: 1px solid rgba(255, 138, 61, .1);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .035),
        inset 0 -1px 0 rgba(0, 0, 0, .48),
        0 14px 34px rgba(0, 0, 0, .28);
      opacity: .8;
    }

    .ticket-pass__face--back .ticket-pass__surface::after {
      background:
        radial-gradient(ellipse at 78% 50%, rgba(255, 238, 202, .085), transparent 17%),
        radial-gradient(circle at 20% 22%, rgba(255, 138, 61, .07), transparent 24%),
        repeating-radial-gradient(ellipse at 30% 66%, transparent 0 19px, rgba(255, 174, 96, .028) 20px 21px, transparent 22px 47px),
        linear-gradient(116deg, transparent 0 30%, rgba(255, 239, 205, .085) 30.4%, transparent 32% 64%, rgba(255, 138, 61, .058) 64.4%, transparent 66%),
        repeating-linear-gradient(90deg, rgba(255, 196, 126, .04) 0 1px, transparent 1px 30px),
        linear-gradient(180deg, rgba(255, 255, 255, .036), transparent 36%, rgba(0, 0, 0, .24));
      background-size: auto, auto, auto, auto, 30px 100%, auto;
      opacity: .78;
      mix-blend-mode: screen;
    }

    .ticket-pass__face::after {
      content: "";
      position: absolute;
      inset: 1px;
      z-index: 1;
      border-radius: calc(var(--pass-radius) - 1px);
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .28), transparent 16%, transparent 84%, rgba(0, 0, 0, .32)),
        linear-gradient(180deg, rgba(255, 255, 255, .08), transparent 18%, transparent 78%, rgba(0, 0, 0, .24));
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .045);
    }

    .ticket-pass__face> :not(.ticket-pass__surface) {
      position: relative;
      z-index: 2;
    }

    .ticket-pass__front-layout,
    .ticket-pass__back-layout {
      min-width: 0;
      min-height: 0;
      display: grid;
      height: 100%;
      gap: var(--pass-gap);
      overflow: hidden;
    }

    .ticket-pass__front-layout {
      grid-template-rows: auto minmax(44px, .72fr) minmax(0, auto);
    }

    .ticket-pass__back-layout {
      grid-template-rows: auto auto minmax(0, 1fr) auto;
    }

    .ticket-pass__back-layout::before {
      content: "";
      position: absolute;
      left: calc(var(--pass-pad) * -1);
      right: calc(var(--pass-pad) * -1);
      top: calc(29% + 2px);
      height: clamp(30px, 12%, 44px);
      z-index: -1;
      background:
        radial-gradient(ellipse at 82% 50%, rgba(255, 177, 98, .14), transparent 34%),
        linear-gradient(90deg, rgba(255, 138, 61, .12), transparent 18%, transparent 74%, rgba(255, 218, 170, .07)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .038) 0 1px, transparent 1px 13px),
        linear-gradient(90deg, rgba(0, 0, 0, .64), rgba(0, 0, 0, .3));
      border-top: 1px solid rgba(255, 225, 188, .06);
      border-bottom: 1px solid rgba(255, 138, 61, .08);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .04),
        inset 0 -1px 0 rgba(0, 0, 0, .28),
        0 14px 34px rgba(0, 0, 0, .2);
      opacity: .66;
    }

    .ticket-pass__front-head,
    .ticket-pass__back-head,
    .ticket-pass__back-footer,
    .ticket-card__top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
    }

    .ticket-pass__back-footer {
      justify-content: center;
    }

    .ticket-pass__eyebrow,
    .ticket-pass__serial,
    .ticket-pass__id,
    .ticket-pass__capability,
    .ticket-card__meta,
    .ticket-card__kind,
    .pix-modal__kicker {
      font-family: var(--mono);
      font-size: 9px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--ink-mute);
    }

    .ticket-pass__eyebrow {
      margin: 0 0 2px;
      color: rgba(255, 172, 88, .92);
      font-weight: 800;
    }

    .ticket-pass__title {
      display: block;
      margin: 0;
      color: rgba(245, 241, 234, .94);
      font-family: var(--display);
      font-size: clamp(12px, .88vw, 14px);
      font-weight: 650;
      letter-spacing: -.01em;
      line-height: 1.02;
    }

    .ticket-pass__serial,
    .ticket-pass__id {
      display: block;
      max-width: 24ch;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(245, 241, 234, .68);
    }

    .ticket-pass__serial {
      --mask-width: 14ch;
      margin-top: 2px;
      font-size: 7.4px;
      color: rgba(245, 241, 234, .48);
    }

    .ticket-pass__edit {
      pointer-events: auto;
      flex: 0 0 auto;
      display: inline-grid;
      place-items: center;
      min-height: 21px;
      padding: 0 7px;
      border: 1px solid rgba(255, 138, 61, .2);
      border-radius: 999px;
      background:
        linear-gradient(180deg, rgba(255, 138, 61, .11), rgba(255, 255, 255, .018)),
        rgba(0, 0, 0, .2);
      color: rgba(255, 218, 172, .88);
      font-family: var(--mono);
      font-size: 7.4px;
      font-weight: 850;
      letter-spacing: .075em;
      line-height: 1;
      text-decoration: none;
      text-transform: uppercase;
      box-shadow:
        inset 0 1px 0 rgba(255, 235, 210, .1),
        0 10px 24px rgba(0, 0, 0, .16);
      transition: border-color .22s ease, color .22s ease, background .22s ease, transform .22s ease;
    }

    .ticket-pass__edit:hover,
    .ticket-pass__edit:focus-visible {
      transform: translateY(-1px);
      border-color: rgba(255, 138, 61, .38);
      color: rgba(255, 238, 212, .96);
      outline: none;
      background:
        linear-gradient(180deg, rgba(255, 138, 61, .16), rgba(255, 255, 255, .03)),
        rgba(0, 0, 0, .24);
    }

    .ticket-pass__nfc {
      flex: 0 0 auto;
      width: 44px;
      height: 34px;
      border: 1px solid rgba(255, 138, 61, .28);
      border-radius: 14px;
      background:
        radial-gradient(circle at 50% 50%, rgba(255, 138, 61, .14), transparent 62%),
        rgba(255, 138, 61, .055);
      position: relative;
      box-shadow:
        inset 0 1px 0 rgba(255, 220, 176, .12),
        0 0 22px rgba(255, 138, 61, .08);
    }

    .ticket-pass__nfc::before,
    .ticket-pass__nfc::after {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      border: 1px solid transparent;
      border-right-color: rgba(255, 220, 176, .88);
      border-radius: 50%;
      transform: translate(-48%, -50%);
    }

    .ticket-pass__nfc::before {
      width: 16px;
      height: 16px;
    }

    .ticket-pass__nfc::after {
      width: 28px;
      height: 28px;
      opacity: .62;
    }

    .ticket-pass__identity {
      min-width: 0;
      align-self: center;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 10px;
      min-height: 44px;
      padding: 7px 10px;
      border: 1px solid rgba(245, 241, 234, .09);
      border-radius: 14px;
      background:
        radial-gradient(80% 120% at 0% 0%, rgba(255, 138, 61, .09), transparent 62%),
        linear-gradient(180deg, rgba(255, 255, 255, .046), rgba(255, 255, 255, .012)),
        rgba(0, 0, 0, .2);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .07),
        inset 0 0 0 1px rgba(0, 0, 0, .16);
    }

    .ticket-pass__holder-mark {
      width: 32px;
      height: 32px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255, 138, 61, .28);
      border-radius: 14px;
      background:
        radial-gradient(circle at 48% 30%, rgba(255, 230, 198, .22), transparent 46%),
        linear-gradient(180deg, rgba(255, 138, 61, .18), rgba(255, 138, 61, .055));
      color: rgba(255, 224, 184, .92);
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .08em;
      box-shadow:
        inset 0 1px 0 rgba(255, 245, 230, .13),
        0 0 24px rgba(255, 138, 61, .08);
    }

    .ticket-pass__identity-copy {
      min-width: 0;
      display: grid;
      gap: 3px;
    }

    .ticket-pass__identity-label {
      color: rgba(255, 172, 88, .82);
      font-family: var(--mono);
      font-size: 7.8px;
      font-weight: 800;
      letter-spacing: .09em;
      line-height: 1;
      text-transform: uppercase;
    }

    .ticket-pass__identity--barcode {
      align-self: stretch;
      align-content: center;
      gap: 7px;
    }

    .ticket-pass__identity h3 {
      max-width: 22ch;
      margin: 0;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      color: rgba(245, 241, 234, .96);
      font-size: clamp(17px, 1.65vw, 24px);
      line-height: .98;
      -webkit-line-clamp: 1;
      letter-spacing: 0;
      font-weight: 650;
      text-wrap: balance;
    }

    .ticket-pass__barcode-meta {
      display: grid;
      align-items: center;
      justify-items: center;
      gap: 2px;
      min-width: 0;
      font-family: var(--mono);
      text-align: center;
      text-transform: uppercase;
    }

    .ticket-pass__barcode-zone {
      display: grid;
      gap: 2px;
      min-width: 0;
      padding: 3px 6px;
      border: 1px solid rgba(245, 241, 234, .07);
      border-radius: 13px;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .26), transparent 48%, rgba(255, 138, 61, .035)),
        rgba(0, 0, 0, .18);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
    }

    .ticket-pass__barcode-meta span {
      width: 100%;
      color: rgba(255, 172, 88, .82);
      font-size: 7.3px;
      font-weight: 800;
      letter-spacing: .09em;
      text-align: center;
    }

    .ticket-pass__barcode-meta strong {
      --mask-width: 12ch;
      display: block;
      width: 100%;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(245, 241, 234, .82);
      font-size: 8.4px;
      font-weight: 800;
      letter-spacing: .055em;
      text-align: center;
    }

    .ticket-pass__barcode {
      --barcode-lines: repeating-linear-gradient(90deg,
          rgba(245, 241, 234, .86) 0 2px,
          transparent 2px 4px,
          rgba(245, 241, 234, .72) 4px 5px,
          transparent 5px 8px);
      position: relative;
      align-self: stretch;
      width: 100%;
      height: clamp(17px, 1.8vw, 23px);
      border: 1px solid rgba(245, 241, 234, .1);
      border-radius: 10px;
      overflow: hidden;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .28), transparent 14%, transparent 86%, rgba(0, 0, 0, .22)),
        rgba(255, 255, 255, .055);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .07),
        inset 0 0 0 1px rgba(255, 138, 61, .035);
    }

    .ticket-pass__barcode::before {
      content: "";
      position: absolute;
      inset: 5px 8px;
      background: var(--barcode-lines);
      opacity: .86;
      mask-image: linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
      -webkit-mask-image: linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
    }

    .ticket-pass__barcode::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, transparent, rgba(255, 138, 61, .08), transparent),
        repeating-linear-gradient(90deg, transparent 0 22px, rgba(255, 138, 61, .08) 22px 23px, transparent 23px 46px);
      opacity: .62;
      pointer-events: none;
    }

    .ticket-pass__barcode span {
      position: relative;
      z-index: 1;
      display: block;
      width: var(--bar-width, 2px);
      height: var(--bar-height, 100%);
      margin-top: auto;
      background: rgba(245, 241, 234, .88);
      border-radius: 1px;
      opacity: var(--bar-alpha, .82);
    }

    .ticket-pass__barcode.is-generated {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: var(--bar-gap, 1px);
      padding: 4px 7px;
    }

    .ticket-pass__barcode.is-generated::before {
      opacity: 0;
    }

    html.pass-reader-open,
    body.pass-reader-open {
      overflow: hidden;
    }

    body.pass-reader-open #sitePlayer {
      opacity: 0;
      pointer-events: none;
    }

    .pass-reader {
      position: fixed;
      inset: 0;
      z-index: 2147483200;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      gap: clamp(14px, 2vh, 22px);
      padding:
        calc(env(safe-area-inset-top, 0px) + clamp(16px, 2.6vh, 30px))
        clamp(14px, 4vw, 42px)
        calc(env(safe-area-inset-bottom, 0px) + clamp(16px, 3vh, 34px));
      overflow: hidden;
      opacity: 0;
      pointer-events: none;
      background:
        radial-gradient(circle at 50% 48%, rgba(255, 138, 61, .18), transparent 36%),
        radial-gradient(circle at 50% 96%, rgba(255, 174, 88, .14), transparent 34%),
        linear-gradient(180deg, rgba(11, 8, 7, .92), rgba(0, 0, 0, .98));
      backdrop-filter: blur(22px) saturate(1.2);
      -webkit-backdrop-filter: blur(22px) saturate(1.2);
      transition: opacity 260ms ease;
      isolation: isolate;
    }

    .pass-reader::before,
    .pass-reader::after {
      content: "";
      position: absolute;
      pointer-events: none;
      z-index: 0;
    }

    .pass-reader::before {
      inset: 0;
      background:
        linear-gradient(115deg, transparent 0 34%, rgba(255, 224, 185, .07) 34.3%, transparent 35.6% 64%, rgba(255, 138, 61, .06) 64.3%, transparent 65.4%),
        repeating-linear-gradient(90deg, transparent 0 42px, rgba(255, 138, 61, .028) 42px 43px, transparent 43px 84px);
      mask-image: radial-gradient(ellipse at 50% 50%, #000, transparent 72%);
      -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000, transparent 72%);
      opacity: .72;
    }

    .pass-reader::after {
      inset: auto 8vw -18vh;
      height: 42vh;
      border-radius: 50%;
      background: radial-gradient(closest-side, rgba(255, 138, 61, .22), transparent 72%);
      filter: blur(18px);
      opacity: .7;
    }

    .pass-reader.is-open {
      opacity: 1;
      pointer-events: auto;
    }

    .pass-reader__chrome,
    .pass-reader__stage {
      position: relative;
      z-index: 1;
    }

    .pass-reader__chrome {
      width: min(100%, 980px);
      justify-self: center;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
    }

    .pass-reader__hint {
      margin: 0;
      color: rgba(245, 241, 234, .78);
      font-family: var(--mono);
      font-size: clamp(10px, 1.4vw, 12px);
      font-weight: 800;
      letter-spacing: .12em;
      line-height: 1.45;
      text-transform: uppercase;
    }

    .pass-reader__close {
      min-height: 38px;
      padding: 0 16px;
      border: 1px solid rgba(255, 138, 61, .34);
      border-radius: 999px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .025)),
        rgba(0, 0, 0, .36);
      color: rgba(255, 225, 186, .94);
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .14em;
      text-transform: uppercase;
      cursor: pointer;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 28px rgba(0, 0, 0, .3);
      transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
    }

    .pass-reader__close:hover,
    .pass-reader__close:focus-visible {
      transform: translateY(-1px);
      border-color: rgba(255, 188, 104, .7);
      background: rgba(255, 138, 61, .14);
      outline: none;
    }

    .pass-reader__stage {
      min-width: 0;
      min-height: 0;
      display: grid;
      place-items: center;
      perspective: 1800px;
      overflow: hidden;
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen {
      width: min(94vw, calc((100dvh - 132px) * 1.586));
      height: min(calc(100dvh - 132px), calc(94vw / 1.586));
      min-height: 0;
      padding: 0;
      overflow: visible;
      background: transparent;
      opacity: 0;
      transform: translateY(22px) scale(.94);
      transition: opacity 420ms ease, transform 640ms cubic-bezier(.19, 1, .22, 1);
    }

    .pass-reader.is-open .ticket-pass.is-barcode-fullscreen {
      opacity: 1;
      transform: translateY(0) scale(1);
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen::before {
      width: 112%;
      opacity: .9;
      filter: blur(8px);
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen::after {
      border-radius: clamp(22px, 3vw, 42px);
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen .ticket-pass__content {
      width: 100%;
      height: 100%;
      max-width: none;
      aspect-ratio: auto;
      border-radius: clamp(22px, 2.6vw, 38px);
      filter:
        drop-shadow(0 42px 90px rgba(0, 0, 0, .64))
        drop-shadow(0 0 34px rgba(255, 138, 61, .18));
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen:hover .ticket-pass__content,
    .pass-reader .ticket-pass.is-barcode-fullscreen:focus-visible .ticket-pass__content {
      --pass-scale: 1;
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen .ticket-pass__barcode-zone {
      gap: clamp(6px, 1.1vh, 12px);
      padding: clamp(8px, 1.4vh, 14px) clamp(10px, 2vw, 22px);
      border-radius: clamp(14px, 1.6vw, 22px);
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen .ticket-pass__barcode {
      height: clamp(48px, 10dvh, 104px);
      border-radius: clamp(12px, 1.6vw, 20px);
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen .ticket-pass__barcode.is-generated {
      padding: clamp(8px, 1.5vh, 14px) clamp(12px, 1.7vw, 20px);
      gap: 2px;
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen .ticket-pass__barcode-meta span {
      font-size: clamp(8px, 1.2vw, 12px);
    }

    .pass-reader .ticket-pass.is-barcode-fullscreen .ticket-pass__barcode-meta strong {
      font-size: clamp(9px, 1.25vw, 13px);
      letter-spacing: .08em;
    }

    @media(max-width:700px) and (orientation: portrait) {
      .pass-reader {
        gap: 8px;
        padding:
          calc(env(safe-area-inset-top, 0px) + 12px)
          12px
          calc(env(safe-area-inset-bottom, 0px) + 12px);
      }

      .pass-reader__chrome {
        align-items: flex-start;
      }

      .pass-reader__hint {
        max-width: 28ch;
        font-size: 9px;
      }

      .pass-reader__close {
        min-height: 34px;
        padding: 0 12px;
        font-size: 9px;
      }

      .pass-reader .ticket-pass.is-barcode-fullscreen {
        width: min(calc(100dvh - 112px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)), 760px);
        height: min(calc(100dvw - 24px), calc((100dvh - 112px) / 1.586));
        transform: rotate(90deg) translateY(18px) scale(.94);
      }

      .pass-reader.is-open .ticket-pass.is-barcode-fullscreen {
        transform: rotate(90deg) translateY(0) scale(1);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .pass-reader,
      .pass-reader .ticket-pass.is-barcode-fullscreen,
      .pass-reader__close {
        transition: none;
      }
    }

    .ticket-pass__handle {
      --mask-width: 18ch;
      display: block;
      width: fit-content;
      max-width: 28ch;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(255, 210, 155, .82);
      font-family: var(--mono);
      font-size: 8.5px;
      letter-spacing: .07em;
      text-transform: uppercase;
    }

    .ticket-pass__public-name {
      --mask-width: 18ch;
      display: block;
      width: fit-content;
      max-width: 28ch;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(245, 241, 234, .68);
      font-family: var(--mono);
      font-size: 7.4px;
      font-weight: 800;
      letter-spacing: .06em;
      line-height: 1.05;
      text-transform: uppercase;
    }

    .ticket-pass__front-footer {
      display: grid;
      gap: 3px;
      min-height: 0;
      overflow: hidden;
    }

    .ticket-pass__front-meta {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 4px;
    }

    .ticket-pass__front-field,
    .ticket-pass__metric {
      min-width: 0;
      padding: 3px 5px;
      display: grid;
      align-content: center;
      justify-items: center;
      text-align: center;
      border: 1px solid rgba(245, 241, 234, .075);
      border-radius: 10px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .034), rgba(255, 255, 255, .01)),
        rgba(0, 0, 0, .2);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
    }

    .ticket-pass__front-field span,
    .ticket-pass__metric span {
      display: block;
      width: 100%;
      margin-bottom: 1px;
      color: rgba(255, 188, 112, .88);
      font-family: var(--mono);
      font-size: 6.6px;
      font-weight: 800;
      letter-spacing: .09em;
      line-height: 1;
      text-transform: uppercase;
    }

    .ticket-pass__front-field strong,
    .ticket-pass__metric strong {
      --mask-width: 9ch;
      display: block;
      width: 100%;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: center;
      color: rgba(245, 241, 234, .9);
      font-family: var(--mono);
      font-size: 7.6px;
      font-weight: 800;
      letter-spacing: .045em;
      line-height: 1.1;
      text-transform: uppercase;
    }

    .ticket-pass__sticker-row {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 4px;
      align-items: center;
      min-width: 0;
      overflow: hidden;
    }

    .pass-stickers {
      min-width: 0;
      display: flex;
      flex-wrap: nowrap;
      justify-content: center;
      gap: 3px;
      overflow: hidden;
    }

    .pass-sticker {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 15px;
      max-width: 100%;
      padding: 0 6px;
      border: 1px solid rgba(255, 138, 61, .18);
      border-radius: 999px;
      background:
        linear-gradient(180deg, rgba(255, 138, 61, .095), rgba(255, 255, 255, .018)),
        rgba(0, 0, 0, .26);
      color: rgba(255, 218, 172, .86);
      font-family: var(--mono);
      font-size: 6.8px;
      font-weight: 800;
      letter-spacing: .065em;
      line-height: 1;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      box-shadow: inset 0 1px 0 rgba(255, 222, 176, .1);
    }

    .ticket-pass__level {
      --mask-width: 7ch;
      flex: 0 0 auto;
    }

    #ticketPassStickers .pass-sticker:nth-child(n+4) {
      display: none;
    }

    .ticket-pass__back-head {
      align-items: center;
    }

    .ticket-pass__back-details {
      align-self: stretch;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 5px;
      min-height: 0;
    }

    .ticket-pass__metric {
      display: grid;
      align-content: center;
      justify-items: center;
      min-height: 34px;
      padding: 5px 7px;
      text-align: center;
    }

    .ticket-pass__metric strong {
      --mask-width: 15ch;
      max-width: 100%;
      font-size: 10px;
      line-height: 1.12;
      text-transform: none;
      letter-spacing: 0;
      overflow-wrap: anywhere;
    }

    .ticket-pass__back-footer {
      align-items: center;
      min-width: 0;
      color: rgba(245, 241, 234, .6);
      font-family: var(--mono);
      font-size: 7.8px;
      letter-spacing: .08em;
      line-height: 1.25;
      text-transform: uppercase;
    }

    .ticket-pass__back-footer span:first-child {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .ticket-pass__capability {
      flex: 0 0 auto;
      color: rgba(255, 172, 88, .74);
      white-space: nowrap;
    }

    .ticket-pass__masked {
      position: relative;
      display: inline-block;
      min-width: var(--mask-width, 8ch);
      min-height: 1em;
      border-radius: 8px;
      transition: color .24s ease, opacity .24s ease, filter .24s ease;
    }

    .ticket-pass.is-loading .ticket-pass__masked {
      color: transparent !important;
      text-shadow: none;

      user-select: none;
    }

    .ticket-pass.is-loading .ticket-pass__masked::before {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      width: min(var(--mask-width, 100%), 100%);
      height: var(--mask-height, .78em);
      transform: translateY(-50%);
      border-radius: inherit;
      background:
        linear-gradient(90deg, rgba(255, 255, 255, .07), rgba(255, 205, 150, .16), rgba(255, 255, 255, .065)),
        rgba(245, 241, 234, .085);
      background-size: 180% 100%;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .07),
        inset 0 0 0 1px rgba(255, 138, 61, .045),
        0 0 16px rgba(255, 159, 61, .045);
      animation: passSkeletonSheen 3.2s cubic-bezier(.45, 0, .2, 1) infinite;
    }

    .ticket-pass.is-loading #ticketPassStickers .pass-sticker {
      position: relative;
      min-width: 66px;
      color: transparent;

      user-select: none;
    }

    .ticket-pass.is-loading #ticketPassStickers .pass-sticker::before {
      content: "";
      position: absolute;
      inset: 7px 9px;
      border-radius: 999px;
      background:
        linear-gradient(90deg, rgba(255, 255, 255, .07), rgba(255, 205, 150, .15), rgba(255, 255, 255, .06)),
        rgba(245, 241, 234, .085);
      background-size: 180% 100%;
      animation: passSkeletonSheen 3.2s cubic-bezier(.45, 0, .2, 1) infinite;
    }

    @keyframes passSkeletonSheen {

      0%,
      100% {
        opacity: .72;
        background-position: 0 0;
      }

      50% {
        opacity: .95;
        background-position: 100% 0;
      }
    }

    .ticket-events {
      --ticket-market-radius: clamp(22px, 2.1vw, 32px);
      --ticket-market-flow: 1;
      position: relative;
      display: grid;
      gap: 12px;
      padding: clamp(14px, 1.8vw, 22px);
      border: 1px solid rgba(255, 255, 255, .095);
      border-radius: var(--ticket-market-radius);
      background:
        radial-gradient(70% 90% at 15% 0%, rgba(255, 138, 61, .13), transparent 58%),
        radial-gradient(62% 84% at 86% 8%, rgba(255, 226, 188, .055), transparent 62%),
        linear-gradient(180deg, rgba(255, 255, 255, .052), rgba(255, 255, 255, .018)),
        rgba(8, 8, 10, .88);
      box-shadow:
        0 34px 110px rgba(0, 0, 0, .32),
        inset 0 1px 0 rgba(255, 255, 255, .06),
        inset 0 0 0 1px rgba(255, 138, 61, .04);
      overflow: hidden;
      isolation: isolate;
    }

    .ticket-events.is-paging {
      pointer-events: none;
    }

    .ticket-events::before,
    .ticket-events::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
    }

    .ticket-events::before {
      background:
        linear-gradient(90deg, transparent 0 7%, rgba(255, 138, 61, .09) 7.15%, transparent 7.45% 49%, rgba(255, 255, 255, .05) 49.12%, transparent 49.36%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .026) 0 1px, transparent 1px 52px);
      mask-image: linear-gradient(90deg, transparent, #000 10% 90%, transparent);
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 10% 90%, transparent);
      opacity: .34;
    }

    .ticket-events::after {
      inset: auto 18px 18px 18px;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255, 138, 61, .56), rgba(255, 255, 255, .16), transparent);
      opacity: .72;
    }

    .ticket-events>* {
      position: relative;
      z-index: 1;
    }

    .ticket-market__head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 16px;
      padding: 4px 4px 10px;
    }

    .ticket-market__kicker {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 8px;
      font-family: var(--mono);
      font-size: 10px;
      line-height: 1;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255, 179, 112, .88);
    }

    .ticket-market__kicker::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 999px;
      background: #ff8a3d;
      box-shadow: 0 0 18px rgba(255, 138, 61, .72);
    }

    .ticket-market__head strong {
      display: block;
      font-family: var(--display);
      font-size: clamp(19px, 1.9vw, 29px);
      line-height: .96;
      letter-spacing: -.03em;
      color: rgba(245, 241, 234, .96);
    }

    .ticket-market__head p {
      max-width: min(100%, 68ch);
      margin: 8px 0 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(245, 241, 234, .62);
      font-size: 13px;
      line-height: 1.45;
    }

    .ticket-market__sync {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 13px;
      border: 1px solid rgba(255, 138, 61, .16);
      border-radius: 999px;
      background: rgba(255, 138, 61, .07);
      color: rgba(255, 225, 198, .78);
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .12em;
      text-transform: uppercase;
      white-space: nowrap;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
    }

    .ticket-market__pager {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 2px 4px 0;
    }

    .ticket-market__page-label {
      min-width: 0;
      color: rgba(245, 241, 234, .58);
      font-family: var(--mono);
      font-size: 10px;
      line-height: 1.2;
      letter-spacing: .12em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .ticket-market__pager-actions {
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }

    .ticket-market__nav {
      width: 38px;
      height: 38px;
      display: inline-grid;
      place-items: center;
      border: 1px solid rgba(255, 138, 61, .18);
      border-radius: 999px;
      background:
        radial-gradient(circle at 50% 12%, rgba(255, 185, 112, .14), transparent 58%),
        rgba(255, 255, 255, .045);
      color: rgba(255, 225, 198, .86);
      font-family: var(--mono);
      font-size: 15px;
      line-height: 1;
      cursor: pointer;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .07),
        0 10px 24px rgba(0, 0, 0, .16);
      transition:
        transform .22s cubic-bezier(.22, 1, .36, 1),
        border-color .22s ease,
        background .22s ease,
        color .22s ease,
        opacity .22s ease;
    }

    .ticket-market__nav:hover,
    .ticket-market__nav:focus-visible {
      transform: translateY(-1px);
      border-color: rgba(255, 138, 61, .34);
      background: rgba(255, 138, 61, .12);
      color: rgba(255, 244, 230, .98);
      outline: none;
    }

    .ticket-market__nav:focus-visible {
      box-shadow:
        0 0 0 3px rgba(255, 138, 61, .22),
        inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    .ticket-market__nav:disabled {
      cursor: default;
      opacity: .38;
      transform: none;
      color: rgba(245, 241, 234, .42);
      border-color: rgba(255, 255, 255, .08);
      background: rgba(255, 255, 255, .025);
      box-shadow: none;
    }

    .ticket-market__viewport {
      overflow: hidden;
      border-radius: clamp(18px, 1.6vw, 24px);
      perspective: 1400px;
    }

    .ticket-market__page {
      display: grid;
      gap: 12px;
      animation: ticketPageIn .48s cubic-bezier(.16, 1, .3, 1);
    }

    @keyframes ticketPageIn {
      from {
        opacity: 0;
        transform: translate3d(calc(var(--ticket-market-flow) * 22px), 8px, 0) rotateY(calc(var(--ticket-market-flow) * -2.5deg));
        filter: blur(7px);
      }
      to {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotateY(0deg);
        filter: blur(0);
      }
    }

    .ticket-card {
      --ticket-remaining-ratio: .5;
      position: relative;
      min-height: clamp(150px, 17vh, 184px);
      padding: clamp(16px, 1.9vw, 24px);
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      grid-template-areas:
        "date top price"
        "date copy price"
        "date meta action";
      gap: clamp(10px, 1.35vh, 14px) clamp(14px, 1.7vw, 24px);
      border: 1px solid rgba(255, 255, 255, .085);
      border-radius: clamp(18px, 1.6vw, 24px);
      background:
        radial-gradient(70% 130% at 0% 45%, rgba(255, 138, 61, .075), transparent 62%),
        linear-gradient(135deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .018) 48%, rgba(255, 138, 61, .035)),
        rgba(9, 9, 12, .94);
      overflow: hidden;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .055),
        0 18px 42px rgba(0, 0, 0, .16);
      transition:
        transform .32s cubic-bezier(.22, 1, .36, 1),
        border-color .32s ease,
        box-shadow .32s ease,
        background .32s ease;
    }

    .ticket-card::before {
      content: "";
      position: absolute;
      inset: 10px auto 10px 0;
      width: 3px;
      border-radius: 999px;
      background: linear-gradient(180deg, transparent, rgba(255, 138, 61, .82), rgba(255, 255, 255, .26), transparent);
      opacity: .54;
      pointer-events: none;
    }

    .ticket-card::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, transparent 0 75%, rgba(255, 138, 61, .05)),
        repeating-linear-gradient(90deg, transparent 0 18px, rgba(255, 255, 255, .025) 19px 20px);
      mask-image: linear-gradient(90deg, transparent, #000 8%, #000 78%, transparent);
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 78%, transparent);
      opacity: .28;
      pointer-events: none;
    }

    .ticket-card>* {
      position: relative;
      z-index: 1;
    }

    .ticket-card:hover,
    .ticket-card:focus-within {
      transform: translateY(-2px);
      border-color: rgba(255, 138, 61, .28);
      background:
        radial-gradient(70% 130% at 0% 45%, rgba(255, 138, 61, .11), transparent 62%),
        linear-gradient(135deg, rgba(255, 255, 255, .074), rgba(255, 255, 255, .024) 48%, rgba(255, 138, 61, .05)),
        rgba(11, 11, 14, .98);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .07),
        inset 0 0 0 1px rgba(255, 138, 61, .06),
        0 24px 56px rgba(0, 0, 0, .24);
    }

    .ticket-card__date {
      grid-area: date;
      width: clamp(62px, 5.4vw, 78px);
      min-height: 100%;
      display: grid;
      place-items: center;
      align-self: stretch;
      border: 1px solid rgba(255, 138, 61, .14);
      border-radius: 18px;
      background:
        radial-gradient(circle at 50% 18%, rgba(255, 138, 61, .18), transparent 54%),
        linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .018));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        inset 0 -18px 32px rgba(0, 0, 0, .18);
    }

    .ticket-card__date span,
    .ticket-card__date strong,
    .ticket-card__date em {
      display: block;
      text-align: center;
      font-style: normal;
    }

    .ticket-card__date span,
    .ticket-card__date em {
      font-family: var(--mono);
      font-size: 8px;
      line-height: 1;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: rgba(255, 219, 188, .58);
    }

    .ticket-card__date strong {
      margin: 5px 0;
      font-family: var(--display);
      font-size: clamp(23px, 2.1vw, 32px);
      line-height: .78;
      letter-spacing: -.04em;
      color: rgba(245, 241, 234, .98);
    }

    .ticket-card h3 {
      margin: 0;
      margin-top: 6px;
      font-size: clamp(22px, 2.2vw, 34px);
      line-height: .92;
      letter-spacing: -.035em;
      font-weight: 540;
    }

    .ticket-card p {
      grid-area: copy;
      max-width: 56ch;
      margin: 0;
      color: rgba(245, 241, 234, .7);
      font-size: 13.5px;
      line-height: 1.5;
    }

    .ticket-card__top {
      grid-area: top;
      min-width: 0;
    }

    .ticket-card__price {
      grid-area: price;
      justify-self: end;
      align-self: start;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 38px;
      padding: 0 14px;
      border: 1px solid rgba(255, 138, 61, .18);
      border-radius: 999px;
      background: rgba(255, 138, 61, .08);
      font-family: var(--display);
      color: rgba(245, 241, 234, .96);
      font-size: clamp(17px, 1.35vw, 22px);
      font-weight: 740;
      white-space: nowrap;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055);
    }

    .ticket-card__actions {
      display: contents;
    }

    .ticket-card__actions .ticket-card__availability {
      grid-area: meta;
      align-self: center;
    }

    .ticket-card__actions .btn {
      grid-area: action;
      justify-self: end;
      align-self: center;
      min-width: 164px;
      box-shadow:
        0 12px 30px rgba(255, 138, 61, .14),
        inset 0 1px 0 rgba(255, 255, 255, .12);
    }

    .ticket-card__availability {
      display: grid;
      gap: 7px;
      min-width: min(270px, 100%);
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: rgba(245, 241, 234, .58);
    }

    .ticket-card__availability-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .ticket-card__capacity {
      position: relative;
      height: 5px;
      border-radius: 999px;
      overflow: hidden;
      background: rgba(255, 255, 255, .08);
    }

    .ticket-card__capacity::before {
      content: "";
      position: absolute;
      inset: 0 auto 0 0;
      width: calc(var(--ticket-remaining-ratio) * 100%);
      border-radius: inherit;
      background: linear-gradient(90deg, rgba(255, 138, 61, .96), rgba(255, 214, 166, .74));
      box-shadow: 0 0 18px rgba(255, 138, 61, .28);
    }

    .tickets-console-wrap.reveal .ticket-market__head,
    .tickets-console-wrap.reveal .ticket-market__pager,
    .tickets-console-wrap.reveal .ticket-card {
      opacity: 0;
      transform: translateY(16px);
      filter: blur(5px);
    }

    .tickets-console-wrap.reveal.in .ticket-market__head {
      animation: ticketMarketBlockIn .74s .04s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-market__pager {
      animation: ticketMarketBlockIn .7s .16s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-events::before,
    .ticket-events.is-paging::before {
      animation: ticketMarketScan 2.2s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-events::after {
      transform-origin: left center;
      animation: ticketMarketLineIn 1.1s .18s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-market__kicker::before,
    .ticket-events.is-paging .ticket-market__kicker::before {
      animation: ticketPixPulse 1.45s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-market__sync {
      animation: ticketSyncIn .78s .24s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-market__nav {
      animation: ticketNavIn .52s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-market__nav:nth-child(1) {
      animation-delay: .24s;
    }

    .tickets-console-wrap.reveal.in .ticket-market__nav:nth-child(2) {
      animation-delay: .32s;
    }

    .tickets-console-wrap.reveal.in .ticket-card {
      animation: ticketCardIn .78s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.28s + (var(--ticket-card-index, 0) * 96ms));
    }

    .ticket-events.is-paging .ticket-card {
      animation: ticketCardPageIn .58s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(var(--ticket-card-index, 0) * 74ms);
    }

    .tickets-console-wrap.reveal.in .ticket-card::before,
    .ticket-events.is-paging .ticket-card::before {
      animation: ticketCardEdgePulse 1.4s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.38s + (var(--ticket-card-index, 0) * 92ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card__date {
      animation: ticketDateTileIn .66s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.36s + (var(--ticket-card-index, 0) * 94ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card__date strong {
      animation: ticketDateNumberPop .74s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.46s + (var(--ticket-card-index, 0) * 94ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card h3,
    .tickets-console-wrap.reveal.in .ticket-card p,
    .tickets-console-wrap.reveal.in .ticket-card__availability {
      animation: ticketTextIn .58s cubic-bezier(.16, 1, .3, 1) both;
    }

    .tickets-console-wrap.reveal.in .ticket-card h3 {
      animation-delay: calc(.42s + (var(--ticket-card-index, 0) * 96ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card p {
      animation-delay: calc(.49s + (var(--ticket-card-index, 0) * 96ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card__availability {
      animation-delay: calc(.56s + (var(--ticket-card-index, 0) * 94ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card__price {
      animation: ticketPriceIn .58s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.5s + (var(--ticket-card-index, 0) * 94ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card__capacity::before,
    .ticket-events.is-paging .ticket-card__capacity::before {
      transform-origin: left center;
      animation: ticketCapacityFill .9s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.64s + (var(--ticket-card-index, 0) * 86ms));
    }

    .tickets-console-wrap.reveal.in .ticket-card__actions .btn {
      animation: ticketButtonIn .62s cubic-bezier(.16, 1, .3, 1) both;
      animation-delay: calc(.62s + (var(--ticket-card-index, 0) * 94ms));
    }

    .ticket-card.is-sold-out {
      --ticket-remaining-ratio: 0;
    }

    .ticket-card.is-sold-out .ticket-card__date,
    .ticket-card.is-sold-out .ticket-card__price {
      border-color: rgba(245, 241, 234, .12);
      background: rgba(255, 255, 255, .035);
      color: rgba(245, 241, 234, .7);
    }

    @keyframes ticketMarketBlockIn {
      from {
        opacity: 0;
        transform: translateY(18px);
        filter: blur(7px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
      }
    }

    @keyframes ticketMarketScan {
      0% {
        opacity: .16;
        transform: translateX(-5%);
      }
      38% {
        opacity: .52;
      }
      100% {
        opacity: .34;
        transform: translateX(0);
      }
    }

    @keyframes ticketMarketLineIn {
      from {
        opacity: 0;
        transform: scaleX(.18);
        filter: blur(5px);
      }
      to {
        opacity: .72;
        transform: scaleX(1);
        filter: blur(0);
      }
    }

    @keyframes ticketPixPulse {
      0% {
        transform: scale(.74);
        box-shadow: 0 0 0 rgba(255, 138, 61, 0);
      }
      42% {
        transform: scale(1.28);
        box-shadow: 0 0 0 9px rgba(255, 138, 61, .12), 0 0 28px rgba(255, 138, 61, .82);
      }
      100% {
        transform: scale(1);
        box-shadow: 0 0 18px rgba(255, 138, 61, .72);
      }
    }

    @keyframes ticketSyncIn {
      from {
        opacity: 0;
        transform: translateX(14px) scale(.96);
        filter: blur(6px);
      }
      to {
        opacity: 1;
        transform: translateX(0) scale(1);
        filter: blur(0);
      }
    }

    @keyframes ticketNavIn {
      from {
        opacity: 0;
        transform: translateX(10px) scale(.82);
      }
      to {
        opacity: 1;
        transform: translateX(0) scale(1);
      }
    }

    @keyframes ticketCardIn {
      from {
        opacity: 0;
        transform: translate3d(calc(var(--ticket-market-flow) * 28px), 18px, 0) rotateX(4deg) rotateY(calc(var(--ticket-market-flow) * -3deg));
        filter: blur(8px);
      }
      to {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
        filter: blur(0);
      }
    }

    @keyframes ticketCardPageIn {
      from {
        opacity: 0;
        transform: translate3d(calc(var(--ticket-market-flow) * 20px), 10px, 0) scale(.985);
        filter: blur(7px);
      }
      to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0);
      }
    }

    @keyframes ticketCardEdgePulse {
      0% {
        opacity: 0;
        transform: scaleY(.2);
      }
      48% {
        opacity: .84;
      }
      100% {
        opacity: .54;
        transform: scaleY(1);
      }
    }

    @keyframes ticketDateTileIn {
      from {
        opacity: 0;
        transform: translateX(calc(var(--ticket-market-flow) * -12px)) scale(.9);
        filter: blur(5px);
      }
      to {
        opacity: 1;
        transform: translateX(0) scale(1);
        filter: blur(0);
      }
    }

    @keyframes ticketDateNumberPop {
      0% {
        opacity: .4;
        transform: translateY(5px) scale(.78);
      }
      64% {
        opacity: 1;
        transform: translateY(-1px) scale(1.08);
      }
      100% {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    @keyframes ticketTextIn {
      from {
        opacity: 0;
        transform: translateY(8px);
        filter: blur(4px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
      }
    }

    @keyframes ticketPriceIn {
      from {
        opacity: 0;
        transform: translateX(calc(var(--ticket-market-flow) * 12px)) scale(.94);
        filter: blur(5px);
      }
      to {
        opacity: 1;
        transform: translateX(0) scale(1);
        filter: blur(0);
      }
    }

    @keyframes ticketCapacityFill {
      from {
        transform: scaleX(.02);
        filter: blur(2px);
      }
      to {
        transform: scaleX(1);
        filter: blur(0);
      }
    }

    @keyframes ticketButtonIn {
      from {
        opacity: 0;
        transform: translateY(8px) scale(.95);
        filter: blur(4px);
      }
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
      }
    }

    html[data-auth-state="guest"] .site-chat-launch,
    html[data-auth-state="guest"] .site-chat {
      display: none !important;
    }

    .site-chat {
      position: fixed;
      right: clamp(24px, 4vw, 62px);
      bottom: clamp(24px, 5vh, 56px);
      z-index: 12130;
      width: clamp(390px, 32vw, 520px);
      max-width: calc(100vw - 48px);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(18px) scale(.985);
      transition:
        opacity .28s cubic-bezier(.16, 1, .3, 1),
        transform .28s cubic-bezier(.16, 1, .3, 1),
        visibility .28s;
      overscroll-behavior: contain;
      touch-action: auto;
    }

    .site-chat.is-open {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0) scale(1);
    }

    .site-chat:has(.site-chat__dm-picker.is-open) {
      z-index: 2147482990;
    }

    .site-chat__panel {
      position: relative;
      display: flex;
      flex-direction: column;
      height: clamp(500px, 74dvh, 680px);
      max-height: calc(100dvh - 72px);
      min-height: min(460px, calc(100dvh - 72px));
      overflow: visible;
      border: 1px solid rgba(255, 201, 135, .15);
      border-radius: 24px;
      background:
        radial-gradient(120% 84% at 12% 0%, rgba(255, 138, 61, .14), transparent 46%),
        linear-gradient(180deg, rgba(23, 21, 20, .94), rgba(8, 8, 10, .96));
      box-shadow:
        0 24px 72px rgba(0, 0, 0, .54),
        0 0 0 1px rgba(255, 255, 255, .035),
        inset 0 1px 0 rgba(255, 232, 197, .08);
      backdrop-filter: blur(24px) saturate(150%);
      -webkit-backdrop-filter: blur(24px) saturate(150%);
      isolation: isolate;
      overscroll-behavior: contain;
      touch-action: auto;
    }

    .site-chat__panel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      background:
        linear-gradient(115deg, transparent 0 42%, rgba(255, 138, 61, .065) 48%, transparent 58%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 44px);
      opacity: .62;
      mask-image: linear-gradient(180deg, #000, transparent 82%);
      -webkit-mask-image: linear-gradient(180deg, #000, transparent 82%);
    }

    .site-chat__head {
      flex: 0 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: start;
      gap: 16px;
      padding: 18px 18px 12px;
      border-bottom: 1px solid rgba(245, 241, 236, .08);
    }

    .site-chat__head-main {
      min-width: 0;
      display: grid;
      gap: 5px;
    }

    .site-chat__kicker {
      display: block;
      margin-bottom: 0;
      color: rgba(255, 187, 112, .78);
      font: 800 9px/1 var(--mono);
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .site-chat__title {
      margin: 0;
      font-size: 24px;
      line-height: 1;
      letter-spacing: -.04em;
    }

    .site-chat__subtitle {
      margin: 0;
      max-width: 34rem;
      color: rgba(245, 241, 236, .62);
      font-size: 12px;
      line-height: 1.45;
    }

    .site-chat__button {
      min-height: 34px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 12px;
      border: 1px solid rgba(245, 241, 236, .12);
      border-radius: 14px;
      background: rgba(255, 255, 255, .04);
      color: rgba(245, 241, 236, .84);
      font: 800 9px/1 var(--mono);
      letter-spacing: .08em;
      text-transform: uppercase;
      cursor: pointer;
      transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
    }

    .site-chat__button:hover {
      border-color: rgba(255, 177, 90, .36);
      background: rgba(255, 138, 61, .09);
      color: var(--ink);
      transform: translateY(-1px);
    }

    .site-chat__button--primary {
      border-color: rgba(255, 138, 61, .42);
      background: linear-gradient(180deg, #ffb35d, #ff7f2a);
      color: #160b04;
      box-shadow: 0 10px 24px rgba(255, 138, 61, .17);
    }

    .site-chat__button--close {
      min-width: 72px;
      align-self: start;
      background: rgba(255, 255, 255, .035);
      color: rgba(245, 241, 236, .72);
    }

    .site-chat__button--primary:disabled {
      opacity: .52;
      cursor: not-allowed;
      transform: none;
    }

    .site-chat__tabs {
      flex: 0 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 6px;
      padding: 10px;
      border-bottom: 1px solid rgba(245, 241, 236, .08);
      background: rgba(0, 0, 0, .16);
    }

    .site-chat__tab {
      min-width: 0;
      min-height: 32px;
      border: 1px solid rgba(245, 241, 236, .09);
      border-radius: 13px;
      background: rgba(255, 255, 255, .032);
      color: rgba(245, 241, 236, .68);
      font: 800 9px/1 var(--mono);
      letter-spacing: .07em;
      cursor: pointer;
      transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
    }

    .site-chat__tab:hover,
    .site-chat__tab[aria-selected="true"] {
      border-color: rgba(255, 176, 93, .36);
      background:
        radial-gradient(80% 100% at 50% 0%, rgba(255, 164, 78, .16), transparent 72%),
        rgba(255, 138, 61, .08);
      color: var(--ink);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 8px 22px rgba(255, 138, 61, .08);
    }

    .site-chat__channel,
    .site-chat__dm {
      flex: 0 0 auto;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 9px;
      padding: 10px 12px;
      border-bottom: 1px solid rgba(245, 241, 236, .08);
      background:
        linear-gradient(90deg, rgba(255, 138, 61, .055), transparent 48%),
        rgba(0, 0, 0, .18);
    }

    .site-chat__channel[hidden],
    .site-chat__dm[hidden] {
      display: none !important;
    }

    .site-chat__channel-label,
    .site-chat__dm-label {
      color: rgba(255, 210, 151, .76);
      font: 850 9px/1 var(--mono);
      letter-spacing: .1em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .site-chat__dm-picker {
      position: relative;
      min-width: 0;
    }

    .site-chat__dm-picker.is-open {
      z-index: 2147483000;
    }

    .site-chat__dm-select {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }

    .site-chat__dm-trigger {
      width: 100%;
      min-height: 34px;
      display: inline-grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      padding: 0 10px 0 12px;
      border: 1px solid rgba(245, 241, 236, .12);
      border-radius: 13px;
      background: rgba(255, 255, 255, .045);
      color: rgba(245, 241, 236, .84);
      font: 800 11px/1 var(--mono);
      text-align: left;
      cursor: pointer;
      transition: border-color .2s ease, background .2s ease, color .2s ease;
    }

    .site-chat__dm-trigger:hover,
    .site-chat__dm-picker.is-open .site-chat__dm-trigger {
      border-color: rgba(255, 177, 90, .34);
      background: rgba(255, 138, 61, .1);
      color: var(--ink);
    }

    .site-chat__dm-value {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .site-chat__dm-chevron {
      width: 8px;
      height: 8px;
      border-right: 2px solid currentColor;
      border-bottom: 2px solid currentColor;
      opacity: .58;
      transform: translateY(-2px) rotate(45deg);
      transition: opacity .2s ease, transform .2s ease;
    }

    .site-chat__dm-picker.is-open .site-chat__dm-chevron {
      opacity: .88;
      transform: translateY(2px) rotate(225deg);
    }

    .site-chat__dm-menu {
      position: absolute;
      inset-inline: 0;
      top: calc(100% + 8px);
      z-index: 2147483001;
      max-height: 190px;
      overflow-y: auto;
      padding: 6px;
      scroll-behavior: smooth;
      border: 1px solid rgba(255, 201, 135, .18);
      border-radius: 16px;
      background: linear-gradient(145deg, rgba(24, 20, 17, .98), rgba(8, 8, 10, .99));
      box-shadow: 0 18px 44px rgba(0, 0, 0, .44), inset 0 1px 0 rgba(255, 255, 255, .06);
      opacity: 0;
      visibility: hidden;
      transform: translate3d(0, -6px, 0);
      transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
      overscroll-behavior: contain;
      touch-action: pan-y;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: rgba(255, 138, 61, .65) transparent;
    }

    .site-chat__dm-picker.is-open .site-chat__dm-menu {
      opacity: 1;
      visibility: visible;
      transform: translate3d(0, 0, 0);
    }

    .site-chat__dm-option {
      width: 100%;
      min-height: 34px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      padding: 0 9px;
      border: 0;
      border-radius: 11px;
      background: transparent;
      color: rgba(245, 241, 236, .74);
      font: 800 11px/1 var(--mono);
      text-align: left;
      cursor: pointer;
    }

    .site-chat__dm-option:hover,
    .site-chat__dm-option[aria-selected="true"] {
      background: rgba(255, 138, 61, .11);
      color: var(--ink);
    }

    .site-chat__dm-option:disabled,
    .site-chat__dm-option.is-muted {
      cursor: default;
      opacity: .68;
      color: rgba(245, 241, 236, .58);
    }

    .site-chat__dm-option:disabled:hover,
    .site-chat__dm-option.is-muted:hover {
      background: transparent;
      color: rgba(245, 241, 236, .58);
    }

    .site-chat__dm-option small {
      min-width: 0;
      color: rgba(255, 210, 151, .62);
      font-size: 9px;
      letter-spacing: .08em;
      text-transform: uppercase;
    }

    .site-chat__button--compact {
      min-height: 36px;
      padding-inline: 12px;
      font-size: 9px;
    }

    .site-chat__messages-shell {
      flex: 1 1 auto;
      display: flex;
      flex-direction: column;
      min-height: 0;
      max-height: 100%;
      overflow: hidden;
      overscroll-behavior: contain;
      padding: 10px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .022), transparent 20px),
        linear-gradient(0deg, rgba(0, 0, 0, .12), transparent 36px);
    }

    .site-chat__messages {
      flex: 1 1 auto;
      height: auto;
      min-height: 0;
      max-height: 100%;
      overflow-y: auto;
      overscroll-behavior: contain;
      scroll-behavior: smooth;
      touch-action: pan-y;
      -webkit-overflow-scrolling: touch;
      display: grid;
      align-content: start;
      gap: 12px;
      padding: 4px 6px 6px;
      font-family: var(--sf-display);
      scrollbar-width: thin;
      scrollbar-color: rgba(255, 138, 61, .72) transparent;
    }

    .site-chat__messages::-webkit-scrollbar {
      width: 7px;
    }

    .site-chat__messages::-webkit-scrollbar-thumb {
      border: 2px solid rgba(12, 12, 14, .96);
      border-radius: 999px;
      background: linear-gradient(180deg, rgba(255, 205, 139, .92), rgba(255, 138, 61, .72));
    }

    .site-chat__empty,
    .site-chat__status {
      margin: 0;
      padding: 18px 16px;
      border: 1px dashed rgba(255, 201, 135, .18);
      border-radius: 16px;
      background: rgba(255, 255, 255, .025);
      color: rgba(245, 241, 236, .58);
      font-size: 13px;
      line-height: 1.45;
      text-align: center;
    }

    .site-chat__message {
      display: grid;
      grid-template-columns: 30px minmax(0, 1fr);
      gap: 9px;
      align-items: start;
    }

    .site-chat__avatar {
      width: 30px;
      height: 30px;
      display: grid;
      place-items: center;
      overflow: hidden;
      border: 1px solid rgba(255, 201, 135, .24);
      border-radius: 50%;
      background:
        radial-gradient(circle at 40% 28%, rgba(255, 211, 151, .28), transparent 48%),
        linear-gradient(145deg, rgba(255, 138, 61, .18), rgba(255, 255, 255, .035));
      color: rgba(255, 212, 157, .92);
      font: 900 9px/1 var(--mono);
      box-shadow: 0 8px 18px rgba(0, 0, 0, .28);
    }

    .site-chat__avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .site-chat__avatar-button {
      padding: 0;
      appearance: none;
      cursor: pointer;
      transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }

    .site-chat__avatar-button:hover {
      transform: translateY(-1px) scale(1.04);
      border-color: rgba(255, 201, 135, .44);
      background:
        radial-gradient(circle at 40% 28%, rgba(255, 211, 151, .36), transparent 48%),
        linear-gradient(145deg, rgba(255, 138, 61, .22), rgba(255, 255, 255, .05));
      box-shadow:
        0 10px 22px rgba(0, 0, 0, .32),
        0 0 0 4px rgba(255, 138, 61, .08);
    }

    .site-chat__bubble {
      min-width: 0;
      display: grid;
      gap: 5px;
      padding: 10px 12px 11px;
      border: 1px solid rgba(245, 241, 236, .09);
      border-radius: 16px;
      border-top-left-radius: 7px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .048), rgba(255, 255, 255, .018)),
        rgba(0, 0, 0, .22);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
    }

    .site-chat__message.is-own .site-chat__bubble {
      border-color: rgba(255, 138, 61, .2);
      background:
        radial-gradient(100% 100% at 100% 0%, rgba(255, 138, 61, .1), transparent 58%),
        rgba(255, 138, 61, .055);
    }

    .site-chat__message.is-crew .site-chat__bubble {
      border-color: rgba(255, 201, 135, .17);
    }

    .site-chat__meta {
      min-width: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: start;
      gap: 10px;
      color: rgba(245, 241, 236, .52);
      font: 800 9px/1.2 var(--mono);
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    .site-chat__identity {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
    }

    .site-chat__author,
    .site-chat__author-name {
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(255, 210, 151, .86);
    }

    .site-chat__author-handle {
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: rgba(245, 241, 236, .42);
      text-transform: none;
      letter-spacing: 0;
    }

    .site-chat__author-badge {
      padding: 2px 5px;
      border: 1px solid rgba(255, 201, 135, .16);
      border-radius: 999px;
      background: rgba(255, 138, 61, .07);
      color: rgba(255, 210, 151, .75);
      font-size: 8px;
      letter-spacing: .08em;
    }

    .site-chat__time {
      flex: 0 0 auto;
      color: rgba(245, 241, 236, .38);
      white-space: nowrap;
    }

    .site-chat__body {
      margin: 0;
      color: rgba(245, 241, 236, .84);
      font-size: 12.5px;
      line-height: 1.5;
      overflow-wrap: anywhere;
    }

    .site-chat__form {
      flex: 0 0 auto;
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: stretch;
      gap: 9px;
      padding: 12px 14px 14px;
      border-top: 1px solid rgba(245, 241, 236, .08);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .025), transparent),
        rgba(0, 0, 0, .18);
    }

    .site-chat__form .site-chat__button--primary {
      min-height: 42px;
      height: 42px;
      align-self: stretch;
      padding-inline: 16px;
      border-radius: 15px;
    }

    .site-chat__input {
      width: 100%;
      min-height: 42px;
      height: 42px;
      max-height: 42px;
      resize: none;
      border: 1px solid rgba(245, 241, 236, .12);
      border-radius: 15px;
      padding: 11px 13px;
      background: rgba(0, 0, 0, .28);
      color: var(--ink);
      font: 13px/20px var(--display);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
      overflow-x: auto;
      overflow-y: hidden;
      white-space: nowrap;
      word-break: normal;
      scrollbar-width: none;
    }

    .site-chat__input::-webkit-scrollbar {
      display: none;
    }

    .site-chat__input::placeholder {
      color: rgba(245, 241, 236, .42);
    }

    @media(max-width:780px) {
      .site-chat {
        top: max(10px, env(safe-area-inset-top, 0px));
        left: 10px;
        right: 10px;
        bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        display: flex;
        flex-direction: column;
        width: auto;
        height: auto;
        max-width: none;
        max-height: none;
      }

      .site-chat__panel {
        flex: 1 1 auto;
        height: auto;
        max-height: none;
        min-height: 0;
        border-radius: 24px;
      }

      .site-chat__head {
        flex: 0 0 auto;
        padding: 15px 14px 11px;
      }

      .site-chat__title {
        font-size: 21px;
      }

      .site-chat__tabs,
      .site-chat__channel,
      .site-chat__dm,
      .site-chat__form {
        flex: 0 0 auto;
      }

      .site-chat__messages-shell {
        flex: 1 1 0;
        min-height: 58px;
      }

      .site-chat__form {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px));
      }

      .site-chat__channel,
      .site-chat__dm {
        grid-template-columns: 1fr;
        align-items: stretch;
      }

      .site-chat__channel-label,
      .site-chat__dm-label {
        white-space: normal;
      }

      .site-chat__button--primary {
        min-height: 44px;
        height: 44px;
        width: auto;
        min-width: 68px;
        padding-inline: 12px;
        white-space: nowrap;
      }

      .site-chat__input {
        min-height: 44px;
        height: 44px;
        max-height: 44px;
        padding-block: 12px;
      }
    }

    html[data-chat-wall-modal-open="true"] {
      overflow: hidden;
    }

    .chat-wall-modal {
      --chat-wall-modal-pad-x: clamp(16px, 3vw, 38px);
      --chat-wall-modal-pad-y: clamp(16px, 3vw, 38px);
      position: fixed;
      inset: 0;
      z-index: 12170;
      display: grid;
      place-items: center;
      padding: var(--chat-wall-modal-pad-y) var(--chat-wall-modal-pad-x);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity .24s cubic-bezier(.16, 1, .3, 1), visibility .24s;
    }

    .chat-wall-modal.is-open {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .chat-wall-modal__scrim {
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 70% 18%, rgba(255, 138, 61, .12), transparent 44%),
        rgba(3, 3, 4, .68);
      backdrop-filter: blur(16px) saturate(132%);
      -webkit-backdrop-filter: blur(16px) saturate(132%);
    }

    .chat-wall-modal__panel {
      position: relative;
      width: min(1280px, 100%);
      height: calc(100dvh - (var(--chat-wall-modal-pad-y) * 2));
      min-height: 0;
      max-height: calc(100dvh - (var(--chat-wall-modal-pad-y) * 2));
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      overflow: hidden;
      border: 1px solid rgba(255, 201, 135, .18);
      border-radius: clamp(20px, 2vw, 30px);
      background:
        radial-gradient(90% 70% at 10% 0%, rgba(255, 138, 61, .14), transparent 50%),
        linear-gradient(180deg, rgba(20, 18, 16, .97), rgba(5, 5, 7, .98));
      box-shadow:
        0 36px 120px rgba(0, 0, 0, .62),
        inset 0 1px 0 rgba(255, 255, 255, .075);
      transform: translate3d(0, 18px, 0) scale(.985);
      transition: transform .28s cubic-bezier(.16, 1, .3, 1);
    }

    .chat-wall-modal.is-open .chat-wall-modal__panel {
      transform: translate3d(0, 0, 0) scale(1);
    }

    .chat-wall-modal__head {
      position: relative;
      z-index: 3;
      width: min(440px, calc(100% - clamp(16px, 2.4vw, 28px)));
      min-width: 0;
      justify-self: end;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
      margin: clamp(8px, 1.2vw, 14px) clamp(8px, 1.2vw, 14px) 0;
      padding: 8px;
      border: 1px solid rgba(245, 241, 236, .1);
      border-radius: 18px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .02)),
        rgba(6, 5, 6, .78);
      box-shadow:
        0 16px 46px rgba(0, 0, 0, .38),
        inset 0 1px 0 rgba(255, 255, 255, .08);
      backdrop-filter: blur(18px) saturate(138%);
      -webkit-backdrop-filter: blur(18px) saturate(138%);
    }

    .chat-wall-modal__copy {
      min-width: 0;
      display: grid;
      gap: 5px;
      padding-left: 4px;
    }

    .chat-wall-modal__kicker {
      color: rgba(255, 190, 118, .78);
      font: 850 9px/1 var(--mono);
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .chat-wall-modal__title {
      margin: 0;
      color: var(--ink);
      font-size: clamp(22px, 2.3vw, 34px);
      line-height: .95;
      letter-spacing: -.04em;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .chat-wall-modal__subtitle {
      margin: 0;
      color: rgba(245, 241, 236, .58);
      font-size: 11px;
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .chat-wall-modal__actions {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
    }

    .chat-wall-modal__button,
    .chat-wall-modal__open {
      min-height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 13px;
      border: 1px solid rgba(245, 241, 236, .12);
      border-radius: 14px;
      background: rgba(255, 255, 255, .045);
      color: rgba(245, 241, 236, .82);
      font: 850 9px/1 var(--mono);
      letter-spacing: .08em;
      text-transform: uppercase;
      text-decoration: none;
      cursor: pointer;
      transition: transform .2s ease, border-color .2s ease, background .2s ease, color .2s ease;
    }

    .chat-wall-modal__button:hover,
    .chat-wall-modal__open:hover {
      transform: translateY(-1px);
      border-color: rgba(255, 177, 90, .34);
      background: rgba(255, 138, 61, .1);
      color: var(--ink);
    }

    .chat-wall-modal__frame-wrap {
      position: relative;
      display: grid;
      grid-template-rows: minmax(0, 1fr);
      grid-row: auto;
      height: 100%;
      min-height: 0;
      overflow: hidden;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .018), transparent),
        #050506;
    }

    .chat-wall-modal__loading {
      position: absolute;
      inset: 0;
      display: grid;
      place-items: center;
      margin: 0;
      color: rgba(245, 241, 236, .58);
      font: 850 10px/1 var(--mono);
      letter-spacing: .12em;
      text-transform: uppercase;
      pointer-events: none;
      transition: opacity .2s ease, visibility .2s ease;
    }

    .chat-wall-modal__frame-wrap.is-loaded .chat-wall-modal__loading {
      opacity: 0;
      visibility: hidden;
    }

    .chat-wall-modal__frame {
      width: 100%;
      height: 100%;
      min-height: 0;
      border: 0;
      display: block;
      background: #050506;
    }

    @media(max-width:780px) {
      .chat-wall-modal {
        --chat-wall-modal-pad-x: 8px;
        --chat-wall-modal-pad-y: 8px;
        padding:
          max(8px, env(safe-area-inset-top, 0px))
          max(8px, env(safe-area-inset-right, 0px))
          max(8px, env(safe-area-inset-bottom, 0px))
          max(8px, env(safe-area-inset-left, 0px));
      }

      .chat-wall-modal__panel {
        height: calc(100dvh - max(8px, env(safe-area-inset-top, 0px)) - max(8px, env(safe-area-inset-bottom, 0px)));
        max-height: calc(100dvh - max(8px, env(safe-area-inset-top, 0px)) - max(8px, env(safe-area-inset-bottom, 0px)));
        min-height: 0;
        border-radius: 20px;
      }

      .chat-wall-modal__head {
        top: auto;
        right: auto;
        width: auto;
        display: flex;
        justify-self: end;
        margin: 8px 8px 0;
        padding: 6px;
        border-radius: 999px;
      }

      .chat-wall-modal__kicker,
      .chat-wall-modal__copy,
      .chat-wall-modal__subtitle,
      .chat-wall-modal__open {
        display: none;
      }

      .chat-wall-modal__actions {
        display: flex;
        justify-content: flex-end;
      }

      .chat-wall-modal__button {
        min-height: 34px;
        padding: 0 12px;
        border-radius: 999px;
      }
    }

    .pix-modal {
      position: fixed;
      inset: 0;
      z-index: 260;
      display: grid;
      place-items: center;
      padding: 22px;
      background: rgba(0, 0, 0, .58);
      backdrop-filter: blur(18px) saturate(130%);
      -webkit-backdrop-filter: blur(18px) saturate(130%);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity .3s ease, visibility .3s ease;
    }

    .pix-modal.is-visible {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .pix-modal__panel {
      width: min(520px, 100%);
      display: grid;
      gap: 18px;
      padding: 26px;
      border: 1px solid rgba(243, 241, 236, .14);
      border-radius: 22px;
      background:
        radial-gradient(120% 90% at 16% 0%, rgba(255, 138, 61, .14), transparent 48%),
        linear-gradient(180deg, rgba(24, 22, 20, .92), rgba(8, 8, 10, .94));
      box-shadow: 0 32px 96px rgba(0, 0, 0, .56);
    }

    .pix-modal__panel h3 {
      margin: 0;
      font-size: clamp(28px, 5vw, 40px);
      line-height: 1;
      letter-spacing: -.035em;
    }

    .pix-modal__copy {
      margin: 0;
      color: rgba(243, 241, 236, .72);
      line-height: 1.58;
    }

    .pix-modal__status {
      margin: -4px 0 0;
      padding: 10px 12px;
      border: 1px solid rgba(243, 241, 236, .12);
      border-radius: 12px;
      background: rgba(0, 0, 0, .24);
      color: rgba(243, 241, 236, .72);
      font: 11px/1.45 var(--mono);
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .pix-modal__status[data-state="paid"] {
      border-color: rgba(255, 138, 61, .42);
      color: rgba(255, 190, 134, .94);
      box-shadow: inset 0 0 0 1px rgba(255, 138, 61, .08);
    }

    .pix-modal__status[data-state="expired"],
    .pix-modal__status[data-state="canceled"] {
      border-color: rgba(243, 241, 236, .18);
      color: rgba(243, 241, 236, .62);
    }

    .pix-code {
      width: 100%;
      min-height: 118px;
      resize: vertical;
      border: 1px solid rgba(243, 241, 236, .13);
      border-radius: 14px;
      padding: 12px;
      background: rgba(0, 0, 0, .28);
      color: var(--ink);
      font: 11px/1.45 var(--mono);
    }

    .pix-qr {
      display: grid;
      justify-items: center;
      gap: 8px;
      padding: 14px;
      border: 1px solid rgba(243, 241, 236, .12);
      border-radius: 16px;
      background: rgba(255, 255, 255, .04);
    }

    .pix-qr[hidden] {
      display: none;
    }

    .pix-qr img {
      width: min(180px, 48vw);
      aspect-ratio: 1;
      border-radius: 12px;
      background: #fff;
    }

    .pix-qr span {
      font: 10px/1 var(--mono);
      letter-spacing: .12em;
      text-transform: uppercase;
      color: rgba(243, 241, 236, .52);
    }

    .pix-modal__actions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    @media(max-width:900px) {
      .ticket-system {
        grid-template-columns: 1fr;
      }

      .ticket-pass {
        min-height: 480px;
      }

      .ticket-market__head {
        grid-template-columns: 1fr;
        align-items: start;
      }

      .ticket-market__sync {
        justify-self: start;
      }

      .ticket-market__pager {
        padding-inline: 0;
      }

      .ticket-market__head p {
        white-space: normal;
      }

      .ticket-card {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
          "date top"
          "date price"
          "copy copy"
          "meta meta"
          "action action";
      }

      .ticket-card__price {
        justify-self: start;
      }

      .ticket-card__actions .btn {
        justify-self: stretch;
      }

      #tickets {
        padding-top: calc(112px + var(--sticky-header-height));
      }
    }

    @media(max-width:620px) {
      .ticket-pass {
        --pass-pad: 10px;
        --pass-gap: 6px;
        min-height: auto;
        padding: 28px 18px;
      }

      .ticket-pass__content {
        width: min(100%, 390px);
        aspect-ratio: 1.586 / 1;
      }

      .ticket-card__top {
        flex-direction: column;
      }

      .ticket-pass__identity h3 {
        font-size: clamp(15px, 5vw, 21px);
        -webkit-line-clamp: 1;
      }

      .ticket-pass__identity {
        min-height: 42px;
        gap: 8px;
        padding: 6px 8px;
        border-radius: 13px;
      }

      .ticket-pass__holder-mark {
        width: 28px;
        height: 28px;
        border-radius: 12px;
        font-size: 9px;
      }

      .ticket-pass__title {
        font-size: 12px;
      }

      .ticket-pass__edit {
        min-height: 20px;
        padding: 0 7px;
        font-size: 6.8px;
      }

      .ticket-pass__identity--barcode {
        gap: 4px;
      }

      .ticket-pass__barcode {
        height: 20px;
        border-radius: 8px;
      }

      .ticket-pass__barcode.is-generated {
        gap: 1px;
        padding: 4px 7px;
      }

      .ticket-pass__barcode-meta span {
        font-size: 7px;
      }

      .ticket-pass__barcode-meta strong {
        max-width: 100%;
        font-size: 7.4px;
        letter-spacing: .045em;
        white-space: nowrap;
      }

      .ticket-pass__front-meta,
      .ticket-pass__back-details {
        gap: 5px;
      }

      .ticket-pass__front-field,
      .ticket-pass__metric {
        padding: 4px 6px;
      }

      .ticket-pass__front-footer {
        gap: 3px;
      }

      .ticket-pass__barcode-zone {
        padding: 3px 6px;
        gap: 2px;
      }

      .ticket-pass__status-pill {
        min-height: 18px;
        padding: 0 6px;
        font-size: 6.6px;
      }

      .ticket-pass__nfc {
        width: 36px;
        height: 28px;
      }

      .ticket-pass__front-field span,
      .ticket-pass__metric span {
        margin-bottom: 1px;
        font-size: 6.4px;
      }

      .ticket-pass__front-field {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
      }

      .ticket-pass__front-field strong,
      .ticket-pass__metric strong {
        font-size: 7.8px;
      }

      .ticket-pass__metric {
        min-height: 34px;
      }

      .ticket-pass__back-footer {
        font-size: 7.5px;
      }

      .pass-sticker {
        min-height: 18px;
        padding: 0 7px;
        font-size: 8px;
      }

      .pass-stickers {
        justify-content: flex-start;
      }

      #ticketPassStickers .pass-sticker:nth-child(n+4) {
        display: none;
      }

      .ticket-pass__capability {
        display: none;
      }

      .ticket-card {
        grid-template-columns: 1fr;
        grid-template-areas:
          "date"
          "top"
          "price"
          "copy"
          "meta"
          "action";
        min-height: 0;
      }

      .ticket-card__date {
        width: 100%;
        min-height: 56px;
        grid-template-columns: auto auto auto;
        justify-content: center;
        gap: 10px;
      }

      .ticket-card__date strong {
        margin: 0;
      }

      .ticket-card__actions .btn {
        justify-self: stretch;
      }

      .ticket-card__availability-line {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
      }

      .ticket-market__pager {
        align-items: stretch;
        flex-direction: column;
      }

      .ticket-market__pager-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .ticket-market__nav {
        width: 100%;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .tickets-console-wrap.reveal .ticket-market__head,
      .tickets-console-wrap.reveal .ticket-market__pager,
      .tickets-console-wrap.reveal .ticket-card,
      .tickets-console-wrap.reveal.in .ticket-market__head,
      .tickets-console-wrap.reveal.in .ticket-market__pager,
      .tickets-console-wrap.reveal.in .ticket-card,
      .tickets-console-wrap.reveal.in .ticket-market__sync,
      .tickets-console-wrap.reveal.in .ticket-market__nav,
      .tickets-console-wrap.reveal.in .ticket-card__date,
      .tickets-console-wrap.reveal.in .ticket-card__date strong,
      .tickets-console-wrap.reveal.in .ticket-card h3,
      .tickets-console-wrap.reveal.in .ticket-card p,
      .tickets-console-wrap.reveal.in .ticket-card__availability,
      .tickets-console-wrap.reveal.in .ticket-card__price,
      .tickets-console-wrap.reveal.in .ticket-card__actions .btn {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        animation: none !important;
      }

      .tickets-console-wrap.reveal.in .ticket-events::before,
      .tickets-console-wrap.reveal.in .ticket-events::after,
      .tickets-console-wrap.reveal.in .ticket-market__kicker::before,
      .ticket-events.is-paging::before,
      .ticket-events.is-paging .ticket-market__kicker::before,
      .ticket-events.is-paging .ticket-card,
      .tickets-console-wrap.reveal.in .ticket-card::before,
      .ticket-events.is-paging .ticket-card::before,
      .tickets-console-wrap.reveal.in .ticket-card__capacity::before,
      .ticket-events.is-paging .ticket-card__capacity::before {
        animation: none !important;
      }

      .ticket-market__page {
        animation: none;
      }

      .player-track-item.is-marquee .player-track-item__label-text {
        animation: none;
        transform: none;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      .ticket-ambient {
        opacity: .22;
      }

      .ticket-pass__content {
        transition: none;
      }

      .ticket-pass__plate {
        transition: none;
      }

      .ticket-pass:hover .ticket-pass__content {
        --pass-scale: 1;
      }

      .ticket-pass__surface::before {
        transition: none;
      }

      .ticket-pass.is-loading .ticket-pass__masked::before,
      .ticket-pass.is-loading #ticketPassStickers .pass-sticker::before {
        animation: none;
      }
    }

    /* ============ PASS FEATURES ============ */
    #pass {
      position: relative;
    }

    #pass::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      background:
        radial-gradient(ellipse 70% 54% at 26% 55%, rgba(255, 138, 61, .038), transparent 68%),
        radial-gradient(ellipse 50% 38% at 80% 34%, rgba(68, 24, 98, .034), transparent 62%);
    }

    #pass .section__head,
    #pass .ticket-system {
      position: relative;
      z-index: 1;
    }

    .pass-features {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      padding: clamp(26px, 3.2vw, 50px) clamp(28px, 3.8vw, 56px);
      background: rgba(8, 8, 10, .76);
      border-left: 1px solid var(--line);
    }

    .pass-features__head {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: clamp(18px, 2.2vw, 30px);
    }

    .pass-features__kicker {
      flex-shrink: 0;
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: rgba(255, 166, 72, .68);
    }

    .pass-features__head-line {
      flex: 1;
      height: 1px;
      background: linear-gradient(90deg, rgba(255, 138, 61, .24), transparent);
    }

    .pass-features__list {
      list-style: none;
      padding: 0;
      margin: 0;
      flex: 1;
      display: flex;
      flex-direction: column;
    }

    .pass-features__item {
      display: grid;
      grid-template-columns: 20px 1fr;
      gap: 14px;
      align-items: start;
      padding: clamp(14px, 1.8vw, 22px) 0;
      border-bottom: 1px solid var(--line);
      transition: background .18s ease;
    }

    .pass-features__item:first-child {
      padding-top: 0;
    }

    .pass-features__item:last-child {
      border-bottom: none;
    }

    .pass-features__icon {
      color: rgba(255, 138, 61, .66);
      font-size: 12px;
      line-height: 1.5;
      font-style: normal;
    }

    .pass-features__item-body {
      display: grid;
      gap: 5px;
    }

    .pass-features__item-title {
      display: block;
      color: rgba(245, 241, 234, .92);
      font-family: var(--display);
      font-size: clamp(13px, 1.08vw, 15px);
      font-weight: 600;
      letter-spacing: -.018em;
      line-height: 1.1;
    }

    .pass-features__item-desc {
      margin: 0;
      color: var(--ink-dim);
      font-size: 13px;
      line-height: 1.56;
    }

    .pass-features__foot {
      padding-top: clamp(20px, 2.4vw, 32px);
      border-top: 1px solid var(--line);
      display: flex;
      flex-direction: column;
      gap: 12px;
      align-items: flex-start;
    }

    .pass-features__note {
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--ink-mute);
    }

    @media (max-width: 820px) {
      #pass .ticket-system {
        grid-template-columns: 1fr;
      }

      .pass-features {
        border-left: none;
        border-top: 1px solid var(--line);
      }
    }