/* Dealysis — minimal, fast, readable */
:root {
  --bg: #0f1115;
  --surface: #181c24;
  --surface-alt: #20252f;
  --border: #2a303c;
  --text: #e7eaf0;
  --muted: #8a93a4;
  --accent: #5aa9ff;
  --good: #4cd97b;
  --warn: #f7b955;
  --bad: #ef6464;
  --score-hi: #4cd97b;
  --score-mid: #f7b955;
  --score-lo: #8a93a4;
  --shadow: 0 6px 20px rgba(0,0,0,0.4);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.4;
}

header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}

.brand {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

h1 {
  margin: 0;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.5px;
}

.tagline {
  color: var(--muted);
  font-size: 13px;
}

.actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

button {
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 6px;
  font-weight: 500;
  cursor: pointer;
  font-size: 14px;
  transition: filter 0.1s;
}
button:hover { filter: brightness(1.1); }
button:disabled { opacity: 0.6; cursor: not-allowed; }

.muted { color: var(--muted); font-size: 13px; }

.stats {
  display: flex;
  gap: 24px;
  padding: 12px 24px;
  background: var(--surface-alt);
  border-bottom: 1px solid var(--border);
  font-size: 13px;
}
.stats .stat { display: flex; gap: 6px; }
.stats .stat-label { color: var(--muted); }
.stats .stat-value { color: var(--text); font-weight: 600; }

.tabs {
  display: flex;
  gap: 4px;
  padding: 0 24px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.tab {
  background: transparent;
  color: var(--muted);
  padding: 10px 16px;
  border-radius: 0;
  font-weight: 500;
  border-bottom: 2px solid transparent;
}
.tab:hover { background: transparent; color: var(--text); filter: none; }
.tab.active { color: var(--text); border-bottom-color: var(--accent); }

main {
  padding: 16px 24px;
}

.tab-panel { display: none; }
.tab-panel.active { display: block; }

.filters {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 12px;
  font-size: 13px;
  color: var(--muted);
}
.filters input[type="text"] {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  flex: 1;
  max-width: 360px;
}
.filters input[type="number"] {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 4px 6px;
  border-radius: 4px;
}

table {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border-radius: 8px;
  overflow: hidden;
}
th, td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
th {
  background: var(--surface-alt);
  font-weight: 600;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  user-select: none;
}
th[data-sort] { cursor: pointer; }
th[data-sort]:hover { color: var(--text); }
tr.deal-row { cursor: pointer; }
tr.deal-row:hover { background: var(--surface-alt); }

td.score { font-weight: 700; font-family: ui-monospace, SF Mono, Menlo, Consolas, monospace; }
td.score.hi { color: var(--score-hi); }
td.score.mid { color: var(--score-mid); }
td.score.lo { color: var(--score-lo); }

td.title-cell {
  max-width: 460px;
}
td.title-cell .title {
  color: var(--text);
  display: block;
}
td.title-cell .meta {
  color: var(--muted);
  font-size: 12px;
}

.feed-pill, .status-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  margin-right: 4px;
}
.feed-pill { background: #2a3548; color: #b0c5e8; }
.feed-pill.cross { background: #2d4a3a; color: #8be0a8; }

.cross-source-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  background: rgba(139, 224, 168, 0.12);
  color: #8be0a8;
  border: 1px solid rgba(139, 224, 168, 0.35);
  text-decoration: none;
  margin-left: 4px;
}
.cross-source-badge:hover {
  background: rgba(139, 224, 168, 0.25);
  color: #a8f0c0;
}
.cross-source-badge .src { text-transform: uppercase; letter-spacing: 0.5px; }
.cross-source-badge .sim { opacity: 0.7; font-weight: 400; }

/* Merchant pills */
.merchant-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  margin-left: 4px;
  border: 1px solid var(--border);
}
.merchant-pill.trust-high { background: rgba(76,217,123,0.12); color: var(--good); border-color: rgba(76,217,123,0.35); }
.merchant-pill.trust-low { background: rgba(239,100,100,0.12); color: var(--bad); border-color: rgba(239,100,100,0.35); }
.merchant-pill.trust-neutral { background: var(--surface-alt); color: var(--muted); }
.merchant-pill.trust-unknown { background: #3a3526; color: var(--warn); border-color: rgba(247,185,85,0.35); }
.merchant-pill .m-delta { opacity: 0.7; font-weight: 500; margin-left: 2px; font-family: ui-monospace, monospace; }

/* Merchants tab list */
.merchant-row {
  display: grid;
  grid-template-columns: 60px 1fr 1fr 80px 80px auto;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 6px;
}
.merchant-row.low { border-left: 3px solid var(--bad); }
.merchant-row.high { border-left: 3px solid var(--good); }
.merchant-row.neutral { border-left: 3px solid var(--border); }
.merchant-row .m-name { font-weight: 600; }
.merchant-row .m-meta { font-size: 11px; color: var(--muted); font-family: ui-monospace, monospace; }
.merchant-row .m-platforms { font-size: 11px; color: var(--muted); }
.merchant-row .m-delta-val {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 10px;
  text-align: center;
}
.merchant-row .m-delta-val.pos { background: rgba(76,217,123,0.15); color: var(--good); }
.merchant-row .m-delta-val.neg { background: rgba(239,100,100,0.15); color: var(--bad); }
.merchant-row .m-delta-val.zero { color: var(--muted); }
.merchant-row .m-notes { color: var(--muted); font-size: 12px; font-style: italic; }

.status-pill.active { background: #1f3a2a; color: var(--good); }
.status-pill.unknown { background: #3a3526; color: var(--warn); }
.status-pill.expired { background: #3a2326; color: var(--bad); }
.status-pill.sold_out { background: #3a2326; color: var(--bad); }

td.empty { text-align: center; color: var(--muted); padding: 40px; }

#detail-modal, #product-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
}
#detail-modal.hidden, #product-modal.hidden { display: none; }
.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
}
.modal-content {
  position: relative;
  max-width: 720px;
  margin: 60px auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 24px;
  box-shadow: var(--shadow);
  max-height: 80vh;
  overflow-y: auto;
}
.modal-content .close {
  position: absolute;
  top: 8px;
  right: 12px;
  background: transparent;
  color: var(--muted);
  font-size: 24px;
  padding: 4px 10px;
}
.modal-content h2 { margin-top: 0; font-size: 18px; }
.modal-content a { color: var(--accent); }
.breakdown {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 16px;
  margin: 12px 0;
  font-family: ui-monospace, SF Mono, Menlo, Consolas, monospace;
  font-size: 13px;
}
.breakdown .label { color: var(--muted); }
.breakdown .value { color: var(--text); }

#toast {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  padding: 12px 18px;
  border-radius: 6px;
  box-shadow: var(--shadow);
  z-index: 200;
  max-width: 360px;
}
#toast.hidden { display: none; }
#toast.error { border-left-color: var(--bad); }
#toast.success { border-left-color: var(--good); }
#toast .undo-btn {
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--accent);
  padding: 3px 12px;
  margin-left: 10px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
#toast .undo-btn:hover { background: var(--accent); color: #fff; filter: none; }

.diff-section { margin-bottom: 24px; }
.diff-section h3 { margin: 0 0 8px; font-size: 14px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
.diff-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 6px;
  font-size: 13px;
}
.diff-item .deal-title { font-weight: 500; margin-bottom: 4px; }
.diff-item .delta { color: var(--muted); font-family: ui-monospace, monospace; font-size: 12px; }
.delta-up { color: var(--good); }
.delta-down { color: var(--bad); }

.snapshot-list {
  background: var(--surface);
  border-radius: 8px;
  border: 1px solid var(--border);
  overflow: hidden;
}
.snapshot-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  font-family: ui-monospace, monospace;
  font-size: 13px;
}
.snapshot-row:last-child { border-bottom: none; }

pre#config-content {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 14px;
  font-size: 13px;
  overflow-x: auto;
}

/* --- Live mode --- */
.live-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--muted);
  cursor: pointer;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-alt);
  user-select: none;
}
.live-toggle input { display: none; }
.live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--muted);
  display: inline-block;
  transition: background 0.2s;
}
.live-toggle.on { color: var(--text); }
.live-toggle.on .live-dot {
  background: var(--good);
  box-shadow: 0 0 0 0 rgba(76, 217, 123, 0.6);
  animation: pulse 2s infinite;
}
.live-toggle.refreshing .live-dot {
  background: var(--accent);
  animation: pulse-fast 0.8s infinite;
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(76, 217, 123, 0.6); }
  70% { box-shadow: 0 0 0 8px rgba(76, 217, 123, 0); }
  100% { box-shadow: 0 0 0 0 rgba(76, 217, 123, 0); }
}
@keyframes pulse-fast {
  0% { box-shadow: 0 0 0 0 rgba(90, 169, 255, 0.7); }
  70% { box-shadow: 0 0 0 6px rgba(90, 169, 255, 0); }
  100% { box-shadow: 0 0 0 0 rgba(90, 169, 255, 0); }
}

/* --- Rising banner --- */
.rising-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 24px;
  background: linear-gradient(90deg, rgba(247, 185, 85, 0.10), rgba(76, 217, 123, 0.05));
  border-bottom: 1px solid var(--border);
}
.rising-banner.hidden { display: none; }
.rising-label {
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--warn);
  padding: 4px 10px;
  border: 1px solid var(--warn);
  border-radius: 12px;
  flex-shrink: 0;
}
.rising-list {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  flex: 1;
  scrollbar-width: thin;
}
.rising-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 14px;
  min-width: 220px;
  cursor: pointer;
  flex-shrink: 0;
  transition: transform 0.1s, border-color 0.1s;
}
.rising-card:hover {
  border-color: var(--good);
  transform: translateY(-1px);
}
.rising-card .rc-title {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 240px;
  display: block;
}
.rising-card .rc-meta {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
  font-family: ui-monospace, monospace;
}
.rising-card .rc-velocity { color: var(--good); font-weight: 700; }

/* --- Sparkline + velocity --- */
td.sparkline-cell { padding: 6px 8px; vertical-align: middle; }
.sparkline {
  display: block;
  width: 100px;
  height: 24px;
}
.sparkline path { fill: none; stroke: var(--accent); stroke-width: 1.5; }
.sparkline .area { fill: rgba(90, 169, 255, 0.15); stroke: none; }
.sparkline .dot { fill: var(--accent); }

td.velocity { font-family: ui-monospace, monospace; font-size: 13px; }
td.velocity.up { color: var(--good); font-weight: 600; }
td.velocity.down { color: var(--bad); }
td.velocity.flat { color: var(--muted); }

/* Row highlight when velocity is rising fast */
tr.deal-row.is-rising td.score::after {
  content: '↑';
  margin-left: 4px;
  color: var(--good);
}

/* --- Sentiment / Vibe --- */
.vibe {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  white-space: nowrap;
}
.vibe.positive { background: #1f3a2a; color: var(--good); }
.vibe.negative { background: #3a2326; color: var(--bad); }
.vibe.mixed { background: #3a3526; color: var(--warn); }
.vibe.neutral { background: var(--surface-alt); color: var(--muted); }
.vibe-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.vibe.positive .vibe-dot { background: var(--good); }
.vibe.negative .vibe-dot { background: var(--bad); }
.vibe.mixed .vibe-dot { background: var(--warn); }
.vibe.neutral .vibe-dot { background: var(--muted); }

.flagged-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px;
}
.flagged-item {
  display: flex;
  gap: 10px;
  padding: 8px 10px;
  background: var(--surface-alt);
  border-radius: 6px;
  border-left: 3px solid var(--border);
  font-size: 13px;
}
.flagged-item.red { border-left-color: var(--bad); }
.flagged-item.green { border-left-color: var(--good); }
.flagged-tag {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 6px;
  border-radius: 3px;
  height: fit-content;
  flex-shrink: 0;
}
.flagged-item.red .flagged-tag { background: rgba(239,100,100,0.15); color: var(--bad); }
.flagged-item.green .flagged-tag { background: rgba(76,217,123,0.15); color: var(--good); }
.flagged-snippet { color: var(--text); font-style: italic; opacity: 0.9; }

/* --- Review queue --- */
.tab-badge {
  display: inline-block;
  min-width: 18px;
  padding: 0 6px;
  margin-left: 6px;
  background: var(--accent);
  color: #fff;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  vertical-align: top;
}
.tab-badge.hidden { display: none; }

.review-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}
.review-filters {
  display: flex;
  gap: 14px;
  align-items: center;
  font-size: 13px;
  color: var(--muted);
}
.review-progress {
  font-size: 14px;
  color: var(--muted);
}
.review-progress strong { color: var(--text); }

.review-card {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 16px;
  padding: 14px;
  margin-bottom: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 0;  /* rectangles — colored left-borders look wrong with rounded corners */
  transition: border-color 0.15s;
}
.review-img-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.review-img {
  width: 120px;
  height: 120px;
  object-fit: contain;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--border);
}
.review-img-placeholder {
  width: 120px;
  height: 120px;
  border-radius: 6px;
  background: var(--surface-alt);
  border: 1px dashed var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}
.review-card.rated-good { border-left: 4px solid var(--good); }
.review-card.rated-meh { border-left: 4px solid var(--warn); }
.review-card.rated-bad { border-left: 4px solid var(--bad); }
.review-card.rated-bought { border-left: 4px solid var(--accent); }
.review-card.rated-interested { border-left: 4px solid var(--good); }

.review-score {
  font-size: 22px;
  font-weight: 700;
  font-family: ui-monospace, monospace;
  text-align: center;
  align-self: start;
}
.review-description {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 8px 0;
  padding: 8px 10px;
  background: var(--surface-alt);
  border-radius: 4px;
  border-left: 2px solid var(--border);
}
.review-comments {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 8px 0;
}
.review-comment {
  font-size: 12px;
  color: var(--text);
  font-style: italic;
  opacity: 0.85;
  padding: 6px 10px;
  background: rgba(90,169,255,0.05);
  border-left: 2px solid var(--accent);
  border-radius: 3px;
  line-height: 1.4;
}
.review-comment::before { content: '" '; color: var(--accent); font-style: normal; }
.review-comment::after { content: ' "'; color: var(--accent); font-style: normal; }

/* --- Products --- */
.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}
.product-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px;
  cursor: pointer;
  transition: border-color 0.1s, transform 0.1s;
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.product-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.product-card-img {
  width: 90px;
  height: 90px;
  object-fit: contain;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--border);
  flex-shrink: 0;
}
.product-card-placeholder {
  width: 90px; height: 90px; border-radius: 6px;
  background: var(--surface-alt);
  border: 1px dashed var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--muted); font-size: 10px;
  flex-shrink: 0;
}
.product-card-body { min-width: 0; flex: 1; }
.product-card .name { font-weight: 600; margin-bottom: 4px; font-size: 14px; }
.product-card .meta { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.product-card .price-summary {
  font-family: ui-monospace, monospace;
  font-size: 13px;
}
.product-card .price-best { color: var(--good); font-weight: 700; }
.product-card .price-last { color: var(--text); }
.product-card .observed-count { font-size: 11px; color: var(--muted); }

/* Product form */
.product-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}
.product-form label { display: flex; flex-direction: column; font-size: 12px; color: var(--muted); gap: 4px; }
.product-form label.full { grid-column: 1 / -1; }
.product-form input, .product-form textarea, .product-form select {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  font-family: inherit;
  font-size: 13px;
}
.product-form select { padding: 6px 8px; }
.product-form textarea { min-height: 50px; resize: vertical; }
.product-form .buttons { grid-column: 1 / -1; display: flex; gap: 8px; justify-content: flex-end; }

/* Product detail */
.product-detail-header {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.product-detail-img {
  width: 140px;
  height: 140px;
  object-fit: contain;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--border);
}
.price-history-chart {
  background: var(--surface-alt);
  border-radius: 6px;
  padding: 10px;
  margin-bottom: 16px;
}
.price-history-chart svg { width: 100%; height: 120px; display: block; }
.price-history-chart .axis-label { fill: var(--muted); font-size: 10px; font-family: ui-monospace, monospace; }
.price-history-chart path { stroke: var(--accent); stroke-width: 2; fill: none; }
.price-history-chart .area { fill: rgba(90,169,255,0.15); stroke: none; }
.price-history-chart .dot { fill: var(--accent); }

.price-history-list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.price-history-row {
  display: grid;
  grid-template-columns: 140px 80px 1fr 80px;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  font-family: ui-monospace, monospace;
  font-size: 12px;
  align-items: center;
}
.price-history-row:last-child { border-bottom: none; }
.price-history-row .price { font-weight: 700; color: var(--good); }
.price-history-row .price.high { color: var(--bad); }
.price-history-row a { color: var(--accent); text-decoration: none; font-size: 11px; }
.review-score.hi { color: var(--score-hi); }
.review-score.mid { color: var(--score-mid); }
.review-score.lo { color: var(--score-lo); }

.review-body { min-width: 0; }
.review-title {
  font-weight: 500;
  color: var(--text);
  font-size: 15px;
  line-height: 1.35;
  margin-bottom: 6px;
}
.review-title a { color: var(--text); text-decoration: none; }
.review-title a:hover { color: var(--accent); }
.review-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 12px;
}

.rating-buttons {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.rating-btn {
  background: var(--surface-alt);
  color: var(--text);
  border: 1px solid var(--border);
  padding: 6px 14px;
  border-radius: 18px;
  cursor: pointer;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.1s;
}
.rating-btn:hover { filter: none; background: var(--border); }
.rating-btn.active.good { background: #1f3a2a; color: var(--good); border-color: var(--good); }
.rating-btn.active.meh { background: var(--surface-alt); color: var(--text); border-color: var(--muted); }
.rating-btn.active.bad { background: #3a2326; color: var(--bad); border-color: var(--bad); }
.rating-btn.active.bought { background: #1e2a3f; color: var(--accent); border-color: var(--accent); }
.rating-btn.clear {
  background: transparent;
  border-color: transparent;
  color: var(--muted);
  font-size: 12px;
}
.rating-btn.clear:hover { color: var(--bad); }

.review-notes {
  width: 100%;
  min-height: 40px;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 13px;
  resize: vertical;
}
.review-notes::placeholder { color: var(--muted); opacity: 0.7; }

.review-rated-time { font-size: 11px; color: var(--muted); margin-top: 4px; }

/* small review badge in Ranked table */
.review-badge-inline {
  display: inline-block;
  margin-left: 6px;
  font-size: 13px;
  vertical-align: middle;
}

/* --- Flag pills --- */
.flag-pill {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 600;
  margin-right: 3px;
  margin-top: 3px;
  background: var(--surface-alt);
  color: var(--muted);
  border: 1px solid var(--border);
  text-transform: uppercase;
  letter-spacing: 0.3px;
  white-space: nowrap;
}
.flag-pill.negative { background: rgba(239,100,100,0.10); color: var(--bad); border-color: rgba(239,100,100,0.3); }
.flag-pill.positive { background: rgba(76,217,123,0.10); color: var(--good); border-color: rgba(76,217,123,0.3); }
.flag-pill.neutral { /* default muted */ }
td.title-cell .flags-inline { display: inline; margin-left: 4px; }

/* --- Triage actions --- */
.triage-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 8px 0;
}
.triage-actions.primary { margin: 10px 0 4px; }
.triage-actions.secondary { margin: 0 0 8px; gap: 4px; }

.triage-btn {
  background: var(--surface-alt);
  color: var(--text);
  border: 1px solid var(--border);
  padding: 6px 14px;
  border-radius: 18px;
  cursor: pointer;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.1s;
}
.triage-btn:hover { background: var(--border); filter: none; }

/* Legacy triage button styles — superseded by .vote-btn below, kept for anything still using them */
.triage-btn.rate-good { background: transparent; color: var(--good); border-color: var(--good); }
.triage-btn.rate-good:hover, .triage-btn.rate-good.active { background: var(--good); color: #0b1a12; }
.triage-btn.rate-ignore { background: transparent; color: var(--warn); border-color: var(--warn); }
.triage-btn.rate-ignore:hover, .triage-btn.rate-ignore.active { background: var(--warn); color: #1a1408; }
.triage-btn.rate-bad { background: transparent; color: var(--bad); border-color: var(--bad); }
.triage-btn.rate-bad:hover, .triage-btn.rate-bad.active { background: var(--bad); color: #1a0b0e; }

/* --- Redesigned vote + notes sections --- */
.notes-section {
  margin: 16px 0 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.notes-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.notes-label .muted { text-transform: none; letter-spacing: 0; font-weight: 400; }
.notes-section .review-notes {
  width: 100%;
  min-height: 52px;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 10px 12px;
  font-family: inherit;
  font-size: 14px;
  color: var(--text);
  resize: vertical;
  line-height: 1.5;
  transition: border-color 0.15s, background 0.15s;
}
.notes-section .review-notes:focus {
  outline: none;
  border-color: var(--accent);
  background: var(--surface);
}

.vote-section {
  margin: 12px 0 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px dashed var(--border);
}
.vote-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
.vote-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
}
.vote-btn {
  background: var(--surface-alt);
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 5px 4px;
  cursor: pointer;
  transition: transform 0.08s, border-color 0.1s, background 0.1s, color 0.1s;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  font-size: 11px;
  min-height: 44px;
}
.vote-btn:hover { transform: translateY(-1px); filter: none; }
.vote-btn .v-emoji { font-size: 14px; line-height: 1; }
.vote-btn .v-label { font-weight: 600; font-size: 11px; }
.vote-btn .v-delta {
  font-family: ui-monospace, monospace;
  font-size: 9px;
  opacity: 0.55;
}
.vote-btn.active .v-delta { opacity: 0.85; }

.vote-btn.selected { transform: translateY(-2px); box-shadow: 0 0 0 2px var(--accent); }

/* Sub-context tag picker */
.vote-tags {
  margin-top: 10px;
  padding: 12px;
  background: var(--surface-alt);
  border: 1px solid var(--accent);
  border-radius: 8px;
}
.vote-tags.hidden { display: none; }
.vote-tags .vt-header { font-size: 13px; margin-bottom: 8px; }
.vote-tags .vt-options { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.vote-tags .vt-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  font-size: 12px;
  cursor: pointer;
}
.vote-tags .vt-option:has(input:checked) {
  border-color: var(--accent);
  background: rgba(90,169,255,0.1);
  color: var(--accent);
}
.vote-tags .vt-option input { margin: 0; }
.vote-tags .vt-notes {
  margin-bottom: 10px;
}
.vote-tags .vt-notes-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--text);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-bottom: 4px;
}
.vote-tags .vt-notes-input {
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 13px;
  resize: vertical;
  line-height: 1.5;
  min-height: 60px;
}
.vote-tags .vt-notes-input:focus {
  outline: none;
  border-color: var(--accent);
}
.vote-tags .vt-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.vote-tags .vt-cancel {
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
}
.vote-tags .vt-cancel:hover { color: var(--text); filter: none; }
.vote-tags .vt-submit { background: var(--accent); }
.vote-tags .vt-hint { margin-top: 8px; font-size: 11px; }

.triage-btn.secondary-action.expired { color: var(--muted); border-color: var(--border); }
.triage-btn.secondary-action.expired:hover {
  color: #1a0b0e;
  background: var(--bad);
  border-color: var(--bad);
  filter: none;
}
.triage-btn.secondary-action.expired.active {
  background: var(--bad);
  color: #1a0b0e;
  border-color: var(--bad);
}

/* Color by vote — gradient from positive (left) to negative (right) */
.vote-btn.vote-bought { color: var(--accent); border-color: rgba(90,169,255,0.4); }
.vote-btn.vote-bought:hover,
.vote-btn.vote-bought.active { background: var(--accent); color: #fff; border-color: var(--accent); }

.vote-btn.vote-good { color: var(--good); border-color: rgba(76,217,123,0.4); }
.vote-btn.vote-good:hover,
.vote-btn.vote-good.active { background: var(--good); color: #0b1a12; border-color: var(--good); }

.vote-btn.vote-skip { color: var(--muted); border-color: var(--border); }
.vote-btn.vote-skip:hover,
.vote-btn.vote-skip.active { background: var(--surface); color: var(--text); border-color: var(--muted); }

.vote-btn.vote-pass { color: var(--warn); border-color: rgba(247,185,85,0.4); }
.vote-btn.vote-pass:hover,
.vote-btn.vote-pass.active { background: var(--warn); color: #1a1408; border-color: var(--warn); }

.vote-btn.vote-bad { color: var(--bad); border-color: rgba(239,100,100,0.4); }
.vote-btn.vote-bad:hover,
.vote-btn.vote-bad.active { background: var(--bad); color: #1a0b0e; border-color: var(--bad); }

/* Breathable card spacing */
.review-card { padding: 18px; gap: 18px; }
.review-meta { margin-bottom: 12px; }
.score-change { margin-top: 4px; text-align: left; padding-left: 2px; }

/* Entity pills — prominent, clickable manufacturer/retailer/category */
.entity-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
  padding: 10px 12px;
  background: var(--surface-alt);
  border-radius: 6px;
  border-left: 2px solid var(--accent);
}
.entity-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 4px 12px;
  font-size: 12px;
  color: var(--text);
  transition: border-color 0.1s, transform 0.08s;
}
.entity-pill.clickable {
  cursor: pointer;
}
.entity-pill.clickable:hover {
  border-color: var(--accent);
  transform: translateY(-1px);
}
.entity-pill .entity-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: var(--muted);
  font-weight: 600;
}
.entity-pill .entity-value {
  font-weight: 600;
}
.entity-pill.has-bias-pos { border-color: var(--good); background: rgba(76,217,123,0.08); }
.entity-pill.has-bias-neg { border-color: var(--bad); background: rgba(239,100,100,0.08); }
.entity-pill .entity-bias-badge {
  font-family: ui-monospace, monospace;
  font-size: 11px;
  padding: 1px 6px;
  border-radius: 8px;
}
.entity-pill.has-bias-pos .entity-bias-badge { background: rgba(76,217,123,0.2); color: var(--good); }
.entity-pill.has-bias-neg .entity-bias-badge { background: rgba(239,100,100,0.2); color: var(--bad); }

/* Inline bias action menu */
.entity-menu {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  padding: 8px 10px;
  background: var(--surface);
  border: 1px solid var(--accent);
  border-radius: 6px;
  margin-top: 6px;
  font-size: 12px;
}
.entity-menu.hidden { display: none; }
.entity-menu .em-label { font-weight: 600; margin-right: 4px; }
.entity-menu button {
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 10px;
  background: var(--surface-alt);
  color: var(--text);
  border: 1px solid var(--border);
  cursor: pointer;
}
.entity-menu button.em-pos { border-color: var(--good); color: var(--good); }
.entity-menu button.em-pos:hover { background: var(--good); color: #0b1a12; }
.entity-menu button.em-neg { border-color: var(--bad); color: var(--bad); }
.entity-menu button.em-neg:hover { background: var(--bad); color: #1a0b0e; }
.entity-menu button.em-remove { color: var(--muted); }
.entity-menu button.em-remove:hover { border-color: var(--muted); color: var(--text); }
.entity-menu .em-cancel {
  margin-left: auto;
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 11px;
  cursor: pointer;
}

/* Secondary actions — smaller, more subdued */
.triage-btn.secondary-action {
  padding: 4px 10px;
  font-size: 12px;
  color: var(--muted);
}
.triage-btn.bought.active { background: #1e2a3f; color: var(--accent); border-color: var(--accent); }
.triage-btn.product { color: var(--warn); }
.triage-btn.product:hover { background: rgba(247,185,85,0.1); color: var(--warn); }
.triage-btn.vibe-check { color: var(--accent); }
.triage-btn.vibe-check:hover { background: rgba(90,169,255,0.1); color: var(--accent); }

.vibe-result {
  padding: 10px 12px;
  border-radius: 6px;
  margin: 8px 0;
  border-left: 3px solid var(--border);
  background: var(--surface-alt);
  font-size: 13px;
}
.vibe-result.rating-steal, .vibe-result.rating-great { border-left-color: var(--good); background: rgba(76,217,123,0.08); }
.vibe-result.rating-good { border-left-color: var(--good); background: rgba(76,217,123,0.05); }
.vibe-result.rating-fair { border-left-color: var(--warn); background: rgba(247,185,85,0.05); }
.vibe-result.rating-poor, .vibe-result.rating-skip { border-left-color: var(--bad); background: rgba(239,100,100,0.05); }

.vibe-result-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
}
.vibe-rating {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 12px;
}
.vibe-result.rating-steal .vibe-rating, .vibe-result.rating-great .vibe-rating,
.vibe-result.rating-good .vibe-rating { color: var(--good); }
.vibe-result.rating-fair .vibe-rating { color: var(--warn); }
.vibe-result.rating-poor .vibe-rating, .vibe-result.rating-skip .vibe-rating { color: var(--bad); }
.vibe-confidence { color: var(--muted); font-size: 12px; }
.vibe-reason { color: var(--text); line-height: 1.4; }
.vibe-caveats { font-size: 12px; margin-top: 6px; color: var(--muted); font-style: italic; }
.vibe-timestamp { margin-left: auto; font-size: 11px; color: var(--muted); }

.breakdown-block {
  background: var(--surface-alt);
  border-radius: 6px;
  padding: 10px 12px;
  margin: 8px 0;
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 4px 12px;
  font-size: 12px;
  border-left: 2px solid var(--accent);
}
.breakdown-block .bk-label { color: var(--muted); font-weight: 600; letter-spacing: 0.3px; text-transform: uppercase; font-size: 10px; align-self: center; }
.breakdown-block .bk-value { color: var(--text); font-family: ui-monospace, monospace; }

.peak-indicator {
  display: inline-block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
  font-family: ui-monospace, monospace;
}
.peak-indicator .peak-value { color: var(--text); font-weight: 600; }
.peak-indicator.declined { color: var(--warn); }
.peak-indicator.climbing { color: var(--good); }

.dismiss-menu {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 12px;
  margin-top: 8px;
}
.dismiss-menu.hidden { display: none; }
.dismiss-menu-section {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 10px;
}
.dismiss-menu-section:last-of-type { margin-bottom: 0; }
.dismiss-menu-label {
  width: 100%;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--muted);
  font-weight: 600;
  margin-bottom: 2px;
}
.dismiss-opt {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  padding: 6px 12px;
  border-radius: 14px;
  font-size: 12px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.dismiss-opt:hover { background: var(--bad); color: #fff; border-color: var(--bad); filter: none; }
.dismiss-opt.dismiss-opt-strong {
  border-color: var(--bad);
  color: var(--bad);
  background: rgba(239,100,100,0.08);
}
.dismiss-opt.dismiss-opt-strong strong { color: var(--text); font-weight: 700; }
.dismiss-opt.dismiss-opt-strong:hover strong { color: #fff; }
.dismiss-opt.dismiss-opt-soft {
  border-color: var(--border);
  color: var(--muted);
}
.dismiss-opt.dismiss-opt-soft:hover { background: var(--surface); color: var(--text); border-color: var(--muted); }
.dismiss-opt.dismiss-opt-form {
  background: var(--surface);
  border-color: var(--border);
}
.dismiss-opt.dismiss-opt-form:hover { background: var(--surface); color: var(--text); border-color: var(--accent); }
.dismiss-opt input[type="text"] {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 12px;
  width: 130px;
  padding: 2px 6px;
  border-radius: 3px;
  outline: none;
}
.dismiss-opt .dismiss-go {
  background: var(--accent);
  border: none;
  color: #fff;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 3px;
  cursor: pointer;
}
.dismiss-cancel {
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
  font-size: 12px;
  padding: 4px 12px;
  border-radius: 14px;
  margin-top: 8px;
}
.dismiss-cancel:hover { color: var(--text); filter: none; }

.detected-brand {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
  background: rgba(90,169,255,0.12);
  color: var(--accent);
  border: 1px solid rgba(90,169,255,0.3);
  margin-right: 4px;
}

.resurface-banner {
  font-size: 11px;
  color: var(--warn);
  background: rgba(247,185,85,0.1);
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 8px;
}

/* Dismissed section collapsible */
.dismissed-section {
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.dismissed-toggle {
  background: transparent;
  color: var(--muted);
  border: none;
  padding: 6px 0;
  font-size: 13px;
  cursor: pointer;
}
.dismissed-toggle:hover { color: var(--text); filter: none; }
.dismissed-list { margin-top: 8px; }
.dismissed-list.hidden { display: none; }
.dismissed-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 4px;
  font-size: 13px;
}
.dismissed-item .title { color: var(--muted); flex: 1; }
.dismissed-item .reason { font-size: 11px; color: var(--muted); margin-right: 12px; }
.undismiss-btn {
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
  padding: 3px 10px;
  font-size: 11px;
  border-radius: 4px;
}
.undismiss-btn:hover { color: var(--good); border-color: var(--good); filter: none; }

/* Feed weights tab */
.feed-weights-grid {
  display: grid;
  grid-template-columns: 70px 140px 90px 180px 50px 1fr;
  gap: 10px 14px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px;
  margin-bottom: 12px;
}
.feed-weights-grid input[type="text"] {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 13px;
}
.feed-weights-grid input[type="text"].changed {
  border-color: var(--warn);
  background: rgba(247,185,85,0.06);
}
.feed-weights-grid .fw-key {
  font-family: ui-monospace, monospace;
  color: var(--muted);
  font-size: 11px;
}
.feed-weights-grid .fw-url {
  font-family: ui-monospace, monospace;
  font-size: 11px;
  color: var(--accent);
  word-break: break-all;
  max-width: 100%;
}
.feed-weights-grid .fw-url:hover { text-decoration: underline; }
.feed-weights-grid .fw-header {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--muted);
  font-weight: 600;
}
.feed-weights-grid .fw-name { font-weight: 600; }
.feed-weights-grid input[type="number"] {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  font-family: ui-monospace, monospace;
  width: 80px;
  text-align: center;
}
.feed-weights-grid input[type="number"].changed {
  border-color: var(--warn);
  background: rgba(247,185,85,0.06);
}
.feed-weights-grid .fw-default {
  font-family: ui-monospace, monospace;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.feed-weights-grid .fw-desc {
  color: var(--muted);
  font-size: 12px;
}
.feed-weights-grid .fw-actions { text-align: right; }
.feed-weights-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}

/* Completed tab table */
.completed-table {
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  border-collapse: collapse;
}
.completed-table thead th {
  background: var(--surface-alt);
  padding: 10px 12px;
  text-align: left;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--muted);
  font-weight: 600;
}
.completed-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  vertical-align: middle;
}
.completed-table tr:last-child td { border-bottom: none; }
.completed-table .img-cell { width: 60px; }
.completed-table img {
  width: 48px; height: 48px; object-fit: contain;
  background: #fff; border-radius: 4px; border: 1px solid var(--border);
}
.completed-table .img-placeholder {
  width: 48px; height: 48px; border-radius: 4px;
  background: var(--surface-alt); border: 1px dashed var(--border);
}
.completed-table .rating-cell { white-space: nowrap; font-size: 16px; }
.completed-table .score-cell {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  white-space: nowrap;
}
.completed-table .score-cell .original { color: var(--muted); font-weight: 400; }
.completed-table .score-cell .arrow { color: var(--muted); margin: 0 4px; }
.completed-table .delta-cell {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  white-space: nowrap;
  text-align: right;
}
.completed-table .delta-cell.pos { color: var(--good); }
.completed-table .delta-cell.neg { color: var(--bad); }
.completed-table .delta-cell.zero { color: var(--muted); }
.completed-table .notes-cell {
  color: var(--muted);
  font-size: 12px;
  max-width: 280px;
  font-style: italic;
}
.completed-table .title-cell {
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.completed-table .title-cell a { color: var(--text); text-decoration: none; }
.completed-table .title-cell a:hover { color: var(--accent); }

/* score change inline on review card */
.score-change {
  font-family: ui-monospace, monospace;
  font-size: 11px;
  margin-top: 4px;
  text-align: center;
}
.score-change .original { color: var(--muted); text-decoration: line-through; }
.score-change .arrow { color: var(--muted); margin: 0 3px; }
.score-change .new.pos { color: var(--good); font-weight: 700; }
.score-change .new.neg { color: var(--bad); font-weight: 700; }

/* Full Dismissals tab table */
.dismissals-table {
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
.dismissals-table thead th {
  background: var(--surface-alt);
  padding: 10px 12px;
  text-align: left;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--muted);
  font-weight: 600;
}
.dismissals-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  vertical-align: top;
}
.dismissals-table tr:last-child td { border-bottom: none; }
.dismissals-table .reason-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.dismissals-table .reason-pill.flag { background: #3a3526; color: var(--warn); }
.dismissals-table .reason-pill.brand { background: #3a2326; color: var(--bad); }
.dismissals-table .reason-pill.category { background: #2a3548; color: #b0c5e8; }
.dismissals-table .reason-pill.just_this_deal { background: var(--surface-alt); color: var(--muted); }
.dismissals-table .reason-pill.not_interested { background: var(--surface-alt); color: var(--muted); }
.dismissals-table .target { font-family: ui-monospace, monospace; font-size: 12px; color: var(--text); }
.dismissals-table .title-col { max-width: 420px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }
.dismissals-table .title-col a { color: var(--accent); text-decoration: none; }
.dismissals-table .time-col { color: var(--muted); font-family: ui-monospace, monospace; font-size: 12px; white-space: nowrap; }
.dismissals-table .threshold-col { font-family: ui-monospace, monospace; font-size: 12px; color: var(--muted); text-align: right; }
.dismissals-table .actions-col { text-align: right; white-space: nowrap; }

/* --- Biases --- */
.biases-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
  gap: 16px;
  flex-wrap: wrap;
}
.secondary-btn {
  background: var(--surface-alt);
  color: var(--text);
  border: 1px solid var(--border);
}
.secondary-btn:hover { background: var(--border); filter: none; }

.bias-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 12px;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 16px;
}
.bias-form input[type="text"], .bias-form input[type="number"], .bias-form select {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 13px;
  font-family: inherit;
}
.bias-form input[type="text"] { flex: 1; min-width: 140px; }
.bias-form .case-toggle {
  font-size: 12px;
  color: var(--muted);
  display: inline-flex;
  gap: 4px;
  align-items: center;
}
.bias-form input[type="text"]#bias-pattern {
  font-family: ui-monospace, monospace;
  flex: 2;
}

.bias-rule {
  display: grid;
  grid-template-columns: auto 1fr auto auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 6px;
}
.bias-rule.disabled { opacity: 0.5; }
.bias-rule-delta {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 10px;
  min-width: 50px;
  text-align: center;
}
.bias-rule-delta.positive { background: rgba(76,217,123,0.15); color: var(--good); }
.bias-rule-delta.negative { background: rgba(239,100,100,0.15); color: var(--bad); }
.bias-rule-label { font-weight: 500; }
.bias-rule-meta {
  font-size: 11px;
  color: var(--muted);
  font-family: ui-monospace, monospace;
}
.bias-rule-pattern {
  font-family: ui-monospace, monospace;
  font-size: 12px;
  color: var(--muted);
  background: var(--surface-alt);
  padding: 2px 6px;
  border-radius: 3px;
}
.bias-rule-target {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.bias-rule-toggle {
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 12px;
}
.bias-rule-toggle.on { color: var(--good); border-color: var(--good); }
.bias-rule-delete {
  background: transparent;
  color: var(--muted);
  border: 1px solid transparent;
  padding: 4px 8px;
  font-size: 14px;
}
.bias-rule-delete:hover { color: var(--bad); border-color: var(--bad); }

.activity-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}
.activity-tile {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px;
}
.activity-tile .tile-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--muted);
  margin-bottom: 4px;
}
.activity-tile .tile-value {
  font-size: 28px;
  font-weight: 700;
  font-family: ui-monospace, monospace;
}
.activity-tile .tile-sub {
  font-size: 12px;
  color: var(--muted);
  margin-top: 6px;
  line-height: 1.4;
}
.activity-section { margin-bottom: 24px; }
.activity-section h3 {
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--muted);
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.activity-section h3 .count {
  background: var(--surface-alt);
  padding: 1px 8px;
  border-radius: 10px;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
}
.activity-section h3 a {
  font-size: 12px;
  color: var(--accent);
  text-decoration: none;
  margin-left: auto;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
}
.activity-list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.activity-row {
  display: grid;
  grid-template-columns: 120px 80px 1fr auto;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  align-items: center;
}
.activity-row:last-child { border-bottom: none; }
.activity-row .kind {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  font-family: ui-monospace, monospace;
  letter-spacing: 0.5px;
}
.activity-row .time { color: var(--muted); font-size: 12px; font-family: ui-monospace, monospace; }
.activity-row .detail { color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-row .value { font-family: ui-monospace, monospace; font-weight: 600; font-size: 12px; }
.activity-row.pos .value { color: var(--good); }
.activity-row.neg .value { color: var(--bad); }

#biases-suggestions {
  background: var(--surface-alt);
  border: 1px solid var(--warn);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 16px;
}
#biases-suggestions h3 { margin: 0 0 8px; font-size: 14px; color: var(--warn); }
#biases-suggestions.hidden { display: none; }
.suggestion-row {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
}
.suggestion-accept { background: var(--accent); padding: 4px 10px; font-size: 12px; border-radius: 4px; }

/* Personal view toggle in filters */
.personal-toggle {
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
}

/* Ranked table — personal score column */
td.personal-delta {
  font-family: ui-monospace, monospace;
  font-size: 12px;
}
td.personal-delta.positive { color: var(--good); }
td.personal-delta.negative { color: var(--bad); }

.breakdown .matched-bias {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}
.breakdown .matched-bias .delta {
  font-family: ui-monospace, monospace;
  min-width: 40px;
}
.breakdown .matched-bias .delta.positive { color: var(--good); }
.breakdown .matched-bias .delta.negative { color: var(--bad); }

/* ==================================================================
 * Categories admin table
 * ================================================================== */
.cat-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.cat-table th {
  text-align: left; padding: 8px 10px;
  background: var(--surface-alt); border-bottom: 1px solid var(--border);
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--muted); font-weight: 700;
}
.cat-table td {
  padding: 8px 10px; border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.cat-table .cat-name { min-width: 160px; }
.cat-table .cat-id { font-family: ui-monospace, monospace; font-size: 10px; color: var(--muted); margin-bottom: 3px; }
.cat-table .cat-name-input {
  width: 100%; background: var(--surface-alt);
  border: 1px solid var(--border); color: var(--text);
  padding: 4px 8px; border-radius: 3px; font-size: 13px; font-family: inherit;
}
.cat-table .cat-patterns {
  width: 100%; min-width: 260px; background: var(--surface-alt);
  border: 1px solid var(--border); color: var(--text);
  padding: 6px 8px; border-radius: 3px; font-family: ui-monospace, monospace;
  font-size: 12px; line-height: 1.45; resize: vertical;
}
.cat-table .cat-brands {
  width: 100%; background: var(--surface-alt);
  border: 1px solid var(--border); color: var(--text);
  padding: 4px 8px; border-radius: 3px; font-size: 13px; font-family: inherit;
}
.cat-table .cat-hits {
  font-family: ui-monospace, monospace; font-weight: 700;
  text-align: center; font-size: 14px; width: 60px;
}
.cat-table .cat-hits.has { color: var(--good); }
.cat-table .cat-hits.none { color: var(--muted); }
.cat-table .cat-source { font-size: 11px; width: 120px; }
.cat-table .cat-actions { white-space: nowrap; width: 130px; }
.cat-table .cat-save, .cat-table .cat-delete {
  padding: 4px 10px; font-size: 12px; border-radius: 3px; cursor: pointer;
  border: 1px solid var(--border); background: var(--surface-alt); color: var(--text);
  margin-right: 4px;
}
.cat-table .cat-save:hover { border-color: var(--accent); color: var(--accent); }
.cat-table .cat-delete { color: var(--muted); }
.cat-table .cat-delete:hover { border-color: var(--bad); color: var(--bad); }

/* ==================================================================
 * Ranked detail modal — Vibe check section
 * ================================================================== */
.detail-vibe-card {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-left-width: 3px;
  padding: 12px;
  display: flex; flex-direction: column; gap: 8px;
}
.detail-vibe-card.rating-steal { border-left-color: var(--good); background: rgba(76,217,123,0.08); }
.detail-vibe-card.rating-great { border-left-color: var(--good); background: rgba(76,217,123,0.05); }
.detail-vibe-card.rating-good  { border-left-color: var(--good); }
.detail-vibe-card.rating-fair  { border-left-color: var(--warn); }
.detail-vibe-card.rating-poor  { border-left-color: var(--bad);  background: rgba(239,100,100,0.05); }
.detail-vibe-card.rating-skip  { border-left-color: var(--bad);  background: rgba(239,100,100,0.08); }
.detail-vibe-head {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px;
}
.detail-vibe-rating { font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.detail-vibe-conf { font-size: 11px; }
.detail-vibe-reason { color: var(--text); font-size: 13px; line-height: 1.45; }
.detail-vibe-caveats {
  background: rgba(247,185,85,0.1); color: var(--warn);
  padding: 6px 10px; border-radius: 3px; font-size: 12px;
}
.detail-vibe-bd {
  display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px;
  padding-top: 8px; border-top: 1px solid var(--border);
  font-size: 12px;
}
.detail-vibe-bd-row { display: contents; }

/* ==================================================================
 * Digest tab — periodic top deals + commentary
 * ================================================================== */
.digest-block {
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 14px 16px;
  margin-bottom: 14px;
}
.digest-head {
  display: flex; align-items: baseline; gap: 10px;
  margin-bottom: 6px; padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.digest-time { font-weight: 600; font-size: 14px; color: var(--text); }
.digest-window { font-size: 11px; }
.digest-summary {
  font-size: 14px; line-height: 1.5; color: var(--text);
  background: rgba(90,169,255,0.06); padding: 8px 12px;
  border-left: 2px solid var(--accent); margin: 8px 0 14px;
}
.digest-deals { display: flex; flex-direction: column; gap: 12px; }
.digest-deal {
  display: grid; grid-template-columns: 90px 1fr; gap: 14px;
  padding: 10px; background: var(--surface-alt);
  border: 1px solid var(--border);
}
.digest-deal-img { width: 90px; height: 90px; overflow: hidden; background: var(--bg); }
.digest-deal-img img { width: 100%; height: 100%; object-fit: contain; }
.digest-img-placeholder { width: 100%; height: 100%; background: var(--bg); }
.digest-deal-body { display: flex; flex-direction: column; gap: 5px; }
.digest-deal-head {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
}
.digest-deal-title {
  color: var(--text); text-decoration: none; font-weight: 600;
  font-size: 14px; line-height: 1.35; flex: 1; min-width: 0;
}
.digest-deal-title:hover { color: var(--accent); }
.digest-deal-score {
  font-family: ui-monospace, monospace; font-weight: 700;
  font-size: 13px; color: var(--good);
  padding: 2px 8px; background: rgba(76,217,123,0.12);
  border-radius: 3px;
}
.digest-verdict {
  font-family: ui-monospace, monospace; font-size: 11px; font-weight: 700;
  padding: 2px 8px; border-radius: 3px; letter-spacing: 0.5px;
}
.digest-verdict.buy   { background: rgba(76,217,123,0.2); color: var(--good); border: 1px solid rgba(76,217,123,0.4); }
.digest-verdict.skip  { background: rgba(239,100,100,0.2); color: var(--bad);  border: 1px solid rgba(239,100,100,0.4); }
.digest-verdict.watch { background: rgba(247,185,85,0.2); color: var(--warn); border: 1px solid rgba(247,185,85,0.4); }
.digest-commentary { margin: 4px 0; color: var(--text); font-size: 13px; line-height: 1.45; }
.digest-vibe { margin: 0; font-size: 11px; }
.digest-deal-meta { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.digest-tag {
  display: inline-block; padding: 1px 7px; font-size: 10px;
  background: var(--bg); border: 1px solid var(--border);
  color: var(--muted); border-radius: 10px;
  font-family: ui-monospace, monospace; letter-spacing: 0.3px;
}
/* Archive days — collapsed by default */
.digest-archive-day {
  border: 1px solid var(--border); margin-bottom: 8px;
  background: var(--surface);
}
.digest-archive-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; cursor: pointer;
  transition: background 0.12s;
}
.digest-archive-head:hover { background: var(--surface-alt); }
.digest-archive-arrow { margin-left: auto; transition: transform 0.15s; color: var(--muted); }
.digest-archive-day.expanded .digest-archive-arrow { transform: rotate(90deg); }
.digest-archive-body { display: none; padding: 0 14px 14px; }
.digest-archive-day.expanded .digest-archive-body { display: block; }

/* ==================================================================
 * Ranked detail modal — Your review section
 * ================================================================== */
.detail-rv {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  padding: 12px;
  display: flex; flex-direction: column; gap: 8px;
}
.detail-rv-current {
  display: flex; align-items: center; gap: 12px;
  padding: 6px 10px; border-radius: 4px;
  background: var(--surface);
}
.detail-rv-emoji { font-size: 22px; line-height: 1; }
.detail-rv-label { display: flex; flex-direction: column; gap: 2px; }
.detail-rv-name { font-weight: 600; color: var(--text); font-size: 14px; }
.detail-rv-notes-lbl { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
.detail-rv textarea {
  width: 100%; background: var(--surface); border: 1px solid var(--border);
  color: var(--text); padding: 6px 10px; border-radius: 4px;
  font-family: inherit; font-size: 13px; line-height: 1.4; resize: vertical;
}
.detail-rv textarea:focus { outline: none; border-color: var(--accent); }
.detail-rv-actions {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
}
.detail-rv-scores { display: flex; gap: 4px; }
.detail-rv-scores .vote-btn { padding: 6px 10px; font-size: 12px; }
.detail-rv-bought-active {
  background: rgba(247,185,85,0.2);
  color: var(--warn);
  border-color: rgba(247,185,85,0.5);
}

/* ==================================================================
 * Ranked tab — "Mine" column (user's rating + bought flag)
 * ================================================================== */
#deals-table .mine-cell {
  width: 58px;
  text-align: center;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1;
  padding: 6px 4px;
}
#deals-table .mine-cell .mine-none { color: var(--border); font-size: 14px; }
#deals-table .mine-cell .mine-bought { color: var(--warn); }
#deals-table .mine-cell .mine-rating {
  display: inline-block;
  padding: 2px 5px;
  border-radius: 3px;
}
#deals-table .mine-cell .mine-bought ~ .mine-rating,
#deals-table .mine-cell .mine-rating { margin-left: 1px; }
#deals-table .mine-cell .mine-bought         { filter: drop-shadow(0 0 2px rgba(247,185,85,0.45)); }
#deals-table .mine-cell .mine-rating.mine-bought        { background: rgba(247,185,85,0.15); }
#deals-table .mine-cell .mine-rating.mine-good,
#deals-table .mine-cell .mine-rating.mine-interested    { background: rgba(76,217,123,0.15); }
#deals-table .mine-cell .mine-rating.mine-meh           { background: rgba(138,147,164,0.15); }
#deals-table .mine-cell .mine-rating.mine-not_interested{ background: rgba(239,100,100,0.12); }
#deals-table .mine-cell .mine-rating.mine-bad           { background: rgba(239,100,100,0.2); }
#deals-table .mine-cell .mine-rating.mine-expired       { background: rgba(138,147,164,0.25); opacity: 0.75; }

/* ==================================================================
 * Watchlist tab — higher contrast than the shared cat-table defaults.
 * These numbers are live signal, not background metadata, so they
 * should pop.
 * ================================================================== */
#watchlist-list .cat-table th {
  color: var(--text);
  background: var(--surface);
  font-size: 11px;
  letter-spacing: 0.7px;
}
#watchlist-list .cat-table td {
  padding: 10px 12px;
  color: var(--text);
  font-size: 13px;
}
#watchlist-list .cat-table tr { transition: background 0.12s; }
#watchlist-list .cat-table tbody tr:nth-child(even) { background: rgba(255,255,255,0.02); }
#watchlist-list .cat-table tbody tr:hover { background: rgba(90,169,255,0.08); }
#watchlist-list .cat-table a {
  color: var(--text); text-decoration: none; font-weight: 500;
}
#watchlist-list .cat-table tbody tr:hover a { color: var(--accent); }
/* Score column: green pill for clear signal */
#watchlist-list .cat-table .cat-hits.has {
  color: var(--good);
  background: rgba(76,217,123,0.12);
  border-radius: 3px; padding: 4px 8px;
  display: inline-block; min-width: 48px;
  font-size: 14px;
}
/* Other numeric cells: full-contrast mono, not muted grey */
#watchlist-list .cat-table .cat-hits {
  color: var(--text);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
#watchlist-list .cat-table .cat-hits:empty::before,
#watchlist-list .cat-table td:has(> .cat-hits:empty) { color: var(--muted); }

/* Completed tab row interactivity */
.completed-table tr.completed-row { cursor: pointer; transition: background 0.12s; }
.completed-table tr.completed-row:hover { background: rgba(90,169,255,0.08); }
.completed-table .completed-title { color: var(--text); }
.completed-table tr.completed-row:hover .completed-title { color: var(--accent); }
.completed-table .completed-ext {
  margin-left: 6px; color: var(--muted); text-decoration: none;
  font-size: 12px; padding: 2px 5px; border-radius: 3px;
}
.completed-table .completed-ext:hover { color: var(--accent); background: rgba(90,169,255,0.1); }

/* ==================================================================
 * Brand stopword chips
 * ================================================================== */
.stopword-chips { display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; }
.stopword-chip {
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 4px 3px 10px; border-radius:16px;
  background:var(--surface-alt); border:1px solid var(--border);
  font-size:12px; font-family:ui-monospace,monospace;
  color:var(--text);
}
.stopword-chip button {
  background:transparent; border:none; color:var(--muted);
  cursor:pointer; width:18px; height:18px; border-radius:50%;
  font-size:10px; padding:0;
}
.stopword-chip button:hover { background:rgba(239,100,100,0.2); color:var(--bad); }

/* ==================================================================
 * Candidates queue grid
 * ================================================================== */
.candidates-grid { display:flex; flex-direction:column; gap:10px; }
.candidate-card {
  display:grid; grid-template-columns: 100px 1fr; gap:14px;
  background:var(--surface); border:1px solid var(--border);
  padding:12px; align-items:flex-start;
}
.candidate-card .candidate-img { width:100px; height:100px; overflow:hidden; background:var(--surface-alt); border:1px solid var(--border); }
.candidate-card .candidate-img img { width:100%; height:100%; object-fit:contain; }
.candidate-card .candidate-img .img-placeholder { width:100%; height:100%; background:var(--surface-alt); }
.candidate-card .candidate-body { display:flex; flex-direction:column; gap:8px; }
.candidate-card .candidate-title { font-weight:600; font-size:14px; line-height:1.35; }
.candidate-card .candidate-title a { color:var(--text); text-decoration:none; }
.candidate-card .candidate-title a:hover { color:var(--accent); }
.candidate-card .candidate-tag {
  display:inline-block; margin-right:8px; padding:1px 6px;
  background:rgba(76,217,123,0.18); color:var(--good);
  border:1px solid rgba(76,217,123,0.4);
  font-family:ui-monospace,monospace; font-size:11px; font-weight:700;
  border-radius:3px;
}
.candidate-card .candidate-meta { font-size:12px; }
.candidate-card .candidate-actions { display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; }
.candidate-card .candidate-actions button {
  padding:6px 12px; font-size:12px; border-radius:3px; cursor:pointer;
  border:1px solid var(--border); background:var(--surface-alt); color:var(--text);
}
.candidate-card .candidate-actions button.cat-save { border-color:rgba(90,169,255,0.4); color:var(--accent); }
.candidate-card .candidate-actions button.cat-save:hover { background:rgba(90,169,255,0.12); }
.candidate-card .candidate-actions button.cat-delete:hover { border-color:var(--border); }
.candidate-card .candidate-actions button.danger:hover { border-color:var(--bad); color:var(--bad); }

/* ==================================================================
 * Always-visible notes input on review cards
 * ================================================================== */
.d-card .d-notes-input {
  width: 100%;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.4;
  resize: vertical;
  min-height: 40px;
  transition: border-color 0.12s, background 0.12s;
}
.d-card .d-notes-input:focus {
  outline: none;
  border-color: var(--accent);
  background: var(--surface);
}
.d-card .d-notes-input::placeholder { color: var(--muted); opacity: 0.7; }

/* ==================================================================
 * Review keyboard focus ring
 * ================================================================== */
.review-card.kbd-focus {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

/* ==================================================================
 * Rescore spinner (bottom-right pulse)
 * ================================================================== */
#rescore-pulse {
  position:fixed; bottom:20px; right:20px; z-index:9999;
  display:none; align-items:center; gap:8px;
  padding:8px 14px; border-radius:20px;
  background:var(--surface); border:1px solid var(--border);
  font-size:12px; color:var(--muted);
  box-shadow:0 4px 12px rgba(0,0,0,0.25);
}
#rescore-pulse.active,
#rescore-pulse.done,
#rescore-pulse.err { display:inline-flex; }
#rescore-pulse .pulse-dot {
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:var(--muted);
}
#rescore-pulse.active .pulse-dot {
  background:var(--accent);
  animation:rescore-pulse 1.2s ease-in-out infinite;
}
#rescore-pulse.done { color:var(--good); border-color:rgba(76,217,123,0.4); }
#rescore-pulse.done .pulse-dot { background:var(--good); }
#rescore-pulse.err { color:var(--bad); border-color:rgba(239,100,100,0.4); }
#rescore-pulse.err .pulse-dot { background:var(--bad); }
@keyframes rescore-pulse {
  0%, 100% { opacity:1; transform:scale(1); }
  50% { opacity:0.4; transform:scale(1.35); }
}

/* ==================================================================
 * D-refined Review card — two-column layout (left: meta + levers;
 * right: content + actions). Scoped under `.review-card.d-card` so
 * existing .review-card styles don't fight us.
 * ================================================================== */

.review-card.d-card {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 22px;
  padding: 18px 22px;
  margin-bottom: 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 0;
  transition: border-color 0.15s;
}
.review-card.d-card.rated-p20     { border-left: 3px solid var(--good); }
.review-card.d-card.rated-p10     { border-left: 3px solid rgba(122,210,160,0.7); }
.review-card.d-card.rated-zero    { border-left: 3px solid var(--muted); }
.review-card.d-card.rated-m10     { border-left: 3px solid var(--warn); }
.review-card.d-card.rated-m20     { border-left: 3px solid var(--bad); }
.review-card.d-card.rated-expired { border-left: 3px solid #555; opacity: 0.8; }

/* -------- LEFT COLUMN -------- */
.d-card .d-left { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.d-card .d-img {
  width: 180px; height: 180px; object-fit: contain;
  background: #fff; border: 1px solid var(--border);
}
.d-card .d-img-ph {
  width: 180px; height: 180px;
  background: var(--surface-alt); border: 1px dashed var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--muted); font-size: 11px;
}
.d-card .d-scores { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.d-card .d-score-box {
  background: var(--surface-alt); border: 1px solid var(--border);
  padding: 6px 4px; text-align: center;
}
.d-card .d-score-lbl {
  font-size: 9px; text-transform: uppercase; letter-spacing: 0.4px;
  color: var(--muted); font-weight: 600;
}
.d-card .d-score-val {
  font-family: ui-monospace, monospace; font-size: 16px; font-weight: 700;
}
.d-card .d-score-val.hi { color: var(--good); }
.d-card .d-score-val.mid { color: var(--warn); }
.d-card .d-score-val.lo { color: var(--muted); }
.d-card .d-trend {
  font-family: ui-monospace, monospace; font-size: 10px;
  color: var(--muted);
  display: flex; justify-content: space-between; align-items: center; gap: 4px;
  padding: 0 2px;
}
.d-card .d-spark svg { vertical-align: middle; max-width: 80px; height: 18px; }
.d-card .d-velocity.up { color: var(--good); }
.d-card .d-velocity.down { color: var(--bad); }

/* Entity stack — compact inline ±1 controls */
.d-card .d-entity-stack { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.d-card .d-entity {
  background: var(--surface-alt); border: 1px solid var(--border);
  padding: 6px 8px 7px;
  display: flex; flex-direction: column; gap: 3px;
}
.d-card .d-entity.empty { opacity: 0.55; }
.d-card .d-ent-label {
  font-size: 9px; text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--muted); font-weight: 700;
}
.d-card .d-ent-row {
  display: grid; grid-template-columns: 1fr auto auto auto;
  align-items: center; gap: 5px;
}
.d-card .d-ent-value {
  font-weight: 600; font-size: 12px; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.d-card .d-ent-value[data-ent-edit] {
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 4px; border-radius: 3px;
  transition: background 0.12s, color 0.12s;
}
.d-card .d-ent-value[data-ent-edit]:hover {
  background: rgba(90,169,255,0.12); color: var(--accent);
}
.d-card .d-ent-edit-hint {
  font-size: 10px; color: var(--muted); opacity: 0;
  transition: opacity 0.12s;
}
.d-card .d-ent-value[data-ent-edit]:hover .d-ent-edit-hint {
  opacity: 1; color: var(--accent);
}
.d-card .d-ent-input {
  background: var(--surface); border: 1px solid var(--accent); color: var(--text);
  padding: 2px 6px; font-size: 12px; font-family: inherit;
  border-radius: 3px; min-width: 0; width: 100%;
}
.d-card .d-ent-input:focus { outline: none; }
.d-card .d-ent-value.warn { color: var(--warn); }
.d-card .d-ent-value.muted { color: var(--muted); font-weight: 400; }
.d-card .d-ent-plat {
  font-family: ui-monospace, monospace; font-size: 9px;
  color: var(--muted); font-weight: 600;
  padding: 1px 4px; background: rgba(138,147,164,0.12);
  border-radius: 2px; margin-left: 3px; vertical-align: 2px;
}
.d-card .d-ent-bias {
  font-family: ui-monospace, monospace; font-size: 11px; font-weight: 700;
  min-width: 24px; text-align: center; padding: 0 2px;
}
.d-card .d-ent-bias.pos { color: var(--good); }
.d-card .d-ent-bias.neg { color: var(--bad); }
.d-card .d-ent-bias.zero { color: var(--muted); }
.d-card .d-ent-btn {
  background: transparent; border: 1px solid var(--border); color: var(--muted);
  width: 26px; height: 22px; padding: 0;
  font-size: 10px; font-weight: 700; font-family: ui-monospace, monospace;
  cursor: pointer; border-radius: 3px;
  transition: color 0.12s, border-color 0.12s, background 0.12s;
}
.d-card .d-ent-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.d-card .d-ent-btn.plus:hover:not(:disabled) {
  border-color: var(--good); color: var(--good); background: rgba(76,217,123,0.1);
}
.d-card .d-ent-btn.minus:hover:not(:disabled) {
  border-color: var(--bad); color: var(--bad); background: rgba(239,100,100,0.1);
}
/* Persistent click state — shows +1 or -1 has been applied to this deal */
.d-card .d-ent-btn.plus.clicked {
  border-color: rgba(76,217,123,0.7); color: #0a1a10;
  background: rgba(76,217,123,0.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15);
}
.d-card .d-ent-btn.minus.clicked {
  border-color: rgba(239,100,100,0.7); color: #fff;
  background: rgba(239,100,100,0.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}
.d-card .d-entity.click-plus { border-color: rgba(76,217,123,0.4); }
.d-card .d-entity.click-minus { border-color: rgba(239,100,100,0.4); }

/* -------- RIGHT COLUMN -------- */
.d-card .d-right { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.d-card .d-head { display: flex; flex-direction: column; gap: 4px; }
.d-card .d-title {
  font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--text);
}
.d-card .d-title a { color: inherit; text-decoration: none; }
.d-card .d-title a:hover { color: var(--accent); }
.d-card .d-pricing { color: var(--muted); font-size: 13px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; }
.d-card .d-price {
  color: var(--good); font-weight: 700;
  font-family: ui-monospace, monospace; font-size: 15px;
}
.d-card .d-merchant { color: var(--text); font-weight: 600; }
.d-card .d-sep { color: var(--border); margin: 0 4px; }
.d-card .d-stats { color: var(--muted); font-family: ui-monospace, monospace; font-size: 12px; }

/* Chip strip: feeds / flags / status / bought */
.d-card .d-tags { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.d-card .d-tag-group { display: flex; gap: 4px; align-items: center; }
.d-card .d-tag-label {
  text-transform: uppercase; letter-spacing: 0.4px; font-weight: 700;
  font-size: 9px; color: var(--muted); margin-right: 2px;
}
.d-card .d-tag-sep { width: 1px; height: 12px; background: var(--border); margin: 0 2px; }
.d-card .d-chip {
  padding: 2px 8px; background: var(--surface-alt); border: 1px solid var(--border);
  font-size: 10px; color: var(--muted); letter-spacing: 0.3px;
  text-transform: uppercase; font-weight: 600;
}
.d-card .d-chip.bought-chip {
  color: #f3c77c; background: rgba(247,185,85,0.15);
  border-color: rgba(247,185,85,0.4);
}

/* Content blocks */
.d-card .d-blocks { display: flex; flex-direction: column; gap: 8px; }
.d-card .d-block {
  padding: 10px 14px; font-size: 13px; line-height: 1.5;
  border-left: 2px solid var(--border); background: var(--surface-alt);
}
.d-card .d-blk-label {
  font-size: 9px; text-transform: uppercase; letter-spacing: 0.5px;
  font-weight: 700; color: var(--muted); margin-bottom: 4px;
  display: block;
}

.d-card .d-block.d-product { border-left-color: var(--accent); }
.d-card .d-block.d-product .d-blk-label { color: var(--accent); }
.d-card .d-prod-row {
  display: flex; gap: 8px;
  font-family: ui-monospace, monospace; font-size: 12px; line-height: 1.6;
}
.d-card .d-prod-k { color: var(--muted); width: 70px; flex-shrink: 0; }
.d-card .d-prod-v { color: var(--text); }
.d-card .d-price-diff {
  margin-top: 4px; padding-top: 6px; border-top: 1px dashed var(--border);
  font-family: ui-monospace, monospace; font-size: 12px;
}
.d-card .d-pd-list { color: var(--muted); text-decoration: line-through; }
.d-card .d-pd-arrow { color: var(--muted); margin: 0 6px; }
.d-card .d-pd-deal { color: var(--good); font-weight: 700; }
.d-card .d-pd-sav { color: var(--good); margin-left: 6px; }

.d-card .d-block.d-desc { color: var(--muted); }
.d-card .d-block.d-comment {
  border-left-color: rgba(90,169,255,0.6);
  background: rgba(90,169,255,0.04);
}
.d-card .d-block.d-comment .d-blk-label { color: var(--accent); }
.d-card .d-comment-q { font-style: italic; color: var(--text); margin-bottom: 4px; }
.d-card .d-comment-q::before { content: '" '; color: var(--accent); font-style: normal; }

.d-card .d-block.d-vibe { border-left-color: var(--good); background: rgba(76,217,123,0.05); }
.d-card .d-block.d-vibe .d-blk-label { color: var(--good); }
.d-card .d-block.d-vibe.rating-fair { border-left-color: var(--warn); background: rgba(247,185,85,0.05); }
.d-card .d-block.d-vibe.rating-fair .d-blk-label { color: var(--warn); }
.d-card .d-block.d-vibe.rating-poor,
.d-card .d-block.d-vibe.rating-skip {
  border-left-color: var(--bad); background: rgba(239,100,100,0.05);
}
.d-card .d-block.d-vibe.rating-poor .d-blk-label,
.d-card .d-block.d-vibe.rating-skip .d-blk-label { color: var(--bad); }
.d-card .d-vibe-rating { font-weight: 700; }
.d-card .d-vibe-ts { margin-left: 8px; color: var(--muted); font-weight: 400; }
.d-card .d-vibe-caveats { margin-top: 4px; color: var(--muted); font-size: 12px; }

/* Score section — 5 numeric vote buttons */
.d-card .d-score-section {
  margin-top: 4px; padding-top: 14px;
  border-top: 1px solid var(--border);
}
.d-card .d-score-section-lbl {
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--muted); font-weight: 700; margin-bottom: 8px;
}
.d-card .d-votes { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.d-card .vote-btn.d-vote {
  display: flex; align-items: center; justify-content: center;
  padding: 10px 12px; border: 1px solid transparent; border-radius: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 700; font-size: 15px; letter-spacing: 0.3px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
  min-height: 40px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035), 0 1px 2px rgba(0,0,0,0.2);
}
.d-card .vote-btn.d-vote.p20  { background: rgba(76,217,123,0.13);  color: #8fe3a7; border-color: rgba(76,217,123,0.28); }
.d-card .vote-btn.d-vote.p20:hover  { background: rgba(76,217,123,0.22); border-color: rgba(76,217,123,0.5); color: #b0ebc1; }
.d-card .vote-btn.d-vote.p20.active { background: rgba(76,217,123,0.4);  color: #0a1a10; border-color: rgba(76,217,123,0.8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 0 0 1px rgba(76,217,123,0.35), 0 2px 8px rgba(76,217,123,0.28); }
.d-card .vote-btn.d-vote.p10  { background: rgba(122,210,160,0.1);  color: #9cd6b3; border-color: rgba(122,210,160,0.24); }
.d-card .vote-btn.d-vote.p10:hover  { background: rgba(122,210,160,0.18); border-color: rgba(122,210,160,0.44); color: #b8e2c6; }
.d-card .vote-btn.d-vote.p10.active { background: rgba(122,210,160,0.32); color: #0d1c14; border-color: rgba(122,210,160,0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 0 0 1px rgba(122,210,160,0.3); }
.d-card .vote-btn.d-vote.zero { background: rgba(138,147,164,0.09); color: #b5bcc9; border-color: rgba(138,147,164,0.22); }
.d-card .vote-btn.d-vote.zero:hover { background: rgba(138,147,164,0.18); border-color: rgba(138,147,164,0.4); color: #d6dbe3; }
.d-card .vote-btn.d-vote.zero.active{ background: rgba(138,147,164,0.3); color: #fff; border-color: rgba(138,147,164,0.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 0 0 1px rgba(138,147,164,0.3); }
.d-card .vote-btn.d-vote.m10  { background: rgba(247,185,85,0.1);  color: #f3ce91; border-color: rgba(247,185,85,0.22); }
.d-card .vote-btn.d-vote.m10:hover  { background: rgba(247,185,85,0.18); border-color: rgba(247,185,85,0.42); color: #f7dcaa; }
.d-card .vote-btn.d-vote.m10.active { background: rgba(247,185,85,0.35); color: #1a1408; border-color: rgba(247,185,85,0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 0 0 1px rgba(247,185,85,0.3), 0 2px 8px rgba(247,185,85,0.2); }
.d-card .vote-btn.d-vote.m20  { background: rgba(239,100,100,0.1);  color: #f49b9b; border-color: rgba(239,100,100,0.22); }
.d-card .vote-btn.d-vote.m20:hover  { background: rgba(239,100,100,0.18); border-color: rgba(239,100,100,0.42); color: #f7bcbc; }
.d-card .vote-btn.d-vote.m20.active { background: rgba(239,100,100,0.38); color: #fff; border-color: rgba(239,100,100,0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 0 0 1px rgba(239,100,100,0.3), 0 2px 8px rgba(239,100,100,0.25); }
.d-card .vote-btn.d-vote.selected { outline: 2px solid var(--accent); outline-offset: 1px; }

/* Vote sub-context — notes only */
.d-card .d-vote-sub {
  margin-top: 10px; padding: 12px 14px;
  background: var(--surface-alt);
  border: 1px solid var(--accent); border-left-width: 3px;
}
.d-card .d-vote-sub.hidden { display: none; }
.d-card .d-vote-sub .vs-head { font-size: 12px; font-weight: 600; margin-bottom: 8px; }
.d-card .d-vote-sub .vs-head .muted { color: var(--muted); font-weight: 400; font-size: 11px; margin-left: 4px; }
.d-card .d-vote-sub .vs-delta-bought,
.d-card .d-vote-sub .vs-delta-good { color: var(--good); }
.d-card .d-vote-sub .vs-delta-meh { color: var(--muted); }
.d-card .d-vote-sub .vs-delta-not_interested { color: var(--warn); }
.d-card .d-vote-sub .vs-delta-bad,
.d-card .d-vote-sub .vs-delta-expired { color: var(--bad); }
.d-card .d-vote-sub .vs-notes-label {
  display: block; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.4px; color: var(--muted); font-weight: 700; margin-bottom: 4px;
}
.d-card .d-vote-sub .vs-notes-input {
  width: 100%; min-height: 60px; background: var(--surface);
  border: 1px solid var(--border); color: var(--text);
  padding: 8px 10px; font-family: inherit; font-size: 13px;
  resize: vertical; line-height: 1.5; border-radius: 3px;
}
.d-card .d-vote-sub .vs-notes-input:focus { outline: none; border-color: var(--accent); }
.d-card .d-vote-sub .vs-actions {
  margin-top: 10px; display: flex; justify-content: flex-end; gap: 8px;
}
.d-card .d-vote-sub .vs-actions button {
  padding: 6px 14px; font-size: 12px; border-radius: 4px; cursor: pointer;
}
.d-card .d-vote-sub .vs-cancel {
  background: transparent; color: var(--muted); border: 1px solid var(--border);
}
.d-card .d-vote-sub .vs-cancel:hover { color: var(--text); }
.d-card .d-vote-sub .vs-submit {
  background: var(--accent); color: #fff; border: 1px solid var(--accent);
}

/* Secondary action row */
.d-card .d-secondary {
  margin-top: 4px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  font-size: 12px; color: var(--muted);
}
.d-card .d-sec-btn {
  background: transparent; color: var(--muted); border: 1px solid var(--border);
  padding: 5px 12px; font-size: 12px; cursor: pointer; border-radius: 4px;
  transition: color 0.12s, border-color 0.12s, background 0.12s;
}
.d-card .d-sec-btn:hover { color: var(--text); border-color: var(--muted); }
.d-card .d-sec-btn.d-product:hover { color: var(--warn); border-color: var(--warn); }
.d-card .d-sec-btn.d-vibe:hover { color: var(--accent); border-color: var(--accent); }
.d-card .d-sec-btn.d-expired:hover,
.d-card .d-sec-btn.d-expired.active { color: var(--bad); border-color: var(--bad); background: rgba(239,100,100,0.08); }
.d-card .d-sec-btn.d-bought {
  color: #f3c77c; border-color: rgba(247,185,85,0.35);
  background: rgba(247,185,85,0.06);
}
.d-card .d-sec-btn.d-bought:hover {
  background: rgba(247,185,85,0.15); border-color: rgba(247,185,85,0.55); color: #ffdca0;
}
.d-card .d-sec-btn.d-bought.active {
  background: rgba(247,185,85,0.28); color: #1a1408;
  border-color: rgba(247,185,85,0.7); font-weight: 600;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15);
}
.d-card .d-spacer { flex: 1; }
.d-card .d-posted { font-family: ui-monospace, monospace; font-size: 10px; }

/* Responsive: narrow viewport collapses to single column */
@media (max-width: 820px) {
  .review-card.d-card { grid-template-columns: 1fr; }
  .d-card .d-img, .d-card .d-img-ph { width: 100%; max-width: 280px; }
}

/* ── Multi-page top navigation ─────────────────────────────────────────── */
.top-nav {
  display: flex;
  align-items: center;
  gap: 0;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  padding: 0 20px;
  height: 44px;
  position: sticky;
  top: 0;
  z-index: 100;
}
.top-nav .brand-link {
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  text-decoration: none;
  margin-right: 24px;
  letter-spacing: -0.3px;
  white-space: nowrap;
}
.top-nav .brand-link:hover { color: var(--accent); }
.top-nav .nav-links {
  display: flex;
  gap: 2px;
  flex: 1;
}
.top-nav .nav-links a {
  padding: 5px 12px;
  border-radius: 5px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
  transition: background 0.12s, color 0.12s;
  white-space: nowrap;
}
.top-nav .nav-links a:hover { color: var(--text); background: var(--surface-alt); }
.top-nav .nav-links a.active { color: var(--accent); background: rgba(90,169,255,0.1); }
.top-nav .nav-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}
.top-nav .nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  background: var(--accent);
  color: #fff;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  margin-left: 4px;
  vertical-align: middle;
}
.top-nav .nav-badge.hidden { display: none; }

/* Page layout */
.page-body { padding: 16px 24px; }
.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 12px;
}
.page-header h1 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}
