
/* okbin bottom nav (mobile) — shared */
:root{--bnav-h:calc(64px + env(safe-area-inset-bottom,0px))}
.bnav{position:fixed;bottom:0;left:0;right:0;z-index:85;height:var(--bnav-h);padding-bottom:env(safe-area-inset-bottom,0px);
  background:color-mix(in srgb,var(--bg,#fff) 90%,transparent);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);
  border-top:1px solid var(--line,#e5e7eb);display:grid;grid-template-columns:repeat(5,1fr);transform:translateZ(0);will-change:transform;backface-visibility:hidden;direction:rtl}
@media(min-width:861px){.bnav{display:none}}
@media(max-width:860px){body{padding-bottom:var(--bnav-h)}}
.bnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--dim,#6b7280);font-size:10px;font-weight:700;transition:color .18s;position:relative;text-decoration:none}
.bnav a svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9}
.bnav a.on{color:var(--accent,#10b981)}
.bnav a.on::before{content:"";position:absolute;top:0;width:26px;height:3px;border-radius:0 0 6px 6px;background:var(--accent,#10b981)}
.bnav .buy{transform:translateY(-14px)}
.bnav .buy i{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:var(--grad-cta,linear-gradient(135deg,#10b981,#059669));color:var(--grad-ink,#fff);box-shadow:var(--glow,0 8px 24px rgba(16,185,129,.35));font-style:normal}
.bnav .buy i svg{stroke:var(--grad-ink,#fff);width:24px;height:24px}
.bnav .buy span{font-size:10px;color:var(--accent-h,#059669)}
