/* Shared participant app design. Existing ticket/live data flows stay intact. */
html { --text-factor:1; }
html[data-text-size="large"] { --text-factor:1.2; }
html[data-text-size="largest"] { --text-factor:1.45; }
.app220 { margin:0; color:#132f4e; background:#f5f7fb; font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-tap-highlight-color:transparent; }
.app220 * { box-sizing:border-box; }
.app220 [hidden] { display:none!important; }
.app220 a { color:#0a67bc; text-decoration:none; }
.app220 button,.app220 input,.app220 select { font:inherit; }
.app220 button { cursor:pointer; }
.app220 button:disabled { cursor:default; opacity:.55; }
.app220 :focus-visible { outline:3px solid #2586d6; outline-offset:3px; }
.app220 svg { width:22px; height:22px; flex-shrink:0; }
.app-header220 { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:16px; padding:calc(15px + env(safe-area-inset-top)) 22px 15px; max-width:720px; margin:auto; }
.app-wordmark220 { display:flex; align-items:center; gap:11px; color:#607286!important; font-size:10px; font-weight:700; letter-spacing:.3px; line-height:1.4; }
.app-wordmark220 img { width:42px; height:42px; max-width:none; border-radius:12px; object-fit:contain; }
.app-wordmark220 strong { display:block; color:#102d4c; font-size:20px; font-weight:800; letter-spacing:-.5px; }
.app-icon-button220 { background:#fff; border:1px solid #e0e7ef; border-radius:14px; padding:11px; color:#244b70; min-width:46px; min-height:46px; display:inline-flex; align-items:center; justify-content:center; }
.app-content220,.app220 .mobile-app { width:100%; max-width:720px; margin:auto; padding:10px 22px calc(112px + env(safe-area-inset-bottom)); background:transparent; min-height:0; }
.app-page-heading220 { margin:4px 0 22px; }
.app220 h1,.app220 h2,.app220 h3,.app220 p { margin:0; }
.app220 h1 { font-size:calc(30px * var(--text-factor)); font-weight:800; line-height:1.15; letter-spacing:-1px; overflow-wrap:anywhere; }
.app220 h2 { font-size:calc(19px * var(--text-factor)); font-weight:750; line-height:1.3; letter-spacing:-.3px; }
.app220 h3 { font-size:calc(17px * var(--text-factor)); line-height:1.35; }
.app220 .app-kicker220 { margin:0 0 8px; color:#62788f; font-size:10px; line-height:1.4; font-weight:800; letter-spacing:1.1px; }
.app-page-heading220 > p:last-child { margin-top:10px; color:#63768a; font-size:calc(14px * var(--text-factor)); line-height:1.5; }
.app-feature220 { position:relative; overflow:hidden; background:linear-gradient(115deg,#07335f,#096dba); padding:22px; border-radius:24px; color:#fff; box-shadow:0 9px 22px #07315e19; }
.app-feature220 h2 { position:relative; max-width:85%; margin:17px 0 8px; font-size:calc(25px * var(--text-factor)); color:#fff; line-height:1.14; letter-spacing:-.7px; }
.app-feature220 > p { position:relative; max-width:85%; color:#e0edf8; font-size:calc(13px * var(--text-factor)); line-height:1.5; }
.feature-orbit220 { position:absolute; right:-28px; top:25px; width:145px; height:145px; display:grid; place-items:center; border:1px solid #ffffff20; border-radius:50%; transform:rotate(-22deg); color:#ffffff16; box-shadow:0 0 0 22px #ffffff06; }
.feature-orbit220 svg { width:85px; height:85px; }
.app-live-chip220 { position:relative; display:flex; align-items:center; gap:7px; color:#e2f3ff; font-size:9px; font-weight:800; letter-spacing:1.2px; }
.app-live-chip220 i { width:6px; height:6px; background:#a4e866; border-radius:50%; box-shadow:0 0 0 4px #a4e86616; }
.app-light-button220,.app-primary220 { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:12px 18px; border-radius:13px; border:0; background:#0a6dcc; color:#fff!important; font-size:calc(14px * var(--text-factor)); font-weight:750; line-height:1.4; text-decoration:none; }
.app-light-button220 { margin-top:19px; background:#fff; color:#084a80!important; }
.app-light-button220 svg { width:17px; height:17px; }
.full220 { width:100%; }
.app-shortcuts220 { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0 23px; }
.app-shortcuts220 > * { min-width:0; border:1px solid #e0e8f0; background:#fff; border-radius:19px; display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:17px; color:#163654; text-align:left; font-weight:400; box-shadow:0 3px 7px #0d355004; }
.shortcut-icon220,.empty-symbol220,.sheet-symbol220 { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:12px; background:#e9f3ff; color:#126abe; margin-bottom:7px; flex-shrink:0; }
.shortcut-icon220.green220 { background:#edf7e9; color:#568722; }
.app-shortcuts220 strong { font-size:calc(15px * var(--text-factor)); line-height:1.35; }
.app-shortcuts220 small { color:#63788e; font-size:calc(12px * var(--text-factor)); line-height:1.4; }
.app-section-title220 { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:22px 0 12px; }
.app-section-title220 h2 { font-size:calc(15px * var(--text-factor)); }
.app-section-title220 > a { font-size:12px; min-height:44px; flex-shrink:0; display:flex; align-items:center; font-weight:700; }
.app-section-title220 .m-text { font-size:12px; text-decoration:none; }
.app-empty220,.app-recent220 { display:flex; align-items:center; gap:13px; padding:17px; border-radius:18px; border:1px solid #e0e8f0; background:#fff; color:#173652!important; }
.app-empty220 .empty-symbol220,.app-recent220 .empty-symbol220 { margin:0; }
.app-empty220 strong,.app-recent220 strong { font-size:calc(13px * var(--text-factor)); line-height:1.45; overflow-wrap:anywhere; }
.app-empty220 p,.app-recent220 p { margin-top:4px; color:#63788e; font-size:calc(12px * var(--text-factor)); line-height:1.5; }
.app-connection220 { color:#6c8296; font-size:11px; padding:19px 0 0; text-align:center; }
.app-tabs220 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); position:fixed; z-index:25; bottom:0; left:50%; transform:translateX(-50%); width:min(720px,100%); padding:9px max(12px,env(safe-area-inset-right)) calc(9px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)); background:#fffffffa; border-top:1px solid #e1e8f0; box-shadow:0 -5px 24px #15375106; }
.app-tabs220 a { color:#6d8095; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:5px; min-height:52px; border-radius:13px; font-size:calc(10px * var(--text-factor)); font-weight:650; line-height:1.25; text-align:center; padding:4px; }
.app-tabs220 a[aria-current="page"] { color:#0a66b9; background:#edf5ff; font-weight:800; }
.app-tabs220 a[aria-current="page"] svg { stroke-width:2.3; }
.app-menu220 { border:1px solid #e0e8f0; border-radius:20px; overflow:hidden; background:#fff; }
.app-menu220 > * { width:100%; display:flex; align-items:center; text-align:left; gap:14px; background:transparent; color:#294d70!important; padding:17px; border:0; border-bottom:1px solid #edf1f5; }
.app-menu220 > *:last-child { border-bottom:0; }
.app-menu220 > * > span { flex:1; min-width:0; }
.app-menu220 strong,.app-menu220 small { display:block; }
.app-menu220 strong { font-size:calc(14px * var(--text-factor)); }
.app-menu220 small { color:#64798f; font-size:calc(12px * var(--text-factor)); margin-top:5px; font-weight:400; line-height:1.45; }
.app-menu220 > * > svg:last-child { width:16px; height:16px; color:#8c9fb1; }
.app-install220 { background:#fff; border:1px solid #e0e8f0; padding:20px; border-radius:20px; margin:20px 0; }
.app-install-brand220 { display:flex; align-items:center; gap:12px; margin-bottom:19px; }
.app-install-brand220 img { flex:0 0 auto; border-radius:14px; }
.app-install-brand220 h2 { font-size:calc(17px * var(--text-factor)); }
.app-install-brand220 p { font-size:calc(12px * var(--text-factor)); color:#64798f; margin-top:5px; }
.app220 .app-caption220 { font-size:calc(12px * var(--text-factor)); color:#687f94; line-height:1.6; margin-top:14px; }
.app-help220 { display:flex; align-items:center; gap:12px; justify-content:center; min-height:48px; font-size:13px; font-weight:650; }
.app220 .m-saved { background:#fff; border:1px solid #e0e8f0; padding:16px; margin-bottom:10px; border-radius:17px; gap:12px; }
.app220 .m-saved a { flex:1; color:#163653; font-size:calc(15px * var(--text-factor)); }
.app220 .m-saved .m-text { font-size:12px; color:#718299; padding:8px 2px; }
.app220 .m-empty { font-size:calc(14px * var(--text-factor)); padding:25px; background:#fff; border:1px dashed #c9d9e8; color:#61788d; }
.sheet220,.app220 .install-dialog210 { position:fixed; inset:auto 0 0; margin:0 auto; width:min(560px,100%); max-width:100%; max-height:90vh; max-height:90dvh; overflow:auto; padding:28px 24px calc(25px + env(safe-area-inset-bottom)); border:0; border-radius:26px 26px 0 0; background:#fff; color:#173654; box-shadow:0 -18px 80px #07315e28; font:16px/1.5 system-ui,sans-serif; }
.sheet220::backdrop,.app220 .install-dialog210::backdrop { background:#0d24476e; backdrop-filter:blur(3px); }
.sheet-grip220 { width:38px; height:4px; border-radius:8px; background:#d5dfe8; margin:-16px auto 24px; }
.sheet-close220 { position:absolute; top:16px; right:14px; display:grid; place-items:center; border:0; background:#eef3f8; color:#60778e; width:44px; height:44px; padding:12px; border-radius:50%; }
.sheet220 h2 { font-size:calc(23px * var(--text-factor)); margin:8px 45px 11px 0; letter-spacing:-.5px; line-height:1.25; }
.sheet220 > p { color:#63798d; font-size:calc(14px * var(--text-factor)); margin:10px 0 17px; }
.sheet220 form { display:grid; gap:12px; margin-top:22px; }
.sheet220 label { font-size:calc(13px * var(--text-factor)); font-weight:700; }
.sheet220 input,.sheet220 select { width:100%; min-height:50px; padding:12px 14px; border:1px solid #c7d7e6; border-radius:12px; background:#f8faff; color:#173654; font:16px/1.5 system-ui; }
.sheet220 .a11y170 { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:20px 0; padding:0; border:0; }
.sheet220 .a11y170 label { display:grid; gap:8px; min-width:0; max-width:none; }
.sheet220 .app-primary220 { width:100%; }
.app220 .app-update210 { bottom:calc(88px + env(safe-area-inset-bottom)); z-index:30; }
/* Live and private-ticket screens use the same navigation and card system. */
.app220 .mobile-app > header.host-brand220 { flex-direction:row; gap:12px; align-items:center; padding:10px 0 14px; border-bottom:1px solid #e1e8f0; }
.app220 .host-brand220 img { width:auto; max-width:148px; max-height:46px; object-fit:contain; }
.app220 .host-brand220 #connection { color:#687f92; font-size:11px; font-weight:500; flex:1; text-align:right; }
.app220 .event-intro { padding:22px 0; }
.app220 .event-intro h1 { margin:8px 0 10px; }
.app220 .event-intro #host { color:#61788c; font-size:calc(13px * var(--text-factor)); line-height:1.5; margin-bottom:13px; }
.app220 .event-intro .eyebrow { color:#788da0; font-size:10px; letter-spacing:1.3px; }
.app220 .pill { font-size:calc(11px * var(--text-factor)); padding:6px 12px; color:#41842d; background:#edf7e7; }
.app220 .live-tabs220 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; padding:5px; margin:0 0 20px; background:#e8eef5; border-radius:13px; }
.app220 .live-tabs220 button { background:none; color:#71849a; min-height:44px; padding:10px 4px; font-size:calc(12px * var(--text-factor)); border:0; border-radius:10px; font-weight:650; }
.app220 .live-tabs220 button[aria-selected="true"] { background:#fff; color:#123e67; box-shadow:0 2px 5px #173c5f0a; }
.app220 .schedule-card { padding:22px; border-radius:21px; background:linear-gradient(120deg,#07335f,#0a629f); }
.app220 .schedule-card .eyebrow { font-size:10px; color:#b6d8f7; }
.app220 .schedule-card h2 { font-size:calc(20px * var(--text-factor)); line-height:1.4; margin:13px 0; }
.app220 .schedule-card p { margin:10px 0; font-size:calc(13px * var(--text-factor)); }
.app220 .schedule-card #countdown { font-size:calc(16px * var(--text-factor)); color:#b6ec7c; }
.app220 .schedule-card small { font-size:calc(11px * var(--text-factor)); line-height:1.6; margin-top:17px; }
.app220 .schedule-card #message:empty { display:none; }
.app220 .totals { gap:12px; margin:16px 0 20px; }
.app220 .totals > div { padding:17px; border-radius:17px; text-align:left; }
.app220 .totals strong { font-size:calc(28px * var(--text-factor)); line-height:1.2; color:#194775; }
.app220 .totals span { font-size:calc(12px * var(--text-factor)); }
.app220 .live-tools220 { display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; }
.app220 .live-tools220 > * { min-height:44px; flex:1; padding:10px 12px; color:#205989; background:#fff; border:1px solid #dbe6f0; border-radius:12px; display:flex; align-items:center; justify-content:center; gap:8px; font-size:calc(12px * var(--text-factor)); font-weight:700; }
.app220 .live-tools220 svg { width:17px; height:17px; }
.app220 .live-tools220 + p { color:#63788e; font-size:12px; margin-top:12px; }
.app220 .winner { border:1px solid #dce8ef; border-top:4px solid #8cc84d; padding:20px; margin:14px 0; border-radius:19px; }
.app220 .winner h3 { margin:9px 0 15px; font-size:calc(22px * var(--text-factor)); }
.app220 .winner code { display:block; border:1px dashed #b8d3e9; border-radius:11px; background:#f4f9ff; padding:13px; font-size:calc(19px * var(--text-factor)); }
.app220 .winner p { font-size:calc(13px * var(--text-factor)); margin-top:13px; }
.app220 .winner small { font-size:10px; font-weight:750; letter-spacing:1px; }
.app220 .prizes170 { grid-template-columns:1fr; gap:10px; margin:15px 0; }
.app220 .prizes170 li { padding:18px; background:#fff; border:1px solid #dfe8f0; border-radius:15px; font-size:calc(14px * var(--text-factor)); }
.app220 .prizes170 li small { margin-top:5px; font-size:calc(12px * var(--text-factor)); }
.app220 .hub-card170 { margin:0 0 20px; border:1px solid #dce6f0; border-radius:21px; box-shadow:0 4px 15px #12365505; }
.app220 .hub-card170 > header { background:linear-gradient(115deg,#113d65,#0e68a9); padding:20px; text-align:left; align-items:flex-start; }
.app220 .hub-card170 > header h2 { font-size:calc(19px * var(--text-factor)); margin:0 0 10px; }
.app220 .hub-card170 > header p { margin:5px 0; font-size:calc(12px * var(--text-factor)); }
.app220 .hub-card170 > header strong { font-size:calc(13px * var(--text-factor)); line-height:1.6; font-weight:500; }
.app220 .hub-body170 { padding:18px; }
.app220 .hub-ticket170 { margin:16px 0 22px; border:1px dashed #b1cce0; border-radius:16px; background:#f7faff; padding:18px; }
.app220 .hub-ticket170.won170 { background:#f5faef; border-color:#b7d393; }
.app220 .hub-ticket170 h3 { margin:10px 0; font-size:calc(21px * var(--text-factor)); }
.app220 .hub-ticket170 > code { display:block; color:#0a6bbc; font-size:calc(21px * var(--text-factor)); font-weight:750; letter-spacing:.3px; margin:10px 0 18px; }
.app220 .hub-ticket170 > small { font-size:10px; letter-spacing:1px; font-weight:800; }
.app220 .hub-ticket170 details { margin-top:13px; border-top:1px solid #d9e6ef; padding-top:9px; }
.app220 .hub-ticket170 summary { display:flex; align-items:center; font-size:calc(12px * var(--text-factor)); font-weight:650; line-height:1.4; }
.app220 .hub-ticket170 p { margin:10px 0; font-size:calc(13px * var(--text-factor)); }
.app220 .hub-panel170 { border:1px solid #dce6f0; border-radius:18px; padding:20px; background:#fff; margin:17px 0; }
.app220 .hub-panel170 p { margin:12px 0; font-size:calc(13px * var(--text-factor)); line-height:1.6; }
.app220 .hub-panel170 summary { font-size:calc(14px * var(--text-factor)); }
.app220 .hub-actions170 { margin:13px 0; gap:9px; }
.app220 .hub-actions170 > * { min-width:0; font-size:calc(12px * var(--text-factor)); line-height:1.4; min-height:44px; }
.app220 .hub-field170 { font-size:calc(13px * var(--text-factor)); }
.app220 .hub-field170 input,.app220 .hub-field170 select { font-size:16px; border-radius:12px; border:1px solid #c3d6e6; }
.app220 .hub-panel170 form > button { min-height:48px; width:100%; font-size:calc(13px * var(--text-factor)); }
.app220 .hub-private170 { font-size:calc(12px * var(--text-factor))!important; }
.app220 #hub-feedback:empty { display:none; }
.app220 .recovery-icon220 { width:48px; height:48px; border-radius:15px; background:#eaf3ff; color:#126fc2; display:grid; place-items:center; margin-bottom:17px; }
.app220 .recovery220 > summary { font-size:calc(17px * var(--text-factor)); color:#173654; font-weight:750; }
.app220 .mobile-app > footer { margin-top:22px; padding-top:15px; font-size:11px; color:#8b9dae; }
.app220 .hub-pickup-code200 > strong { font-size:clamp(17px,6vw,29px); }
.app220 .hub-pickup-code200 button { font-size:calc(12px * var(--text-factor)); }
.asn-native210.app220 .app-tabs220 { display:none; }
.asn-native210.app220 .app-content220,.asn-native210.app220 .mobile-app { padding-bottom:24px; }
.asn-native220.app220 .app-header220 { display:none; }
.asn-native220.app220 .app-content220 { padding-top:23px; }
.asn-native220.app220 .mobile-app { padding-top:12px; }
@media (min-width:740px) { .app220 { background:#eaf0f6; } .app-header220,.app-content220,.app220 .mobile-app { background:#f5f7fb; } .app-content220 { min-height:calc(100vh - 90px); } }
@media (max-width:360px) { .app-header220 { padding-left:16px; padding-right:16px; } .app-content220,.app220 .mobile-app { padding-left:16px; padding-right:16px; } .app-feature220 { padding:20px; } .app-shortcuts220 > * { padding:15px; } .app-section-title220 { gap:9px; } .app-section-title220 h2 { font-size:calc(14px * var(--text-factor)); } }
@media (max-height:480px) { .sheet220 { border-radius:18px 18px 0 0; max-height:95dvh; } }
@media (prefers-reduced-motion:no-preference) { .app220 button,.app220 a { transition:background .15s ease,box-shadow .15s ease; } .app220 button:active,.app-shortcuts220 a:active { filter:brightness(.97); } }
@media print { .app-header220,.app-tabs220,.live-tools220,.sheet220 { display:none!important; } .app220 .mobile-app { padding-bottom:0; } }