.ticketPreviewLauncher { width:100%; max-width:560px; margin:10px auto 0; color:#939dae; font-size:10px; line-height:1.7; }
.ticketPreviewStartStatus { min-height:0; color:#e3be7f; }
.ticketPreviewStartStatus:empty { display:none; }
.ticketPreviewScenarios { margin:9px auto 0; max-width:410px; color:#858fa2; font-size:10px; text-align:left; }
.ticketPreviewScenarios > summary { min-height:44px; align-content:center; cursor:pointer; text-align:center; }
.ticketPreviewScenarios label { display:flex; flex-direction:column; gap:6px; }
.ticketPreviewScenarios select { width:100%; min-height:44px; padding:9px 11px; border:1px solid #ffffff12; border-radius:5px; background:#202631; color:#c5cbd6; font-size:12px; }
.ticketPreviewScenarios p { margin:7px 0; }
dialog.ticketPreviewDialog { width:min(1120px,calc(100vw - 32px)); max-width:1120px; height:min(900px,calc(100dvh - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:0; border:1px solid #ffffff12; border-radius:12px; background:#20242e; color:#e8ebf1; overflow:hidden; box-shadow:0 28px 85px #0009; }
dialog.ticketPreviewDialog[open] { display:flex; flex-direction:column; }
dialog.ticketPreviewDialog::backdrop { background:#0c1016dc; backdrop-filter:blur(5px); }
.ticketPreviewDialog * { box-sizing:border-box; }
.ticketPreviewHeader { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:23px 28px 15px; }
.ticketPreviewEyebrow { display:block; color:#a99e76; font-size:9px; letter-spacing:2px; line-height:1.7; }
.ticketPreviewHeader h2 { margin:5px 0 0; font-size:25px; line-height:1.35; letter-spacing:.2px; }
.ticketPreviewClose { display:flex; flex:0 0 44px; align-items:center; justify-content:center; width:44px; height:44px; min-height:44px; border:0; border-radius:5px; background:transparent; color:#b0b8c7; font-size:28px; cursor:pointer; }
.ticketPreviewClose:hover { background:#ffffff07; color:#fff; }
.ticketPreviewDisclosure { margin:0; padding:0 28px 14px; color:#a59d83; font-size:10px; line-height:1.7; }
.ticketPreviewMeta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 20px; padding:11px 28px; border-block:1px solid #ffffff08; color:#969fb1; background:#181d2580; font-size:11px; }
.ticketPreviewMeta strong { margin-left:10px; color:#e8d59a; font-size:13px; }
.ticketPreviewLegend { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 24px; padding:13px 20px 4px; color:#929bae; font-size:10px; }
.ticketPreviewLegend > span { display:flex; align-items:center; gap:6px; }
.ticketPreviewLegend > span:before { content:""; width:8px; height:8px; border:1px solid #957b42; border-radius:2px; background:#55452a; }
.ticketPreviewLegend [data-ticket-legend="selected"]:before { background:#eac455; border-color:#ffe799; }
.ticketPreviewLegend [data-ticket-legend="drawn"]:before { background:#4b2830; border-color:#cf6772; }
.ticketPreviewLegend [data-ticket-legend="unavailable"]:before { background:#424b59; border-color:#737f91; }
.ticketPreviewKeyboard { margin:4px 20px 10px; color:#737f94; font-size:9px; line-height:1.6; text-align:center; }
.ticketPreviewBody { flex:1; min-height:0; padding:0 22px 16px; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; scrollbar-width:thin; scrollbar-color:#515b6c #1b2029; }
.ticketPreviewGrid { display:grid; grid-template-columns:repeat(10,minmax(44px,1fr)); gap:8px; padding:5px; }
.ticketPreviewOption { display:block; position:relative; min-width:44px; min-height:44px; aspect-ratio:1; padding:2px; border:1px solid #ffffff06; border-radius:6px; background:#171c2480; cursor:pointer; }
.ticketPreviewOption:hover:not(:disabled) { border-color:#b99c555c; background:#b99c5509; }
.ticketPreviewOption--selected { border-color:#e4be55; background:#e4be5515; }
.ticketPreviewOption--selected:after { content:"✓"; position:absolute; top:3px; left:3px; display:flex; align-items:center; justify-content:center; width:16px; height:16px; border:1px solid #e4be55; border-radius:50%; background:#242a2d; color:#f2dc88; font-size:10px; line-height:1; }
.ticketPreviewOption:disabled { opacity:1; cursor:not-allowed; }
.ticketPreviewOption--drawn { background:#161b24; border-color:#743a442b; }
.ticketPreviewOption--unavailable { background:#252b35; border-color:#606b7b24; }
.ticketPreviewFooter { flex-shrink:0; padding:14px 26px 18px; border-top:1px solid #ffffff0b; background:#1a1f28; }
.ticketPreviewSelection { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; align-items:start; color:#9aa4b7; font-size:10px; line-height:1.7; }
.ticketPreviewSelection strong { color:#ead68d; margin-left:5px; }
.ticketPreviewSelection output { display:block; max-height:48px; overflow:auto; overflow-wrap:anywhere; color:#c1c8d4; }
.ticketPreviewStatus { margin:7px 0 0; color:#e1ac8d; font-size:11px; line-height:1.7; }
.ticketPreviewStatus:empty { display:none; }
.ticketPreviewFooterActions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:8px 12px; margin-top:9px; }
.ticketPreviewTotal { margin-left:auto; color:#aab2c1; font-size:11px; font-weight:500; }
.ticketPreviewTotal > span { margin-left:7px; color:#f0cf69; font-size:17px; font-weight:750; }
.ticketPreviewPrimary,.ticketPreviewSecondary,.ticketPreviewTopUp { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:11px 18px; border:1px solid transparent; border-radius:23px; font:inherit; font-size:12px; font-weight:650; line-height:1.5; cursor:pointer; }
.ticketPreviewPrimary { background:#ffd33f; color:#262016; }
.ticketPreviewPrimary:hover:not(:disabled) { background:#ffdd68; }
.ticketPreviewPrimary:disabled { background:#45483e; color:#8b917e; cursor:not-allowed; }
.ticketPreviewSecondary { background:#ffffff04; border-color:#ffffff15; color:#afb8c7; }
.ticketPreviewTopUp { background:#ccaa4930; border-color:#d2af4b60; color:#f0d885; }
.ticketPreviewTopUp[hidden] { display:none; }
.ticketPreviewText { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 4px; border:0; border-radius:4px; background:transparent; color:#b7ac82; font:inherit; font-size:10px; cursor:pointer; }
.ticketPreviewStartStatus .ticketPreviewText,.ticketPreviewStatus .ticketPreviewText { margin-left:9px; }
.ticketPreviewDialog button:focus-visible,.ticketPreviewLauncher button:focus-visible,.ticketPreviewScenarios select:focus-visible,.ticketTopUpPreview button:focus-visible { outline:2px solid #ead078; outline-offset:2px; }
.ticketPreviewOption:focus-visible { outline-offset:-2px; z-index:1; }
.ticketPreviewConfirmation { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; min-height:100%; padding:30px 16px; text-align:center; }
.ticketPreviewConfirmation > span { display:flex; align-items:center; justify-content:center; width:56px; height:56px; border:1px solid #c1ad5b80; border-radius:50%; color:#ebd682; font-size:28px; }
.ticketPreviewConfirmation h3 { margin:0; color:#f1e9cf; font-size:22px; }
.ticketPreviewConfirmation p { max-width:460px; margin:0; color:#9aa6ba; font-size:12px; line-height:1.9; }
.ticketPreviewConfirmation output { display:block; max-width:100%; padding:15px 18px; border:1px solid #c1ad5b20; border-radius:6px; color:#edd67e; font-size:15px; line-height:1.9; overflow-wrap:anywhere; }
.ticketPreviewConfirmation strong { color:#c3b989; font-size:13px; }
.ticketTopUpPreview { width:100%; min-width:0; padding:45px 0 60px; text-align:center; }
.ticketTopUpPreview h1 { margin:9px 0 15px; font-size:32px; color:#f0e9d3; }
.ticketTopUpPreview > p { max-width:580px; margin:0 auto; color:#929fb4; font-size:12px; line-height:1.9; }
.ticketTopUpPanel { display:flex; flex-direction:column; align-items:center; gap:17px; width:min(460px,100%); margin:30px auto 0; padding:32px 24px 23px; border:1px solid #ffffff0d; border-radius:10px; background:#242a35; }
.ticketTopUpPanel > span { color:#a9b1c0; font-size:12px; }
.ticketTopUpPanel > strong { color:#ebce73; font-size:36px; }
.ticketTopUpPanel > p { margin:0 0 3px; color:#8995aa; font-size:11px; line-height:1.8; }
.ticketTopUpPanel > .ticketPreviewPrimary { width:100%; }
@media(max-width:767px) {
 dialog.ticketPreviewDialog { width:calc(100vw - 16px); height:calc(100dvh - 20px); max-height:calc(100dvh - 20px); border-radius:9px; }
 .ticketPreviewHeader { padding:15px 15px 10px; gap:8px; }
 .ticketPreviewHeader h2 { font-size:20px; }
 .ticketPreviewDisclosure { padding:0 16px 11px; font-size:9px; }
 .ticketPreviewMeta { padding:10px 16px; gap:5px 15px; font-size:10px; }
 .ticketPreviewMeta strong { font-size:11px; margin-left:5px; }
 .ticketPreviewLegend { padding:10px 12px 3px; gap:6px 13px; font-size:9px; }
 .ticketPreviewKeyboard { font-size:8px; margin-bottom:8px; }
 .ticketPreviewBody { padding:0 9px 10px; }
 .ticketPreviewGrid { grid-template-columns:repeat(5,minmax(44px,1fr)); gap:5px; padding:3px; }
 .ticketPreviewFooter { padding:11px 14px 14px; }
 .ticketPreviewFooterActions { gap:6px 8px; }
 .ticketPreviewTotal { font-size:10px; }
 .ticketPreviewTotal > span { font-size:15px; }
 .ticketPreviewPrimary,.ticketPreviewSecondary,.ticketPreviewTopUp { font-size:11px; padding:10px 14px; }
 .ticketPreviewFooterActions > .ticketPreviewPrimary { flex:1 0 55%; }
 .ticketPreviewFooterActions > .ticketPreviewTopUp { flex:1 0 55%; }
 .ticketPreviewSelection { font-size:9px; }
 .ticketTopUpPreview { padding-top:30px; }
 .ticketTopUpPreview h1 { font-size:26px; }
}
@media(max-width:359px) { .ticketPreviewGrid { grid-template-columns:repeat(4,minmax(44px,1fr)); } .ticketPreviewHeader h2 { font-size:18px; } }
@media(prefers-reduced-motion:reduce) { .ticketPreviewDialog,.ticketPreviewDialog *,.ticketPreviewDialog::backdrop { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
.ticketPreviewTarget{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:0;padding:10px 20px;background:#b3903510;border-bottom:1px solid #b3903530;color:#efcd78;font-size:12px;line-height:1.5}