/* Shared transition shell. First-paint pages also inline its critical rules. */

/* Also inlined before external dependencies. Uses the same local logo as the navigation. */
html{background:#181a20}
html:is([data-page-readiness="pending"],[data-page-readiness="error"]) body > :not(script):not(style):not(link):not(#hashlingsPageLoader):not([data-page-loading-keep]){visibility:hidden!important;opacity:0!important;pointer-events:none!important}
html[data-page-readiness="ready"] #hashlingsPageLoader:not([data-state]){display:none}
#hashlingsPageLoader{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;box-sizing:border-box;margin:0;width:100%;height:100dvh;padding:32px 24px 72px;background:radial-gradient(ellipse at 50% 38%,#292719 0%,#181a20 48%,#0b0e11 100%);color:#eaecef;text-align:center;font:14px/1.6 system-ui,sans-serif;overflow:auto}
.hl-page-loader__status{margin:24px 0 12px;font-size:18px;line-height:1.6;font-weight:500}
.hl-page-loader__content{width:min(100%,360px)}
.hl-page-loader__progress{height:8px;width:min(100%,264px);margin:18px auto 0;overflow:hidden;border:1px solid #343b46;border-radius:99px;background:#2b3139}
.hl-page-loader__progress-fill{display:block;height:100%;width:0;border-radius:inherit;background:#fcd535;transition:width .2s ease}
.hl-page-loader__progress[data-mode="indeterminate"] .hl-page-loader__progress-fill{width:36%;animation:hl-progress-slide 1.5s ease-in-out infinite}
.hl-page-loader__detail{margin:9px 0 18px;color:#b7bdc6;font-size:12px;line-height:1.6;font-variant-numeric:tabular-nums}
#hashlingsPageLoader[data-state="error"] .hl-page-loader__progress-fill{background:#d5bc72;animation:none}
@keyframes hl-progress-slide{from{transform:translateX(-100%)}to{transform:translateX(280%)}}
.hl-page-loader__actions{display:flex;justify-content:center;gap:12px}
#hashlingsPageLoader button{min-height:44px;border:1px solid #f0b90b;border-radius:12px;padding:9px 20px;background:#fcd535;color:#181a20;font:600 14px system-ui;cursor:pointer}
#hashlingsPageLoader button[hidden]{display:none}

.world-loading-logo{display:grid;place-items:center;width:176px;height:176px;margin:0 auto 12px;background:none;animation:hl-logo-breathe 3s ease-in-out infinite}.world-loading-logo img{display:block;width:152px;height:152px;max-width:100%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 0 #10292540)}
@keyframes hl-logo-breathe{50%{transform:translateY(-5px)}}
@media(max-height:600px){.world-loading-logo{width:128px;height:128px}.world-loading-logo img{width:112px;height:112px}}
@media(prefers-reduced-motion:reduce){.world-loading-logo,.hl-page-loader__progress[data-mode="indeterminate"] .hl-page-loader__progress-fill{animation:none}.hl-page-loader__progress-fill{transition:none}}

/* One header offset for both native deep links and in-page anchors. */
/* Only explicit navigation animates scrolling; native hash restoration must
   not keep moving while account content and fonts settle. */
html { scroll-padding-top:var(--nav-offset,16px);scroll-behavior:auto;scrollbar-gutter:stable; }
html[data-ui-theme="binance"] body.home-layout :is(#mint,#box,#collection,#market,#world-section,#fusion,#top) { scroll-margin-top:0; }
html[data-ui-theme="binance"] #hashlingsPageLoader[data-state="error"] .hl-page-loader__progress-fill { background:var(--sf-danger); }
html[data-ui-theme="binance"] #hashlingsPageLoader button:focus-visible { outline:2px solid var(--sf-primary);outline-offset:3px; }
html[data-ui-theme="binance"][data-app-page="deposit"] body.shared-theme .game-shop { margin-top:calc(var(--nav-offset,140px) + 20px); }