/* YLLW with Saelem (30 Oct 2026): ticket pop-up + a small "Tickets" pill that stays on screen */
.tk{--tk-y:#f7d400;--tk-r:#96262f;position:fixed;inset:0;z-index:96;display:grid;place-items:center;padding:clamp(16px,4vh,40px) 16px;background:rgba(10,3,3,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s}
.tk.open{opacity:1;visibility:visible;transition:opacity .45s ease}
.tk[hidden]{display:none}
.tk-card{position:relative;display:flex;flex-direction:column;align-items:stretch;width:min(440px,100%,calc((100vh - 170px) * .8));background:var(--tk-y);box-shadow:0 40px 100px rgba(0,0,0,.6);transform:translateY(30px) scale(.97);transition:transform .7s cubic-bezier(.77,0,.18,1)}
.tk.open .tk-card{transform:none}
.tk-card img{display:block;width:100%;height:auto;aspect-ratio:1080/1350;object-fit:cover}
.tk-row{display:flex;gap:10px;padding:12px}
.tk-go{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 18px;background:var(--tk-r);color:#fff;text-decoration:none;font:800 14px/1 var(--display,sans-serif);font-stretch:125%;letter-spacing:.14em;text-transform:uppercase;transition:background .2s}
.tk-go:hover{background:#120606}
.tk-go svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8}
.tk-later{min-height:52px;padding:0 16px;background:none;border:1.5px solid var(--tk-r);color:var(--tk-r);cursor:pointer;font:700 12px/1 var(--display,sans-serif);font-stretch:125%;letter-spacing:.12em;text-transform:uppercase}
.tk-later:hover{background:var(--tk-r);color:#fff}
.tk-x{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#120606;color:#fff;border:1px solid rgba(255,255,255,.35);cursor:pointer;z-index:2}
.tk-x svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.tk-go:focus-visible,.tk-later:focus-visible,.tk-x:focus-visible,.tk-pill:focus-visible{outline:2px solid #fff;outline-offset:3px}
/* the pill: always there until the show is over, reopens the pop-up */
.tk-pill{--tk-y:#f7d400;--tk-r:#96262f;position:fixed;right:clamp(12px,2vw,24px);bottom:calc(env(safe-area-inset-bottom,0px) + clamp(14px,2vw,24px));z-index:90;display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border:0;border-radius:999px;background:var(--tk-y);color:var(--tk-r);cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.35);font:800 12px/1 var(--display,sans-serif);font-stretch:125%;letter-spacing:.12em;text-transform:uppercase;transform:translateY(160%);transition:transform .7s cubic-bezier(.77,0,.18,1),background .2s}
.tk-pill.show{transform:none}
.tk-pill:hover{background:#fff}
.tk-pill img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:60% 30%}
.tk-pill small{display:block;font-weight:600;font-size:10px;letter-spacing:.16em;opacity:.8;margin-top:3px}
@media (max-width:560px){.tk-row{flex-direction:column}.tk-x{top:-12px;right:-8px}.tk-pill{padding:6px 14px 6px 6px}.tk-pill img{width:30px;height:30px}}
@media (prefers-reduced-motion:reduce){.tk,.tk-card,.tk-pill{transition:none}}