.nav{position:fixed;z-index:100;left:50%;bottom:calc(var(--safe-b) + 12px);transform:translateX(-50%);width:min(440px,calc(100vw - 24px));height:var(--nav-h);display:flex;align-items:center;justify-content:space-around;padding:0 6px;border-radius:26px;background:var(--glass);border:1px solid var(--glass-line);-webkit-backdrop-filter:blur(24px) saturate(1.4);backdrop-filter:blur(24px) saturate(1.4);box-shadow:0 18px 40px rgba(0,0,0,.45);view-transition-name:sd-nav}
.nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--text2);font-size:11.5px;font-weight:600;padding:6px 0;transition:color .25s}
.nav-ic{position:relative;display:grid;place-items:center;width:52px;height:30px;border-radius:15px;transition:background .35s var(--ease),transform .25s var(--ease)}
.nav a:active .nav-ic{transform:scale(.9)}
.nav a.on{color:#fff}
.nav a.on .nav-ic{background:var(--accent)}
.nav .ic{width:21px;height:21px}
@media (min-width:900px){.nav{width:480px}}