/* The golden ticket (2026-10-19). Gold leaf after the adidas Confirmed ticket, fields after the TLA event pass.
   A stack of masked layers gives the gold an edge when it tilts; ticket.js builds the markup and drives the light. */
.ticket { --deep: #2A1D09; --lift: rgba(255, 236, 190, .5); --gold: #E9C46A;
  width: var(--tw, min(380px, 78vw)); aspect-ratio: 5 / 8; perspective: 1400px; position: relative; cursor: pointer; touch-action: pan-y; outline: none; -webkit-tap-highlight-color: transparent; }
.ticket:focus-visible .t-front { outline: 2px solid var(--gold); outline-offset: 6px; }
.ticket .t-card { position: absolute; inset: 0; transform-style: preserve-3d; }
.ticket .t-face, .ticket .t-edge { position: absolute; inset: 0; -webkit-mask: var(--shape) center / 100% 100% no-repeat; mask: var(--shape) center / 100% 100% no-repeat; }
.ticket .t-edge { background: linear-gradient(160deg, #7A5A1E, #C99A45 40%, #8E6A26 70%, #5E4413); }
.ticket .t-face { backface-visibility: hidden; -webkit-backface-visibility: hidden; container-type: size; overflow: hidden; }
.ticket .t-back { transform: translateZ(-5px) rotateY(180deg); }
.ticket .t-card:not(.back-on) .t-back, .ticket .t-card.back-on .t-front { visibility: hidden; }

.ticket .t-gold { position: absolute; inset: 0;
  background: linear-gradient(125deg, #4A3209 0%, #8C6420 12%, #D9AE52 26%, #F7E1A0 36%, #C9973E 46%, #6E4C14 58%, #B8873A 70%, #F2D58C 80%, #A57A2C 90%, #5A3D0E 100%);
  background-size: 260% 260%; background-position: var(--bx, 50%) var(--by, 50%); }
.ticket .t-leaf { position: absolute; inset: 0; background: var(--leaf) center / cover; mix-blend-mode: overlay; opacity: .9; }
.ticket .t-leaf.fine { background-image: var(--fine); mix-blend-mode: soft-light; opacity: .55; }
.ticket .t-holo { position: absolute; inset: 0; mix-blend-mode: color-dodge; opacity: calc(.2 + var(--hyp, 0) * .8);
  -webkit-mask: var(--fine) center / cover; mask: var(--fine) center / cover; mask-mode: luminance;
  background:
    repeating-linear-gradient(115deg, #FF7A9A 0%, #FFD36E 6%, #8CFFB4 12%, #6EC8FF 18%, #C79CFF 24%, #FF7A9A 30%),
    repeating-linear-gradient(65deg, rgba(14, 10, 4, .9) 0%, rgba(120, 120, 120, .2) 2.5%, rgba(14, 10, 4, .9) 5%);
  background-blend-mode: screen; background-size: 300% 300%, 200% 200%;
  background-position: var(--hx, 50%) var(--hy, 50%), calc(100% - var(--hx, 50%)) var(--hy, 50%);
  filter: brightness(.42) contrast(1.5) saturate(1.4); }
.ticket .t-prism { position: absolute; inset: 0; mix-blend-mode: overlay; opacity: calc(var(--hyp, 0) * .55);
  background: repeating-linear-gradient(var(--pa, 110deg), transparent 0%, rgba(120, 220, 255, .9) 3%, rgba(200, 140, 255, .9) 5%, rgba(255, 120, 170, .8) 7%, transparent 10%, transparent 22%);
  background-size: 220% 220%; background-position: var(--hx, 50%) var(--hy, 50%);
  -webkit-mask: radial-gradient(farthest-corner circle at var(--px, 50%) var(--py, 30%), #000 0%, transparent 70%); mask: radial-gradient(farthest-corner circle at var(--px, 50%) var(--py, 30%), #000 0%, transparent 70%); }
.ticket .t-glare { position: absolute; inset: 0; mix-blend-mode: soft-light;
  background: radial-gradient(farthest-corner circle at var(--px, 50%) var(--py, 30%), rgba(255, 250, 232, .7) 0%, rgba(255, 236, 190, .18) 28%, rgba(20, 12, 2, .55) 95%); }
.ticket .t-sweep { position: absolute; inset: -20%; mix-blend-mode: overlay; pointer-events: none;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 250, 230, .9) 50%, transparent 60%) no-repeat;
  background-size: 300% 100%; background-position: 130% 0; }
.ticket.seen .t-sweep { animation: t-sweep 1.6s cubic-bezier(.16, 1, .3, 1) .5s both; }
@keyframes t-sweep { to { background-position: -30% 0; } }
.ticket .t-back .t-prism { opacity: calc(var(--hyp, 0) * .25); }
.ticket .t-back .t-holo { opacity: calc(.06 + var(--hyp, 0) * .25); }

/* debossed type: dark fill with a highlight under the lower lip */
.ticket .t-deb { position: absolute; inset: 0; color: var(--deep); text-shadow: 0 1px 0 var(--lift); text-align: left; }
.ticket .t-border { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ticket .t-border path { fill: none; stroke: var(--deep); stroke-width: 1.2; opacity: .7; }
.ticket .t-border path.hi { stroke: var(--lift); transform: translateY(1px); opacity: 1; }
.ticket .t-mono { font: 400 max(9px, 2.6cqw)/1.4 Mono, monospace; letter-spacing: .08em; text-transform: uppercase; }
.ticket .t-rule { background: linear-gradient(rgba(42, 29, 9, .6), rgba(42, 29, 9, .6)) 0 0 / 100% 1px no-repeat, linear-gradient(var(--lift), var(--lift)) 0 1px / 100% 1px no-repeat; }

.ticket .t-front .t-deb { padding: 11cqw 11cqw 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ticket .t-mark { display: block; width: 24cqw; aspect-ratio: 3084 / 708; background: var(--deep); -webkit-mask: url(/site/brand/wordmark.svg) center / contain no-repeat; mask: url(/site/brand/wordmark.svg) center / contain no-repeat; filter: drop-shadow(0 1px 0 var(--lift)); }
.ticket .t-chosen { margin-top: 8.5cqw; font: 700 3.9cqw/1 UB, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.ticket .t-title { margin-top: 3cqw; font: 700 18.5cqw/.9 UD, sans-serif; letter-spacing: 0; }
.ticket .t-sub { margin-top: 4.5cqw; font: 400 4.4cqw/1.3 U, sans-serif; }
.ticket .t-side { position: absolute; top: 60%; writing-mode: vertical-rl; transform: translateY(-50%); white-space: nowrap; }
.ticket .t-side.l { left: 6.6cqw; transform: translateY(-50%) rotate(180deg); }
.ticket .t-side.r { right: 6.6cqw; }
.ticket .t-data { margin-top: 12cqw; width: 100%; display: grid; grid-template-columns: 1fr 1fr; column-gap: 5cqw; row-gap: 4cqw; text-align: left; }
.ticket .t-data > div { padding-top: 2cqw; }
.ticket .t-data .v { margin-top: 1cqw; font: 700 4.8cqw/1.15 U, sans-serif; }
.ticket .t-data s { font-weight: 400; font-size: 3.4cqw; opacity: .7; margin-left: 1cqw; }
.ticket .t-perf { position: absolute; left: 7cqw; right: 7cqw; top: 128cqw; height: 4px;
  background: radial-gradient(circle, rgba(42, 29, 9, .65) 1.1px, transparent 1.5px) 0 50% / 8px 4px repeat-x; filter: drop-shadow(0 1px 0 var(--lift)); }
.ticket .t-stub { position: absolute; left: 11cqw; right: 11cqw; top: 133cqw; }
.ticket .t-wave { display: block; width: 100%; height: 9cqw; filter: drop-shadow(0 1px 0 var(--lift)); }
.ticket .t-wave rect, .ticket .t-bars svg rect { fill: var(--deep); }
.ticket .t-row { display: flex; justify-content: space-between; }
.ticket .t-stub .t-row { margin-top: 2.5cqw; }

.ticket .t-back .t-deb { padding: 12cqw 12cqw 0; display: flex; flex-direction: column; }
.ticket .t-back .t-mark { width: 20cqw; }
.ticket .t-back .t-head { margin-top: 9cqw; font: 700 8cqw/1 UD, sans-serif; }
.ticket .t-terms { margin-top: 5cqw; list-style: none; padding: 0; counter-reset: t; }
.ticket .t-terms li { counter-increment: t; display: grid; grid-template-columns: 7cqw 1fr; padding: 2.4cqw 0; font: 400 3.5cqw/1.35 U, sans-serif; }
.ticket .t-terms li + li { border-top: 1px solid rgba(42, 29, 9, .4); box-shadow: inset 0 1px 0 rgba(255, 236, 190, .35); }
.ticket .t-terms li::before { content: counter(t, decimal-leading-zero); font: 400 2.6cqw/1.9 Mono, monospace; }
.ticket .t-bars { position: absolute; left: 12cqw; right: 12cqw; bottom: 11cqw; }
.ticket .t-bars svg { display: block; width: 100%; height: 10cqw; filter: drop-shadow(0 1px 0 var(--lift)); }
.ticket .t-bars .t-row { margin-top: 2cqw; }

.ticket .t-floor { position: absolute; left: 10%; right: 10%; bottom: -9%; height: 10%; border-radius: 50%; z-index: -1;
  background: radial-gradient(closest-side, rgba(0, 0, 0, .7), transparent); filter: blur(8px); transform: translateX(var(--fx, 0px)); }

/* scratch-off coat and the flakes it sheds */
.ticket .t-scratch { position: absolute; inset: 0; width: 100%; height: 100%; }
.ticket.locked { touch-action: none; cursor: crosshair; }
.ticket { -webkit-user-select: none; user-select: none; }
.ticket .t-flakes { position: absolute; inset: -12%; width: 124%; height: 124%; pointer-events: none; z-index: 2; }

/* the YC ticket: the same foil, tinted YC orange */
.ticket.yc { --deep: #2B1003; --lift: rgba(255, 214, 180, .5); --gold: #FF8A3D; }
.ticket.yc .t-gold { background-image: linear-gradient(125deg, #6A2500 0%, #B04200 12%, #F06A10 26%, #FFB27A 36%, #F57A22 46%, #8A3100 58%, #D95A0C 70%, #FFA05C 80%, #C24E08 90%, #6E2700 100%); }
.ticket.yc .t-edge { background: linear-gradient(160deg, #7A2C00, #D05A10 40%, #8E3606 70%, #5A2000); }
.ticket.yc .t-holo { opacity: calc(.14 + var(--hyp, 0) * .6); }
.ticket.yc .t-title { font-size: 17cqw; }

/* the Uncork ticket: the same foil, pressed in Uncork's cream */
.ticket.uncork { --deep: #1C1813; --lift: rgba(255, 250, 240, .55); --gold: #F1E7DB; }
.ticket.uncork .t-gold { background-image: linear-gradient(125deg, #8A7D6B 0%, #C2B39D 12%, #E6DACA 26%, #FFF8EE 36%, #DDCEB9 46%, #978A77 58%, #D3C4AE 70%, #FAF1E4 80%, #C8B9A3 90%, #85786A 100%); }
.ticket.uncork .t-edge { background: linear-gradient(160deg, #7E7262, #CFC2AE 40%, #93877A 70%, #5F5548); }
.ticket.uncork .t-holo { opacity: calc(.1 + var(--hyp, 0) * .5); }
.ticket.uncork .t-title { font-size: 17cqw; }
.ticket .t-lock { display: flex; align-items: center; gap: 2.6cqw; }
.ticket .t-lock .t-mark { width: 21cqw; }
.ticket .t-plus { font: 400 5cqw/1 U, sans-serif; font-style: normal; }
.ticket .t-with { display: block; height: 4.6cqw; aspect-ratio: 1825 / 381; background: var(--deep); -webkit-mask: url(/site/brand/clients/uncork-logo.svg) center / contain no-repeat; mask: url(/site/brand/clients/uncork-logo.svg) center / contain no-repeat; filter: drop-shadow(0 1px 0 var(--lift)); }
.ticket .t-back .t-lock { --s: .84; } .ticket .t-back .t-lock .t-mark { width: calc(21cqw * var(--s)); } .ticket .t-back .t-with { height: calc(4.6cqw * var(--s)); } .ticket .t-back .t-plus { font-size: calc(5cqw * var(--s)); }

@media (prefers-reduced-motion: reduce) { .ticket .t-sweep, .ticket.seen .t-sweep { animation: none; display: none; } }