/* Shared UX overrides. Keep app.css, payment layouts and draw timing intact. */
:root{--site-font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body,input,select,textarea,button,.tabs a,.tabs button,.shipping-main button,.shipping-page #shipping-refresh{font-family:var(--site-font)}
[hidden]{display:none!important}
.wrap,.card,.grid>*,.form>*,.topbar-inner>*{min-width:0}
input,select,textarea{max-width:100%;min-width:0}
button,.btn,.nav a{overflow-wrap:anywhere;white-space:normal}
button:disabled,.btn:disabled{cursor:not-allowed;opacity:.6;transform:none}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.form-error,[role=status],[role=alert],h1,h2,h3,.card p,.lead{overflow-wrap:anywhere}
.site-ux-notice{width:min(1080px,calc(100% - 32px));margin:16px auto;padding:14px 16px;border:2px solid var(--border);border-radius:16px;background:#fff;color:var(--dark);line-height:1.5;overflow-wrap:anywhere}
.site-ux-notice a{display:inline-block;margin:8px 14px 0 0;text-decoration:underline;text-underline-offset:3px}
.site-ux-notice[data-error=true]{border-color:#8b3030}
.site-ux-form-status{font-size:14px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
.site-ux-form-status:empty{display:none}
html.site-ux-gated body>:not(.topbar):not(#site-ux-notice):not(script):not(style):not(link){display:none!important}
html.site-ux-gated .mobile-cta{display:none!important}
.site-ux-table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.site-ux-table-scroll:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.spark{max-width:100%;overflow-x:auto}
.pay,.pay label.opt{min-width:0;max-width:100%}
.pay label.opt{display:block;text-align:left;overflow-wrap:anywhere;white-space:normal}
.pay label.opt input[type=radio]{width:18px;height:18px;display:inline-block;vertical-align:top;margin:3px 8px 0 0}
.pay label.opt small{display:block;margin:4px 0 0 26px;font-weight:500;color:var(--muted)}
@media(max-width:900px){
 .topbar-inner{flex-wrap:wrap}
 .topbar-inner .nav{flex:1 1 100%;max-width:100%;gap:4px}
 .nav a,.nav .btn{padding:10px 12px;min-height:44px}
 .nav-view-toggle{white-space:normal}
}
@media(max-width:540px){
 .topbar{position:relative}
 .topbar-inner .brand img{height:36px}
 .cards{grid-template-columns:minmax(0,1fr)}
 .card{padding:14px}
 input,select,textarea,.compact-form input,.shipping-main input,.shipping-main select,.shipping-main textarea{font-size:16px}
 .btn,.tabs button,.tabs a{min-height:44px;max-width:100%;text-align:center}
 .form-row,.identity-name-row{grid-template-columns:minmax(0,1fr)}
 .split .row{flex-wrap:wrap;gap:4px 12px}
 .kpis{grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr))}
 .confirmation-card{padding:20px 14px}
 .mobile-cta{position:static;display:block;margin:16px 12px 0;width:auto;left:auto;right:auto}
 body:has(.mobile-cta){padding-bottom:80px}
 .site-ux-notice{width:calc(100% - 22px)}
}
/* Only decorative landing motion is reduced; live draw cadence is untouched. */
@media(prefers-reduced-motion:reduce){.hero img.mascot,.landing-mascot{animation:none}.btn:hover{transform:none}}