/* ============================================================
   10-tabbar.css  底部5个tab导航
   图标：images/tab_kj.png / tab_sw.png / tab_home.png / tab_fx.png / tab_kf.png
   ============================================================ */
.tabbar {
  position: fixed; left:0; right:0; bottom:0; z-index: 100;
  background: linear-gradient(180deg, rgba(18,44,52,.85), rgba(10,26,32,.95));
  border-top: 1px solid rgba(60,190,170,.3);
  backdrop-filter: blur(12px);
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  display:flex; justify-content: space-around;
}
.tab {
  flex:1; display:flex; flex-direction:column; align-items:center; gap:3px;
  color:#8fb8b1; font-size:12px; cursor:pointer; padding: 4px 0;
}
.tab .ico {
  width: 40px; height: 40px; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #3a5a66, #1c3038);
  border: 1px solid rgba(120,200,190,.25);
  display:flex; align-items:center; justify-content:center; font-size:20px;
  transition: all .2s;
}
.tab.active { color:#22d3b8; font-weight:700; }
.tab.active .ico {
  background: radial-gradient(circle at 30% 30%, #5eead4, #0f766e);
  border-color: #5eead4;
  box-shadow: 0 0 12px rgba(34,211,184,.5);
}