/* JavaScript owns route transitions; CSS only holds the incoming main hidden
   when the browser cannot capture complete route frames. */
html body#nw-web > #main.is-changing { transition: none; }
html body#nw-web > #main.is-animating:not(.is-leaving) { opacity: 0; }
/* Swup keeps the incoming main hidden for its own animation. During a frame
   snapshot it must be fully painted before the browser captures the new view. */
html[data-nw-route-snapshot] body#nw-web > #main.is-animating:not(.is-leaving) { opacity:1; }
/* Hold the outgoing fixed scenery above the incoming one while the route
   enters. It is removed as soon as the matching JS fade completes. */
html body#nw-web > .nw-route-scene { position:fixed;inset:0;z-index:-1;pointer-events:none; }
@media(prefers-reduced-motion:reduce){html body#nw-web > #main.is-changing{transition:none}}
/* Account entry inherits the same background layers and positioning as other pages. */
html body#nw-web.page-loading-lk > main { padding-block:24px 0!important;flex:1 0 auto;align-items:center; }
html body#nw-web.page-loading-lk .state-page { grid-template-columns:minmax(0,650px) minmax(280px,380px);gap:clamp(40px,6vw,100px)!important;max-width:1160px;margin-inline:auto!important; }
html body#nw-web.page-loading-lk .state-page > div { max-width:650px;align-self:center; }
html body#nw-web.page-loading-lk .cabinet-title { font-size:clamp(34px,3.5vw,52px);line-height:1.12;margin-bottom:24px; }
html body#nw-web.page-loading-lk .cabinet-status { font-size:22px;line-height:1.4;margin:0 0 12px; }
html body#nw-web.page-loading-lk .cabinet-text { max-width:570px;font-size:18px;line-height:1.75;margin-bottom:0; }
html body#nw-web.page-loading-lk .actions { margin-top:24px;gap:12px 32px;align-items:center; }
html body#nw-web.page-loading-lk .state-support { margin-top:24px;padding-top:0; }
html body#nw-web.page-loading-lk .state-art { height:520px!important;width:100%;max-width:380px;object-fit:contain;mask-image:none!important;-webkit-mask-image:none!important;filter:none;align-self:center;justify-self:center; }
@media(max-width:900px){html body#nw-web.page-loading-lk .state-page{grid-template-columns:minmax(0,1fr) 280px;gap:32px}html body#nw-web.page-loading-lk .state-art{height:460px!important}}
@media(max-width:700px){html body#nw-web.page-loading-lk > main{padding-block:28px!important}html body#nw-web.page-loading-lk .state-page{grid-template-columns:1fr;gap:24px}html body#nw-web.page-loading-lk .cabinet-text{font-size:16px}html body#nw-web.page-loading-lk .state-art{height:340px!important}html body#nw-web.page-loading-lk .actions{margin-top:24px;gap:8px 22px}html body#nw-web.page-loading-lk .state-support{margin-top:24px;padding-top:0}}

html:has(#main.is-changing) { overflow-anchor:none; }

/* Programmatic page focus is for reading order, not a decorative frame. */
html body#nw-web > #main:focus { outline:none; }

/* All status messages share a grid cell: its intrinsic height fits every state,
   including translated and wrapped text, before scripts or requests finish. */
html body#nw-web.page-loading-lk .cabinet-messages { display:grid; }
[data-cabinet-message] { grid-area:1 / 1;visibility:hidden; }
html:not([data-nw-cabinet-state]) [data-cabinet-message="loading"],
html[data-nw-cabinet-state="loading"] [data-cabinet-message="loading"],
html[data-nw-cabinet-state="success"] [data-cabinet-message="success"],
html[data-nw-cabinet-state="maintenance"] [data-cabinet-message="maintenance"],
html[data-nw-cabinet-state="error"] [data-cabinet-message="error"] { visibility:inherit; }
/* The text already announces connection checking. Keep the additional status
   accessible without reserving a second visible row in every state. */
html body#nw-web.page-loading-lk .cabinet-progress { position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%); }
html body#nw-web.page-loading-lk .progress-line { display:block;height:1px;max-width:none;margin-top:24px;background:linear-gradient(90deg,transparent,rgba(184,197,232,.33) 24%,rgba(184,197,232,.33) 76%,transparent); }
html body#nw-web.page-loading-lk .progress-line::after { background:linear-gradient(90deg,transparent,rgba(184,197,232,.85),transparent); }
html[data-theme="light"] body#nw-web.page-loading-lk .progress-line { background:linear-gradient(90deg,transparent,rgba(57,79,116,.33) 24%,rgba(57,79,116,.33) 76%,transparent); }
html[data-theme="light"] body#nw-web.page-loading-lk .progress-line::after { background:linear-gradient(90deg,transparent,rgba(57,79,116,.85),transparent); }
html[data-nw-cabinet-state]:not([data-nw-cabinet-state="loading"]):not([data-nw-cabinet-checking]) body#nw-web.page-loading-lk :is(.cabinet-progress,.progress-line) { visibility:hidden; }