.mobile-bottom{display:none}
@media(max-width:767px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  body:has(.mobile-bottom) .site-footer-main{padding-bottom:20px}
  body:has(.mobile-bottom) #debug-icon:not(.fixed-top),body:has(.mobile-bottom) #debug-bar:not(.fixed-top){bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  .mobile-bottom{box-sizing:border-box;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));position:fixed;z-index:60;bottom:0;left:0;right:0;height:calc(68px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(17,31,55,.08)}
  .mobile-bottom{gap:4px;padding:6px 5px calc(6px + env(safe-area-inset-bottom,0px))}
  .mobile-bottom a{box-sizing:border-box;touch-action:manipulation;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;border:1px solid color-mix(in srgb,var(--muted) 45%,var(--surface));border-radius:8px;background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface) 92%,var(--muted)));box-shadow:0 2px 0 color-mix(in srgb,var(--muted) 35%,transparent),inset 0 1px 0 #ffffff30;color:var(--ink);font:inherit;font-size:10px;font-weight:750;text-decoration:none;transition:background .12s,box-shadow .12s,transform .12s}
  .mobile-bottom a:focus-visible{outline:2px solid var(--brand);outline-offset:-3px;border-radius:6px}
  .mobile-bottom svg{display:block;width:21px;height:21px;margin:0 auto 3px;stroke:currentColor;fill:none;stroke-width:1.8}
  .mobile-bottom .active,.mobile-bottom a:active{color:var(--brand);border-color:var(--brand);background:color-mix(in srgb,var(--brand) 18%,var(--surface));box-shadow:inset 0 2px 4px color-mix(in srgb,var(--brand) 35%,transparent),inset 0 -1px 0 #ffffff20;transform:translateY(1px)}
  .mobile-bottom .active svg{stroke-width:2.3}
}
@media(prefers-reduced-motion:reduce){.mobile-bottom a{transition:none}}
