/* Bottom tab bar, like most phone apps: Home, My pile, a big +, Alerts, Profile. Shared by the pile and Profile. */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:25;background:rgba(27,13,58,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-top:1px solid rgba(255,255,255,.12);padding:4px 6px calc(4px + env(safe-area-inset-bottom,0px))}
.tabbar-in{max-width:560px;margin:0 auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end}
.tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;min-height:56px;padding:6px 0 4px;
  background:none;border:0;color:#b9abd9;font:700 11px/1.1 "Public Sans",system-ui,sans-serif;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.tab svg{width:24px;height:24px;flex:none}
.tab:hover{color:#fff8ec}
.tab[aria-selected="true"],.tab[aria-current="page"]{color:#ffc93c}
.tab .tab-badge{position:absolute;top:2px;left:calc(50% + 6px);min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#ff6f91;color:#3d0016;
  font:800 12px/20px "Bricolage Grotesque","Arial Black",sans-serif;text-align:center;border:2px solid #1b0d3a;font-variant-numeric:tabular-nums}
.tab .tab-av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:800 12px "Bricolage Grotesque","Arial Black",sans-serif;background:#ffc93c;color:#3a2500}
.tab[aria-current="page"] .tab-av{box-shadow:0 0 0 2px #ffc93c,0 0 0 4px #1b0d3a}
.tab-add .circle{width:56px;height:56px;margin-top:-24px;border-radius:50%;display:grid;place-items:center;background:#ffc93c;color:#3a2500;
  box-shadow:0 5px 0 #c48f00,0 10px 24px rgba(0,0,0,.4);transition:transform .12s, box-shadow .12s}
.tab-add .circle svg{width:26px;height:26px}
.tab-add:active .circle{transform:translateY(3px);box-shadow:0 2px 0 #c48f00,0 6px 14px rgba(0,0,0,.4)}
.tab-add{color:#fff8ec}
.tab:focus-visible{outline:3px solid #ffc93c;outline-offset:-3px;border-radius:12px}
@media (prefers-reduced-motion: reduce){.tab-add .circle{transition:none}}
