/* AI Watch -- two sub-views (Watches / Live) behind one segmented control,
   plus Alerts as its own destination linked from a quiet button beside the
   control (2026-09-23 nav merge; Alerts previously sat as a third tab here).
   Every colour, spacing, radius, elevation and duration below is a var()
   from site/member-tokens.css per docs/design/DESIGN-SYSTEM.md; no literal
   hex or off-scale size is used.
   Loaded last in site/member.html so these token-only rules take precedence
   over the older literal ones they are beginning to replace (see
   DESIGN-SYSTEM.md section 15, items 2-4, 12 for the .ps-* component set
   introduced here). Dark mode needs no separate rules: every value below
   resolves through a token that already has a [data-theme="dark"] arm. */

/* ---------------------------------------------------------------------- */
/* Shared ps-* primitives this tab draws on (DESIGN-SYSTEM.md section 9)   */
/* ---------------------------------------------------------------------- */

.live-member .ps-tabs--segmented {
  display: flex; flex-wrap: wrap; gap: var(--space-1);
  padding: var(--space-1); margin: 0 0 var(--space-6);
  background: var(--well); border: var(--border-strong) solid var(--border-control);
  border-radius: var(--radius-md); width: fit-content; max-width: 100%;
}
.live-member .ps-tabs--segmented button {
  min-height: 40px; padding: var(--space-2) var(--space-4); border: 0;
  border-radius: var(--radius-sm); background: transparent; color: var(--body);
  font: 700 var(--font-size-200)/1.2 var(--font-mono); letter-spacing: .04em; text-transform: uppercase;
  cursor: pointer; transition: background-color var(--duration-2) var(--ease-standard), color var(--duration-2) var(--ease-standard);
}
.live-member .ps-tabs--segmented button:hover { background: var(--card1-hi); color: var(--text); }
.live-member .ps-tabs--segmented button:focus-visible { outline: 0; box-shadow: var(--focus-ring); }
.live-member .ps-tabs--segmented button[aria-current="page"] { background: var(--panel); color: var(--text); box-shadow: var(--elev-1); }
.live-member .ps-tabs-label-short { display: none; }

.live-member .ps-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: var(--control-height); padding: var(--space-2) var(--space-4);
  border: var(--border-strong) solid var(--border-control); border-radius: var(--radius-md);
  background: var(--well); color: var(--text); font: 700 var(--font-size-400)/1.2 var(--font-sans);
  cursor: pointer; text-decoration: none; text-align: center;
  transition: background-color var(--duration-2) var(--ease-standard), border-color var(--duration-2) var(--ease-standard), transform var(--duration-2) var(--ease-standard);
}
.live-member .ps-btn:hover { border-color: var(--accent); background: var(--card1-hi); }
.live-member .ps-btn:focus-visible { outline: 0; border-color: var(--accent); box-shadow: var(--focus-ring); }
.live-member .ps-btn:active { transform: translateY(1px); }
.live-member .ps-btn[disabled], .live-member .ps-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; box-shadow: none; }
.live-member .ps-btn--primary { background: var(--cta-grad); border-color: var(--outline); color: var(--accent-ink); box-shadow: var(--elev-2); text-transform: uppercase; }
.live-member .ps-btn--primary:hover:not([disabled]) { background: var(--cta-grad-hi); border-color: var(--outline); }
.live-member .ps-btn--secondary { background: var(--well); }
.live-member .ps-btn--ghost { border-color: transparent; background: transparent; color: var(--body); box-shadow: none; }
.live-member .ps-btn--ghost:hover:not([disabled]) { border-color: var(--border-control); background: var(--card1-hi); color: var(--text); }
.live-member .ps-btn--danger { border-color: var(--status-down); color: var(--status-down); background: color-mix(in srgb, var(--status-down) 10%, var(--well)); }
.live-member .ps-btn--danger:hover:not([disabled]) { background: color-mix(in srgb, var(--status-down) 18%, var(--well)); }
.live-member .ps-btn--compact { min-height: 36px; padding: var(--space-2) var(--space-3); font-size: var(--font-size-200); }
.live-member .ps-btn--icon { width: var(--control-height); min-width: var(--control-height); padding: 0; }

.live-member .ps-panel.watch-editor-panel,
.live-member .ps-panel.watch-drawer-detail,
.live-member .ps-panel.alert-settings,
.live-member .ps-panel.alert-inbox { background: linear-gradient(180deg, var(--card1), var(--card2)); border: var(--border-strong) solid var(--outline); border-radius: var(--radius-lg); padding: clamp(var(--space-5), 3vw, var(--space-6)); box-shadow: var(--elev-inset), var(--elev-3); }
.live-member .ps-panel--quiet { box-shadow: none !important; border-width: var(--border-hairline) !important; }

.live-member .ps-pill { display: inline-flex; align-items: center; gap: var(--space-1); padding: var(--space-1) var(--space-2); border: var(--border-hairline) solid var(--border-control); border-radius: var(--radius-pill); font: 700 var(--font-size-100)/1.2 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--body); white-space: nowrap; }
.live-member .ps-pill--matches { border-color: var(--accent); color: var(--accent-text); }
.live-member .ps-pill--over-budget { border-color: var(--status-down); color: var(--status-down); }
.live-member .ps-pill--on { border-color: var(--status-up); color: var(--status-up); }

.live-member .ps-empty { padding: var(--space-6); border: var(--border-strong) dashed var(--border-control); border-radius: var(--radius-md); background: color-mix(in srgb, var(--panel) 85%, transparent); }
.live-member .ps-empty__eyebrow { font: 700 var(--font-size-200)/1.4 var(--font-mono); letter-spacing: .1em; color: var(--accent-text); text-transform: uppercase; margin: 0 0 var(--space-2); }
.live-member .ps-empty__title { font-size: var(--font-size-600); margin: 0 0 var(--space-2); max-width: 42ch; }
.live-member .ps-empty__body { color: var(--body); font-size: var(--font-size-300); margin: 0; max-width: 42ch; }
.live-member .ps-empty__actions { margin-top: var(--space-4); }
.live-member .ps-empty--inline { padding: var(--space-4) 0 0; border: 0; background: none; }
.live-member .ps-empty--inline .ps-empty__title { font-size: var(--font-size-500); }
.live-member .ps-empty--unavailable { border-style: dashed; }

.live-member .ps-skeleton-group { display: grid; gap: var(--space-3); }
/* A tile skeleton mirrors the tile grid it stands in for (one, two, three columns) so the module does not load as a tall single column. */
.live-member .ps-skeleton-group:has(> .ps-skeleton--tile) { grid-template-columns: 1fr; gap: var(--space-4); }
.live-member .ps-skeleton { background: var(--well); border-radius: var(--radius-md); position: relative; overflow: hidden; }
.live-member .ps-skeleton::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, var(--card1-hi), transparent); animation: member-shimmer var(--duration-ambient) linear infinite; }
@media (prefers-reduced-motion: reduce) {
  .live-member .ps-skeleton::after { animation: none; }
  .live-member .ps-overlay--drawer .ps-overlay__surface { animation: none; }
}
.live-member .ps-skeleton--text { height: 14px; max-width: 70%; }
.live-member .ps-skeleton--row { height: 76px; }
.live-member .ps-skeleton--tile { height: 240px; }

.live-member .ps-chip { display: inline-flex; align-items: center; gap: var(--space-1); min-height: 34px; padding: var(--space-2) var(--space-3); border-radius: var(--radius-pill); border: var(--border-hairline) solid var(--border-control); background: var(--well); color: var(--body); font: 700 var(--font-size-200)/1.2 var(--font-sans); cursor: pointer; }
.live-member .ps-chip:hover { border-color: var(--accent); }
.live-member .ps-chip:focus-visible { outline: 0; box-shadow: var(--focus-ring); }
.live-member .ps-chip.is-selected { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, var(--well)); color: var(--text); }

.live-member .ps-glyph { font: 900 var(--font-size-500)/1 var(--font-sans); }
.live-member .ps-glyph--affirm { color: var(--status-up); }
.live-member .ps-glyph--negate { color: var(--status-down); }
.live-member .ps-glyph--unknown { color: var(--status-neutral); }

.live-member .ps-overlay--drawer { position: fixed; inset: 0; z-index: var(--z-overlay); display: flex; justify-content: flex-end; }
.live-member .ps-overlay__scrim { position: absolute; inset: 0; background: rgba(16,10,28,.45); border: 0; padding: 0; cursor: pointer; }
.live-member .ps-overlay--drawer .ps-overlay__surface { position: relative; width: min(480px, 100%); max-width: 100%; height: 100%; overflow-y: auto; background: var(--panel); border-left: var(--border-strong) solid var(--outline); box-shadow: var(--elev-3); animation: watches-drawer-in var(--duration-3) var(--ease-entrance); }
.live-member .ps-overlay--drawer .ps-overlay__surface:focus { outline: none; }
.live-member .ps-overlay__header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-5); border-bottom: var(--border-hairline) solid var(--border); background: var(--panel); }
.live-member .ps-overlay__header h2 { margin: 0; font-size: var(--font-size-600); }
.live-member .ps-overlay__body { padding: var(--space-5); display: grid; gap: var(--space-5); }
@keyframes watches-drawer-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 639px) { .live-member .ps-overlay--drawer .ps-overlay__surface { width: 100%; } }

/* ---------------------------------------------------------------------- */
/* Shared hero + segmented header, all three sub-views                     */
/* ---------------------------------------------------------------------- */

.live-member .watches-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-6); margin: 0 0 var(--space-5); }
.live-member .watches-hero > div { max-width: 670px; }
.live-member .watches-hero h2 { margin-bottom: var(--space-2); }
.live-member .watches-hero p:not(.eyebrow) { margin: 0; font-size: var(--font-size-500); }

/* AI Watch's own tab row: the two-tab segmented control plus the quiet link
   to Alerts that replaced its third tab. The link sits in the same row,
   pushed to the far end, rather than inside the segmented control's own
   button group -- it is a destination, not a peer view of this page. */
.live-member .ai-watch-subnav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); margin: 0 0 var(--space-6); }
.live-member .ai-watch-subnav .ps-tabs--segmented { margin: 0; }
.live-member .ai-watch-see-alerts { margin-left: auto; }
.live-member .ps-btn--link { min-height: 0; padding: 0; border: 0; background: transparent; color: var(--accent-text); text-decoration: underline; font: 700 var(--font-size-300)/1.2 var(--font-sans); text-transform: none; }
.live-member .ps-btn--link:hover { border: 0; background: transparent; color: var(--accent); }
.live-member .ps-btn--link:focus-visible { outline: 0; box-shadow: var(--focus-ring); border-radius: var(--radius-xs); }

/* ---------------------------------------------------------------------- */
/* My grails (watches list)                                                */
/* ---------------------------------------------------------------------- */

.live-member .watch-section-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-5); margin-top: var(--space-1); }
.live-member .watch-section-head > span { color: var(--body); font: 700 var(--font-size-200)/1.4 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }
.live-member .watch-list { display: grid; gap: var(--space-2); margin: var(--space-4) 0 0; }
.live-member .watch-inbox-row { width: 100%; display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: var(--space-3); min-height: 84px; padding: var(--space-2); border: var(--border-strong) solid var(--border-control); border-radius: var(--radius-md); background: var(--panel); box-shadow: none; text-align: left; text-transform: none; cursor: pointer; }
.live-member .watch-inbox-row:hover { border-color: var(--accent); background: var(--card1-hi); transform: none; }
.live-member .watch-inbox-row:focus-visible { outline: 0; box-shadow: var(--focus-ring); }
.live-member .watch-inbox-art { display: block; width: 48px; aspect-ratio: 5 / 7; border-radius: var(--radius-sm); overflow: hidden; background: var(--card2); }
.live-member .watch-inbox-art-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.live-member .watch-inbox-art-img-empty { box-sizing: border-box; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--card2); border: var(--border-strong) dashed var(--border-control); border-radius: inherit; color: var(--muted); }
.live-member .watch-inbox-art-img-empty svg { width: 40%; height: 40%; }
.live-member .watch-inbox-copy { min-width: 0; display: grid; gap: 2px; }
.live-member .watch-inbox-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: var(--font-size-500); }
.live-member .watch-inbox-meta { color: var(--accent-text); font: 700 var(--font-size-100)/1.25 var(--font-mono); letter-spacing: .04em; text-transform: uppercase; }
.live-member .watch-inbox-target { color: var(--text); font-weight: 800; font-size: var(--font-size-300); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-member .watch-inbox-scan { font-size: var(--font-size-200); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-member .watch-inbox-flags { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-1); }
.live-member .watch-inbox-next-scan { margin: var(--space-4) 0 0; font-size: var(--font-size-300); }
.live-member .watches-sync-stale-banner { display: flex; align-items: baseline; gap: var(--space-2); margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border: var(--border-strong) solid var(--status-stale); border-radius: var(--radius-md); background: color-mix(in srgb, var(--status-stale) 10%, var(--well)); color: var(--text); font-size: var(--font-size-300); font-weight: 700; }
.live-member .watches-sync-stale-banner strong { color: var(--status-stale); }

/* ---------------------------------------------------------------------- */
/* Watch drawer: latest matches + quick actions + the edit form            */
/* ---------------------------------------------------------------------- */

.live-member .watch-drawer-facts { display: grid; gap: var(--space-2); margin: 0 0 var(--space-4); padding-bottom: var(--space-4); border-bottom: var(--border-hairline) solid var(--border); }
.live-member .watch-drawer-facts div { display: grid; gap: 2px; }
.live-member .watch-drawer-facts dt { color: var(--body); font: 700 var(--font-size-100)/1.4 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }
.live-member .watch-drawer-facts dd { margin: 0; color: var(--text); font-size: var(--font-size-400); font-weight: 700; overflow-wrap: anywhere; }
.live-member .watch-drawer-detail-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--space-3); }
.live-member .watch-drawer-detail-head h4 { margin: 0; font-size: var(--font-size-500); }
.live-member .watch-drawer-detail-head time { color: var(--body); font-size: var(--font-size-200); }
.live-member .watch-match-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.live-member .watch-match-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: var(--space-3); padding: var(--space-2); border: var(--border-hairline) solid var(--border); border-radius: var(--radius-sm); background: var(--well); }
.live-member .watch-match-row.is-over-budget { border-color: var(--status-down); }
.live-member .watch-match-art { display: block; width: 40px; aspect-ratio: 5 / 7; border-radius: var(--radius-xs); overflow: hidden; background: var(--card2); }
.live-member .watch-match-art-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.live-member .watch-match-art-img-empty { box-sizing: border-box; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--card2); border: var(--border-strong) dashed var(--border-control); border-radius: inherit; color: var(--muted); }
.live-member .watch-match-art-img-empty svg { width: 40%; height: 40%; }
.live-member .watch-match-copy { min-width: 0; display: grid; gap: 2px; }
.live-member .watch-match-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--font-size-300); }
.live-member .watch-match-price { font: 700 var(--font-size-300)/1.3 var(--font-mono); color: var(--text); }
.live-member .watch-match-age { font-size: var(--font-size-100); text-transform: uppercase; letter-spacing: .04em; }
.live-member .watch-drawer-quick-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); padding-top: var(--space-4); border-top: var(--border-hairline) solid var(--border); }
.live-member .watch-editor-panel h3 { margin-top: 0; }

/* ---------------------------------------------------------------------- */
/* Live opportunities                                                      */
/* ---------------------------------------------------------------------- */

.live-member .opportunity-filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-5); }
.live-member .opportunity-filters #opportunity-scan-now { margin-left: auto; }
.live-member .opportunity-scan-status { margin: 0 0 var(--space-3); }
.live-member .opportunity-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-4); }
.live-member .opportunity-tile { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: var(--space-4); padding: var(--space-4); border: var(--border-strong) solid var(--outline); border-radius: var(--radius-lg); background: linear-gradient(180deg, var(--card1), var(--card2)); box-shadow: var(--elev-2); }
.live-member .opportunity-tile-art { display: block; width: 96px; aspect-ratio: .6072; align-self: start; border-radius: var(--radius-sm); overflow: hidden; background: var(--card2); }
.live-member .opportunity-tile-art-img { width: 100%; height: 100%; object-fit: contain; display: block; }
.live-member .opportunity-tile-art-img-empty { box-sizing: border-box; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--card2); border: var(--border-strong) dashed var(--border-control); border-radius: inherit; color: var(--muted); }
.live-member .opportunity-tile-art-img-empty svg { width: 36%; height: 36%; }
.live-member .opportunity-tile-body { min-width: 0; display: grid; gap: var(--space-2); }
.live-member .opportunity-tile-title { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.live-member .opportunity-tile-price-row { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.live-member .opportunity-tile-live, .live-member .opportunity-tile-guide { display: grid; gap: 2px; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); }
.live-member .opportunity-tile-live { border: var(--border-strong) solid var(--data-live); }
.live-member .opportunity-tile-live .eyebrow { color: var(--data-live); }
.live-member .opportunity-tile-live strong { font: 800 var(--font-size-600)/1.2 var(--font-mono); }
.live-member .opportunity-tile-guide { border: var(--border-strong) dashed var(--data-benchmark); }
.live-member .opportunity-tile-guide .eyebrow { color: var(--data-benchmark); }
.live-member .opportunity-tile-guide strong { font: 700 var(--font-size-500)/1.2 var(--font-mono); }
.live-member .opportunity-tile-discount { margin: 0; color: var(--status-up); font: 800 var(--font-size-400)/1.2 var(--font-sans); }
.live-member .opportunity-tile-source-chip { display: inline-block; align-self: flex-start; margin: 0 0 var(--space-1); padding: 2px var(--space-2); border-radius: var(--radius-pill); background: color-mix(in srgb, var(--accent) 16%, var(--well)); color: var(--accent); font: 700 var(--font-size-100)/1.4 var(--font-sans); text-transform: uppercase; letter-spacing: 0.02em; }
.live-member .opportunity-tile-auction-meta { margin: 0; color: var(--muted); font: 600 var(--font-size-200)/1.3 var(--font-sans); }
.live-member .opportunity-checklist { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-3); list-style: none; margin: 0; padding: 0; }
.live-member .opportunity-checklist li { display: inline-flex; align-items: center; gap: 4px; font-size: var(--font-size-200); color: var(--body); }
.live-member .opportunity-load-more-row { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); margin: var(--space-5) 0 0; text-align: center; }
.live-member .opportunity-load-more-row .muted { font-size: var(--font-size-200); }

/* ---------------------------------------------------------------------- */
/* Alerts + settings                                                       */
/* ---------------------------------------------------------------------- */

.live-member .watches-alerts-layout { display: grid; grid-template-columns: minmax(0,1fr); gap: var(--space-5); align-items: start; }
.live-member .alert-inbox-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding-bottom: var(--space-4); border-bottom: var(--border-strong) solid var(--border); }
.live-member .alert-inbox-head h3 { margin: 0; }
.live-member #alert-inbox-summary { margin: var(--space-1) 0 0; }
.live-member #alert-inbox-summary.alert-inbox-summary--stale { color: var(--status-stale); font-weight: 700; }
.live-member #alert-inbox-list { display: grid; gap: 0; }
.live-member .alert-receipt { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) 0; border-bottom: var(--border-hairline) solid var(--border); }
.live-member .alert-receipt:last-child { border-bottom: 0; padding-bottom: 0; }
.live-member .alert-receipt.is-unread { background: linear-gradient(90deg, var(--row-hi), transparent); margin-inline: -12px; padding-inline: 12px; }
.live-member .alert-receipt-art { display: block; flex: 0 0 auto; width: 44px; aspect-ratio: 5 / 7; border-radius: var(--radius-sm); overflow: hidden; background: var(--card2); }
.live-member .alert-receipt-art-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.live-member .alert-receipt-art-img-empty { box-sizing: border-box; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--card2); border: var(--border-strong) dashed var(--border-control); border-radius: inherit; color: var(--muted); }
.live-member .alert-receipt-art-img-empty svg { width: 40%; height: 40%; }
.live-member .alert-receipt-main { min-width: 0; flex: 1 1 auto; }
.live-member .alert-receipt-main h3 { margin: 5px 0; overflow-wrap: anywhere; font-size: var(--font-size-500); }
.live-member .alert-receipt-main > p { display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.live-member .alert-receipt-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); color: var(--body); font: 700 var(--font-size-100)/1.4 var(--font-mono); text-transform: uppercase; }
.live-member .alert-receipt-kind-chip { display: inline-flex; align-items: center; padding: 2px var(--space-2); border: var(--border-hairline) solid var(--accent); border-radius: var(--radius-pill); color: var(--accent-text); font: 800 var(--font-size-100)/1.4 var(--font-mono); text-transform: uppercase; letter-spacing: .04em; }
.live-member .unread-badge { border-radius: var(--radius-pill); padding: 3px var(--space-2); background: var(--accent); color: var(--accent-ink); font: 800 var(--font-size-100)/1.2 var(--font-mono); text-transform: uppercase; }
.live-member .alert-channel-icons { display: flex; gap: var(--space-1); list-style: none; margin: var(--space-2) 0 0; padding: 0; }
.live-member .alert-channel-icon { padding: 2px var(--space-2); border-radius: var(--radius-pill); border: var(--border-hairline) solid var(--border-control); font: 700 var(--font-size-100)/1.4 var(--font-mono); text-transform: uppercase; color: var(--muted); letter-spacing: .04em; }
.live-member .alert-channel-icon.is-on { border-color: var(--status-up); color: var(--status-up); }
.live-member .alert-receipt .actions { flex: 0 0 auto; display: flex; gap: var(--space-2); }
.live-member .alert-inbox-load-more-row { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); margin: var(--space-4) 0 0; text-align: center; }
.live-member .alert-inbox-load-more-row .muted { font-size: var(--font-size-200); }

.live-member .alert-settings-channels { display: grid; gap: var(--space-2); margin: var(--space-3) 0 var(--space-5); }
.live-member .alert-settings-channel { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.live-member .alert-settings-channel .alert-settings-channel-toggle { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font: 700 var(--font-size-200)/1.3 var(--font-sans); color: var(--body); }
.live-member .alert-settings-controls { display: grid; gap: var(--space-3); }
.live-member .alert-settings-row { display: grid; gap: var(--space-1); font-weight: 700; font-size: var(--font-size-300); }
.live-member .alert-settings-row input, .live-member .alert-settings-row select { min-height: var(--control-height-compact, 40px); border: var(--border-hairline) solid var(--border); border-radius: var(--radius-sm); background: var(--well); color: var(--text); padding: 0 var(--space-3); }
.live-member .alert-settings-row.is-disabled input, .live-member .alert-settings-row.is-disabled select { opacity: .6; cursor: not-allowed; }
.live-member .alert-settings-row .muted { font-weight: 400; font-size: var(--font-size-100); }
.live-member .alert-settings-quiet-hours { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.live-member .alert-settings-actions { display: flex; align-items: center; gap: var(--space-3); margin-top: var(--space-4); }
.live-member .alert-settings-saved { color: var(--status-up); font-size: var(--font-size-200); font-weight: 700; }

/* Success banner: the scan-now result channel (competitive-spec.md 4.1 P0)
   -- same shape as .error, mirrored onto --status-up so a completed scan
   never borrows the error/role=alert treatment for good news. */
.live-member .notice { padding: 12px; border: 2px solid var(--status-up); border-radius: var(--control-radius); color: var(--text); background: color-mix(in srgb, var(--status-up) 8%, var(--well)); }

/* ---------------------------------------------------------------------- */
/* Breakpoints (DESIGN-SYSTEM.md section 6: mobile-first, min-width)       */
/* ---------------------------------------------------------------------- */

@media (min-width: 640px) {
  .live-member .opportunity-tile { grid-template-columns: 120px minmax(0,1fr); }
  .live-member .opportunity-tile-art { width: 120px; }
}

@media (min-width: 900px) {
  .live-member .opportunity-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .live-member .ps-skeleton-group:has(> .ps-skeleton--tile) { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .live-member .watches-alerts-layout { grid-template-columns: minmax(0,1fr) minmax(300px,.4fr); }
}

@media (min-width: 1100px) {
  .live-member .opportunity-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .live-member .ps-skeleton-group:has(> .ps-skeleton--tile) { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 639px) {
  .live-member .watches-hero { align-items: stretch; flex-direction: column; }
  .live-member .watches-hero .ps-btn--primary { width: 100%; }
  .live-member .ps-tabs--segmented { display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; }
  .live-member .ps-tabs--segmented button { padding-inline: var(--space-2); text-align: center; }
  .live-member .ps-tabs-label-full { display: none; }
  .live-member .ps-tabs-label-short { display: inline; }
  .live-member .watch-inbox-row { grid-template-columns: 44px minmax(0,1fr); }
  .live-member .watch-inbox-art { width: 44px; }
  .live-member .watch-inbox-flags { grid-column: 2; flex-direction: row; align-items: center; margin-top: 2px; }
  .live-member .watch-match-row { grid-template-columns: 34px minmax(0,1fr); }
  .live-member .watch-match-art { width: 34px; }
  .live-member .watch-match-row .ps-btn { grid-column: 1 / -1; width: 100%; }
  .live-member .opportunity-tile { grid-template-columns: 1fr; }
  .live-member .alert-inbox-head { flex-direction: column; align-items: flex-start; text-align: left; }
  .live-member .alert-receipt { align-items: flex-start; flex-direction: column; }
  .live-member .alert-receipt .actions { width: 100%; }
  .live-member .alert-receipt .actions > * { flex: 1 1 auto; justify-content: center; text-align: center; }
}

/* ---- AI Watch truth-at-a-glance (2026-09-24): time-urgency tiers, freshness
   bar, bid-outcome pills, ended-listing group and named art placeholder. One
   shared token set (.ps-urgency--*) used by AI Watch's "Your eBay activity",
   Overview's "Ending soon" and the Live tab's Fanatics auction meta -- see
   site/member.js urgencyInfo/urgencyMarkup for the tier boundaries this
   styles. Colour is never the only signal: every tier also carries a weight
   or icon change, not just a colour swap (WCAG AA in both themes). No
   separate site/ai-watch.css -- src/index.js's static-asset route serves an
   explicit filename allowlist it is out of this change's scope to extend,
   so these rules live in this file (already allowlisted, already loaded on
   every AI Watch/Overview screen) instead. ---- */

.live-member .ps-urgency { display: inline-flex; align-items: center; gap: 4px; font: 700 var(--font-size-200)/1.2 var(--font-mono, 'Geist Mono', ui-monospace, monospace); white-space: nowrap; }
.live-member .ps-urgency--critical { color: var(--status-down); font-weight: 800; }
.live-member .ps-urgency--warning { color: var(--status-stale); font-weight: 700; }
.live-member .ps-urgency--neutral { color: var(--body2); font-weight: 600; }
.live-member .ps-urgency--later { color: var(--muted); font-weight: 500; }
.live-member .ps-urgency--ended { color: var(--muted2); font-weight: 500; font-style: italic; }

.live-member .ps-freshness-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 0 0 var(--space-2); margin-bottom: var(--space-2); border-bottom: var(--border-hairline) dashed var(--border); }
.live-member .ps-freshness-label { color: var(--muted); font-size: var(--font-size-200); }
.live-member .ps-freshness-label.is-stale { color: var(--status-stale); font-weight: 700; }

.live-member .ps-outcome-pill { flex: 0 0 auto; }
.live-member .ps-outcome-pill.is-winning { border-color: var(--status-up); color: var(--status-up); }
.live-member .ps-outcome-pill.is-outbid { border-color: var(--status-down); color: var(--status-down); }
.live-member .ps-outcome-pill.is-won { border-color: var(--status-up); color: var(--status-up); }
.live-member .ps-outcome-pill.is-lost { border-color: var(--muted2); color: var(--muted); }
.live-member .ps-signal-row.is-outbid { border-color: color-mix(in srgb, var(--status-down) 55%, var(--border-control)); background: color-mix(in srgb, var(--status-down) 6%, var(--well)); }
.live-member .ps-signal-row__outcome-note { flex: 1 1 100%; color: var(--muted); font-size: var(--font-size-200); }
.live-member .ps-signal-row__action { flex: 0 0 auto; }

.live-member .ai-watch-activity-ended { margin-top: var(--space-3); }
.live-member .ai-watch-activity-ended > summary { cursor: pointer; list-style: none; color: var(--muted); font: 700 var(--font-size-200)/1.2 var(--font-mono, 'Geist Mono', ui-monospace, monospace); text-transform: uppercase; letter-spacing: .05em; padding: var(--space-2) 0; }
.live-member .ai-watch-activity-ended > summary::-webkit-details-marker { display: none; }
.live-member .ai-watch-activity-ended > summary::before { content: '\25b8'; display: inline-block; margin-right: var(--space-1); transition: transform var(--duration-2) var(--ease-standard); }
.live-member .ai-watch-activity-ended[open] > summary::before { transform: rotate(90deg); }
.live-member .ps-signal-row--ended { opacity: .62; }
.live-member .ps-signal-row--ended .ps-signal-row__title { color: var(--body2); }

.live-member .watch-inbox-art-img-named, .live-member .watch-match-art-img-named { padding: 4px; text-align: center; }
.live-member .watch-inbox-art-img-named-text, .live-member .watch-match-art-img-named-text { font: 700 var(--font-size-100)/1.15 var(--font-sans); color: var(--muted); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }

@media (max-width: 560px) {
  .live-member .ps-freshness-bar { flex-wrap: wrap; }
}

/* PriceCharting source link on an AI Watch row (site/member.js
   watchRowMarkup): a sibling of the row's own <button>, never nested in it,
   drawn inside the row's edge. A linked row reserves the link's column on
   its right; at phone width the link drops to its own line under the copy. */
.live-member .watch-inbox-item { position: relative; }
.live-member .watch-inbox-item--sourced .watch-inbox-row { padding-right: calc(var(--space-2) + var(--ps-source-col) + var(--space-2)); }
.live-member .watch-inbox-item .watch-inbox-source { position: absolute; top: 50%; right: calc(var(--space-2) + var(--border-strong)); margin-top: calc(var(--control-height) / -2); }
@media (max-width: 639px) {
  .live-member .watch-inbox-item--sourced .watch-inbox-row { padding-right: var(--space-2); padding-bottom: calc(var(--control-height) + 2 * var(--space-2)); }
  .live-member .watch-inbox-item .watch-inbox-source { top: auto; right: auto; bottom: calc(var(--space-2) + var(--border-strong)); left: calc(var(--space-2) + 44px + var(--space-3)); margin-top: 0; }
}

/* Receipts without a catalog binding identify their source, never a fake card. */
.live-member .alert-receipt-source { display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:var(--muted); background:var(--card2); }
.live-member .alert-receipt-source .ps-icon { width:24px; height:24px; }
.live-member .alert-receipt-source-ebay { width:34px; height:18px; fill:currentColor; }
.live-member .alert-settings-channel .alert-settings-channel-toggle { min-height:44px; flex-direction:row; white-space:nowrap; cursor:pointer; }
.live-member .alert-settings-channel-toggle input[type="checkbox"] { width:20px; height:20px; min-height:20px; padding:0; margin:0; flex:0 0 20px; accent-color:var(--accent); }

.live-member .alert-receipt-art-img.ps-art-photo-thumb { object-fit:contain; background:var(--art-photo-matte); }