/* BestGoods catalog pass-7 — ghost cards, product grid, footer grid, missing detail primitives */

/* Ghost card (shadcn borderless) */
.ghost-card {
  background: var(--catalog-canvas);
  border: none;
  border-radius: var(--radius-md);
  padding: var(--space-4);
  margin-bottom: var(--space-3);
}
.ghost-card__title {
  font-size: var(--text-base);
  font-weight: 600;
  margin: 0 0 var(--space-4);
  color: var(--bg-text);
}
.ghost-card--form { padding: var(--space-5); }

/* Home KPI inline */
.catalog-kpi-inline {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
}
.catalog-kpi-inline__item {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
}
.catalog-kpi-inline__value {
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--catalog-kpi-fg);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.catalog-kpi-inline__label {
  font-size: var(--text-xs);
  color: var(--bg-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.catalog-kpi-inline__sep {
  color: var(--zinc-300);
  font-weight: 300;
  user-select: none;
}

/* Product card grid (L2 list) */
.catalog-card-grid {
  display: grid;
  gap: var(--space-4);
}
.catalog-card-grid--products {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.catalog-product-card {
  min-width: 0;
}
.catalog-product-card__link {
  display: flex;
  gap: var(--space-4);
  align-items: flex-start;
  padding: var(--space-4);
  background: var(--catalog-canvas);
  border: none;
  border-radius: var(--radius-md);
  text-decoration: none;
  color: inherit;
  transition: background var(--transition-fast);
  min-height: 100%;
}
.catalog-product-card__link:hover {
  background: var(--zinc-50);
}
.catalog-product-card__avatar {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: var(--catalog-accent-subtle);
  color: var(--sky-700);
  font-size: var(--text-base);
  font-weight: 700;
  line-height: 1;
}
.catalog-product-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.catalog-product-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2);
}
.catalog-product-card__title {
  margin: 0;
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--bg-text);
  line-height: 1.35;
}
.catalog-product-card__brands {
  margin: 0;
  font-size: var(--text-sm);
  color: var(--bg-text-muted);
  line-height: 1.45;
}
.catalog-product-card__brands-label {
  display: inline;
  margin-right: var(--space-1);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--bg-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.catalog-product-card__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: auto;
  padding-top: var(--space-2);
}
.catalog-product-card__hint {
  font-size: var(--text-xs);
  color: var(--bg-text-subtle);
}
.catalog-product-card__cta {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--bg-accent);
  white-space: nowrap;
}
.badge--sm {
  padding: 2px var(--space-1);
  font-size: 10px;
}

/* Footer 4-column grid */
.catalog-footer {
  border-top: 1px solid #e5e7eb;
  background: var(--catalog-canvas);
  padding: var(--space-10) var(--page-gutter) var(--space-6);
}
.catalog-footer__inner {
  max-width: var(--page-max);
  margin: 0 auto;
}
.catalog-footer__brand {
  margin-bottom: var(--space-8);
  max-width: 42ch;
}
.catalog-footer__logo {
  margin-bottom: var(--space-3);
}
.catalog-footer__tagline {
  margin: 0;
  font-size: var(--text-sm);
  color: var(--bg-text-muted);
  line-height: 1.55;
}
.catalog-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-8) var(--space-6);
  margin-bottom: var(--space-8);
}
.catalog-footer__title {
  margin: 0 0 var(--space-3);
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bg-text);
}
.catalog-footer__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.catalog-footer__links a {
  font-size: var(--text-sm);
  color: var(--bg-text-muted);
  text-decoration: none;
}
.catalog-footer__links a:hover {
  color: var(--bg-accent);
}
.catalog-footer__col--lang .lang-switcher {
  margin-bottom: var(--space-2);
}
.catalog-footer__lang-hint {
  margin: var(--space-2) 0 0;
}
.catalog-footer__bottom,
.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding-top: var(--space-6);
  border-top: 1px solid #e5e7eb;
  font-size: var(--text-xs);
  color: var(--bg-text-subtle);
}

/* Table wrap + product row + comments + action bar (detail primitives) */
.table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-md);
}
.table-wrap--sticky thead th {
  position: sticky;
  top: 0;
  z-index: 2;
}
.textarea {
  width: 100%;
  min-height: 96px;
  padding: var(--space-3);
  font-size: var(--text-sm);
  color: var(--bg-text);
  background: var(--bg-layer);
  border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md);
  resize: vertical;
}
.textarea:focus {
  border-color: var(--bg-accent);
  box-shadow: var(--focus-ring);
  outline: none;
}
.product-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--space-4);
  align-items: start;
}
.product-row__visual { flex-shrink: 0; }
.product-row__avatar {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: var(--catalog-accent-subtle);
  color: var(--sky-700);
}
.product-row__title { margin: 0 0 var(--space-1); font-size: var(--text-base); font-weight: 600; }
.product-row__meta, .product-row__price, .product-row__rationale { margin: 0; font-size: var(--text-sm); color: var(--bg-text-muted); }
.product-row__metrics { display: flex; flex-direction: column; gap: var(--space-2); align-items: flex-end; }
.product-row__chip {
  display: inline-block;
  padding: 2px var(--space-2);
  font-size: var(--text-xs);
  background: var(--zinc-100);
  border-radius: var(--radius-sm);
  color: var(--bg-text-muted);
}
.rating-bar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 120px;
}
.rating-bar__track {
  flex: 1;
  height: 6px;
  background: var(--zinc-100);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.rating-bar__fill {
  height: 100%;
  background: var(--catalog-kpi-fg);
  border-radius: var(--radius-full);
}
.rating-bar__value {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--bg-text-muted);
  font-variant-numeric: tabular-nums;
}
.comment-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.comment {
  display: flex;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--catalog-canvas);
  border-radius: var(--radius-md);
}
.comment__avatar {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background: var(--catalog-accent-subtle);
  color: var(--sky-700);
  font-weight: 700;
  font-size: var(--text-sm);
}
.comment__header {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin-bottom: var(--space-1);
}
.comment__author { font-weight: 600; font-size: var(--text-sm); }
.comment__time { font-size: var(--text-xs); color: var(--bg-text-subtle); }
.comment__body { margin: 0; font-size: var(--text-sm); line-height: 1.55; }
.action-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 180;
  background: var(--catalog-canvas);
  border-top: 1px solid #e5e7eb;
  padding-bottom: var(--safe-bottom);
}
.action-bar__inner {
  display: flex;
  max-width: var(--page-max);
  margin: 0 auto;
}
.action-bar__btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: var(--space-2);
  min-height: var(--bottom-nav-height);
  font-size: 10px;
  color: var(--bg-text-muted);
  text-decoration: none;
  background: transparent;
  border: none;
  cursor: pointer;
}
.action-bar__btn.is-active,
.action-bar__btn--primary { color: var(--sky-700); font-weight: 600; }
.sticky-submit {
  display: none;
  position: fixed;
  bottom: calc(var(--bottom-nav-height) + var(--safe-bottom));
  left: 0;
  right: 0;
  padding: var(--space-3) var(--page-gutter);
  background: var(--catalog-canvas);
  border-top: 1px solid #e5e7eb;
  z-index: 170;
}
.analysis-tier__header { margin-bottom: var(--space-4); }
.analysis-tier__title { margin: 0; font-size: var(--text-base); display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.analysis-cards { display: flex; flex-direction: column; gap: var(--space-3); }
.product-stack { display: flex; flex-direction: column; gap: var(--space-3); }
.spec-group { margin-bottom: var(--space-3); }
.spec-group__title {
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--bg-text-muted);
  margin-bottom: var(--space-2);
}
.spec-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.spec-table td { padding: var(--space-1) var(--space-2); border-bottom: 1px solid #e5e7eb; }
.spec-table td:first-child { color: var(--bg-text-muted); width: 40%; }
.cell-empty {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--bg-text-subtle);
}
.table-cards { display: none; }
.table-card {
  padding: var(--space-3);
  background: var(--catalog-canvas);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-2);
}
.table-card__row {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-1) 0;
  font-size: var(--text-sm);
  border-bottom: 1px solid #e5e7eb;
}
.table-card__label { color: var(--bg-text-muted); font-size: var(--text-xs); }

@media (max-width: 768px) {
  .catalog-card-grid--products { grid-template-columns: 1fr; }
  .catalog-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-masthead--hero .catalog-masthead__row { grid-template-columns: 1fr; }
  .catalog-kpi-inline { width: 100%; }
  .action-bar--enhanced { display: block; }
  .catalog--borderless.has-action-bar .catalog-main {
    padding-bottom: calc(var(--bottom-nav-height) + var(--space-12) + var(--safe-bottom));
  }
  .table-wrap--cardified .data-table { display: none; }
  .table-wrap--cardified .table-cards { display: block; }
  .product-row { grid-template-columns: 1fr; }
  .product-row__metrics { align-items: flex-start; }
}

@media (min-width: 769px) {
  .catalog-masthead--hero .catalog-masthead__row {
    align-items: flex-end;
  }
}

/* BestGoods catalog pass-6 — components (shadcn + AIAds v5 density, 40px controls) */

/* Buttons */
.bg-btn, .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  height: var(--control-height); padding: 0 var(--space-4);
  font-size: var(--text-sm); font-weight: 500; line-height: 1;
  border-radius: var(--radius-md); border: var(--border-width) solid transparent;
  cursor: pointer; transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
  white-space: nowrap; text-decoration: none;
}
.bg-btn:disabled, .btn:disabled { opacity: 0.5; pointer-events: none; }
.bg-btn--primary, .btn--accent {
  background: var(--bg-accent); color: var(--bg-accent-fg); border-color: var(--bg-accent);
}
.bg-btn--primary:hover, .btn--accent:hover { background: var(--bg-accent-hover); color: #fff; }
.bg-btn--secondary, .btn--secondary {
  background: var(--bg-layer-02); color: var(--bg-text); border-color: var(--bg-border);
}
.bg-btn--secondary:hover, .btn--secondary:hover { background: var(--bg-layer-02); }
.bg-btn--ghost, .btn--ghost { background: transparent; color: var(--bg-text-muted); }
.bg-btn--ghost:hover, .btn--ghost:hover { background: var(--bg-layer-02); color: var(--bg-text); }
.bg-btn--outline, .btn--outline {
  background: var(--bg-layer); color: var(--bg-text); border-color: var(--bg-border);
  
}
.bg-btn--outline:hover, .btn--outline:hover { background: var(--bg-layer-02); }
.bg-btn--danger, .btn--danger { background: var(--bg-danger); color: #fff; }
.bg-btn--success, .btn--success { background: var(--bg-success); color: #fff; }
.bg-btn--sm, .btn--sm { height: 32px; padding: 0 var(--space-3); font-size: var(--text-xs); }
.bg-btn--lg, .btn--lg { height: 40px; padding: 0 var(--space-6); }
.bg-btn--block, .btn--block { width: 100%; }

/* Inputs */
.bg-input, .input {
  width: 100%; height: var(--control-height); padding: 0 var(--space-3);
  font-size: var(--text-sm); color: var(--bg-text);
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.bg-input:focus, .input:focus { border-color: var(--bg-accent); box-shadow: var(--focus-ring); outline: none; }
.bg-input::placeholder, .input::placeholder { color: var(--bg-text-subtle); }
.bg-select, .select, select.input {
  appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2364748b'%3E%3Cpath d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; padding-right: 32px;
}

/* Form fields */
.form-field { display: flex; flex-direction: column; gap: var(--space-1); }
.form-field__label { font-size: var(--text-sm); font-weight: 500; color: var(--bg-text); }
.form-field__hint { font-size: var(--text-xs); color: var(--bg-text-muted); margin: 0; }

/* Chips / tags */
.bg-chip, .chip {
  display: inline-flex; align-items: center; gap: var(--space-1);
  padding: var(--space-1) var(--space-3); min-height: 32px;
  font-size: var(--text-sm); font-weight: 500; color: var(--bg-text-muted);
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-full); text-decoration: none; transition: all var(--transition-fast);
}
.bg-chip:hover, .chip:hover { background: var(--bg-layer-02); color: var(--bg-text); border-color: var(--bg-border-strong); }
.bg-chip.is-active, .chip.is-active {
  background: var(--bg-accent-soft); color: var(--bg-accent); border-color: var(--bg-accent-muted); font-weight: 600;
}
.chip__dot, .bg-chip__dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--bg-success);
  box-shadow: 0 0 0 2px var(--bg-success-soft);
}

/* Cards */
.bg-card, .card {
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); padding: var(--space-4);
   transition: box-shadow var(--transition-base), border-color var(--transition-base);
}
.card--interactive:hover, .bg-card--interactive:hover {
  border-color: var(--sky-100); box-shadow: none;
}
.card__title { font-size: var(--text-base); font-weight: 600; margin: 0 0 var(--space-1); color: var(--bg-text); }
.card__meta { font-size: var(--text-xs); color: var(--bg-text-muted); margin: 0; }

/* Badges */
.badge {
  display: inline-flex; align-items: center; padding: 2px var(--space-2);
  font-size: var(--text-xs); font-weight: 500; border-radius: var(--radius-full);
  background: var(--bg-layer-02); color: var(--bg-text-muted);
}
.badge--muted { background: var(--bg-layer); }
.badge--accent { background: var(--bg-accent-soft); color: var(--bg-accent); }

/* Panels */
.panel {
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); padding: var(--space-5); margin-bottom: var(--space-4);
}
.panel__title { font-size: var(--text-base); font-weight: 600; margin: 0 0 var(--space-4); color: var(--bg-text); }

/* Tables — ant design density */
.bg-table, .data-table {
  width: 100%; border-collapse: collapse; font-size: var(--text-sm);
}
.bg-table th, .data-table th {
  text-align: left; padding: var(--space-px-12) var(--space-px-16);
  font-weight: 600; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--bg-text-muted); background: var(--bg-layer-02);
  border-bottom: var(--border-width) solid var(--bg-border);
}
.bg-table td, .data-table td {
  padding: var(--space-px-12) var(--space-px-16); border-bottom: var(--border-width) solid var(--bg-border);
  vertical-align: middle;
  line-height: 1.5;
}
.bg-table tr:hover td, .data-table tr:hover td { background: var(--bg-bg); }

/* Stats / metrics */
.bg-stat, .compact-stat { display: flex; flex-direction: column; gap: 2px; }
.compact-stat__value, .bg-stat__value { font-size: var(--text-xl); font-weight: 700; color: var(--catalog-kpi-fg); font-variant-numeric: tabular-nums; }
.compact-stat__label, .bg-stat__label { font-size: var(--text-xs); color: var(--bg-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.compact-stats-bar, .bg-stats-bar {
  display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap;
  padding: var(--space-3) var(--space-4); background: var(--bg-layer);
  border: var(--border-width) solid var(--bg-border); border-radius: var(--radius-md);
}
.compact-stat__sep { color: var(--bg-text-subtle); }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--space-4); margin-bottom: var(--space-6); }
.stat-card, .metric-card {
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); padding: var(--space-4);
}
.stat-card__label, .metric-card__label { font-size: var(--text-xs); color: var(--bg-text-muted); margin-bottom: var(--space-1); }
.stat-card__value, .metric-card__value { font-size: var(--text-2xl); font-weight: 700; color: var(--bg-text); }
.stat-card--accent { border-color: var(--bg-accent-muted); background: var(--bg-accent-soft); }
.stat-card--success { border-color: var(--bg-success-soft); }
.stat-card--danger { border-color: var(--bg-danger-soft); }

/* Alerts */
.alert { padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); font-size: var(--text-sm); margin-bottom: var(--space-4); }
.alert--danger { background: var(--bg-danger-soft); color: var(--bg-danger); border: 2px solid color-mix(in srgb, var(--bg-danger) 25%, transparent); }

/* Pagination */
.pagination { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-6); flex-wrap: wrap; }
.pagination__info { font-size: var(--text-sm); color: var(--bg-text-muted); }
.pagination__nav { display: flex; gap: var(--space-1); }
.pagination__btn {
  min-width: 36px; height: var(--control-height); display: inline-flex; align-items: center; justify-content: center;
  border: var(--border-width) solid var(--bg-border); border-radius: var(--radius-md); background: var(--bg-layer);
  font-size: var(--text-sm); cursor: pointer; color: var(--bg-text);
}
.pagination__btn.is-active { background: var(--bg-accent); color: #fff; border-color: var(--bg-accent); }
.pagination__btn.is-disabled { opacity: 0.4; pointer-events: none; }

/* Tabs */
.tabs { display: flex; gap: var(--space-1); border-bottom: var(--border-width) solid var(--bg-border); margin-bottom: var(--space-4); overflow-x: auto; }
.tab {
  padding: var(--space-2) var(--space-4); font-size: var(--text-sm); font-weight: 500;
  color: var(--bg-text-muted); background: none; border: none; border-bottom: 2px solid transparent;
  cursor: pointer; margin-bottom: -1px; white-space: nowrap;
}
.tab.is-active { color: var(--bg-accent); border-bottom-color: var(--bg-accent); }

/* Toast */
.toast-stack { position: fixed; bottom: calc(var(--bottom-nav-height) + var(--space-4)); right: var(--space-4); z-index: 9999; display: flex; flex-direction: column; gap: var(--space-2); pointer-events: none; }
.toast { pointer-events: auto; display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); background: var(--bg-gray-900); color: #fff; border-radius: var(--radius-md); box-shadow: var(--shadow-lg); opacity: 0; transform: translateY(8px); transition: all var(--transition-base); }
.toast.is-visible { opacity: 1; transform: translateY(0); }

/* Lang switcher */
.lang-switcher { display: inline-flex; gap: 2px; padding: 2px; background: var(--bg-layer-02); border-radius: var(--radius-md); border: var(--border-width) solid var(--bg-border); }
.lang-switcher__btn {
  padding: var(--space-1) var(--space-2); font-size: var(--text-xs); font-weight: 600;
  border: none; background: transparent; border-radius: var(--radius-sm); cursor: pointer; color: var(--bg-text-muted);
  text-decoration: none;
}
.lang-switcher__btn.is-active { background: var(--bg-layer); color: var(--bg-text);  }

/* Search box */
.search-box, .search-box--header {
  position: relative; display: flex; align-items: center; flex: 1; max-width: 420px;
}
.search-box input, #search-input {
  width: 100%; height: var(--control-height); padding: 0 var(--space-3) 0 36px;
  font-size: var(--text-sm); background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); color: var(--bg-text); 
}
.search-box input::placeholder { color: var(--bg-text-subtle); }
.search-box input:focus { border-color: var(--bg-accent); outline: none; box-shadow: var(--focus-ring); }
.search-box__icon { position: absolute; left: var(--space-3); color: var(--bg-text-muted); font-size: var(--text-sm); pointer-events: none; }

/* Utility text */
.text-sm { font-size: var(--text-sm); }
.text-xs { font-size: var(--text-xs); }
.text-muted { color: var(--bg-text-muted); }
.text-success { color: var(--bg-success); }
.text-danger { color: var(--bg-danger); }
.font-medium { font-weight: 500; }
.mb-2 { margin-bottom: var(--space-2); }
.mb-4 { margin-bottom: var(--space-4); }
.mt-2 { margin-top: var(--space-2); }
.mt-4 { margin-top: var(--space-4); }
.display-title { font-size: var(--text-2xl); font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; }

/* Breadcrumb */
.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1); font-size: var(--text-sm); color: var(--bg-text-muted); margin-bottom: var(--space-4); }
.breadcrumb a { color: var(--bg-text-muted); }
.breadcrumb a:hover { color: var(--bg-accent); }
.breadcrumb__sep { opacity: 0.5; }
.breadcrumb__current { color: var(--bg-text); font-weight: 500; }

/* Progress bar */
.progress-bar { height: 6px; background: var(--bg-layer-02); border-radius: var(--radius-full); overflow: hidden; margin-top: var(--space-2); }
.progress-bar__fill { height: 100%; background: var(--bg-accent); border-radius: var(--radius-full); transition: width var(--transition-base); }

/* Timeline / pipeline */
.pipeline-stepper { display: flex; gap: var(--space-2); margin-bottom: var(--space-6); overflow-x: auto; }
.pipeline-step { flex: 1; min-width: 100px; text-align: center; }
.pipeline-step__dot {
  width: 32px; height: 32px; margin: 0 auto var(--space-2);
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; font-size: var(--text-sm); font-weight: 600;
  background: var(--bg-layer-02); color: var(--bg-text-muted); border: var(--border-width) solid var(--bg-border);
}
.pipeline-step.is-active .pipeline-step__dot { background: var(--bg-accent-soft); color: var(--bg-accent); border-color: var(--bg-accent); }
.pipeline-step.is-done .pipeline-step__dot { background: var(--bg-success); color: #fff; border-color: var(--bg-success); }
.pipeline-step__label { font-size: var(--text-xs); color: var(--bg-text-muted); }

/* Health banner */
.health-banner {
  display: flex; align-items: flex-start; gap: var(--space-4); padding: var(--space-4);
  border-radius: var(--radius-md); margin-bottom: var(--space-4); border: var(--border-width) solid var(--bg-border);
}
.health-banner--ok { background: var(--bg-success-soft); border-color: color-mix(in srgb, var(--bg-success) 30%, transparent); }

/* Chart */
.bar-chart { display: flex; align-items: flex-end; gap: var(--space-1); height: 120px; padding: var(--space-2) 0; }
.chart-scroll { overflow-x: auto; }

/* FAB */
.fab {
  position: fixed; bottom: calc(var(--bottom-nav-height) + var(--space-4)); right: var(--space-4);
  width: 56px; height: 56px; border-radius: 50%; background: var(--bg-accent); color: #fff;
  border: none; box-shadow: var(--shadow-lg); cursor: pointer; z-index: 100; display: none;
}
.fab-menu { display: none; }

/* Empty state */
.empty-state { text-align: center; padding: var(--space-10) var(--space-4); }
.empty-state__title { font-size: var(--text-lg); font-weight: 600; margin: 0 0 var(--space-2); }
.empty-state__desc { color: var(--bg-text-muted); margin: 0 0 var(--space-6); }

/* Card grid */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--space-4); }
.card-grid[data-view="list"] { grid-template-columns: 1fr; }

/* List rows */
.list-rows { display: flex; flex-direction: column; gap: var(--space-3); }
.form-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-2) 0; border-bottom: var(--border-width) solid var(--bg-border); }

/* Section */
.section { margin-bottom: var(--space-8); }
.section__title { font-size: var(--text-lg); font-weight: 600; margin: 0; }
.section__desc { font-size: var(--text-sm); color: var(--bg-text-muted); margin: var(--space-1) 0 0; }
.section__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); }
.view-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); flex-wrap: wrap; }
.filter-panel { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: flex-end; }
.filter-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); flex-wrap: wrap; }
.filter-bar__meta { font-size: var(--text-sm); color: var(--bg-text-muted); }
.filter-bar__actions { display: flex; gap: var(--space-2); }

/* Task sections (admin) */
.task-section { margin-bottom: var(--space-8); }
.task-section__header { display: flex; gap: var(--space-4); margin-bottom: var(--space-4); }
.task-section__icon {
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  background: var(--bg-accent-soft); color: var(--bg-accent); border-radius: var(--radius-md); flex-shrink: 0;
}
.task-section__title { font-size: var(--text-base); font-weight: 600; margin: 0; }
.task-section__desc { font-size: var(--text-sm); color: var(--bg-text-muted); margin: var(--space-1) 0 0; }
.bulk-bar {
  display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap;
  padding: var(--space-3) var(--space-4); background: var(--bg-accent-soft);
  border: 2px solid var(--bg-accent-muted); border-radius: var(--radius-md); margin-bottom: var(--space-4);
}
.toolbar { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-4); }

/* Density toggle */
.density-toggle { display: inline-flex; border: var(--border-width) solid var(--bg-border); border-radius: var(--radius-md); overflow: hidden; }
.density-toggle__btn {
  padding: var(--space-1) var(--space-3); font-size: var(--text-xs); border: none; background: var(--bg-layer); cursor: pointer; color: var(--bg-text-muted);
}
.density-toggle__btn.is-active { background: var(--bg-accent-soft); color: var(--bg-accent); font-weight: 600; }

/* Poll indicator */
.poll-indicator { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--text-xs); color: var(--bg-text-muted); }
.poll-indicator__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--bg-success); animation: v2-pulse 2s infinite; }
@keyframes v2-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }

/* Kbd hint */
.kbd-hint { font-size: var(--text-xs); color: var(--bg-text-subtle); }
.kbd-hint kbd { padding: 2px 6px; background: var(--bg-layer-02); border: var(--border-width) solid var(--bg-border); border-radius: var(--radius-sm); font-family: var(--font-mono); font-size: 10px; }

/* Timeline items */
.timeline { display: flex; flex-direction: column; gap: var(--space-3); }
.timeline-item { display: flex; gap: var(--space-3); padding-left: var(--space-2); border-left: 2px solid var(--bg-border); }
.timeline-item--ok { border-left-color: var(--bg-success); }
.timeline-item--fail { border-left-color: var(--bg-danger); }
.timeline-item__time { font-size: var(--text-xs); color: var(--bg-text-subtle); min-width: 140px; }
.timeline-item__body { font-size: var(--text-sm); }

/* List */
.list-item { display: flex; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: var(--border-width) solid var(--bg-border); }
.list-item__title { font-weight: 500; font-size: var(--text-sm); }
.list-item__meta { font-size: var(--text-xs); color: var(--bg-text-muted); }
.tag { display: inline-flex; padding: 2px var(--space-2); font-size: var(--text-xs); border-radius: var(--radius-sm); }
.tag--danger { background: var(--bg-danger-soft); color: var(--bg-danger); }

/* Matrix table (detail) */
.matrix-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.matrix-table th, .matrix-table td { padding: var(--space-2) var(--space-3); border: var(--border-width) solid var(--bg-border); }
.matrix-table th { background: var(--bg-layer-02); font-weight: 600; font-size: var(--text-xs); }

/* Detail sections */
.detail-section { margin-bottom: var(--space-8); scroll-margin-top: calc(var(--topbar-height) + var(--space-4)); }
.detail-section__title { font-size: var(--text-lg); font-weight: 600; margin: 0 0 var(--space-2); }
.detail-page-header { margin-bottom: var(--space-6); }
.detail-page-header__title { margin: 0 0 var(--space-2); }
.detail-page-header__meta { color: var(--bg-text-muted); font-size: var(--text-sm); margin: 0; }
.detail-meta { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-4); }
.detail-meta__item { display: flex; flex-direction: column; gap: 2px; }
.detail-meta__label { font-size: var(--text-xs); color: var(--bg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.detail-meta__value { font-size: var(--text-sm); font-weight: 500; }
.detail-section-nav { display: flex; gap: var(--space-2); margin-bottom: var(--space-6); flex-wrap: wrap; }
.detail-section-nav a {
  padding: var(--space-2) var(--space-3); font-size: var(--text-sm); font-weight: 500;
  color: var(--bg-text-muted); background: var(--bg-layer-02); border-radius: var(--radius-md); text-decoration: none;
}
.detail-section-nav a:hover, .detail-section-nav a.is-active { background: var(--bg-accent-soft); color: var(--bg-accent); }

/* Comment / vote */
.comment-form { display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-6); }
.vote-bar { display: flex; gap: var(--space-2); margin-bottom: var(--space-4); }

/* Error page */
.error-page { text-align: center; padding: var(--space-12) var(--space-4); max-width: 520px; margin: 0 auto; }
.error-page__title { margin: var(--space-4) 0; }
.error-page__message { color: var(--bg-text-muted); margin-bottom: var(--space-6); }
.error-page__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; margin-bottom: var(--space-8); }
.error-page__code-num { font-size: var(--text-sm); font-weight: 600; color: var(--bg-accent); text-transform: uppercase; letter-spacing: 0.08em; }

/* Admin login */
.admin-login-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--bg-bg); padding: var(--space-4); }
.admin-login { width: 100%; max-width: 400px; }
.admin-login__card {
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); padding: var(--space-8); box-shadow: none;
}
.admin-login__eyebrow { font-size: var(--text-xs); font-weight: 600; color: var(--bg-accent); text-transform: uppercase; letter-spacing: 0.08em; }
.admin-login__title { font-size: var(--text-2xl); font-weight: 700; margin: var(--space-2) 0; }
.admin-login__subtitle { color: var(--bg-text-muted); font-size: var(--text-sm); margin: 0 0 var(--space-6); }
.admin-login__form { display: flex; flex-direction: column; gap: var(--space-4); }
.admin-login__footer { margin-top: var(--space-6); text-align: center; }
.admin-login__lang { margin-top: var(--space-4); text-align: center; }

/* Masthead pass-6 — flat row: copy + KPI / actions / foot */
.catalog-masthead,
.catalog-page-header,
.page-header {
  margin-bottom: var(--section-gap);
  padding: var(--space-px-32) 0;
  background: var(--catalog-canvas);
  border-bottom: var(--border-width) solid var(--catalog-border-default);
  border-radius: 0;
  box-shadow: none;
}
.catalog-masthead__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-px-8);
  min-width: 0;
  margin-bottom: var(--space-px-16);
}
.catalog-masthead__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-px-32);
  align-items: center;
}
.catalog-masthead__copy {
  min-width: 0;
}
.catalog-masthead__kpi {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  min-width: 0;
}
/* Legacy aliases (pass5 class names) */
.catalog-masthead__shell { display: flex; flex-direction: column; gap: var(--space-px-16); }
.catalog-masthead__meta-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-px-8); margin-bottom: var(--space-px-16); }
.catalog-masthead__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-px-32); align-items: center; }
.catalog-masthead__primary,
.catalog-masthead__copy { min-width: 0; }
.catalog-masthead__secondary,
.catalog-masthead__aside,
.catalog-masthead__kpi { flex: 0 0 auto; display: flex; align-items: center; min-width: 0; }
.catalog-masthead__title,
.page-header__title {
  font-size: var(--text-display);
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.03em;
  line-height: 1.15;
  white-space: normal;
  text-wrap: balance;
  color: var(--catalog-fg-default);
}
.catalog-masthead__lead,
.page-header__subtitle {
  color: var(--bg-text-muted);
  font-size: var(--text-lg);
  margin: var(--space-px-12) 0 0;
  max-width: 58ch;
  line-height: 1.55;
  white-space: normal;
  text-wrap: balance;
}
.catalog-masthead__eyebrow,
.page-header__eyebrow,
.page-header__eyebrow.section-eyebrow {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--catalog-trust-fg);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 var(--space-px-8);
}
.catalog-masthead__actions,
.page-header__actions,
.catalog-page-header__actions {
  display: flex;
  align-items: center;
  gap: var(--space-px-8);
  flex-wrap: wrap;
  justify-content: flex-end;
}
.catalog-masthead__actions,
.catalog-masthead__cta-row,
.catalog-masthead__cta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-px-12);
  align-items: center;
  margin-top: var(--space-px-24);
  padding-top: var(--space-px-24);
  border-top: var(--border-width) solid var(--catalog-border-muted);
}
.catalog-masthead--home .catalog-masthead__actions,
.catalog-masthead--home .catalog-masthead__cta-row {
  margin-top: var(--space-px-24);
}
.btn--masthead {
  height: var(--control-height);
  padding: 0 var(--space-px-24);
  font-size: var(--text-sm);
  font-weight: 600;
  border-radius: var(--radius-md);
}
.btn--masthead.btn--accent {
  background: var(--bg-accent);
  color: #fff;
  border-color: var(--bg-accent);
}
.btn--masthead.btn--outline {
  background: var(--catalog-canvas);
  color: var(--bg-accent);
  border-color: var(--catalog-border-default);
}
.btn--masthead.btn--outline:hover {
  background: var(--catalog-accent-subtle);
  border-color: var(--accent-100);
}
.catalog-masthead__back,
.page-header__back {
  display: inline-flex;
  align-items: center;
  gap: var(--space-px-8);
  font-size: var(--text-sm);
  color: var(--bg-text-muted);
  text-decoration: none;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0;
  min-height: var(--touch-min);
  white-space: normal;
}
.catalog-masthead__back:hover,
.page-header__back:hover { color: var(--bg-accent); }
.catalog-masthead__foot,
.catalog-masthead__footer-row,
.catalog-masthead__footer {
  padding-top: var(--space-px-24);
  margin-top: var(--space-px-24);
  border-top: var(--border-width) solid var(--catalog-border-muted);
}
.catalog-masthead--home,
.catalog-masthead--hero {
  padding-bottom: var(--space-px-16);
  background: transparent;
  border-bottom: none;
}
.catalog-masthead--home .catalog-kpi-strip,
.catalog-kpi-strip--masthead,
.catalog-masthead--hero .catalog-kpi-inline {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  gap: var(--space-px-24);
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
}
.catalog-masthead--home .compact-stat,
.catalog-kpi-strip--masthead .compact-stat {
  text-align: right;
  padding: 0;
  min-width: 72px;
}
.catalog-masthead--home .compact-stat__value,
.catalog-kpi-strip--masthead .compact-stat__value {
  color: var(--data-500);
  font-size: var(--text-3xl);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.catalog-masthead--home .compact-stat__label,
.catalog-kpi-strip--masthead .compact-stat__label {
  margin-top: var(--space-px-4);
}
.catalog-masthead--detail .breadcrumb {
  margin-bottom: 0;
}
.catalog-masthead--detail .detail-meta {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
  width: 100%;
}
.share-bar--masthead {
  display: flex;
  flex-direction: column;
  gap: var(--space-px-8);
  align-items: stretch;
}
.share-bar--masthead .btn--masthead { justify-content: center; width: 100%; }
.catalog-masthead--login {
  text-align: center;
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 0 0 var(--space-px-24);
  margin-bottom: 0;
}
.catalog-masthead--error {
  text-align: center;
  border-bottom: none;
  background: var(--catalog-canvas);
  padding: var(--space-px-40);
  border: var(--border-width) solid color-mix(in srgb, var(--catalog-r500) 18%, var(--catalog-border-default));
  border-radius: var(--radius-lg);
}
.catalog-masthead--toolbar,
.catalog-page-header--split {
  padding: var(--space-px-32) 0;
  background: var(--catalog-canvas);
  border-bottom: var(--border-width) solid var(--catalog-border-default);
}
.catalog-masthead--toolbar .catalog-masthead__title {
  font-size: clamp(var(--text-xl), 2.4vw, var(--text-2xl));
}

@media (max-width: 639px) {
  .catalog-masthead__row,
  .catalog-masthead__grid {
    grid-template-columns: 1fr;
    gap: var(--space-px-24);
  }
  .catalog-masthead--home .catalog-kpi-strip,
  .catalog-kpi-strip--masthead {
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
  }
  .catalog-masthead--home .compact-stat,
  .catalog-kpi-strip--masthead .compact-stat {
    text-align: left;
  }
  .catalog-masthead__actions,
  .page-header__actions {
    justify-content: flex-start;
    width: 100%;
  }
  .catalog-masthead__secondary {
    width: 100%;
  }
  .share-bar--masthead {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .share-bar--masthead .btn--masthead { width: auto; flex: 1 1 auto; }
}

/* Skip link */
.skip-link {
  position: absolute; top: -100%; left: var(--space-4); z-index: 10000;
  padding: var(--space-2) var(--space-4); background: var(--bg-accent); color: #fff;
  border-radius: var(--radius-md); font-weight: 600;
}
.skip-link:focus { top: var(--space-4); }

/* PTR indicator */
.ptr-indicator {
  position: fixed; top: 0; left: 50%; transform: translateX(-50%) translateY(-100%);
  padding: var(--space-2) var(--space-4); background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg); font-size: var(--text-xs); z-index: 200;
  transition: transform var(--transition-base);
}
.ptr-indicator.is-visible { transform: translateX(-50%) translateY(0); }

/* Product card footer */
.product-card__footer { display: flex; align-items: center; justify-content: space-between; margin-top: var(--space-3); }
.product-card__cta { font-size: var(--text-xs); color: var(--bg-accent); font-weight: 500; }

/* Rate display */
.rate-display { display: flex; align-items: baseline; gap: var(--space-1); }
.rate-display__value { font-size: var(--text-2xl); font-weight: 700; }
.rate-display__unit { font-size: var(--text-xs); color: var(--bg-text-muted); }

/* Period compare */
.period-compare { margin-left: auto; font-size: var(--text-xs); color: var(--bg-text-muted); }
.period-compare__delta--up { color: var(--bg-success); }
.period-compare__delta--down { color: var(--bg-danger); }

/* Truncate */
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Chip rows */
.chip-row { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-4); }
.chip-row--l1-wrap { flex-wrap: wrap; }
.chip-row--grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--space-2); }
.chip-row--scroll { flex-wrap: nowrap; overflow-x: auto; padding-bottom: var(--space-1); }

/* Filter drawer */
.filter-overlay {
  position: fixed; inset: 0; background: rgba(2,6,23,0.5); z-index: 300; opacity: 0; pointer-events: none; transition: opacity var(--transition-base);
}
.filter-overlay.is-open { opacity: 1; pointer-events: auto; }
.filter-drawer {
  position: fixed; bottom: 0; left: 0; right: 0; max-height: 85vh; overflow-y: auto;
  background: var(--bg-layer); border-radius: var(--radius-md) var(--radius-xl) 0 0;
  padding: var(--space-4) var(--space-4) calc(var(--space-4) + var(--safe-bottom));
  z-index: 301; transform: translateY(100%); transition: transform var(--transition-base);
}
.filter-drawer.is-open { transform: translateY(0); }
.filter-drawer__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-4); }
.bottom-sheet__handle { width: 40px; height: 4px; background: var(--bg-border); border-radius: var(--radius-full); margin: 0 auto var(--space-4); }
.bottom-sheet__footer { margin-top: var(--space-4); padding-top: var(--space-4); border-top: var(--border-width) solid var(--bg-border); }

/* Swipe card (mobile) */
.swipe-card { position: relative; }

/* Home hints */
.home-empty-hint { padding: var(--space-4); }
.l1-wrap-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.05em; color: var(--bg-text-muted); }

/* Analysis cards */
.analysis-card:not(.ghost-card) {
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border);
  border-radius: var(--radius-md); padding: var(--space-4); margin-bottom: var(--space-4);
}
.analysis-stack { display: flex; flex-direction: column; gap: var(--space-4); }

/* Fuzzy badge */
.fuzzy-badge { font-size: var(--text-xs); padding: 2px var(--space-2); background: var(--bg-warning-soft); color: var(--bg-warning); border-radius: var(--radius-sm); }

/* Evidence expand */
.evidence-block { font-size: var(--text-sm); color: var(--bg-text-muted); }

/* Star rating */
.star-rating { display: inline-flex; gap: 2px; color: var(--bg-warning); }

/* Section eyebrow */
.section-eyebrow { font-size: var(--text-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--catalog-trust-fg); }

/* Tab panels hidden by default handled in JS */
[data-tab-panel] { display: none; }
[data-tab-panel].is-active { display: block; }

/* Admin grid */
.admin-grid { display: grid; gap: var(--space-4); }
.admin-form--mobile { display: flex; flex-direction: column; gap: var(--space-4); }

/* Input variants */
.input--inline { width: auto; }
.input--mobile { min-height: var(--touch-min); }

/* List divided */
.list--divided > * + * { border-top: var(--border-width) solid var(--bg-border); }

/* Metric card spark */
.metric-card__trend { font-size: var(--text-xs); color: var(--bg-text-muted); margin-top: var(--space-1); }

/* Home compact top */
.home-compact-top { margin-bottom: var(--space-4); }
.section--flush { padding: 0; }

/* Filter select wrapper */
.filter-select { display: flex; flex-direction: column; gap: var(--space-1); }
.filter-select__label { font-size: var(--text-xs); color: var(--bg-text-muted); }

/* Nav overlay for mobile */
.nav-overlay {
  position: fixed; inset: 0; background: rgba(2,6,23,0.6); z-index: 250;
  opacity: 0; pointer-events: none; transition: opacity var(--transition-base);
}
.nav-overlay.is-open { opacity: 1; pointer-events: auto; }

/* Confirm dialog */
.confirm-dialog {
  position: fixed; inset: 0; z-index: 500; display: flex; align-items: center; justify-content: center; padding: var(--space-4);
  background: rgba(2,6,23,0.5); opacity: 0; pointer-events: none; transition: opacity var(--transition-base);
}
.confirm-dialog.is-open { opacity: 1; pointer-events: auto; }
.confirm-dialog__panel {
  background: var(--bg-layer); border-radius: var(--radius-md); padding: var(--space-6);
  max-width: 400px; width: 100%; box-shadow: var(--shadow-lg);
}

/* Command palette */
.command-palette {
  position: fixed; inset: 0; z-index: 400; display: flex; align-items: flex-start; justify-content: center;
  padding-top: 15vh; background: rgba(2,6,23,0.5); opacity: 0; pointer-events: none;
}
.command-palette.is-open { opacity: 1; pointer-events: auto; }
.command-palette__panel {
  width: min(560px, 92vw); background: var(--bg-layer); border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg); overflow: hidden;
}
.command-palette__input { width: 100%; height: 48px; padding: 0 var(--space-4); border: none; border-bottom: var(--border-width) solid var(--bg-border); font-size: var(--text-base); }
.command-palette__results { max-height: 320px; overflow-y: auto; }
.command-palette__item { display: block; padding: var(--space-3) var(--space-4); font-size: var(--text-sm); color: var(--bg-text); text-decoration: none; border-bottom: var(--border-width) solid var(--bg-border); }
.command-palette__item:hover, .command-palette__item.is-highlighted { background: var(--bg-accent-soft); }

/* Typeahead results */
.typeahead-results {
  position: absolute; top: 100%; left: 0; right: 0; margin-top: var(--space-1);
  background: var(--bg-layer); border: var(--border-width) solid var(--bg-border); border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg); max-height: 280px; overflow-y: auto; z-index: 50; display: none;
}
.typeahead-results.is-open { display: block; }
.typeahead-results__item { display: block; padding: var(--space-2) var(--space-3); font-size: var(--text-sm); color: var(--bg-text); text-decoration: none; }
.typeahead-results__item:hover, .typeahead-results__item.is-highlighted { background: var(--bg-accent-soft); }

/* Back gesture zone */
.back-gesture-zone { position: fixed; left: 0; top: 0; bottom: 0; width: 24px; z-index: 1; }

/* Action bar body class */
.has-action-bar { padding-bottom: var(--space-4); }

/* Sticky summary removed in v2 */
.sticky-summary { display: none !important; }

/* Hide deprecated hero/featured */
.hero, .hero--brand, .featured-grid, .section--featured, [data-recent-strip], .section--browse-hub { display: none !important; }

/* Lozenge / wiki-cat-badge — active eval indicator */
.lozenge, .wiki-cat-badge {
  display: inline-block;
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  font-weight: 500;
  line-height: 1.4;
  background: var(--catalog-g50);
  color: var(--catalog-g500);
}
.lozenge--success { background: var(--catalog-g50); color: var(--catalog-g500); }
.lozenge--info { background: var(--catalog-accent-subtle); color: var(--accent-600); }
.lozenge--warning { background: var(--catalog-y50); color: var(--catalog-y500); }

/* Filter label-on-top (Round 29) */
.form-field--filter { gap: var(--space-2); }
.form-field__label--filter {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--bg-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

