.ticket{--t-bg:#ffd21e;--t-line:transparent;--t-n:4.5px;--t-perf-x:24px;--t-hole:1.05px;--t-pitch:4.5px;--t-notch-l:radial-gradient(circle var(--t-n) at 0 50%, #0000 calc(var(--t-n) - .25px), #000 calc(var(--t-n) + .25px)) 0 0 / 51% 100% no-repeat;--t-notch-r:radial-gradient(circle var(--t-n) at 100% 50%, #0000 calc(var(--t-n) - .25px), #000 calc(var(--t-n) + .25px)) 100% 0 / 51% 100% no-repeat;isolation:isolate;background:var(--t-bg);color:#111;letter-spacing:.01em;white-space:nowrap;height:26px;-webkit-mask:var(--t-notch-l), var(--t-notch-r);-webkit-mask:var(--t-notch-l), var(--t-notch-r);mask:var(--t-notch-l), var(--t-notch-r);border-radius:6px;justify-content:center;align-items:center;padding:0 12px;font-size:11.5px;font-weight:600;line-height:1;display:inline-flex;position:relative}.ticket[data-stub=true]{--t-holes:radial-gradient(circle var(--t-hole) at 50% 50%, #000 calc(var(--t-hole) - .25px), #0000 calc(var(--t-hole) + .25px)) calc(var(--t-perf-x) - var(--t-pitch) / 2) 50% / var(--t-pitch) var(--t-pitch) repeat-y;-webkit-mask:var(--t-holes), var(--t-notch-l), var(--t-notch-r);-webkit-mask-composite:xor, source-over;-webkit-mask:var(--t-holes), var(--t-notch-l), var(--t-notch-r);mask:var(--t-holes), var(--t-notch-l), var(--t-notch-r);justify-content:flex-start;gap:0;-webkit-mask-composite:xor,source-over;mask-composite:exclude,add}.ticket-stub{width:calc(var(--t-perf-x) - 1px);flex-shrink:0;place-items:center;height:100%;display:grid}.ticket-stub img{width:11px;height:11px}.ticket[data-stub=true] .ticket-label{padding-left:10px}.ticket[data-tone=peach]{--t-bg:#ffe3cc}.ticket[data-tone=outline]{--t-bg:#d9d5c7}.ticket[data-tone=outline]:before{content:"";z-index:-1;-webkit-mask:radial-gradient(circle calc(var(--t-n) + 1px) at -1px 50%, #0000 calc(var(--t-n) + .75px), #000 calc(var(--t-n) + 1.25px)) 0 0 / 51% 100% no-repeat, radial-gradient(circle calc(var(--t-n) + 1px) at calc(100% + 1px) 50%, #0000 calc(var(--t-n) + .75px), #000 calc(var(--t-n) + 1.25px)) 100% 0 / 51% 100% no-repeat;-webkit-mask:radial-gradient(circle calc(var(--t-n) + 1px) at -1px 50%, #0000 calc(var(--t-n) + .75px), #000 calc(var(--t-n) + 1.25px)) 0 0 / 51% 100% no-repeat, radial-gradient(circle calc(var(--t-n) + 1px) at calc(100% + 1px) 50%, #0000 calc(var(--t-n) + .75px), #000 calc(var(--t-n) + 1.25px)) 100% 0 / 51% 100% no-repeat;mask:radial-gradient(circle calc(var(--t-n) + 1px) at -1px 50%, #0000 calc(var(--t-n) + .75px), #000 calc(var(--t-n) + 1.25px)) 0 0 / 51% 100% no-repeat, radial-gradient(circle calc(var(--t-n) + 1px) at calc(100% + 1px) 50%, #0000 calc(var(--t-n) + .75px), #000 calc(var(--t-n) + 1.25px)) 100% 0 / 51% 100% no-repeat;background:#fff;border-radius:5px;position:absolute;inset:1px}.ticket[data-size=xs]{--t-n:3.5px;border-radius:5px;height:20px;padding:0 9px;font-size:10.5px}.ticket[data-size=sm]{--t-n:4px;--t-perf-x:21px;border-radius:5px;height:22px;padding:0 10px;font-size:11px}.ticket[data-size=sm] .ticket-stub img{width:10px;height:10px}.ticket[data-size=lg]{--t-n:6.5px;--t-perf-x:40px;--t-hole:1.4px;--t-pitch:6px;letter-spacing:0;border-radius:10px;height:44px;padding:0 24px;font-size:14px}.ticket[data-size=lg] .ticket-stub img{width:16px;height:16px}.ticket[data-size=lg][data-stub=true] .ticket-label{padding-left:16px}.ticket[data-size=nav]{--t-n:5.5px;--t-perf-x:32px;--t-hole:1.2px;--t-pitch:5px;letter-spacing:0;border-radius:9px;height:38px;padding:0 18px;font-size:14px}.ticket[data-size=nav] .ticket-stub img{width:14px;height:14px}.ticket[data-size=nav][data-stub=true] .ticket-label{padding-left:13px}.ticket[data-stub=true][data-size]{padding-left:0}.ticket-host{filter:drop-shadow(0 6px 10px #c8960038);background:0 0;border-radius:10px;flex-shrink:0;padding:0;transition:translate .15s,filter .15s;display:inline-flex}.ticket-host[data-glow=true]{filter:drop-shadow(0 0 16px #ffd21e66)}.ticket-host .ticket{transition:background-color .15s}.ticket-host:hover .ticket[data-tone=yellow]{--t-bg:#ffdd4d}.ticket-host:active{translate:0 1px}.ticket-host:focus-visible{outline-offset:3px;outline:2px solid #111}.ticket-host[data-glow=true]:focus-visible{outline-color:#ffd21e}@media (prefers-reduced-motion:reduce){.ticket-host,.ticket-host .ticket{transition:none}}
