/* shared styles */
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }

.text-preview {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-line;
}

.fade-in { animation: fadeIn 0.15s ease-out; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.page-item.active {
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 600;
}

.brand-tab {
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  background: #f1f5f9;
  color: #475569;
  border: 1px solid transparent;
  transition: all 0.1s;
}
.brand-tab:hover { background: #e2e8f0; }
.brand-tab.active {
  background: #1d4ed8;
  color: white;
  border-color: #1d4ed8;
}

.subtab-pill {
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  background: #f1f5f9;
  color: #475569;
  border: 1px solid transparent;
}
.subtab-pill:hover { background: #e2e8f0; }
.subtab-pill.active {
  background: #fde68a;
  color: #92400e;
  border-color: #f59e0b;
}