:root{--nav-h:76px}
.bottom-nav{height:calc(var(--nav-h) + var(--safe-bottom));padding:7px 8px var(--safe-bottom);grid-template-columns:1fr 1fr 92px 1fr 1fr;align-items:center;background:linear-gradient(135deg,var(--mc-cyan-dark),var(--mc-cyan));border-top:1px solid rgba(255,255,255,.25);box-shadow:0 -5px 22px rgba(17,54,71,.2)}
.nav-item{height:62px;justify-content:center;gap:3px;padding:5px 1px;color:rgba(255,255,255,.72);font-size:9px;letter-spacing:.025em;position:relative}
.nav-item.active{color:#fff}
.nav-item.active:after{position:absolute;content:"";bottom:1px;width:28px;height:3px;background:var(--mc-green);box-shadow:0 0 8px rgba(114,212,0,.45)}
.nav-icon{width:24px;height:24px;display:grid;place-items:center;font-size:0;line-height:normal}
.nav-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.brand-bridge{align-self:center;margin:0;height:54px;width:86px;padding:9px 8px;background:#fff;border:1px solid rgba(0,127,159,.12);border-radius:17px;box-shadow:0 4px 14px rgba(15,67,88,.25);display:flex;align-items:center;justify-content:center;transform:translateY(-7px)}
.brand-bridge img{width:100%;height:auto;max-height:34px;object-fit:contain}
.page{bottom:calc(var(--nav-h) + var(--safe-bottom))}
.locate{bottom:18px}
@media(max-width:370px){.bottom-nav{grid-template-columns:1fr 1fr 80px 1fr 1fr;padding-left:3px;padding-right:3px}.brand-bridge{width:76px;padding:8px}.nav-item{font-size:8px}}