/* Restoring a document must not start an animated trip from the top. */
html { scroll-behavior: auto; scrollbar-gutter: stable; }
#motion { min-inline-size: 13ch; white-space: nowrap; }
#server-state { display: inline-block; inline-size: 27ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
altcha-widget { display: block; min-block-size: 80px; }

/* The hash is available before CSS; the server cannot see it. */
html[data-cabinet-panel] .desk-panel { display: none !important; }
html[data-cabinet-panel="accounts"] #panel-accounts,
html[data-cabinet-panel="donate"] #panel-donate,
html[data-cabinet-panel="premium"] #panel-premium,
html[data-cabinet-panel="promo"] #panel-promo,
html[data-cabinet-panel="history"] #panel-history,
html[data-cabinet-panel="settings"] #panel-settings,
html[data-cabinet-panel="admin"] #panel-admin { display: block !important; }

/* A saved form should not push the cabinet down or scroll back to its header. */
.is-desk #flash-messages { position: fixed; top: 100px; right: 24px; z-index: 90; width: min(440px,calc(100vw - 48px)); pointer-events: none; }
.is-desk #flash-messages .notice { margin: 0 0 10px; padding: 16px 20px; background: #251d30; border: 1px solid #c9aa7659; border-left: 3px solid var(--gold); border-radius: 7px; box-shadow: 0 12px 35px #09060d4d; pointer-events: auto; }
@media(max-width:760px) { .is-desk #flash-messages { top: 112px; right: 16px; width: calc(100vw - 32px); } }