.screen {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 16px 100px 16px;
  overflow-y: auto;
}

.tabbar {
  position: fixed;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 358px;
  height: 64px;
  padding: 0 10px;
  background: rgba(22, 22, 22, 0.95);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: space-between;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 50;
}

.tabbar .tab {
  flex: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: var(--text-muted);
  font-size: 10px;
}
.tabbar .tab svg { width: 22px; height: 22px; }
.tabbar .tab.active { color: var(--accent); }

.tabbar .tab.shop .shop-circle {
  width: 46px;
  height: 46px;
  border-radius: var(--radius-full);
  background: var(--accent);
  color: var(--on-accent);
  display: flex;
  align-items: center;
  justify-content: center;
}
.tabbar .tab.shop .shop-circle svg { color: var(--on-accent); }
.tabbar .tab.shop .label { color: var(--accent); }