.mobile-crystals{display:none}
@media(max-width:680px){
.top{column-gap:10px;row-gap:12px;padding:12px 14px!important;align-items:center!important;flex-direction:row!important;flex-wrap:wrap;transition:padding .28s ease,background .28s ease,row-gap .28s ease,border-radius .28s ease}
.top .brand{order:1;flex:1 1 auto;min-width:0;margin:0!important;align-self:center}
.top .brand img{width:40px;height:40px}
.top .nav-toggle{position:relative;inset:auto;order:3;align-self:center;flex:0 0 42px;width:42px;height:42px;min-height:42px;padding:9px;margin:0!important;border-radius:11px;transform:none!important;box-shadow:none;filter:none!important}
.top .nav-toggle::before,.top .nav-toggle::after{display:none!important}
.top .profile-bar{order:4;flex:0 0 100%;width:100%;margin:0!important;padding:12px 0 0!important;border-left:0;border-top:1px solid rgba(151,207,232,.17);max-height:180px;opacity:1;transition:max-height .28s ease,padding .28s ease,opacity .2s ease,border-color .28s ease;justify-content:center}
.top .server-status{order:5;max-height:120px;opacity:1;transition:max-height .28s ease,padding .28s ease,margin .28s ease,opacity .2s ease,border-color .28s ease}
.top #main-nav{order:6;flex:0 0 100%;width:100%}
.top .mobile-crystals{order:2;flex:0 0 auto;align-items:center;justify-content:center;gap:7px;padding:7px 9px;border:1px solid #9cd9f329;border-radius:10px;background:#6ba8c512;color:#d3efff;font-size:12px;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.top .mobile-crystals .profile-crystals-icon{display:flex;color:#9cd9f3}
.top .mobile-crystals svg{display:block;width:18px;height:18px}
.top .mobile-crystals .profile-crystals-value{font-weight:650}
.top.mobile-compact{row-gap:0;padding:8px 12px!important;border-radius:13px;background:rgba(6,19,32,.94);min-height:56px}
.top.mobile-compact .brand img{width:34px;height:34px}
.top.mobile-compact .brand{gap:8px}.top.mobile-compact .brand>span{display:block;min-width:0;overflow:hidden;font-size:12px;white-space:nowrap}.top.mobile-compact .brand small{display:block;font-size:clamp(5px,1.6vw,7px);letter-spacing:.09em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}
.top.mobile-compact .nav-toggle{width:38px;height:38px;min-height:38px;flex-basis:38px}
.top.mobile-compact .mobile-crystals:not([hidden]){display:inline-flex}
.top.mobile-compact:not(.menu-open) .profile-bar{max-height:0;min-height:0;padding:0!important;border-top-color:transparent;border-top-width:0;opacity:0;overflow:hidden;pointer-events:none}
.top.mobile-compact .server-status{max-height:0;min-height:0;padding:0!important;margin:0!important;border-top-color:transparent;border-top-width:0;opacity:0;overflow:hidden;pointer-events:none}
.top.mobile-compact.menu-open .profile-bar{margin-top:10px!important;padding-top:10px!important}
.top.mobile-compact.menu-open .profile-menu .profile-crystals{display:none}
.top.mobile-compact.menu-open #main-nav{padding-top:10px}
.top .profile-bar[aria-label="Профиль"]{position:relative}
}
@media(prefers-reduced-motion:reduce){.top,.top .profile-bar,.top .server-status{transition:none!important}}

/* One stable sticky slot, with a compact visual header inside it. */
.header-slot{position:sticky;top:10px;z-index:100;min-width:0;pointer-events:none;isolation:isolate}
.header-slot>.top{position:relative;top:0;pointer-events:auto;margin-bottom:0;box-sizing:border-box}
@media(min-width:681px){.header-slot>.top.is-scrolled{padding:6px 14px!important;gap:8px 12px;border-radius:12px;min-height:0}.top.is-scrolled .brand{gap:8px}.top.is-scrolled .brand img{width:30px;height:30px}.top.is-scrolled .brand>span{font-size:15px}.top.is-scrolled .brand small{font-size:7px;letter-spacing:.12em}.top.is-scrolled nav>a,.top.is-scrolled .nav-more-trigger{padding:8px 10px}.top.is-scrolled .profile-menu>summary{padding:6px 9px;gap:8px}.top.is-scrolled .profile-avatar{width:30px;height:30px;min-width:30px}.top.is-scrolled .profile-greeting{display:none}.top.is-scrolled .server-status{padding:6px 0 0;margin-top:0;font-size:10px}.top.is-scrolled .nav-toggle{width:36px;height:34px;min-height:34px;padding:7px}}
@media(max-width:680px){.header-slot{top:8px}.header-slot>.top.mobile-compact{padding:6px 10px!important;min-height:50px}.top.mobile-compact .brand img{width:30px;height:30px}.top.mobile-compact .nav-toggle{width:34px;height:34px;min-height:34px;flex-basis:34px;padding:7px}.top.mobile-compact .mobile-crystals{padding:6px 8px;gap:5px}.top.mobile-compact .mobile-crystals svg{width:16px;height:16px}}
