/* Screen UI palettes. Customer artwork/printed SVGs keep their own colors. */
@media screen {
 /* Compact cards also render Orbit markup; its SVG must never use the page
    as the absolute positioning block. Geometry applies to every card mode. */
 #app #content .timer-design31{position:relative;display:grid;place-items:center;width:230px;max-width:88%;aspect-ratio:1;flex-shrink:0;isolation:isolate;contain:layout;margin:20px auto;color:var(--s31-ink)}
 #app #content .timer-design31>svg{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;pointer-events:none}
 #app #content .timer-design31 .timer-content31{position:relative;text-align:center}
 #app #content .compact-sessions13{position:relative;min-width:0;width:100%;max-width:100%;box-sizing:border-box;overflow-x:auto;overscroll-behavior-x:contain}
 #app #content .route-switch31{position:relative}
 #app #content .sessions-design-pay9{min-width:0;max-width:100%}
 :root:not([data-appearance=night]) #app .state12:not(.is-live):not(.live):not(.online){color:#435b70;background:#edf2f7;border-color:#c2ced9}
 :root:not([data-appearance=night]) .sessions-design-pay9{--s31-accent:#07655f}
 :root:not([data-appearance=night]) #app #content .digital-clock32 i{color:#31566b;opacity:1}
 :root:not([data-appearance=night]) #app #content .session-temporary31{color:#075c62}
 :root:not([data-appearance=night]) #app #content .route-switch31{color:#174954}
 :root:not([data-appearance=night]) :is(#app,#modal) :is(button:disabled,button[aria-disabled=true]){background:#e7edf2!important;color:#526274!important;border-color:#9eafbe!important;opacity:1!important;filter:none;cursor:not-allowed;box-shadow:none}
 :root:not([data-appearance=night]) #app .vs36 .scope-note{opacity:1}
 :root:not([data-appearance=night]) #app :is(.chart-caption12,.reset-card p,.repair-banner p,.steps14 li){color:#31566b}
 :root:not([data-appearance=night]) #app .telegram-message small{color:#c5dceb}
 :root:not([data-appearance=night]) #app .theme-section>span{color:#466277}
 :root:not([data-appearance=night]) #app .preview-toolbar12 button{color:#174954}
 :root:not([data-appearance=night]){--muted:#466277;--sub12:#466277;--muted21:#466277;--teal:#086777;--accent:#086777;--accent12:#086777;--green:#086b50}
 :root:not([data-appearance=night]) :is(#app,#modal) .error{color:#a12748!important}
 :root:not([data-appearance=night]) #app .mobile-nav button.active{color:#086777}
 :root:not([data-appearance=night]) :is(#app,#modal) :is(button.primary,a.button.primary){background:#086777!important;color:#fff!important;border-color:#086777}
 :root:not([data-appearance=night]) :is(#app,#modal) button.danger-text{color:#a12748!important}
 :root:not([data-appearance=night]) :is(#app,#modal) :is(input,textarea)::placeholder{color:#516876!important;opacity:1}
 :root:not([data-appearance=night]) #app :is(.chip,.state12){color:#125b50;background:#e0f4eb;border-color:#afd2c7}
 :root:not([data-appearance=night]) #app :is(.chip.unused,.chip.disabled,.chip.unknown,.chip.disconnected,.chip.inactive){color:#435b70;background:#edf2f7;border-color:#c2ced9}
 :root:not([data-appearance=night]) #app :is(.chip.pending,.chip.scheduled,.chip.Pending){color:#704b0b;background:#fff2d7;border-color:#e4ce9d}
 :root:not([data-appearance=night]) #app :is(.chip.failed,.chip.expired,.chip.offline,.chip.blocked,.chip.revoked){color:#a12748;background:#fff0f4;border-color:#e4b8c4}
 :root:not([data-appearance=night]) #app .metric-index-pay9{color:#2b526c!important;background:#e6edf3}
 :root:not([data-appearance=night]) #app :is(.memory-caption-pay9,.live-pill){color:#125b50!important;opacity:1;background:#e0f4eb}
 :root:not([data-appearance=night]) #app .traffic-legend>span{color:#11644e}
 :root:not([data-appearance=night]) #app .traffic-legend>span:nth-child(2){color:#155b92}
 :root:not([data-appearance=night]) #app :is(.leader-pay7 small,.leader-pay7 span,.session-monitor-toolbar26 small,.session-speed26 small){color:#466277;opacity:1}
 :root:not([data-appearance=night]) #app :is(.digital-clock32,.session-speed26>div>span,.temporary-launch31 strong){color:#075c62!important}
 :root:not([data-appearance=night]) #app .digital-timer32 i{color:#466277;opacity:1}
 :root:not([data-appearance=night]) #app .route-switch31{color:#174954}
 :root:not([data-appearance=night]) #app .pagination{color:#466277}
 :root:not([data-appearance=night]) #app .pagination :is(button,strong){color:#31566e;opacity:1}
 :root:not([data-appearance=night]) #app .dm25{--dm33-muted:#466277;--dm33-accent:#075f63}
 :root:not([data-appearance=night]) #app .dm25 :is(small,.dm25-hint,.dm33-eyebrow){color:#466277;opacity:1}
 :root:not([data-appearance=night]) #app .dm25 :is(button,.dm33-avatar,.dm33-presence){color:#075f63}
 :root:not([data-appearance=night]) #app :is(.stat-tile:not([data-metric-pay9])){background:#edf5f8;color:#173c52}
 :root:not([data-appearance=night]) #app .stat-tile:not([data-metric-pay9]) :is(strong,.stat-label,small){color:#244b63;opacity:1}
 :root:not([data-appearance=night]) #app .overview-digital-pay9 .stat-tile small{color:#466277!important;opacity:1!important}
 :root:not([data-appearance=night]) #app :is(.text-button12,.empty-symbol,.conversation-support-state){color:#31596c}
 :root:not([data-appearance=night]) #app .telegram-hero{background:linear-gradient(120deg,#153f53,#145b59);color:#fff}
 :root:not([data-appearance=night]) #app .telegram-hero :is(h2,p,.eyebrow){color:#e2f9f5}
 :root:not([data-appearance=night]) #app .telegram-hero :is(button,#tg-status){color:#153f53;background:#e2f9f5}
 :root:not([data-appearance=night]) #app :is(.fix-card p,.owner-session11 p,.owner-session11 small,.security-session p,.security-list p,.reset-hero p){color:#466277;opacity:1}
 :root:not([data-appearance=night]) #app :is(.performance-choice span,.step-list li){color:#31596c}
 :root[data-appearance=night] #app .header-actions button{background:#173b4b;color:#e4f5ff}
 :root[data-appearance=night] #app .header-actions button span{color:inherit}
 :root[data-appearance=night] #app .dm25-badges span{color:#c7f2e8;background:#124847}
 /* Button descendants must not erase light sample artwork. */
 #app .qr-design-choices21 button .qr-swatch21{color:#086777!important;background:#f4fffd!important}
 #app .qr-design-choices21 button .qr-swatch21.neon{color:#78f3df!important;background:#0b2839!important}
 #app .qr-design-choices21 button .qr-swatch21.compact{color:#14354a!important;background:#fff!important}
 #app .qr-design-choices21 button .qr-swatch21 svg{color:inherit!important}
 :root:not([data-appearance=night]) #app .qr-controls21 button:not(.primary){background:#e6f3f3;color:#075b69}
 :root[data-appearance=night] #app .vs36 .vs36-ticket :is(footer,footer strong,footer span,footer svg){color:#eafff5!important}
 :root[data-appearance=night] #app .vs36 .vs36-ticket footer small{color:#c8e9df!important}
 #app .vs36 .scope-note{color:var(--vs-muted)}
 #app .vs36 .quick-voucher input::placeholder{color:var(--vs-muted)!important;opacity:1}
 /* Ticket/studio pattern uses local CSS, with no remote images or polling. */
 .vs36-studio{position:relative;isolation:isolate;overflow:hidden}
 .vs36-studio:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 100% 0%,#3bb99b16,transparent 55%),radial-gradient(var(--vs-line) .8px,transparent .8px);background-size:auto,18px 18px;mask-image:linear-gradient(100deg,transparent 25%,#000)}
 .vs36-ticket{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(140deg,#174f48,#102a3b 72%);box-shadow:0 18px 35px #002a3b20,inset 0 1px #d0ffea44}
 .vs36-ticket:before{content:"";position:absolute;width:310px;height:310px;right:-150px;top:-115px;border:1px solid #8ff0c52b;border-radius:50%;box-shadow:0 0 0 22px #86e8bc0b,0 0 0 44px #86e8bc0a,0 0 0 66px #86e8bc08;pointer-events:none;z-index:-1}
 .vs36-ticket:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 14px,#b6f8da06 14px 15px)}
 .vs36-ticket header{padding-bottom:16px;border-bottom:1px solid #a9ddc62e}
 .vs36-code:before{content:"ACCESS PASS";display:block;font:650 9px/1.4 system-ui,sans-serif;letter-spacing:.24em;color:#b3e1d4;margin-bottom:13px}
 .vs36-ticket-meta{position:relative}
 .vs36-ticket-meta:before,.vs36-ticket-meta:after{content:"";position:absolute;top:-10px;width:18px;height:18px;border-radius:50%;background:var(--vs-bg);border:1px solid #80b9a1}
 .vs36-ticket-meta:before{left:-33px}.vs36-ticket-meta:after{right:-33px}
 .vs36-ticket footer [data-vs-price]{font-family:SawdaDigital,monospace;letter-spacing:.02em}
 .vs36 .voucher-summary13 article{position:relative;overflow:hidden}
 .vs36 .voucher-summary13 article:after{content:"";position:absolute;width:80px;height:80px;border:1px solid var(--vs-line);right:-29px;bottom:-35px;border-radius:50%;box-shadow:0 0 0 12px #32ad9510;pointer-events:none}
 html[data-appearance=compact] .vs36-studio:before{background-size:auto,14px 14px}
 @media(prefers-reduced-motion:no-preference){.vs36-ticket{transition:box-shadow .2s ease,transform .2s ease}.vs36-ticket:hover{transform:translateY(-2px);box-shadow:0 20px 35px #002a3b30}}
 /* A collapsed rail has a compact status dot and sign-out, no wrapped slogan. */
 @media(min-width:761px){.workspace12.sidebar-collapsed12 .sidebar-bottom{font-size:0!important;line-height:1!important;padding:12px 0;text-align:center}.workspace12.sidebar-collapsed12 .sidebar-bottom small{font-size:0!important;display:block;margin-top:10px}.workspace12.sidebar-collapsed12 #logout{font-size:10px;display:inline-block;padding:6px 3px}.workspace12.sidebar-collapsed12 .sidebar-bottom .status-dot{display:inline-block;margin:0}}
}