:root{--nav-surface:#0d1218;--nav-border:#252d37;--nav-muted:#9aa4b2}
.guest-session .authenticated-nav,.guest-session [data-authenticated="true"]{display:none!important}
.guest-session .top-nav{justify-content:center}
html,body{min-height:100%;height:auto;overflow-x:hidden;overflow-y:auto}
body{padding-bottom:40px}
html.modal-open,html.modal-open body{overflow:hidden}
.topbar{position:sticky;top:0;z-index:40;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;min-height:72px;height:auto;padding:9px clamp(18px,3vw,46px);gap:20px;background:#07090df5;border-bottom:1px solid #ffffff12;box-shadow:0 14px 36px #0007;backdrop-filter:blur(20px)}
.admin-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0}.admin-metrics article{padding:16px;border:1px solid #d8ff3e2e;border-radius:16px;background:linear-gradient(145deg,#151c14,#0b0f14)}.admin-metrics span,.admin-metrics strong{display:block}.admin-metrics span{color:#9da6b2;font-size:12px;font-weight:700}.admin-metrics strong{margin-top:5px;color:var(--lime);font:800 30px/1 Manrope}
.brand{min-width:max-content}.brandmark{width:42px;height:42px;border-radius:13px;background:#0b0f13}.brandmark img{object-fit:contain;padding:3px}.brand>span:last-child{font-size:15px;letter-spacing:.2px}
.top-nav{justify-self:center;display:flex;align-items:center;gap:2px;min-width:0;padding:5px;border:1px solid var(--nav-border);border-radius:18px;background:linear-gradient(180deg,#121820,#0b1016);box-shadow:inset 0 1px #ffffff0d,0 12px 28px #0004}
.top-nav .nav-app-button{min-width:0;min-height:44px;height:44px;padding:0 11px;border:0;border-radius:13px;background:transparent;box-shadow:none;display:flex;flex-direction:row;gap:7px;color:var(--nav-muted);font-size:12px;font-weight:750;white-space:nowrap}
.top-nav .nav-app-button:hover{transform:none;background:#ffffff08;color:#fff}.top-nav .nav-app-button.active{background:#d8ff3e17;color:var(--lime);box-shadow:inset 0 0 0 1px #d8ff3e38}
.top-nav .nav-icon{width:20px;height:20px}.top-nav .nav-icon svg{width:19px;height:19px}.top-nav .nav-label{font-size:12px;line-height:1}
.top-nav .nav-profile{display:flex!important;padding-right:7px}.top-nav .nav-avatar{width:32px;height:32px;border-radius:50%;overflow:hidden}.top-nav .nav-avatar img{width:100%;height:100%;object-fit:cover}.top-nav .nav-profile .nav-label{display:none}
.head-actions{display:none!important}.top-subscribe{min-width:64px;height:48px;border-radius:16px}.top-subscribe span{min-width:42px;height:30px;font-size:11px}
.landing-professional-card{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(270px,.55fr);gap:34px;align-items:end;margin:16px 0;padding:clamp(26px,4vw,52px);border-color:#d8ff3e35;background:radial-gradient(circle at 92% 8%,#d8ff3e18,transparent 30%),#0c1116}
.landing-professional-card h2{max-width:820px;margin:16px 0 18px;font:800 clamp(38px,5.5vw,72px)/.98 Manrope;letter-spacing:-3px}.landing-professional-card p{max-width:720px;color:#9fa9b6;font-size:18px;line-height:1.55}.landing-professional-card .app-button{width:max-content;margin-top:22px}
.album-ranking-head small{display:block;margin-top:5px;color:var(--muted)}.album-ranking-head select{min-height:44px;padding:0 38px 0 14px;border:1px solid var(--line);border-radius:13px;background:#11171e;color:#fff;font-weight:750}
.admin-users-dialog{width:min(820px,calc(100vw - 32px))!important}.admin-users-dialog>p{color:var(--muted)}.admin-users-list{display:grid;gap:10px;margin-top:20px}.admin-user-card{display:flex;align-items:center;gap:18px;padding:16px;border:1px solid var(--line);border-radius:17px;background:#0b0f14}.admin-user-card>div:first-child{flex:1;min-width:0}.admin-user-card strong,.admin-user-card small,.admin-user-card span{display:block}.admin-user-card small{margin:4px 0;color:var(--muted)}.admin-user-card span{color:var(--lime);font-size:12px;font-weight:800}.admin-user-actions{display:flex;flex-wrap:wrap;gap:7px}.admin-user-actions button,.admin-api-result button{min-height:44px;padding:0 13px;border:1px solid var(--line);border-radius:11px;background:#171d25;color:#fff;font-weight:750}.admin-user-actions .danger-action{background:#ff5d5d14;color:#ff8484;border-color:#ff5d5d4a}.admin-api-result{margin-top:18px;padding:17px;border:1px solid #d8ff3e4d;border-radius:16px;background:#d8ff3e0b}.admin-api-result code{display:block;overflow-wrap:anywhere;margin:10px 0;padding:12px;border-radius:10px;background:#050708;color:var(--lime)}.admin-api-result small{display:block;margin-top:9px;color:var(--muted)}
.compact-empty{padding:34px 16px}.pwa-install-card>img,.pwa-install-sheet>img{object-fit:contain!important;padding:7px;background:#000}
@media(max-width:1160px) and (min-width:761px){.topbar{gap:10px;padding-inline:12px}.brand>span:last-child{display:none}.top-nav .nav-app-button{padding-inline:8px}.top-nav .nav-label{display:none}.top-nav .nav-profile .nav-label{display:none}.top-nav .nav-icon{width:23px;height:23px}}
@media(max-width:760px){body{padding-bottom:calc(100px + env(safe-area-inset-bottom))}.topbar{position:sticky;top:0;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;grid-template-areas:"home subscribe spacer"!important;min-height:62px;padding:calc(7px + env(safe-area-inset-top)) 12px 8px!important;background:#07090df5}.topbar:after{content:"";grid-area:spacer}.mobile-home{display:grid!important;grid-area:home;width:42px;height:42px}.top-subscribe{grid-area:subscribe;justify-self:center;height:42px;min-height:42px}.brand,.head-actions{display:none!important}.top-nav{position:fixed!important;z-index:80;left:8px!important;right:8px!important;top:auto!important;bottom:calc(8px + env(safe-area-inset-bottom))!important;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;width:auto!important;height:72px!important;padding:7px 5px!important;gap:1px!important;border-radius:22px!important;background:#0e131af5!important;box-shadow:0 20px 60px #000,0 0 0 1px #ffffff12!important;backdrop-filter:blur(20px)}.top-nav .nav-start{display:none!important}.top-nav .nav-app-button{display:flex!important;flex-direction:column!important;justify-content:center;width:100%;height:58px!important;min-height:58px!important;padding:2px!important;gap:2px!important;border-radius:15px!important;background:transparent!important;color:#8f98a6!important}.top-nav .nav-app-button.active{color:var(--lime)!important}.top-nav .nav-app-button.active .nav-icon{background:#d8ff3e!important;color:#080b08!important}.top-nav .nav-icon{width:30px!important;height:30px!important;border-radius:10px}.top-nav .nav-icon svg{width:19px!important;height:19px!important}.top-nav .nav-label,.top-nav .nav-profile .nav-label{display:block!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:8px!important;line-height:11px!important}.top-nav .nav-avatar{border-radius:10px}.landing-professional-card{grid-template-columns:1fr;gap:24px;padding:25px 20px}.landing-professional-card h2{font-size:clamp(39px,11vw,54px);letter-spacing:-2.5px}.landing-professional-card p{font-size:16px}.landing-professional-card .app-button{width:100%}.album-ranking-head{align-items:flex-end;gap:10px}.album-ranking-head small{font-size:11px}.album-ranking-head select{max-width:45%;font-size:12px}.admin-user-card{display:grid}.admin-user-actions{display:grid;grid-template-columns:1fr 1fr}.admin-user-actions button{padding:0 8px}.admin-user-actions .danger-action{grid-column:1/-1}}
@media(max-width:350px){.top-nav .nav-label,.top-nav .nav-profile .nav-label{font-size:0!important}.top-nav{height:62px!important}.top-nav .nav-app-button{height:48px!important;min-height:48px!important}}
@media(max-width:760px){.guest-session .top-nav{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:420px;margin-inline:auto}}
.guest-session .authenticated-nav,.guest-session [data-authenticated="true"]{display:none!important}
.admin-album-access{display:grid;gap:5px;min-width:min(100%,220px)}.admin-album-access span{font-size:.72rem;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.06em}.admin-album-access select{min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--white);padding:0 12px}
body.guest-session .top-nav .authenticated-nav,body.guest-session .head-actions .authenticated-nav{display:none!important}
