/* Keep the same layout width while pages load and the drawer locks scrolling. */
html{scrollbar-gutter:stable}
/* Loading artwork and positions from Figma 1489:4273 (390 × 844).
   The exported ring PNG already carries its transparency; do not multiply opacity again. */
html[data-page-loading] #page-root,html[data-page-loading] #menu,html[data-page-loading] body>.af-header,html[data-page-loading] #side-menu,html[data-page-loading] .drawer-shade,html[data-page-loading] body>dialog{visibility:hidden!important}
html[data-page-loading] dialog::backdrop{background:transparent}
#page-loading{display:none;position:fixed;inset:0;z-index:100;background:var(--af-surface-15161a,#15161a);color:var(--af-ink-f8f9fa,#f8f9fa);overflow:hidden;container-type:inline-size}
html[data-page-loading] #page-loading{display:block}
html:not([data-loader-fonts-ready]) [data-loading-title],html:not([data-loader-fonts-ready]) .page-loading-message,html:not([data-loader-fonts-ready]) .page-loading-error{visibility:hidden}
.page-loading-canvas{position:relative;width:390px;height:844px;margin:0 auto;transform-origin:top center}
.page-loading-header{position:absolute;top:0;left:0;width:390px;height:64px;background:var(--af-surface-1c1d22,#1c1d22);border-radius:0 0 16px 16px}
.page-loading-header p{position:absolute;left:60px;top:8px;width:210px;height:48px;display:flex;align-items:center;justify-content:flex-start;transform:none;margin:0;font:500 18px/22px Oswald,sans-serif;letter-spacing:.18px;text-align:left;white-space:normal;overflow-wrap:anywhere}
.page-loading-back{position:absolute;left:16px;top:16px;width:32px;height:32px;display:grid;place-items:center;transform:rotate(90deg)}
.page-loading-menu,.page-loading-bell{position:absolute;top:12px;width:40px;height:40px;border-radius:10px;background:var(--af-surface-22242a,#22242a);display:grid;place-items:center}
.page-loading-menu{left:334px}.page-loading-bell{left:282px}.page-loading-bell img{opacity:.2}
.page-loading-ring{position:absolute;left:105px;top:116px;width:180px;height:180px;animation:page-loading-spin 2s linear infinite}
.page-loading-logo{position:absolute;left:160.57275px;top:174px;width:68.8545px;height:64px}
.page-loading-message{position:absolute;top:328px;left:0;width:390px;text-align:center}
.page-loading-message strong{display:block;font:500 18px/24px Oswald,sans-serif;letter-spacing:.18px}
.page-loading-message p{margin:8px 0 0;color:var(--af-ink-8b8e99,#8b8e99);font:500 12px/16px Manrope,sans-serif;letter-spacing:.12px}
.page-loading-error{position:absolute;left:16px;top:328px;width:358px;text-align:center;font:500 13px/20px Manrope,sans-serif}
.page-loading-error button{display:block;margin:16px auto 0;padding:12px 16px;border:0;border-radius:10px;background:#ffb703;color:#15161a;font:500 14px/20px Oswald,sans-serif;cursor:pointer}
@keyframes page-loading-spin{to{transform:rotate(360deg)}}
@container(max-width:389px){.page-loading-canvas{margin-left:calc((100% - 390px)/2);transform:scale(calc(100cqw / 390px))}}
@media(prefers-reduced-motion:reduce){.page-loading-ring{animation:none}}
