:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bg: #07111f;
  --panel: rgba(10, 23, 40, 0.91);
  --panel-soft: rgba(255,255,255,0.035);
  --border: rgba(255,255,255,0.10);
  --border-strong: rgba(255,255,255,0.16);
  --pink: #ff4fa3;
  --yellow: #b39d49;
  --teal: #30d6ca;
  --text: #ffffff;
  --muted: rgba(255,255,255,0.62);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at top left, rgba(255, 79, 163, 0.10), transparent 34%),
    radial-gradient(circle at top right, rgba(48, 214, 202, 0.10), transparent 30%),
    var(--bg);
  color: var(--text);
}

button,
input,
select {
  font: inherit;
}

button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 2px;
}

.shell {
  width: min(1380px, calc(100% - 32px));
  margin: 0 auto;
  padding: 28px 0 36px;
}

.page-header {
  margin-bottom: 22px;
}

.eyebrow {
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  opacity: 0.66;
}

.page-header h1 {
  margin: 4px 0 0;
  font-size: 2rem;
  line-height: 1;
  background: linear-gradient(90deg, var(--pink), var(--teal));
  -webkit-background-clip: text;
  color: transparent;
}

.subtitle {
  margin-top: 7px;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  opacity: 0.78;
}

.toolbar,
.panel {
  border: 1px solid var(--border);
  background: var(--panel);
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.18);
}

.search-wrap {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.search-input,
.filter {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.04);
  color: #fff;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 0.88rem;
  outline: none;
}

.search-input:focus,
.filter:focus {
  border-color: var(--pink);
}

.filters {
  display: grid;
  grid-template-columns: 150px 160px minmax(140px, 1fr) minmax(160px, 1.2fr) minmax(140px, 1fr) minmax(190px, 1.2fr) auto auto;
  gap: 10px;
  margin-top: 10px;
}

.btn {
  min-height: 42px;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  cursor: pointer;
}

.btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.btn-primary {
  border: 1px solid var(--pink);
  background: rgba(255,79,163,0.13);
  color: var(--pink);
}

.btn-secondary {
  border: 1px solid var(--teal);
  background: rgba(48,214,202,0.10);
  color: var(--teal);
}

.btn-ghost {
  border: 1px solid var(--border-strong);
  background: rgba(255,255,255,0.04);
  color: #fff;
}

.status {
  margin: 0 0 18px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255,255,255,0.035);
  font-size: 0.84rem;
  opacity: 0.82;
}

.status.is-error {
  color: #ff879f;
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
}

.panel-kicker {
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  color: var(--pink);
}

.panel h2 {
  margin: 3px 0 0;
  font-size: 1.25rem;
}

.count {
  min-width: 48px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,79,163,0.12);
  color: var(--pink);
  text-align: center;
  font-size: 0.8rem;
  font-weight: 850;
}

.result-range {
  margin-top: 5px;
  color: var(--muted);
  font-size: 0.8rem;
}

.table-wrap {
  width: 100%;
  overflow-x: auto;
}

.results-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 1060px;
}

.results-table th,
.results-table td {
  padding: 10px 9px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  text-align: left;
  vertical-align: middle;
  font-size: 0.82rem;
}

.results-table th {
  font-size: 0.66rem;
  letter-spacing: 0.07em;
  opacity: 0.58;
  white-space: nowrap;
}

.column-sort {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  margin: 0;
  font: inherit;
  letter-spacing: inherit;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  opacity: 0.78;
}

.column-sort:hover {
  opacity: 1;
  color: #fff;
}

.column-sort.is-active {
  opacity: 1;
  color: #fff;
  font-weight: 950;
}

.sort-arrow {
  display: inline-block;
  min-width: 0.9em;
  margin-left: 3px;
  color: var(--teal);
  font-size: 0.92em;
  font-weight: 950;
}

.results-table tbody tr:hover {
  background: rgba(255,255,255,0.025);
}

.image-col,
.image-cell {
  width: 72px;
}

.thumbnail-button,
.item-link-button {
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.thumbnail-button {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 10px;
  background: rgba(255,255,255,0.96);
  overflow: hidden;
}

.item-thumbnail {
  width: 52px;
  height: 52px;
  display: block;
  object-fit: contain;
}

.item-thumbnail.image-missing,
.item-hero-image.image-missing {
  display: none;
}

.item-cell {
  min-width: 300px;
}

.item-link-button {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.item-name {
  color: #fff;
  font-size: 0.9rem;
  font-weight: 850;
  line-height: 1.25;
}

.item-id {
  color: var(--teal);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.item-taxonomy {
  margin-top: 5px;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.3;
}

.item-link-button:hover .item-name,
.thumbnail-button:hover + .item-name {
  color: var(--pink);
}

.condition-badge,
.type-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.05);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.condition-new {
  border-color: rgba(255,79,163,0.45);
  color: var(--pink);
}

.condition-used {
  border-color: rgba(48,214,202,0.45);
  color: var(--teal);
}

.sale-price {
  color: var(--pink);
  font-size: 1.02rem !important;
  font-weight: 950;
  white-space: nowrap;
}

.volt-percent {
  font-size: 0.94rem !important;
  font-weight: 900;
  white-space: nowrap;
}

.volt-percent.is-positive {
  color: #8fe8ba;
}

.volt-percent.is-negative {
  color: #ff9aae;
}

.volt-percent.is-neutral {
  color: rgba(255,255,255,0.62);
}

.volt-price {
  color: var(--teal);
  font-weight: 850;
  white-space: nowrap;
}


.validated-count {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-align: center;
  white-space: nowrap;
}

.seller-cell,
.date-cell {
  color: rgba(255,255,255,0.78);
}

.date-cell {
  white-space: nowrap;
}

.pagination {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 16px;
  margin-top: 16px;
  padding-top: 2px;
}

.page-button:first-child {
  justify-self: start;
}

.page-button:last-child {
  justify-self: end;
}

.page-center {
  display: grid;
  justify-items: center;
  gap: 7px;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
}

.page-size-filter {
  min-height: 34px;
  padding: 6px 30px 6px 9px;
  font-size: 0.72rem;
}

.back-button {
  margin-bottom: 14px;
}

.item-hero-panel {
  padding: 22px;
}

.item-hero {
  display: grid;
  grid-template-columns: minmax(220px, 340px) 1fr;
  gap: 28px;
  align-items: center;
}

.item-image-stage {
  min-height: 300px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.97);
  padding: 18px;
  overflow: hidden;
}

.item-hero-image {
  width: 100%;
  max-width: 300px;
  height: 270px;
  object-fit: contain;
}

.item-hero-copy h2 {
  margin-top: 6px;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.08;
}

.item-number {
  margin-top: 8px;
  color: var(--teal);
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: 0.05em;
}

.item-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.item-descriptors {
  display: grid;
  gap: 9px;
  margin: 22px 0 0;
}

.descriptor-row {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 12px;
  align-items: baseline;
}

.descriptor-row dt {
  color: rgba(255,255,255,0.48);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.07em;
}

.descriptor-row dd {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 750;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}

.stat-card {
  border: 1px solid var(--border);
  background: var(--panel-soft);
  border-radius: 12px;
  padding: 13px;
}

.stat-card-summary {
  grid-column: 1 / -1;
}

.stat-condition {
  margin-bottom: 11px;
}

.stat-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.summary-stat-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stat-value {
  font-size: 1.02rem;
  font-weight: 900;
}

.stat-label {
  display: block;
  margin-top: 3px;
  color: rgba(255,255,255,0.52);
  font-size: 0.64rem;
  line-height: 1.3;
}

.item-sales-table {
  min-width: 900px;
}

.detail-sale-price {
  font-size: 1.08rem !important;
}

.detail-percent {
  font-size: 1rem !important;
}

.is-hidden {
  display: none !important;
}

.empty-row td {
  text-align: center;
  padding: 28px;
  opacity: 0.55;
}

.footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 22px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  opacity: 0.55;
}

.footer-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--teal);
}

@media (max-width: 1160px) {
  .filters {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .sort-filter {
    grid-column: span 2;
  }
}

@media (max-width: 820px) {
  .shell {
    width: min(100% - 20px, 1380px);
    padding-top: 18px;
  }

  .search-wrap {
    grid-template-columns: 1fr;
  }

  .filters {
    grid-template-columns: 1fr 1fr;
  }

  .sort-filter {
    grid-column: span 2;
  }

  .item-hero {
    grid-template-columns: 1fr;
  }

  .item-image-stage {
    min-height: 260px;
  }

  .item-hero-image {
    height: 230px;
  }

  .stats-grid {
    grid-template-columns: 1fr;
  }

  .stat-card-summary {
    grid-column: auto;
  }

  .stat-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .summary-stat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pagination {
    grid-template-columns: 1fr 1fr;
  }

  .page-center {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .page-button:first-child,
  .page-button:last-child {
    justify-self: stretch;
  }
}

@media (max-width: 520px) {
  .filters {
    grid-template-columns: 1fr;
  }

  .sort-filter {
    grid-column: auto;
  }

  .item-hero-panel {
    padding: 14px;
  }

  .item-image-stage {
    min-height: 220px;
  }

  .item-hero-image {
    height: 190px;
  }

  .stat-row,
  .summary-stat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .descriptor-row {
    grid-template-columns: 75px 1fr;
  }
}

.results-mode-toggle {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 0 0 14px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,0.035);
}

.mode-button {
  min-width: 110px;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  cursor: pointer;
}

.mode-button.is-active {
  border-color: rgba(48,214,202,0.45);
  background: rgba(48,214,202,0.10);
  color: #fff;
}

.grouped-results-table {
  min-width: 1240px;
}

.grouped-item-row {
  cursor: pointer;
}

.grouped-item-row:hover {
  background: rgba(48,214,202,0.035) !important;
}

.condition-mix {
  min-width: 118px;
}

.condition-count {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 2px 0;
  white-space: nowrap;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 800;
}

.median-price,
.seller-count {
  font-weight: 800;
  white-space: nowrap;
}

.seller-count,
.validated-count {
  text-align: center !important;
}

/* v0.3.5 item market intelligence */
.market-panel { margin-top: 16px; }
.market-heading { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; margin-bottom:16px; }
.market-heading h2 { margin:3px 0 0; }
.market-controls { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }
.segmented-control { display:inline-flex; gap:4px; padding:4px; border:1px solid var(--border); border-radius:11px; background:rgba(255,255,255,.035); }
.market-condition,.market-range { min-height:34px; padding:7px 11px; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--muted); font-size:.7rem; font-weight:900; letter-spacing:.05em; cursor:pointer; }
.market-condition.is-active,.market-range.is-active { border-color:rgba(48,214,202,.45); background:rgba(48,214,202,.1); color:#fff; }
.market-status { color:var(--muted); font-size:.8rem; margin-bottom:12px; }
.market-status.is-error { color:#ff879f; }
.market-metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.market-metric { border:1px solid var(--border); border-radius:11px; padding:12px; background:var(--panel-soft); min-width:0; }
.market-metric.market-primary { border-color:rgba(255,79,163,.32); }
.market-metric.market-current { border-color:rgba(48,214,202,.30); }
.market-metric-value { font-size:1.18rem; line-height:1.1; font-weight:950; white-space:nowrap; }
.market-metric-label { margin-top:5px; color:var(--muted); font-size:.64rem; font-weight:850; letter-spacing:.05em; line-height:1.25; }
.market-metric-sub { margin-top:4px; color:rgba(255,255,255,.55); font-size:.66rem; line-height:1.25; }
.market-positive { color:#8fe8ba; }
.market-negative { color:#ff9aae; }
.market-neutral { color:rgba(255,255,255,.75); }
.market-chart-wrap { border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.02); padding:12px 12px 8px; overflow:hidden; }
.market-chart { width:100%; height:auto; min-height:260px; display:block; }
.chart-grid { stroke:rgba(255,255,255,.09); stroke-width:1; }
.chart-axis-text { fill:rgba(255,255,255,.48); font-size:20px; font-family:system-ui,sans-serif; }
.chart-whatnot { fill:none; stroke:var(--yellow); stroke-width:5; stroke-linecap:round; stroke-linejoin:round; }
.chart-volt { fill:none; stroke:var(--pink); stroke-width:5; stroke-linecap:round; stroke-linejoin:round; }
.chart-point-whatnot { fill:var(--yellow); stroke:#0b1020; stroke-width:3; }
.chart-point-volt { fill:var(--pink); stroke:#0b1020; stroke-width:3; }
.chart-empty { fill:rgba(255,255,255,.48); font-size:24px; font-weight:750; font-family:system-ui,sans-serif; }
.chart-legend { display:flex; flex-wrap:wrap; gap:18px; margin:4px 4px 2px; color:var(--muted); font-size:.68rem; font-weight:900; letter-spacing:.05em; }
.chart-legend span { display:flex; align-items:center; gap:7px; }
.legend-line { width:25px; height:3px; border-radius:4px; display:inline-block; }
.whatnot-line { background:var(--yellow); }
.volt-line { background:var(--pink); }
.market-chart-note { margin-top:8px; color:var(--muted); font-size:.72rem; line-height:1.4; }
.stat-card-30d { border-color:rgba(48,214,202,.25); }
.stat-card-30d .stat-condition { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.stat-range-label { color:var(--muted); font-size:.68rem; font-weight:900; letter-spacing:.06em; }
@media (max-width:900px){ .market-heading{display:grid;} .market-controls{justify-content:flex-start;} .market-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:520px){ .market-controls{display:grid;} .segmented-control{width:100%;} .market-condition,.market-range{flex:1;} .market-metric-grid{grid-template-columns:1fr 1fr;} .market-chart{min-height:210px;} }


/* v0.3.8 market clarity + chart polish */
.market-benchmark-explainer {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin-top:7px;
  max-width:760px;
  color:rgba(255,255,255,.58);
  font-size:.72rem;
  line-height:1.45;
}
.market-benchmark-explainer strong:first-child { color:var(--yellow); }
.market-benchmark-explainer strong:last-of-type { color:var(--pink); }

.stat-row-market-summary {
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.stat-card-30d .stat-value {
  font-size:1.12rem;
}
.stat-summary-note {
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid rgba(255,255,255,.06);
  color:rgba(255,255,255,.48);
  font-size:.66rem;
  line-height:1.4;
}

.market-metric-grid {
  gap:11px;
}
.market-metric {
  min-height:88px;
  padding:13px 14px;
  border-radius:12px;
}
.market-metric.market-primary {
  border-color:rgba(179,157,73,.42);
  box-shadow:inset 0 0 0 1px rgba(179,157,73,.04);
}
.market-metric.market-current {
  border-color:rgba(255,79,163,.36);
  box-shadow:inset 0 0 0 1px rgba(255,79,163,.04);
}
.market-metric-value {
  font-size:1.28rem;
}
.market-metric-label {
  font-size:.66rem;
}
.market-metric-sub {
  font-size:.68rem;
}

.market-chart-wrap {
  border-color:rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 50% -35%, rgba(48,214,202,.055), transparent 50%),
    rgba(255,255,255,.018);
  padding:16px 16px 10px;
}
.market-chart {
  min-height:300px;
}
.chart-grid {
  stroke:rgba(255,255,255,.075);
}
.chart-axis-text {
  fill:rgba(255,255,255,.52);
  font-size:18px;
  font-weight:600;
}
.chart-date-label {
  font-size:18px;
}
.chart-whatnot {
  stroke-width:5.5;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.28));
}
.chart-volt {
  stroke-width:5;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.24));
}
.chart-area-whatnot {
  fill:url(#whatnotAreaGradient);
  stroke:none;
  pointer-events:none;
}
.chart-area-volt {
  fill:url(#voltAreaGradient);
  stroke:none;
  pointer-events:none;
}
.chart-area-stop-whatnot-start {
  stop-color:var(--yellow);
  stop-opacity:.16;
}
.chart-area-stop-volt-start {
  stop-color:var(--pink);
  stop-opacity:.11;
}
.chart-area-stop-end {
  stop-color:transparent;
  stop-opacity:0;
}
.chart-point-whatnot,
.chart-point-volt {
  transition:r .15s ease;
}
.chart-point-whatnot:hover,
.chart-point-volt:hover {
  r:9;
}
.chart-current-volt {
  stroke:var(--pink);
  stroke-width:2;
  stroke-dasharray:9 8;
  opacity:.58;
}
.chart-current-label {
  fill:var(--pink);
  font-size:14px;
  font-weight:900;
  letter-spacing:.04em;
  font-family:system-ui,sans-serif;
}
.current-volt-line {
  height:0;
  border-top:2px dashed var(--pink);
  background:transparent;
}
.chart-legend {
  gap:22px;
  margin:7px 4px 3px;
}
.market-chart-note {
  padding:9px 2px 0;
  color:rgba(255,255,255,.52);
  font-size:.73rem;
  line-height:1.55;
}
.market-chart-note strong:first-child { color:var(--yellow); }
.market-chart-note strong:nth-of-type(2) { color:var(--pink); }

@media (max-width:820px) {
  .stat-row-market-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:520px) {
  .market-benchmark-explainer { font-size:.68rem; }
  .market-chart { min-height:240px; }
}


/* v0.3.9 - HVB six-month-tracker inspired chart styling */
.market-chart-wrap {
  border:1px solid rgba(255,255,255,.15);
  border-radius:24px;
  background:#07101f;
  padding:18px 18px 12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

.market-chart {
  width:100%;
  min-height:340px;
  display:block;
  overflow:visible;
}

.chart-grid {
  stroke:rgba(255,255,255,.14);
  stroke-width:1;
}

.chart-axis-text {
  fill:rgba(255,255,255,.67);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:700;
}

.chart-price-label {
  font-size:18px;
}

.chart-date-label {
  font-size:18px;
  font-weight:650;
}

.chart-whatnot {
  fill:none;
  stroke:var(--yellow);
  stroke-width:5.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.chart-volt {
  fill:none;
  stroke:var(--pink);
  stroke-width:5.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.chart-area-whatnot {
  fill:url(#whatnotAreaGradient);
  stroke:none;
  pointer-events:none;
}

.chart-area-volt {
  fill:url(#voltAreaGradient);
  stroke:none;
  pointer-events:none;
}

.chart-area-stop-whatnot-start {
  stop-color:var(--yellow);
  stop-opacity:.23;
}

.chart-area-stop-whatnot-end {
  stop-color:var(--yellow);
  stop-opacity:.015;
}

.chart-area-stop-volt-start {
  stop-color:var(--pink);
  stop-opacity:.20;
}

.chart-area-stop-volt-end {
  stop-color:var(--pink);
  stop-opacity:.01;
}

.chart-point-halo {
  pointer-events:none;
  opacity:.18;
}

.chart-point-halo-whatnot {
  fill:var(--yellow);
}

.chart-point-halo-volt {
  fill:var(--pink);
}

.chart-point-whatnot {
  fill:var(--yellow);
  stroke:var(--yellow);
  stroke-width:1.5;
}

.chart-point-volt {
  fill:var(--pink);
  stroke:var(--pink);
  stroke-width:1.5;
}

.chart-current-volt {
  stroke:var(--pink);
  stroke-width:2.3;
  stroke-dasharray:10 9;
  stroke-linecap:round;
  opacity:.62;
}

.chart-current-label {
  fill:var(--pink);
  font-size:13px;
  font-weight:900;
  letter-spacing:.06em;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.chart-legend {
  margin:8px 8px 2px;
  gap:24px;
  font-size:.67rem;
}

.legend-line {
  width:28px;
  height:4px;
}

.current-volt-line {
  height:0;
  border-top:2px dashed var(--pink);
  background:transparent;
}

@media (max-width:520px) {
  .market-chart-wrap {
    border-radius:18px;
    padding:10px 8px 8px;
  }

  .market-chart {
    min-height:260px;
  }

  .chart-price-label,
  .chart-date-label {
    font-size:16px;
  }
}


/* v0.3.10 - thinner chart + responsive text/label protection */
.market-chart-wrap {
  padding:14px 14px 10px;
  overflow:hidden;
}

.market-chart {
  min-height:300px;
  max-height:430px;
}

.chart-whatnot,
.chart-volt {
  stroke-width:3.2;
}

.chart-current-volt {
  stroke-width:1.6;
  stroke-dasharray:8 8;
}

.chart-point-whatnot {
  stroke-width:1;
}

.chart-point-volt {
  stroke-width:1;
}

.chart-price-label {
  font-size:15px;
  font-weight:650;
}

.chart-date-label {
  font-size:14px;
  font-weight:650;
}

.chart-current-label {
  font-size:11px;
  font-weight:850;
  letter-spacing:.035em;
}

.chart-legend {
  flex-wrap:wrap;
  row-gap:7px;
  column-gap:18px;
  margin:6px 6px 4px;
  font-size:.60rem;
  line-height:1.2;
}

.legend-line {
  width:24px;
  height:3px;
}

.market-chart-note {
  font-size:.67rem;
  line-height:1.48;
  overflow-wrap:anywhere;
}

@media (max-width:900px) {
  .market-chart-wrap {
    padding:10px 8px 8px;
  }

  .market-chart {
    min-height:260px;
  }

  .chart-whatnot,
  .chart-volt {
    stroke-width:2.8;
  }

  .chart-price-label {
    font-size:14px;
  }

  .chart-date-label {
    font-size:12px;
  }

  .chart-current-label {
    font-size:10px;
  }

  .chart-legend {
    font-size:.56rem;
    column-gap:14px;
  }

  .market-chart-note {
    font-size:.63rem;
  }
}

@media (max-width:650px) {
  .market-chart-wrap {
    overflow-x:hidden;
    border-radius:16px;
  }

  .market-chart {
    min-height:230px;
  }

  .chart-whatnot,
  .chart-volt {
    stroke-width:2.4;
  }

  .chart-price-label {
    font-size:12px;
  }

  .chart-date-label {
    font-size:10px;
  }

  .chart-current-label {
    font-size:9px;
  }

  .chart-legend {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
    font-size:.52rem;
  }

  .chart-legend span {
    min-width:0;
    white-space:normal;
  }

  .market-chart-note {
    font-size:.60rem;
    line-height:1.42;
  }
}

@media (max-width:430px) {
  .market-chart {
    min-height:215px;
  }

  .chart-date-label {
    font-size:9px;
  }

  .chart-price-label {
    font-size:11px;
  }

  .chart-current-label {
    font-size:8px;
  }

  .chart-legend {
    grid-template-columns:1fr;
  }
}


/* v0.3.11 - consolidated condition summaries + like-for-like market comparison */
.stats-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.condition-summary-card {
  padding:16px 18px 14px;
}

.condition-summary-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
}

.condition-market-30d {
  padding:0;
}

.condition-market-title {
  margin-bottom:9px;
  color:rgba(255,255,255,.50);
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.09em;
}

.condition-market-grid {
  display:grid;
  grid-template-columns:1.25fr 1fr 1fr 1fr;
  gap:12px;
  align-items:end;
}

.condition-market-grid > div {
  min-width:0;
}

.condition-market-grid strong {
  display:block;
  color:#fff;
  font-size:1.18rem;
  font-weight:950;
  line-height:1.05;
  white-space:nowrap;
}

.condition-market-grid > div:first-child strong {
  font-size:1.48rem;
}

.condition-market-grid span {
  display:block;
  margin-top:5px;
  color:rgba(255,255,255,.48);
  font-size:.58rem;
  font-weight:850;
  letter-spacing:.04em;
  line-height:1.25;
}

.condition-market-meta {
  margin-top:10px;
  color:rgba(255,255,255,.43);
  font-size:.61rem;
  line-height:1.35;
}

.condition-history-mini {
  display:grid;
  grid-template-columns:.7fr 1fr 1.5fr;
  gap:12px;
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.07);
}

.condition-history-mini strong {
  display:block;
  color:rgba(255,255,255,.78);
  font-size:.80rem;
  line-height:1.15;
}

.condition-history-mini span {
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.37);
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.04em;
}

.condition-new {
  border-color:rgba(255,79,163,.25);
}

.condition-used {
  border-color:rgba(48,214,202,.25);
}

.market-metric-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.market-metric {
  min-height:80px;
  padding:12px 14px;
}

.market-metric-value {
  font-size:1.18rem;
}

.market-metric-label {
  font-size:.61rem;
}

.market-metric-sub {
  font-size:.62rem;
}

.market-metric.market-primary {
  border-color:rgba(179,157,73,.38);
}

.market-metric.market-volt {
  border-color:rgba(255,79,163,.30);
}

.market-metric.market-comparison {
  border-color:rgba(48,214,202,.28);
}

.current-volt-line {
  display:none !important;
}

@media (max-width:900px) {
  .stats-grid {
    grid-template-columns:1fr;
  }

  .market-metric-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:620px) {
  .condition-market-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .condition-history-mini {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .condition-history-mini > div:last-child {
    grid-column:1 / -1;
  }
}

@media (max-width:430px) {
  .market-metric-grid {
    grid-template-columns:1fr 1fr;
  }
}


/* v0.3.12 - complete X-axis + hover detail + uncropped labels */
.market-chart-wrap {
  position:relative;
  overflow:visible;
  padding:12px 12px 18px;
}

.market-chart {
  width:100%;
  height:auto;
  min-height:360px;
  max-height:none;
  overflow:visible;
}

.chart-date-label {
  font-size:10px;
  font-weight:650;
}

.chart-price-label {
  font-size:13px;
}

.chart-hover-point {
  cursor:pointer;
  transition:r .12s ease, filter .12s ease;
}

.chart-hover-point:hover {
  r:8;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.28));
}

.market-chart-tooltip {
  position:absolute;
  z-index:30;
  width:min(360px, calc(100% - 16px));
  max-height:320px;
  overflow:auto;
  padding:12px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  background:rgba(5,14,29,.97);
  box-shadow:0 16px 40px rgba(0,0,0,.42);
  color:#fff;
  pointer-events:none;
  backdrop-filter:blur(10px);
}

.market-chart-tooltip.is-hidden {
  display:none;
}

.tooltip-title {
  font-size:.78rem;
  font-weight:950;
  letter-spacing:.04em;
}

.tooltip-summary {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5px 12px;
  margin-top:8px;
  font-size:.66rem;
  color:rgba(255,255,255,.62);
}

.tooltip-summary strong {
  color:#fff;
}

.tooltip-divider {
  height:1px;
  margin:9px 0;
  background:rgba(255,255,255,.09);
}

.tooltip-sales-title {
  margin-bottom:6px;
  color:rgba(255,255,255,.54);
  font-size:.60rem;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.tooltip-sale-row {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:9px;
  align-items:start;
  padding:5px 0;
  border-top:1px solid rgba(255,255,255,.05);
}

.tooltip-sale-row strong {
  font-size:.72rem;
  color:var(--yellow);
}

.tooltip-sale-row span {
  font-size:.60rem;
  line-height:1.35;
  color:rgba(255,255,255,.60);
}

.tooltip-empty {
  font-size:.62rem;
  color:rgba(255,255,255,.48);
}

.chart-legend {
  position:relative;
  margin-top:-20px;
  padding-top:4px;
}

.market-chart-note {
  position:relative;
  margin-top:8px;
  padding-top:8px;
}

@media (max-width:900px) {
  .market-chart {
    min-height:330px;
  }
  .chart-date-label {
    font-size:9px;
  }
}

@media (max-width:650px) {
  .market-chart-wrap {
    overflow-x:auto;
    overflow-y:visible;
    padding-bottom:14px;
  }

  .market-chart {
    min-width:760px;
    min-height:320px;
  }

  .market-chart-tooltip {
    position:fixed;
    left:12px !important;
    right:12px;
    top:auto !important;
    bottom:12px;
    width:auto;
    max-height:40vh;
    pointer-events:none;
  }
}


/* v0.3.15 - stock-style time axis + backend start_at support + visible time grid */
.market-chart-wrap {
  position:relative;
  overflow:visible;
}

.range-control {
  flex-wrap:wrap;
}

.chart-time-grid {
  stroke:rgba(255,255,255,.10);
  stroke-width:1;
  pointer-events:none;
}

.chart-time-grid-major {
  stroke:rgba(255,255,255,.19);
  stroke-width:1.15;
}

.chart-date-label {
  font-size:12px;
  font-weight:700;
  letter-spacing:.01em;
}

.market-chart-tooltip {
  z-index:100;
}

@media (max-width:650px) {
  .market-chart-wrap {
    overflow-x:auto;
    overflow-y:visible;
  }
  .market-chart {
    min-width:760px;
  }
}

/* v0.3.16 - cleaner stock chart + VOLT-specific hover */
.chart-grid {
  display:none !important;
}

.tooltip-title-volt {
  color:var(--pink);
}

.tooltip-volt-price {
  margin-top:5px;
  color:var(--pink);
  font-size:1.35rem;
  font-weight:950;
  line-height:1;
}

.tooltip-volt-source {
  margin-top:5px;
  color:rgba(255,255,255,.68);
  font-size:.64rem;
  font-weight:800;
}

.tooltip-volt-meta {
  display:grid;
  gap:4px;
  color:rgba(255,255,255,.58);
  font-size:.62rem;
  line-height:1.35;
}

.tooltip-volt-meta strong {
  color:#fff;
}

/* v0.3.17 - prominent NEW / USED market condition */
.market-condition {
  min-height: 42px;
  min-width: 86px;
  padding: 9px 18px;
  font-size: .82rem;
  letter-spacing: .07em;
  opacity: .68;
}
.market-condition[data-condition="NEW"] {
  border-color: rgba(255,79,163,.28);
  color: var(--pink);
}
.market-condition[data-condition="USED"] {
  border-color: rgba(48,214,202,.28);
  color: var(--teal);
}
.market-condition[data-condition="NEW"].is-active {
  border-color: var(--pink);
  background: rgba(255,79,163,.20);
  color: #fff;
  box-shadow: 0 0 0 1px rgba(255,79,163,.16) inset, 0 0 16px rgba(255,79,163,.10);
  opacity: 1;
}
.market-condition[data-condition="USED"].is-active {
  border-color: var(--teal);
  background: rgba(48,214,202,.18);
  color: #fff;
  box-shadow: 0 0 0 1px rgba(48,214,202,.14) inset, 0 0 16px rgba(48,214,202,.08);
  opacity: 1;
}
.market-panel[data-market-condition="NEW"] {
  border-top-color: rgba(255,79,163,.55);
}
.market-panel[data-market-condition="USED"] {
  border-top-color: rgba(48,214,202,.55);
}


/* Web authentication shell */
.page-header { position: relative; }
.account-bar { display:flex; align-items:center; gap:10px; position:absolute; right:0; top:0; }
.account-email { color:var(--muted); font-size:.78rem; max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.auth-inline-button { min-height:34px; padding:7px 10px; }
.auth-gate { min-height:60vh; display:grid; place-items:center; padding:34px 0; }
.auth-card { width:min(460px,100%); border:1px solid var(--border); background:var(--panel); border-radius:18px; padding:24px; box-shadow:0 18px 50px rgba(0,0,0,.3); }
.auth-card h2 { margin:6px 0 8px; font-size:1.35rem; }
.auth-card p { color:var(--muted); margin:0 0 18px; line-height:1.5; }
.auth-form { display:grid; gap:10px; }
.auth-status { margin:12px 0 0; }
.is-hidden { display:none !important; }
@media (max-width: 720px) {
  .account-bar { position:static; margin-top:12px; justify-content:space-between; }
  .account-email { max-width:210px; }
}

/* v0.2.0 - Tracker home / show-control shell */
.tracker-home { display:grid; gap:16px; }
.home-section {
  border:1px solid var(--border);
  background:var(--panel);
  border-radius:16px;
  padding:15px 16px;
  box-shadow:0 10px 30px rgba(0,0,0,.16);
}
.home-live-section { padding-bottom:12px; }
.home-section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:10px; }
.home-section-heading h2 { margin:3px 0 0; font-size:1rem; letter-spacing:.02em; }
.count-live { background:rgba(48,214,202,.11); color:var(--teal); }
.home-mini-button { min-height:34px; padding:7px 10px; }
.compact-show-list { display:grid; gap:8px; }
.compact-show-card {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.025);
}
.compact-show-card.is-tracking { border-color:rgba(48,214,202,.22); background:rgba(48,214,202,.035); }
.compact-show-copy { min-width:0; }
.compact-show-top { display:flex; align-items:center; gap:9px; min-width:0; }
.compact-show-top strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.86rem; }
.tracking-badge { padding:3px 7px; border:1px solid rgba(48,214,202,.38); border-radius:999px; color:var(--teal); font-size:.58rem; font-weight:900; letter-spacing:.08em; }
.compact-show-title { margin-top:3px; color:rgba(255,255,255,.77); font-size:.76rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.compact-show-meta { margin-top:5px; color:var(--muted); font-size:.68rem; }
.compact-show-start { min-height:36px; padding:7px 10px; white-space:nowrap; }
.home-empty { padding:11px 4px; color:var(--muted); font-size:.78rem; }
.home-text-button { margin-top:10px; padding:6px 0 0; border:0; background:none; color:var(--muted); font-size:.67rem; font-weight:850; letter-spacing:.06em; cursor:pointer; }
.home-text-button:hover { color:#fff; }
.home-primary-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:2px; }
.home-action-card {
  min-height:132px;
  padding:16px;
  text-align:left;
  border:1px solid var(--border-strong);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  color:#fff;
  cursor:pointer;
}
.home-action-card:hover { transform:translateY(-1px); border-color:rgba(255,255,255,.27); }
.home-action-card-sales { border-color:rgba(255,79,163,.28); }
.home-action-card-analytics { border-color:rgba(179,157,73,.35); }
.home-action-kicker { display:block; color:var(--muted); font-size:.61rem; font-weight:900; letter-spacing:.09em; }
.home-action-card strong { display:block; margin-top:8px; font-size:1rem; }
.home-action-card > span:last-child { display:block; margin-top:8px; color:var(--muted); font-size:.72rem; line-height:1.45; }
.back-home-button { margin-bottom:14px; }
.subpage-view { margin-top:4px; }
.completed-heading { align-items:center; }
.compact-toggle { margin:0; }
.completed-toolbar { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,260px); gap:10px; margin-bottom:14px; }
.coming-soon-panel { display:grid; gap:5px; padding:24px 14px; border:1px dashed rgba(255,255,255,.12); border-radius:12px; text-align:center; color:var(--muted); }
.coming-soon-panel strong { color:#fff; font-size:.8rem; }
.coming-soon-panel span { font-size:.75rem; line-height:1.5; }
.analytics-preview-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:16px 0; }
.analytics-preview-card { padding:14px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.025); }
.analytics-preview-card span { display:block; color:var(--muted); font-size:.62rem; font-weight:850; letter-spacing:.05em; }
.analytics-preview-card strong { display:block; margin-top:6px; font-size:1.2rem; }
.quick-save-modal { position:fixed; inset:0; z-index:500; display:grid; place-items:center; padding:18px; background:rgba(2,7,14,.78); backdrop-filter:blur(8px); }
.quick-save-card { position:relative; width:min(500px,100%); padding:22px; border:1px solid var(--border-strong); border-radius:18px; background:#0a1728; box-shadow:0 24px 80px rgba(0,0,0,.55); }
.quick-save-card h2 { margin:5px 0 8px; }
.quick-save-card p { margin:0 0 16px; color:var(--muted); font-size:.82rem; line-height:1.5; }
.quick-save-close { position:absolute; right:12px; top:10px; width:34px; height:34px; border:0; background:transparent; color:var(--muted); font-size:1.7rem; cursor:pointer; }
.quick-save-form { display:grid; gap:10px; }
.remote-start-option { display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:start; padding:11px; border:1px solid rgba(179,157,73,.28); border-radius:11px; background:rgba(179,157,73,.05); cursor:pointer; }
.remote-start-option input { margin-top:3px; }
.remote-start-option strong { display:block; color:var(--yellow); font-size:.76rem; }
.remote-start-option small { display:block; margin-top:3px; color:var(--muted); font-size:.67rem; line-height:1.4; }

@media (max-width:760px) {
  .home-primary-actions { grid-template-columns:1fr; }
  .home-action-card { min-height:105px; }
  .analytics-preview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .completed-toolbar { grid-template-columns:1fr; }
}

@media (max-width:560px) {
  .shell { width:min(100% - 20px,1380px); padding-top:18px; }
  .home-section { padding:13px; }
  .compact-show-card { grid-template-columns:1fr; }
  .compact-show-start { width:100%; }
  .home-section-heading { align-items:flex-start; }
  .quick-save-modal { align-items:end; padding:10px; }
  .quick-save-card { border-radius:18px 18px 12px 12px; }
}

/* v0.3.0 - mobile share + remote inspect/start/stop */
:root {
  --bg:#090D1A;
  --panel:rgba(21,28,47,.92);
  --pink:#FF3FA4;
  --teal:#08D8D1;
  --cyan:#42C8E9;
  --purple:#A970FF;
  --yellow:#FFD64A;
  --muted:#A7B0C4;
}
body {
  background:
    radial-gradient(circle at 12% 0%, rgba(255,63,164,.11), transparent 34%),
    radial-gradient(circle at 88% 0%, rgba(8,216,209,.10), transparent 31%),
    #090D1A;
}
.tracker-brand { display:flex; align-items:center; gap:13px; min-width:0; }
.tracker-brand-mark { width:58px; height:58px; object-fit:contain; filter:drop-shadow(0 8px 20px rgba(0,0,0,.28)); }
.tracker-brand-copy { min-width:0; }
.share-save-toast {
  border:1px solid rgba(8,216,209,.3);
  border-radius:13px;
  padding:11px 13px;
  background:rgba(8,216,209,.07);
  color:var(--teal);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.045em;
  text-align:center;
}
.share-save-toast.is-error { border-color:rgba(255,63,164,.35); background:rgba(255,63,164,.08); color:var(--pink); }
.saved-badge { padding:3px 7px; border:1px solid rgba(169,112,255,.35); border-radius:999px; color:var(--purple); font-size:.58rem; font-weight:900; letter-spacing:.08em; white-space:nowrap; }
.show-countdown { margin-left:7px; color:var(--yellow); font-weight:900; letter-spacing:.035em; }
.compact-show-controls { display:flex; align-items:center; justify-content:flex-end; gap:7px; }
.btn-stop { border:1px solid var(--yellow); background:rgba(255,214,74,.08); color:var(--yellow); }
.btn-stop:hover:not(:disabled) { background:rgba(255,214,74,.14); }
.inspect-flow-note { display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:center; padding:11px; border:1px solid rgba(8,216,209,.23); border-radius:11px; background:rgba(8,216,209,.045); }
.inspect-flow-dot { width:10px; height:10px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 5px rgba(8,216,209,.08),0 0 16px rgba(8,216,209,.35); }
.inspect-flow-note strong { display:block; color:var(--teal); font-size:.75rem; letter-spacing:.035em; }
.inspect-flow-note small { display:block; margin-top:3px; color:var(--muted); font-size:.67rem; line-height:1.4; }
.home-action-card-analytics { border-color:rgba(255,214,74,.32); }
@media (max-width:560px) {
  .page-header { margin-bottom:15px; }
  .tracker-brand-mark { width:49px; height:49px; }
  .page-header h1 { font-size:1.65rem; }
  .subtitle { font-size:.69rem; }
  .compact-show-card { gap:9px; }
  .compact-show-controls { width:100%; }
  .compact-show-controls .btn { width:100%; }
  .compact-show-meta { display:flex; flex-wrap:wrap; gap:3px; align-items:center; }
}


/* v0.3.1 completed show history */
.completed-status { margin:0 0 10px; color:var(--muted); font-size:.68rem; font-weight:800; letter-spacing:.08em; }
.completed-results { display:grid; gap:9px; }
.completed-show-card { padding:13px 14px; border:1px solid rgba(255,255,255,.10); border-radius:14px; background:rgba(255,255,255,.025); box-shadow:0 10px 28px rgba(0,0,0,.14); }
.completed-card-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.completed-card-head > div { min-width:0; }
.completed-card-head strong { color:#fff; font-size:.88rem; }
.completed-card-title { margin-top:4px; color:rgba(255,255,255,.68); font-size:.74rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.completed-date { flex:0 0 auto; color:var(--muted); font-size:.62rem; font-weight:800; letter-spacing:.05em; }
.completed-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(105px,1fr)); gap:7px; margin-top:11px; }
.completed-metric { padding:8px 9px; border:1px solid rgba(255,255,255,.07); border-radius:10px; background:rgba(255,255,255,.018); }
.completed-metric strong { display:block; color:#fff; font-size:.82rem; }
.completed-metric span { display:block; margin-top:2px; color:var(--muted); font-size:.56rem; font-weight:800; letter-spacing:.07em; }
.completed-store-card { border-color:rgba(255,214,74,.16); }
@media (max-width:640px) { .completed-card-head { gap:8px; } .completed-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }


/* v0.3.2 admin operations + completed-show analytics */
.admin-operations { display:grid; gap:14px; }
.completed-analytics-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:0 0 14px; }
.completed-analytics-grid .completed-metric { border-color:rgba(255,214,74,.12); background:rgba(255,214,74,.025); }
.completed-analytics-note { margin:-4px 0 14px; padding:10px 12px; border:1px solid rgba(255,255,255,.08); border-radius:10px; color:var(--muted); font-size:.67rem; line-height:1.45; }
@media (max-width:820px) { .completed-analytics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:430px) { .completed-analytics-grid { grid-template-columns:1fr 1fr; } }

/* v0.3.3 — VOLT Tracker branded UI */
:root {
  --bg:#090D1A;
  --panel:#151C2F;
  --panel-deep:#0F1525;
  --text:#F8F9FF;
  --muted:#A7B0C4;
  --pink:#FF3FA4;
  --purple:#A970FF;
  --cyan:#42C8E9;
  --teal:#08D8D1;
  --yellow:#FFD64A;
  --brand-gradient:linear-gradient(100deg,var(--pink) 0%,var(--purple) 48%,var(--teal) 100%);
  --brand-gradient-soft:linear-gradient(100deg,rgba(255,63,164,.16),rgba(169,112,255,.12),rgba(8,216,209,.13));
  --border:rgba(248,249,255,.10);
  --border-strong:rgba(248,249,255,.16);
}

body {
  min-height:100vh;
  background:
    radial-gradient(circle at 14% -8%,rgba(255,63,164,.13),transparent 28%),
    radial-gradient(circle at 82% -4%,rgba(8,216,209,.11),transparent 28%),
    linear-gradient(rgba(66,200,233,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(66,200,233,.018) 1px,transparent 1px),
    var(--bg);
  background-size:auto,auto,38px 38px,38px 38px,auto;
}

.shell { width:min(1380px,calc(100% - 34px)); padding-top:20px; }

.branded-header {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:104px;
  padding:17px 20px 19px;
  margin-bottom:18px;
  border:1px solid rgba(248,249,255,.10);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(21,28,47,.96),rgba(15,21,37,.92));
  box-shadow:0 18px 50px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025);
  overflow:hidden;
}

.branded-header::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  background:var(--brand-gradient);
  opacity:.95;
}

.tracker-brand { display:flex; align-items:center; gap:18px; min-width:0; }
.tracker-brand-lockup {
  display:block;
  width:min(430px,52vw);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 8px 22px rgba(0,0,0,.22));
}
.tracker-brand-meta {
  min-width:0;
  padding-left:16px;
  border-left:1px solid rgba(248,249,255,.13);
}
.tracker-brand-meta .eyebrow { color:rgba(248,249,255,.58); opacity:1; }
.tracker-brand-meta .subtitle { color:var(--muted); opacity:1; }

.account-bar { position:static; flex:0 0 auto; margin-left:18px; }
.account-email { color:var(--muted); }
.auth-inline-button:hover { border-color:rgba(255,63,164,.5); color:var(--pink); }

.toolbar,.panel,.home-section,.auth-card {
  border-color:rgba(248,249,255,.10);
  background:linear-gradient(150deg,rgba(21,28,47,.95),rgba(15,21,37,.94));
  box-shadow:0 14px 38px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.018);
}

.auth-card {
  position:relative;
  overflow:hidden;
  border-radius:22px;
  padding:28px;
}
.auth-card::before {
  content:"";
  position:absolute;
  width:220px;
  height:165px;
  right:-72px;
  top:-34px;
  background:url('assets/volt-tracker-logo-circle.png') center/contain no-repeat;
  opacity:.055;
  pointer-events:none;
}
.auth-card::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:var(--brand-gradient);
}

.panel-kicker { color:var(--pink); }
.home-live-section .panel-kicker { color:var(--teal); }
.home-saved-section .panel-kicker { color:var(--purple); }

.btn { transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease; }
.btn:hover:not(:disabled) { transform:translateY(-1px); }
.btn-primary {
  border-color:rgba(255,63,164,.72);
  background:linear-gradient(110deg,rgba(255,63,164,.16),rgba(169,112,255,.10));
  color:#FF68B7;
}
.btn-primary:hover:not(:disabled) { background:linear-gradient(110deg,rgba(255,63,164,.24),rgba(169,112,255,.16)); }
.btn-secondary { border-color:rgba(8,216,209,.58); color:var(--teal); }

.home-primary-actions { gap:14px; }
.home-action-card {
  position:relative;
  overflow:hidden;
  min-height:142px;
  padding:18px 18px 17px;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(21,28,47,.96),rgba(15,21,37,.93));
  box-shadow:0 12px 30px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.018);
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.home-action-card::before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(var(--purple),var(--cyan));
}
.home-action-card-sales::before { background:var(--yellow); }
.home-action-card-analytics::before { background:var(--brand-gradient); }
.home-action-card:hover {
  transform:translateY(-2px);
  border-color:rgba(248,249,255,.22);
  box-shadow:0 16px 38px rgba(0,0,0,.22),0 0 0 1px rgba(169,112,255,.06) inset;
}
.home-action-card-sales { border-color:rgba(255,214,74,.22); }
.home-action-card-analytics { border-color:rgba(8,216,209,.20); }
.home-action-kicker { color:var(--muted); }
.home-action-card strong { font-size:1.03rem; letter-spacing:.015em; }

.home-section { border-radius:18px; }
.compact-show-card,.completed-show-card,.analytics-preview-card,.completed-metric {
  background:rgba(248,249,255,.025);
  border-color:rgba(248,249,255,.08);
}
.compact-show-card.is-tracking {
  border-color:rgba(8,216,209,.23);
  background:linear-gradient(100deg,rgba(8,216,209,.045),rgba(169,112,255,.025));
}

.completed-analytics-grid .completed-metric {
  border-color:rgba(169,112,255,.14);
  background:linear-gradient(145deg,rgba(169,112,255,.045),rgba(66,200,233,.025));
}
.completed-store-card { border-color:rgba(255,214,74,.18); }

.results-mode-toggle,.segmented-control { background:rgba(15,21,37,.72); }
.mode-button.is-active { box-shadow:inset 0 -2px 0 var(--pink); }

.search-input,.filter {
  background:rgba(248,249,255,.035);
  border-color:rgba(248,249,255,.12);
}
.search-input:focus,.filter:focus { border-color:var(--purple); box-shadow:0 0 0 3px rgba(169,112,255,.08); }

.quick-save-card {
  background:linear-gradient(150deg,#151C2F,#0F1525);
  border-color:rgba(169,112,255,.24);
}
.quick-save-card::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  border-radius:18px 18px 0 0;
  background:var(--brand-gradient);
}

@media (max-width:900px) {
  .branded-header { align-items:flex-start; }
  .tracker-brand { align-items:flex-start; flex-direction:column; gap:8px; }
  .tracker-brand-lockup { width:min(390px,62vw); }
  .tracker-brand-meta { padding-left:0; border-left:0; }
}

@media (max-width:720px) {
  .branded-header { display:block; min-height:0; padding:15px 15px 17px; border-radius:17px; }
  .tracker-brand-lockup { width:min(100%,360px); }
  .account-bar { margin:13px 0 0; padding-top:11px; border-top:1px solid rgba(248,249,255,.08); }
}

@media (max-width:560px) {
  .shell { width:min(100% - 18px,1380px); padding-top:10px; }
  .branded-header { margin-bottom:12px; }
  .tracker-brand-lockup { width:min(100%,330px); }
  .tracker-brand-meta .eyebrow { font-size:.62rem; }
  .tracker-brand-meta .subtitle { margin-top:4px; font-size:.60rem; letter-spacing:.075em; }
  .home-action-card { min-height:112px; padding:15px; }
  .auth-card { padding:22px 18px; }
}


/* v0.3.4 — mobile PWA + verified admin header */
html {
  min-height:100%;
  background:#090D1A;
  overscroll-behavior:none;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body {
  min-height:100dvh;
  overflow-x:hidden;
  overscroll-behavior-y:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
}

button,
a,
input,
select {
  touch-action:manipulation;
}

.admin-badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(255,214,74,.55);
  border-radius:999px;
  background:rgba(255,214,74,.10);
  color:var(--yellow);
  box-shadow:0 0 0 1px rgba(255,214,74,.035) inset,0 0 18px rgba(255,214,74,.08);
  font-size:.62rem;
  font-weight:950;
  letter-spacing:.10em;
  line-height:1;
  white-space:nowrap;
}

@media (display-mode: standalone) {
  body { padding-top:env(safe-area-inset-top); }
  .shell {
    padding-bottom:calc(24px + env(safe-area-inset-bottom));
  }
}

@media (max-width:720px) {
  body { background-attachment:fixed; }
  .shell {
    width:100%;
    padding:calc(8px + env(safe-area-inset-top)) 9px calc(18px + env(safe-area-inset-bottom));
  }
  .branded-header {
    position:relative;
    margin:0 0 10px;
    padding:13px 13px 14px;
    border-radius:16px;
  }
  .tracker-brand { gap:6px; }
  .tracker-brand-lockup { width:min(100%,325px); }
  .tracker-brand-meta { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; }
  .tracker-brand-meta .subtitle { margin-top:0; }
  .account-bar {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    margin-top:10px;
    padding-top:10px;
  }
  .account-email {
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.70rem;
  }
  .auth-inline-button { min-height:40px; padding:8px 11px; }
  .home-section,
  .panel,
  .toolbar { border-radius:15px; padding:13px; margin-bottom:10px; }
  .home-primary-actions { grid-template-columns:1fr; gap:9px; }
  .home-action-card {
    width:100%;
    min-height:102px;
    padding:14px 15px;
    border-radius:15px;
    text-align:left;
  }
  .home-action-card strong { font-size:.95rem; }
  .home-action-card span:last-child { line-height:1.35; }
  .btn,
  .mode-button,
  .home-text-button { min-height:44px; }
  .search-input,
  .filter {
    min-height:46px;
    font-size:16px;
  }
  .search-wrap { grid-template-columns:1fr; }
  .search-wrap .btn { width:100%; }
  .filters { grid-template-columns:1fr 1fr; }
  .filters > * { min-width:0; }
  .completed-toolbar { grid-template-columns:1fr; }
  .completed-toolbar .filter,
  .completed-toolbar .search-input { width:100%; }
  .results-mode-toggle { width:100%; }
  .results-mode-toggle .mode-button { flex:1; }
  .quick-save-modal {
    align-items:flex-end;
    padding:0;
  }
  .quick-save-card {
    width:100%;
    max-width:none;
    max-height:calc(100dvh - env(safe-area-inset-top));
    margin:0;
    padding:20px 16px calc(18px + env(safe-area-inset-bottom));
    border-radius:20px 20px 0 0;
    overflow:auto;
  }
  .back-home-button { width:100%; margin-bottom:9px; }
  .table-wrap {
    margin-left:-4px;
    margin-right:-4px;
    width:calc(100% + 8px);
    -webkit-overflow-scrolling:touch;
  }
}

@media (max-width:430px) {
  .shell { padding-left:7px; padding-right:7px; }
  .tracker-brand-lockup { width:min(100%,300px); }
  .tracker-brand-meta .eyebrow { font-size:.56rem; }
  .tracker-brand-meta .subtitle { font-size:.56rem; }
  .account-bar { grid-template-columns:auto minmax(0,1fr); }
  .auth-inline-button { grid-column:1 / -1; width:100%; }
  .filters { grid-template-columns:1fr; }
  .completed-analytics-grid,
  .completed-metrics,
  .analytics-preview-grid { grid-template-columns:1fr 1fr; }
}

/* v0.3.5 — quiet home refresh, completed hierarchy, seller profiles */
.tracking-heading-actions { display:flex; align-items:center; gap:8px; }
.icon-refresh-button {
  width:32px; height:32px; min-width:32px; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(8,216,209,.30); border-radius:999px;
  background:rgba(8,216,209,.055); color:var(--teal);
  font:900 1rem/1 Inter,system-ui,sans-serif; cursor:pointer;
}
.icon-refresh-button:hover:not(:disabled) { border-color:rgba(8,216,209,.65); background:rgba(8,216,209,.10); }
.icon-refresh-button.is-refreshing { animation:volt-spin .65s linear infinite; }
@keyframes volt-spin { to { transform:rotate(360deg); } }

.compact-show-controls { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.compact-show-controls .btn { min-width:108px; }

.completed-results,
.completed-show-card,
.completed-card-head,
.completed-card-copy,
.completed-metrics,
.completed-toolbar,
.seller-profile-panel { min-width:0; max-width:100%; }
.completed-results { overflow:hidden; }
.completed-show-card { overflow:hidden; }
.completed-card-copy { flex:1 1 auto; overflow:hidden; }
.completed-card-title { white-space:normal; overflow-wrap:anywhere; line-height:1.35; }
.completed-card-head { align-items:flex-start; }
.completed-seller-link {
  display:inline-block; max-width:100%; padding:0; border:0; background:none;
  color:var(--cloud,#F8F9FF); font:900 .92rem/1.15 Inter,system-ui,sans-serif;
  letter-spacing:.01em; text-align:left; cursor:pointer;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.completed-seller-link:hover { color:var(--yellow); }
.completed-date { margin-top:2px; }
.completed-metric { min-width:0; }
.completed-metric strong { overflow-wrap:anywhere; }
.completed-metric.metric-revenue strong { color:var(--yellow); font-size:.91rem; }
.completed-metric.metric-count strong { color:#fff; }
.completed-metric.metric-matched strong { color:var(--purple); }
.completed-metric.metric-volt strong { color:var(--cyan); }
.completed-metric.metric-above strong { color:var(--teal); }
.completed-metric.metric-below strong { color:var(--pink); }
.completed-metric.metric-pending strong { color:var(--yellow); }
.completed-card-footer {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:10px; padding-top:9px; border-top:1px solid rgba(248,249,255,.065);
}
.completed-profile-button,
.completed-open-link,
.seller-profile-hint {
  color:var(--muted); font-size:.60rem; font-weight:900; letter-spacing:.075em; text-decoration:none;
}
.completed-profile-button { padding:0; border:0; background:none; cursor:pointer; }
.completed-profile-button:hover,.completed-open-link:hover { color:var(--yellow); }
.completed-store-card { cursor:pointer; }
.completed-store-card:hover { border-color:rgba(255,214,74,.34); background:rgba(255,214,74,.035); }
.completed-store-name { color:#fff; font-size:.94rem; }

.seller-profile-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:13px; }
.seller-profile-head h2 { margin-bottom:5px; }
.seller-profile-meta { color:var(--muted); font-size:.68rem; line-height:1.45; }
.seller-profile-metrics { margin-bottom:16px; }
.seller-performance-panel {
  margin:0 0 16px; padding:14px;
  border:1px solid rgba(169,112,255,.16); border-radius:14px;
  background:linear-gradient(145deg,rgba(169,112,255,.035),rgba(8,216,209,.018));
}
.seller-performance-heading { display:flex; justify-content:space-between; gap:16px; margin-bottom:12px; }
.seller-performance-heading span { display:block; color:var(--pink); font-size:.58rem; font-weight:900; letter-spacing:.09em; }
.seller-performance-heading strong { display:block; margin-top:3px; color:#fff; font-size:.82rem; letter-spacing:.035em; }
.seller-performance-heading small { max-width:430px; color:var(--muted); font-size:.60rem; line-height:1.4; text-align:right; }
.seller-performance-chart { display:grid; gap:7px; }
.seller-chart-row { display:grid; grid-template-columns:58px minmax(0,1fr) 58px; align-items:center; gap:8px; }
.seller-chart-label { color:var(--muted); font-size:.58rem; font-weight:800; }
.seller-chart-row > strong { font-size:.64rem; text-align:right; }
.seller-chart-row > strong.is-above { color:var(--teal); }
.seller-chart-row > strong.is-below { color:var(--pink); }
.seller-chart-track { position:relative; height:14px; border-radius:999px; background:rgba(248,249,255,.035); overflow:hidden; }
.seller-chart-zero { position:absolute; top:0; bottom:0; left:50%; width:1px; background:rgba(248,249,255,.25); z-index:2; }
.seller-chart-bar { position:absolute; top:3px; bottom:3px; min-width:2px; border-radius:999px; }
.seller-chart-bar.is-above { background:var(--teal); }
.seller-chart-bar.is-below { background:var(--pink); }
.seller-chart-empty { padding:18px 10px; color:var(--muted); font-size:.68rem; line-height:1.5; text-align:center; }
.seller-profile-shows-heading { margin:2px 0 9px; color:var(--muted); font-size:.62rem; font-weight:900; letter-spacing:.10em; }

@media (max-width:720px) {
  .completed-heading { align-items:stretch; gap:10px; }
  .completed-heading .results-mode-toggle { width:100%; }
  .completed-card-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; }
  .completed-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .completed-card-footer { gap:8px; }
  .seller-performance-heading { display:block; }
  .seller-performance-heading small { display:block; max-width:none; margin-top:6px; text-align:left; }
  .compact-show-controls { justify-content:stretch; width:100%; }
  .compact-show-controls .btn { flex:1 1 calc(50% - 4px); min-width:0; }
}

@media (max-width:430px) {
  .account-bar { grid-template-columns:auto minmax(0,1fr) auto; }
  .auth-inline-button {
    grid-column:auto; width:auto; min-height:30px; padding:5px 8px;
    border-radius:8px; font-size:.55rem; letter-spacing:.06em;
  }
  .admin-badge { min-height:24px; padding:4px 7px; font-size:.55rem; }
  .account-email { font-size:.61rem; }
  .completed-show-card { padding:12px; }
  .completed-card-head { grid-template-columns:minmax(0,1fr); }
  .completed-date { justify-self:start; }
  .completed-seller-link { font-size:.88rem; }
  .completed-card-title { margin-top:4px; font-size:.69rem; }
  .completed-metrics { gap:6px; }
  .completed-metric { padding:8px; }
  .completed-metric strong { font-size:.78rem; }
  .completed-metric.metric-revenue strong { font-size:.86rem; }
  .completed-card-footer { flex-wrap:wrap; }
  .seller-chart-row { grid-template-columns:48px minmax(0,1fr) 52px; gap:6px; }
  .seller-performance-panel { padding:11px; }
}


/* v0.3.8 — share inspection UX; raid suggestions remain opt-in */
.raid-suggestion-card {
  border-color:rgba(255,214,74,.30);
  background:linear-gradient(145deg,rgba(255,214,74,.055),rgba(169,112,255,.025));
}
.raid-badge {
  padding:3px 7px;
  border:1px solid rgba(255,214,74,.46);
  border-radius:999px;
  color:var(--yellow);
  font-size:.56rem;
  font-weight:900;
  letter-spacing:.075em;
  white-space:nowrap;
}
.raid-meta { color:rgba(255,214,74,.76); }
.raid-suggestion-card .compact-show-controls .btn-primary { min-width:150px; }
@media (max-width:720px) {
  .raid-suggestion-card .compact-show-controls .btn-primary { flex:2 1 58%; }
  .raid-suggestion-card .compact-show-controls .btn-secondary { flex:1 1 34%; }
}

/* v0.3.9 — screenshot OCR intake */
.share-save-toast {
  white-space: pre-line;
  line-height: 1.45;
}


/* v0.3.10 — collapsible show buckets + check/delete controls */

.home-section-toggle {
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}

.home-section-toggle:focus-visible {
  outline:2px solid rgba(169,112,255,.75);
  outline-offset:3px;
}

.home-section-toggle-copy {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.home-section-chevron {
  width:16px;
  flex:0 0 16px;
  color:var(--muted);
  font-size:.70rem;
  line-height:1;
  transform:rotate(0deg);
  transition:
    transform .16s ease,
    color .16s ease;
}

.home-section-toggle:hover .home-section-chevron {
  color:#fff;
}

.home-section.is-collapsed .home-section-chevron {
  transform:rotate(-90deg);
}

.home-section-body {
  display:block;
}

.home-section-body.is-collapsed {
  display:none;
}

.home-section.is-collapsed {
  padding-bottom:15px;
}

.home-section.is-collapsed .home-section-heading {
  margin-bottom:0;
}

.btn-delete {
  border-color:rgba(255,63,164,.42);
  background:rgba(255,63,164,.045);
  color:var(--pink);
}

.btn-delete:hover:not(:disabled) {
  border-color:rgba(255,63,164,.78);
  background:rgba(255,63,164,.11);
}

@media (max-width:720px) {
  .home-section-toggle {
    min-height:52px;
  }

  .home-section-toggle-copy {
    flex:1 1 auto;
  }

  .home-section-heading h2 {
    font-size:.92rem;
  }

  .compact-show-controls {
    width:100%;
    justify-content:stretch;
  }

  .compact-show-controls .btn {
    flex:1 1 108px;
    min-width:0;
  }
}


/* v0.3.11B — sale performance chart */

.completed-performance-metrics,
.seller-profile-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.completed-secondary-metrics,
.seller-secondary-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.seller-performance-chart {
  width: 100%;
  min-height: 360px;
  overflow-x: auto;
}

.seller-performance-svg {
  display: block;
  width: 100%;
  min-width: 620px;
  height: 360px;
}

.seller-chart-gridline {
  stroke: rgba(167, 176, 196, 0.18);
  stroke-width: 1;
}

.seller-chart-baseline {
  stroke: rgba(248, 249, 255, 0.72);
  stroke-width: 1.5;
  stroke-dasharray: 7 6;
}

.seller-chart-line {
  fill: none;
  stroke: #A970FF;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.seller-chart-point {
  stroke: #090D1A;
  stroke-width: 3;
}

.seller-chart-point.is-above {
  fill: #08D8D1;
}

.seller-chart-point.is-below {
  fill: #FF3FA4;
}

.seller-chart-axis-label,
.seller-chart-axis-title,
.seller-chart-date-label {
  fill: #A7B0C4;
  font-family: Inter, sans-serif;
  font-weight: 700;
}

.seller-chart-axis-label {
  font-size: 12px;
}

.seller-chart-axis-title {
  font-size: 11px;
  letter-spacing: 0.08em;
}

.seller-chart-date-label {
  font-size: 11px;
}

@media (max-width: 800px) {
  .completed-performance-metrics,
  .seller-profile-metrics,
  .completed-secondary-metrics,
  .seller-secondary-metrics {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .seller-performance-svg {
    min-width: 560px;
  }
}


/* v0.3.12 — curved branded VOLT performance chart */

.seller-chart-gridline {
  stroke: rgba(167, 176, 196, 0.14);
  stroke-width: 1;
}

.seller-chart-volt-line {
  stroke: #A970FF;
  stroke-width: 2;
  stroke-dasharray: 8 7;
  opacity: 0.9;
}

.seller-chart-volt-label {
  fill: #A970FF;
  font-family: Inter, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.seller-chart-performance-curve {
  fill: none;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter:
    drop-shadow(
      0 0 7px rgba(169, 112, 255, 0.22)
    );
}

.seller-chart-area {
  pointer-events: none;
}

.seller-chart-point {
  stroke: #090D1A;
  stroke-width: 3;
  transition:
    r 120ms ease,
    opacity 120ms ease;
}

.seller-chart-point:hover {
  r: 8;
  opacity: 1;
}

.seller-chart-point.is-above {
  fill: #08D8D1;
}

.seller-chart-point.is-below {
  fill: #FF3FA4;
}

.seller-chart-axis-label,
.seller-chart-axis-title,
.seller-chart-date-label {
  fill: #A7B0C4;
}


/* v0.3.13 — dynamic % based VOLT colors */

.seller-chart-performance-curve {
  fill: none;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter:
    drop-shadow(
      0 0 8px rgba(169, 112, 255, 0.20)
    );
}

.seller-chart-point-dynamic {
  stroke: #090D1A;
  stroke-width: 3;
  transition:
    r 120ms ease,
    filter 120ms ease;
}

.seller-chart-point-dynamic:hover {
  r: 8;
  filter:
    drop-shadow(
      0 0 7px currentColor
    );
}


/* v0.3.15 — daily tracked and validated sales charts */

.tracker-trend-panel {
  margin: 18px 0 20px;
  padding: 18px 18px 12px;
  border: 1px solid rgba(167, 176, 196, 0.14);
  border-radius: 18px;
  background:
    linear-gradient(
      180deg,
      rgba(21, 28, 47, 0.82),
      rgba(15, 21, 37, 0.82)
    );
  overflow: hidden;
}

.tracker-trend-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 8px;
}

.tracker-trend-head h3 {
  margin: 3px 0 0;
  font-size: 18px;
  line-height: 1.1;
  letter-spacing: 0.02em;
}

.tracker-trend-head small {
  display: block;
  margin-top: 5px;
  color: #A7B0C4;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.tracker-range-toggle {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid rgba(167, 176, 196, 0.14);
  border-radius: 999px;
  background: rgba(9, 13, 26, 0.56);
}

.tracker-range-toggle button {
  min-width: 42px;
  height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #A7B0C4;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
}

.tracker-range-toggle button:hover {
  color: #F8F9FF;
}

.tracker-range-toggle button.is-active {
  color: #F8F9FF;
  background: rgba(169, 112, 255, 0.20);
  box-shadow:
    inset 0 0 0 1px rgba(169, 112, 255, 0.38);
}

.tracker-trend-chart-wrap {
  position: relative;
  width: 100%;
  min-height: 260px;
}

.tracker-trend-chart {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.tracker-chart-axis-text {
  fill: #A7B0C4;
  font-family: Inter, sans-serif;
  font-size: 11px;
  font-weight: 650;
}

.tracker-chart-date {
  font-size: 10px;
  letter-spacing: 0.03em;
}

.tracker-chart-time-grid {
  stroke: rgba(167, 176, 196, 0.09);
  stroke-width: 1;
}

.tracker-daily-line {
  fill: none;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tracker-daily-line-sales {
  stroke: #FFD64A;
  filter: drop-shadow(
    0 0 7px rgba(255, 214, 74, 0.20)
  );
}

.tracker-daily-line-validated {
  stroke: #08D8D1;
  filter: drop-shadow(
    0 0 7px rgba(8, 216, 209, 0.20)
  );
}

.tracker-daily-area {
  pointer-events: none;
}

.tracker-daily-point {
  stroke: #090D1A;
  stroke-width: 2.5;
}

.tracker-daily-point-sales {
  fill: #FFD64A;
}

.tracker-daily-point-validated {
  fill: #08D8D1;
}

.tracker-chart-empty {
  fill: #A7B0C4;
  font-family: Inter, sans-serif;
  font-size: 13px;
}

@media (max-width: 700px) {
  .tracker-trend-panel {
    padding: 15px 10px 8px;
  }

  .tracker-trend-head {
    display: block;
  }

  .tracker-range-toggle {
    width: 100%;
    margin-top: 12px;
    justify-content: space-between;
  }

  .tracker-range-toggle button {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 4px;
  }

  .tracker-trend-chart-wrap {
    min-height: 220px;
  }
}


/* v0.3.16 — compact tracking/saved dashboard */

.compact-show-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.compact-show-card-v316 {
  display:flex;
  flex-direction:column;
  align-items:stretch;
  min-width:0;
  gap:6px;
  padding:8px 9px;
  border-radius:11px;
}

.compact-v316-seller {
  display:flex;
  min-width:0;
  align-items:center;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  color:var(--muted);
  font-size:.66rem;
  line-height:1.05;
}

.compact-v316-seller strong {
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  color:#fff;
  font-size:.72rem;
  font-weight:900;
}

.compact-v316-metrics {
  display:flex;
  align-items:center;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  font-size:clamp(.50rem,1.55vw,.66rem);
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.01em;
}

.compact-v316-sold {
  color:rgba(248,249,255,.88);
}

.compact-v316-separator {
  margin:0 4px;
  color:rgba(167,176,196,.55);
}

.compact-v316-valid {
  color:var(--pink);
  font-weight:900;
}

.compact-v316-schedule {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  font-size:clamp(.50rem,1.55vw,.67rem);
  line-height:1.1;
  letter-spacing:-.01em;
}

.compact-v316-date {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  color:rgba(248,249,255,.88);
  font-weight:750;
}

.compact-v316-countdown {
  flex:0 0 auto;
  font-weight:950;
}

.compact-v316-countdown.is-upcoming {
  color:var(--pink);
}

.compact-v316-countdown.is-started {
  color:var(--yellow);
}

.compact-v316-controls {
  display:grid;
  width:100%;
  gap:5px;
  margin-top:1px;
}

.compact-v316-controls.is-tracking-controls {
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.compact-v316-controls.is-saved-controls {
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.compact-v316-controls .compact-show-start {
  width:100%;
  min-width:0;
  min-height:24px;
  padding:4px 3px;
  border-radius:7px;
  font-size:clamp(.47rem,1.25vw,.59rem);
  font-weight:900;
  line-height:1;
  letter-spacing:.015em;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.compact-show-page-panel {
  padding:14px;
}

.compact-show-page-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}

.compact-show-page-heading h2 {
  margin:3px 0 0;
}

.compact-saved-sort {
  width:auto;
  min-width:108px;
  min-height:32px;
  padding:5px 8px;
  font-size:.63rem;
  font-weight:850;
}

#trackingShowsBody.is-collapsed,
#savedShowsBody.is-collapsed {
  display:none;
}

.home-section.is-collapsed {
  padding-bottom:12px;
}

.home-section.is-collapsed .home-section-heading {
  margin-bottom:0;
}

@media (max-width:560px) {
  .compact-show-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }

  .compact-show-card-v316 {
    grid-template-columns:none;
    padding:7px;
    gap:5px;
  }

  .compact-v316-seller {
    font-size:.56rem;
  }

  .compact-v316-seller strong {
    font-size:.64rem;
  }

  .compact-v316-metrics,
  .compact-v316-schedule {
    font-size:clamp(.47rem,2.05vw,.58rem);
  }

  .compact-v316-separator {
    margin:0 2px;
  }

  .compact-v316-controls {
    gap:3px;
  }

  .compact-v316-controls .compact-show-start {
    width:100%;
    min-height:22px;
    padding:3px 2px;
    font-size:clamp(.43rem,1.75vw,.52rem);
    border-radius:6px;
  }

  .compact-show-page-panel {
    padding:10px 7px;
  }

  .compact-show-page-heading {
    margin-bottom:9px;
  }

  .compact-saved-sort {
    min-width:92px;
    max-width:105px;
    min-height:30px;
    padding:4px 5px;
    font-size:.56rem;
  }
}

@media (max-width:360px) {
  .compact-show-card-v316 {
    padding:6px;
  }

  .compact-v316-metrics,
  .compact-v316-schedule {
    font-size:.45rem;
  }

  .compact-v316-controls .compact-show-start {
    font-size:.41rem;
  }
}



/* v0.3.17 — stacked show cards + persistent app header */

/* ---------------------------------------------
   STACKED CARDS
--------------------------------------------- */

.compact-show-card-v316 {
  gap:7px;
  padding:10px 11px;
}

.compact-v316-seller {
  display:flex;
  align-items:baseline;
  gap:0;
  min-width:0;
  font-size:.68rem;
}

.compact-v317-seller-link {
  appearance:none;
  border:0;
  padding:0;
  margin:0;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  background:none;
  color:#F8F9FF;
  font:inherit;
  font-size:1.2em;
  font-weight:950;
  line-height:1.1;
  text-align:left;
  cursor:pointer;
}

.compact-v317-seller-link:hover {
  color:var(--cyan);
}

.compact-v316-seller > span {
  flex:0 0 auto;
  color:var(--muted);
  font-weight:750;
}

.compact-v316-metrics {
  display:grid;
  grid-template-columns:1fr;
  gap:3px;
  overflow:visible;
  white-space:nowrap;
  font-size:.67rem;
  line-height:1.15;
}

.compact-v316-sold {
  color:rgba(248,249,255,.90);
  font-weight:850;
}

.compact-v316-valid {
  color:var(--pink);
  font-weight:950;
}

.compact-v316-separator {
  display:none;
}

.compact-v316-schedule {
  display:block;
  overflow:visible;
  white-space:nowrap;
  font-size:.66rem;
  line-height:1.12;
}

.compact-v316-date {
  color:rgba(248,249,255,.90);
  font-weight:850;
}

.compact-v317-countdown-line {
  min-height:14px;
  font-size:.67rem;
  line-height:1.12;
}

.compact-v316-countdown {
  font-weight:950;
}

.compact-v316-countdown.is-upcoming {
  color:var(--pink);
}

.compact-v316-countdown.is-started {
  color:var(--yellow);
}

.compact-v316-controls {
  margin-top:2px;
}

.compact-v316-controls.is-tracking-controls {
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.compact-v316-controls.is-saved-controls {
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.compact-v316-controls .compact-show-start {
  min-height:36px;
  aspect-ratio:2 / 1;
  padding:4px 3px;
  white-space:normal;
  text-align:center;
  line-height:1.02;
  font-size:.58rem;
  overflow:hidden;
}

/* ---------------------------------------------
   ACCOUNT BUTTON
--------------------------------------------- */

.tracker-account-shell {
  position:relative;
  margin-left:auto;
}

.tracker-account-button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:34px;
  max-width:260px;
  padding:7px 10px;
  border-radius:9px;
  background:rgba(248,249,255,.035);
  font-size:.69rem;
  font-weight:900;
  overflow:hidden;
  white-space:nowrap;
  cursor:pointer;
}

.tracker-account-button.is-normal-account {
  border:1px solid rgba(248,249,255,.62);
  color:#F8F9FF;
}

.tracker-account-button.is-admin-account {
  border:1px solid rgba(255,214,74,.72);
  background:rgba(255,214,74,.09);
  color:var(--yellow);
  box-shadow:
    0 0 0 1px rgba(255,214,74,.035) inset,
    0 0 18px rgba(255,214,74,.07);
}

#accountButtonLabel {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.tracker-account-caret {
  flex:0 0 auto;
  font-size:.62rem;
}

.tracker-account-menu {
  position:absolute;
  right:0;
  top:calc(100% + 7px);
  z-index:800;
  width:min(280px,calc(100vw - 24px));
  padding:9px;
  border:1px solid rgba(248,249,255,.13);
  border-radius:13px;
  background:linear-gradient(150deg,#151C2F,#0F1525);
  box-shadow:0 20px 55px rgba(0,0,0,.48);
}

.tracker-account-menu-head {
  display:grid;
  gap:3px;
  padding:7px 7px 10px;
  border-bottom:1px solid rgba(248,249,255,.09);
}

.tracker-account-menu-head strong {
  color:#F8F9FF;
  font-size:.78rem;
}

.tracker-account-menu .account-email {
  display:block;
  max-width:none;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.65rem;
}

.tracker-account-admin {
  width:max-content;
  margin-top:4px;
  padding:3px 6px;
  border:1px solid rgba(255,214,74,.45);
  border-radius:999px;
  color:var(--yellow);
  background:rgba(255,214,74,.07);
  font-size:.55rem;
  font-weight:950;
  letter-spacing:.08em;
}

.tracker-account-menu-action {
  width:100%;
  margin-top:7px;
  padding:9px 8px;
  border:1px solid rgba(248,249,255,.10);
  border-radius:8px;
  background:rgba(248,249,255,.025);
  color:#F8F9FF;
  text-align:left;
  font-size:.66rem;
  font-weight:850;
  cursor:pointer;
}

.tracker-signout-action {
  color:var(--pink);
  border-color:rgba(255,63,164,.25);
}

/* ---------------------------------------------
   DESKTOP STICKY NAV
--------------------------------------------- */

@media (min-width:721px) {
  .subpage-view > .back-home-button,
  #resultsView > .back-home-button {
    position:sticky;
    top:10px;
    z-index:300;
    width:max-content;
    margin-bottom:14px;
    backdrop-filter:blur(12px);
    background:rgba(9,13,26,.90);
    box-shadow:0 5px 18px rgba(0,0,0,.20);
  }

  .tracker-mobile-back {
    display:none !important;
  }
}

/* ---------------------------------------------
   MOBILE / PWA FIXED APP HEADER
--------------------------------------------- */

.tracker-mobile-back {
  border:0;
  background:transparent;
  color:#F8F9FF;
  padding:5px 0;
  font-size:.63rem;
  font-weight:900;
  cursor:pointer;
}

@media (max-width:720px) {
  :root {
    --tracker-mobile-header-height:118px;
  }

  body {
    padding-top:var(--tracker-mobile-header-height);
  }

  .shell {
    padding-top:
      calc(8px + env(safe-area-inset-top));
  }

  .branded-header {
    position:fixed !important;
    z-index:700;
    top:0;
    left:env(safe-area-inset-left);
    right:env(safe-area-inset-right);

    width:auto;
    min-height:var(--tracker-mobile-header-height);
    margin:0;
    padding:
      calc(7px + env(safe-area-inset-top))
      10px
      8px;

    border-width:0 0 1px;
    border-radius:0;

    background:
      linear-gradient(
        180deg,
        rgba(9,13,26,.99),
        rgba(15,21,37,.98)
      );

    box-shadow:
      0 8px 25px rgba(0,0,0,.30);

    overflow:visible;
  }

  .branded-header::after {
    height:2px;
  }

  .tracker-brand {
    display:flex;
    flex-direction:column;
    align-items:center !important;
    justify-content:center;
    gap:0;
    width:100%;
  }

  .tracker-brand-lockup {
    width:min(280px,78vw) !important;
    max-height:52px;
    object-fit:contain;
  }

  .tracker-brand-meta {
    display:block;
    width:100%;
    padding:0 !important;
    border:0 !important;
    text-align:center;
  }

  .tracker-brand-meta .eyebrow {
    display:block;
    margin-top:-1px;
    color:rgba(248,249,255,.66);
    font-size:.55rem !important;
    font-weight:850;
    letter-spacing:.10em;
  }

  .tracker-brand-meta .subtitle {
    display:none;
  }

  .account-bar {
    position:absolute !important;
    left:10px;
    right:10px;
    bottom:7px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;

    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }

  .tracker-mobile-back {
    display:block;
    flex:0 0 auto;
  }

  .tracker-is-home .tracker-mobile-back {
    visibility:hidden;
    pointer-events:none;
  }

  .tracker-account-shell {
    margin-left:auto;
    min-width:0;
  }

  .tracker-account-button {
    max-width:52vw;
    min-height:30px;
    padding:5px 8px;
    font-size:.61rem;
  }

  .subpage-view > .back-home-button,
  #resultsView > .back-home-button {
    display:none !important;
  }

  .tracker-account-menu {
    position:fixed;
    top:
      calc(
        var(--tracker-mobile-header-height) -
        7px +
        env(safe-area-inset-top)
      );
    right:9px;
  }

  .compact-show-card-v316 {
    gap:5px;
    padding:8px;
  }

  .compact-v316-seller {
    font-size:.60rem;
  }

  .compact-v316-metrics,
  .compact-v316-schedule,
  .compact-v317-countdown-line {
    font-size:clamp(.50rem,2vw,.59rem);
  }

  .compact-v316-controls {
    gap:4px;
  }

  .compact-v316-controls .compact-show-start {
    min-height:34px;
    aspect-ratio:2 / 1;
    padding:3px 2px;
    font-size:clamp(.45rem,1.75vw,.53rem);
    line-height:1;
  }
}

@media (display-mode:standalone) and (max-width:720px) {
  :root {
    --tracker-mobile-header-height:122px;
  }
}



/* v0.3.18 — responsive Tracker header + card tuning */

/* =========================================================
   GLOBAL HEADER
========================================================= */

.tracker-brand-meta {
  display:none !important;
}

.tracker-brand-lockup {
  display:block;
  object-fit:contain;
}

.tracker-mobile-nav-row,
.tracker-mobile-tools {
  display:none;
}

/* =========================================================
   DESKTOP — KEEP EXISTING LARGE HEADER FEEL
========================================================= */

@media (min-width:721px) {

  .branded-header {
    min-height:92px;
    padding:15px 18px;
  }

  .tracker-brand {
    flex:1 1 auto;
    min-width:0;
  }

  .tracker-brand-lockup {
    width:min(520px,46vw);
    max-height:72px;
  }

  .account-bar {
    flex:0 0 auto;
    margin-left:20px;
  }

  .tracker-account-button {
    min-height:34px;
    max-width:220px;
    padding:7px 11px;
    font-size:.70rem;
  }

  /* Desktop cards:
     larger type, shorter buttons.
  */

  .compact-show-card-v316 {
    padding:12px 13px;
    gap:7px;
  }

  .compact-v316-seller {
    font-size:.76rem;
  }

  .compact-v317-seller-link {
    font-size:1.2em;
  }

  .compact-v316-metrics,
  .compact-v316-schedule,
  .compact-v317-countdown-line {
    font-size:.72rem;
  }

  .compact-v316-controls {
    gap:7px;
  }

  .compact-v316-controls .compact-show-start {
    min-height:34px;
    height:34px;
    aspect-ratio:auto;
    padding:5px 7px;
    font-size:.61rem;
    line-height:1.02;
  }

  .compact-v316-controls.is-tracking-controls {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .compact-v316-controls.is-saved-controls {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* =========================================================
   MOBILE / PWA HEADER
========================================================= */

@media (max-width:720px) {

  :root {
    --tracker-mobile-header-height:108px;
  }

  body {
    padding-top:
      calc(
        var(--tracker-mobile-header-height) +
        env(safe-area-inset-top)
      );
  }

  .shell {
    width:100%;
    padding:
      8px 9px
      calc(18px + env(safe-area-inset-bottom));
  }

  .branded-header {
    position:fixed !important;
    z-index:700;
    top:0;
    left:0;
    right:0;

    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;

    align-items:center;
    column-gap:8px;
    row-gap:7px;

    min-height:var(--tracker-mobile-header-height);
    margin:0;
    padding:
      calc(7px + env(safe-area-inset-top))
      10px
      8px;

    border:0;
    border-bottom:1px solid rgba(248,249,255,.11);
    border-radius:0;

    overflow:visible;

    background:
      linear-gradient(
        180deg,
        rgba(9,13,26,.995),
        rgba(15,21,37,.985)
      );

    box-shadow:
      0 8px 24px rgba(0,0,0,.30);
  }

  .branded-header::after {
    height:2px;
  }

  /* Row 1 left */
  .tracker-brand {
    grid-column:1;
    grid-row:1;

    display:block;
    width:100%;
    min-width:0;
  }

  .tracker-brand-lockup {
    width:min(100%,265px) !important;
    max-width:68vw;
    max-height:46px;
    object-fit:contain;
    object-position:left center;
    margin:0;
  }

  /* Row 1 right */
  .account-bar {
    grid-column:2;
    grid-row:1;

    position:static !important;
    display:block;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    min-width:0;
  }

  .tracker-account-shell {
    margin:0;
  }

  .tracker-account-button {
    min-height:28px;
    max-width:28vw;
    padding:5px 7px;
    border-radius:8px;
    font-size:.55rem;
  }

  .tracker-account-caret {
    font-size:.50rem;
  }

  /* Row 2 spans both columns */
  .tracker-mobile-nav-row {
    grid-column:1 / -1;
    grid-row:2;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;

    min-height:30px;
    width:100%;
  }

  .tracker-mobile-back {
    display:flex;
    align-items:center;
    justify-content:center;

    min-height:28px;
    padding:5px 9px;

    border:1px solid rgba(8,216,209,.60);
    border-radius:8px;

    background:rgba(8,216,209,.05);
    color:var(--teal);

    font-size:.56rem;
    font-weight:900;
    letter-spacing:.025em;
  }

  .tracker-mobile-back:hover,
  .tracker-mobile-back:active,
  .tracker-mobile-back:focus-visible {
    background:rgba(8,216,209,.50);
    color:#F8F9FF;
  }

  .tracker-is-home .tracker-mobile-back {
    visibility:hidden;
    pointer-events:none;
  }

  .tracker-mobile-tools {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:4px;
    margin-left:auto;
  }

  .tracker-mobile-tool-button {
    min-height:27px;
    padding:5px 8px;

    border:1px solid rgba(248,249,255,.17);
    border-radius:7px;

    background:rgba(248,249,255,.025);
    color:var(--muted);

    font-size:.53rem;
    font-weight:900;
    letter-spacing:.025em;
  }

  .tracker-mobile-tool-button.is-active {
    border-color:rgba(169,112,255,.62);
    background:rgba(169,112,255,.17);
    color:#F8F9FF;
  }

  /* Hide original page toggles on mobile because their proxies
     now live in the header.
  */

  #completedShowsView .results-mode-toggle,
  #resultsView > .results-mode-toggle {
    display:none !important;
  }

  /* Hide all old in-content back buttons. */
  .subpage-view > .back-home-button,
  #resultsView > .back-home-button {
    display:none !important;
  }

  /* Account dropdown position below first row/header. */
  .tracker-account-menu {
    position:fixed;
    top:
      calc(
        53px +
        env(safe-area-inset-top)
      );
    right:9px;
  }

  /* =======================================================
     MOBILE CARDS
  ======================================================= */

  .compact-show-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }

  .compact-show-card-v316 {
    padding:8px;
    gap:5px;
  }

  .compact-v316-seller {
    font-size:.61rem;
  }

  .compact-v317-seller-link {
    font-size:1.2em;
  }

  .compact-v316-metrics,
  .compact-v316-schedule,
  .compact-v317-countdown-line {
    font-size:clamp(.50rem,2.05vw,.59rem);
  }

  .compact-v316-controls {
    gap:4px;
  }

  /* Tracking — compact enough for 3 across */
  .compact-v316-controls.is-tracking-controls
  .compact-show-start {
    min-height:33px;
    height:auto;
    aspect-ratio:2 / 1;
    padding:3px 2px;
    font-size:clamp(.43rem,1.7vw,.51rem);
    line-height:1;
  }

  /* Saved — requested ~3:1 */
  .compact-v316-controls.is-saved-controls
  .compact-show-start {
    min-height:28px;
    height:auto;
    aspect-ratio:3 / 1;
    padding:3px 4px;
    font-size:clamp(.45rem,1.8vw,.53rem);
    line-height:1;
    white-space:nowrap;
  }
}

@media (max-width:390px) {

  .tracker-brand-lockup {
    max-width:66vw;
  }

  .tracker-account-button {
    max-width:27vw;
    padding-left:6px;
    padding-right:6px;
    font-size:.51rem;
  }

  .tracker-mobile-tool-button {
    padding-left:6px;
    padding-right:6px;
    font-size:.49rem;
  }

  .compact-show-card-v316 {
    padding:7px;
  }
}



/* v0.3.19 — true two-row sticky Tracker header */

/* =========================================================
   SHARED HEADER STRUCTURE
========================================================= */

.branded-header {
  overflow:visible !important;
}

.tracker-brand {
  min-width:0;
}

.account-bar {
  min-width:0;
}

.tracker-mobile-nav-row {
  width:100%;
}

.tracker-account-menu {
  z-index:1200;
}

/* =========================================================
   DESKTOP
========================================================= */

@media (min-width:721px) {

  .branded-header {
    position:sticky !important;
    top:12px;
    z-index:700;

    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;

    column-gap:18px;
    row-gap:11px;

    align-items:center;

    min-height:0;
    padding:15px 18px 11px;
  }

  .tracker-brand {
    grid-column:1;
    grid-row:1;

    display:flex;
    align-items:center;
  }

  .tracker-brand-lockup {
    width:min(520px,46vw);
    max-height:72px;
    object-position:left center;
  }

  .account-bar {
    grid-column:2;
    grid-row:1;

    position:static !important;
    display:flex;
    align-items:center;
    justify-content:flex-end;

    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }

  .tracker-account-button {
    min-height:32px;
    max-width:210px;
    padding:6px 10px;
    font-size:.64rem;
  }

  .tracker-mobile-nav-row {
    grid-column:1 / -1;
    grid-row:2;

    display:flex;
    align-items:center;
    justify-content:space-between;

    min-height:34px;

    padding-top:9px;
    border-top:1px solid rgba(248,249,255,.08);
  }

  .tracker-is-home .tracker-mobile-nav-row {
    display:none;
  }

  .tracker-mobile-back {
    display:flex !important;
    align-items:center;
    justify-content:center;

    min-height:31px;
    padding:6px 11px;

    border:1px solid rgba(8,216,209,.55);
    border-radius:8px;

    background:rgba(8,216,209,.04);
    color:var(--teal);

    font-size:.61rem;
    font-weight:900;
  }

  .tracker-mobile-back:hover,
  .tracker-mobile-back:active {
    background:rgba(8,216,209,.50);
    color:#F8F9FF;
  }

  .tracker-mobile-tools {
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    gap:5px;
    margin-left:auto;
  }

  .tracker-mobile-tool-button {
    min-height:31px;
    padding:6px 11px;

    border:1px solid rgba(248,249,255,.15);
    border-radius:8px;

    background:rgba(248,249,255,.025);
    color:var(--muted);

    font-size:.60rem;
    font-weight:900;
  }

  .tracker-mobile-tool-button.is-active {
    border-color:rgba(169,112,255,.65);
    background:rgba(169,112,255,.17);
    color:#F8F9FF;
  }

  /* The new header owns page navigation now. */
  .subpage-view > .back-home-button,
  #resultsView > .back-home-button {
    display:none !important;
  }

  #completedShowsView .results-mode-toggle,
  #resultsView > .results-mode-toggle {
    display:none !important;
  }

  .tracker-account-menu {
    position:absolute;
    top:calc(100% + 7px);
    right:0;
  }
}

/* =========================================================
   MOBILE / PWA
========================================================= */

@media (max-width:720px) {

  :root {
    --tracker-mobile-header-one-row:72px;
    --tracker-mobile-header-two-row:108px;
  }

  body {
    padding-top:
      calc(
        var(--tracker-mobile-header-one-row) +
        env(safe-area-inset-top)
      );
  }

  .tracker-has-subnav body {
    padding-top:
      calc(
        var(--tracker-mobile-header-two-row) +
        env(safe-area-inset-top)
      );
  }

  .branded-header {
    position:fixed !important;
    top:0;
    left:0;
    right:0;
    z-index:800;

    display:grid !important;

    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;

    align-items:center;
    column-gap:8px;
    row-gap:6px;

    min-height:0;
    margin:0;

    padding:
      calc(6px + env(safe-area-inset-top))
      10px
      7px;

    border:0;
    border-bottom:1px solid rgba(248,249,255,.11);
    border-radius:0;

    background:
      linear-gradient(
        180deg,
        rgba(9,13,26,.995),
        rgba(15,21,37,.985)
      );

    box-shadow:0 8px 24px rgba(0,0,0,.30);
  }

  .tracker-brand {
    grid-column:1;
    grid-row:1;

    display:flex !important;
    align-items:center !important;

    width:100%;
    min-width:0;
  }

  .tracker-brand-lockup {
    width:min(100%,270px) !important;
    max-width:69vw;
    max-height:50px;

    margin:0;

    object-fit:contain;
    object-position:left center;
  }

  .account-bar {
    grid-column:2;
    grid-row:1;

    position:static !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;

    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }

  .tracker-account-shell {
    display:flex;
    align-items:center;
    margin:0;
  }

  .tracker-account-button {
    min-height:27px;
    max-width:25vw;

    padding:4px 6px;

    border-radius:8px;

    font-size:.49rem;
    line-height:1;

    align-self:center;
  }

  .tracker-account-caret {
    font-size:.44rem;
  }

  .tracker-mobile-nav-row {
    grid-column:1 / -1;
    grid-row:2;

    display:flex;
    align-items:center;
    justify-content:space-between;

    width:100%;
    min-height:29px;

    padding-top:6px;
    border-top:1px solid rgba(248,249,255,.07);
  }

  .tracker-is-home .tracker-mobile-nav-row {
    display:none;
  }

  .tracker-mobile-back {
    display:flex !important;
    align-items:center;
    justify-content:center;

    min-height:28px;
    padding:5px 9px;

    border:1px solid rgba(8,216,209,.58);
    border-radius:8px;

    background:rgba(8,216,209,.05);
    color:var(--teal);

    font-size:.53rem;
    font-weight:950;
  }

  .tracker-mobile-back:hover,
  .tracker-mobile-back:active,
  .tracker-mobile-back:focus-visible {
    background:rgba(8,216,209,.50);
    color:#F8F9FF;
  }

  .tracker-mobile-tools {
    display:flex !important;
    align-items:center;
    justify-content:flex-end;

    gap:4px;
    margin-left:auto;
  }

  .tracker-mobile-tool-button {
    min-height:28px;
    padding:5px 7px;

    border:1px solid rgba(248,249,255,.16);
    border-radius:7px;

    background:rgba(248,249,255,.025);
    color:var(--muted);

    font-size:.51rem;
    font-weight:900;
  }

  .tracker-mobile-tool-button.is-active {
    border-color:rgba(169,112,255,.64);
    background:rgba(169,112,255,.18);
    color:#F8F9FF;
  }

  .tracker-account-menu {
    position:fixed;
    top:
      calc(
        54px +
        env(safe-area-inset-top)
      );
    right:9px;

    width:min(255px,calc(100vw - 18px));
  }

  .subpage-view > .back-home-button,
  #resultsView > .back-home-button {
    display:none !important;
  }

  #completedShowsView .results-mode-toggle,
  #resultsView > .results-mode-toggle {
    display:none !important;
  }
}

/* Smaller phones */
@media (max-width:390px) {

  .tracker-brand-lockup {
    max-width:67vw;
  }

  .tracker-account-button {
    max-width:24vw;
    padding-left:5px;
    padding-right:5px;
    font-size:.46rem;
  }

  .tracker-mobile-back,
  .tracker-mobile-tool-button {
    font-size:.48rem;
  }
}


/* v0.3.20 — manual show lifecycle */
.compact-lifecycle-status {
  margin: 8px 0 3px;
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.is-live-ready-status {
  color: var(--teal);
}

.is-ended-status {
  color: #ffd64a;
}

.compact-show-card.is-ended {
  border-color: rgba(255,214,74,.36);
}

.compact-show-card.is-live-ready {
  border-color: rgba(48,214,202,.34);
}

.compact-v316-countdown.is-started {
  font-weight: 900;
  color: #ffd64a;
}


/* =========================================================
   v0.3.22 — technical rounded Tracker cards
========================================================= */

:root {
  --volt-card-radius: 17px;
  --volt-card-border: rgba(73, 210, 217, .29);
  --volt-card-bg: rgba(15, 23, 42, .91);
  --volt-card-bg-deep: rgba(8, 15, 29, .97);
}

/* Main section shells */
.tracker-home .home-section {
  border-radius: 20px;
  border: 1px solid rgba(139, 160, 198, .18);
  background:
    linear-gradient(145deg,
      rgba(18, 27, 49, .96),
      rgba(9, 16, 31, .98));
  box-shadow:
    0 14px 36px rgba(0, 0, 0, .20),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.home-live-section {
  position: relative;
  overflow: hidden;
}

.home-live-section::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background:
    linear-gradient(
      180deg,
      var(--pink),
      var(--purple),
      var(--teal)
    );
  opacity: .82;
}

/* Live Capture header */
#trackingShowsToggle.home-section-heading {
  align-items: center;
  gap: 12px;
}

#trackingShowsToggle .panel-kicker {
  margin-bottom: 4px;
  color: var(--teal);
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .18em;
}

#trackingShowsHeading {
  font-size: clamp(1.25rem, 4.7vw, 1.85rem);
  line-height: .98;
  font-weight: 950;
  letter-spacing: .015em;
}

#trackingShowsHeading::first-letter {
  color: var(--teal);
}

.tracking-heading-actions {
  gap: 8px;
}

.tracking-heading-actions .count-live {
  min-width: 46px;
  min-height: 37px;
  border: 1px solid rgba(8,216,209,.13);
  border-radius: 13px;
  background: rgba(8,216,209,.09);
  color: var(--teal);
  font-weight: 950;
}

#refreshTrackingButton {
  border-radius: 13px !important;
}

/* CHECK TRACKED SHOWS added by the current frontend */
#checkTrackedShowsButton,
#checkAllTrackedShowsButton,
.check-tracked-shows-button,
.bulk-tracked-show-check-button {
  min-height: 39px !important;
  padding: 8px 13px !important;
  border: 1.5px solid rgba(8,216,209,.70) !important;
  border-radius: 13px !important;
  background: rgba(8,216,209,.055) !important;
  color: var(--teal) !important;
  font-weight: 950 !important;
  letter-spacing: .045em !important;
  box-shadow: none !important;
}

/* Grid */
.compact-show-list {
  gap: 11px;
}

.compact-show-card-v322 {
  position: relative;
  min-width: 0;
  padding: 13px;
  overflow: hidden;
  border: 1.25px solid var(--volt-card-border);
  border-radius: var(--volt-card-radius);
  background:
    linear-gradient(
      145deg,
      rgba(20, 30, 53, .95) 0%,
      rgba(12, 20, 37, .97) 58%,
      rgba(8, 15, 29, .98) 100%
    );
  box-shadow:
    0 8px 22px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.compact-show-card-v322::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 49px;
  border-radius: var(--volt-card-radius) 0 7px 0;
  background: linear-gradient(180deg,var(--pink),var(--purple));
}

.compact-show-card-v322:nth-child(even)::before {
  background: linear-gradient(180deg,var(--teal),#60a5fa);
}

.compact-show-card-v322.is-ended::before {
  background: linear-gradient(180deg,#ffd64a,#ff9f43);
}

.compact-show-card-v322.is-ended {
  border-color: rgba(255,214,74,.42);
}

/* Seller identity */
.compact-v322-identity {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.compact-v322-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 2px solid transparent;
  border-radius: 50%;
  background:
    linear-gradient(#0d1728,#0d1728) padding-box,
    linear-gradient(
      135deg,
      var(--pink),
      var(--purple),
      var(--teal)
    ) border-box;
  color: #f8f9ff;
  font-size: .98rem;
  font-weight: 950;
  letter-spacing: -.02em;
  box-shadow: inset 0 0 0 4px rgba(255,255,255,.025);
}

.compact-v322-identity-copy {
  min-width: 0;
}

.compact-v322-seller-row {
  display: flex;
  align-items: center;
  min-width: 0;
}

.compact-v322-seller-link {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: transparent;
  color: #f8f9ff;
  font-family: inherit;
  font-size: .87rem;
  font-weight: 950;
  line-height: 1.08;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-v322-seller-link:hover,
.compact-v322-seller-link:focus-visible {
  color: var(--teal);
}

.compact-v322-category {
  margin-top: 3px;
  color: #aab8d2;
  font-size: .59rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.compact-v322-live-status {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  color: #58e986;
  font-size: .57rem;
  font-weight: 950;
  letter-spacing: .13em;
}

.compact-v322-status-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 3px rgba(88,233,134,.07);
}

.compact-v322-live-status.is-ended {
  color: #ffd64a;
}

.compact-v322-live-status.is-ready {
  color: var(--teal);
}

/* Technical metrics */
.compact-v322-metrics {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  margin-top: 13px;
  border-top: 1px solid rgba(248,249,255,.075);
  border-bottom: 1px solid rgba(248,249,255,.055);
}

.compact-v322-metric {
  min-width: 0;
  padding: 10px 9px 10px 0;
}

.compact-v322-metric + .compact-v322-metric {
  padding-left: 11px;
  border-left: 1px solid rgba(248,249,255,.08);
}

.compact-v322-metric-count {
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
  color: #f8f9ff;
}

.compact-v322-metric-count strong {
  font-size: .90rem;
  font-weight: 950;
}

.compact-v322-metric-count span {
  color: #aab8d2;
  font-size: .57rem;
  font-weight: 900;
  letter-spacing: .055em;
}

.compact-v322-valid-metric .compact-v322-metric-count strong,
.compact-v322-valid-metric .compact-v322-metric-count span {
  color: var(--pink);
}

.compact-v322-metric-value {
  display: block;
  margin-top: 1px;
  overflow: hidden;
  color: #f8f9ff;
  font-size: .90rem;
  font-weight: 950;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-v322-metric-label {
  display: block;
  margin-top: 4px;
  color: #71809d;
  font-size: .48rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.compact-v322-ended-banner {
  margin: 11px 0 0;
  padding: 7px 8px;
  border: 1px solid rgba(255,214,74,.23);
  border-radius: 8px;
  background: rgba(255,214,74,.055);
  color: #ffd64a;
  font-size: .56rem;
  text-align: center;
}

/* Saved cards */
.compact-v322-schedule-wrap {
  display: grid;
  gap: 3px;
  margin-top: 13px;
  padding-top: 10px;
  border-top: 1px solid rgba(248,249,255,.075);
}

.compact-v322-schedule-date {
  color: #f8f9ff;
  font-size: .72rem;
  font-weight: 900;
}

.compact-v322-countdown {
  margin-top: 2px;
  color: var(--purple);
  font-size: .70rem;
  font-weight: 950;
}

/* Controls */
.compact-v322-controls {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 8px !important;
  margin-top: 11px;
}

.compact-v322-controls .compact-show-start,
.compact-v322-controls .btn {
  width: 100%;
  min-width: 0;
  min-height: 39px !important;
  height: 39px !important;
  aspect-ratio: auto !important;
  padding: 6px 5px !important;
  border-radius: 10px !important;
  font-size: .56rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: .035em;
  white-space: nowrap;
}

.compact-v322-open-button {
  border-width: 1.5px !important;
  border-color: rgba(8,216,209,.72) !important;
  background: rgba(8,216,209,.035) !important;
  color: var(--teal) !important;
}

.compact-v322-end-button {
  border-width: 1.5px !important;
  border-color: rgba(255,214,74,.92) !important;
  background: rgba(255,214,74,.025) !important;
  color: #ffd64a !important;
}

/* Saved / history panels */
.home-saved-section,
.home-primary-actions .home-action-card {
  border-radius: 18px;
}

.home-primary-actions .home-action-card {
  border: 1px solid rgba(139,160,198,.19);
  background:
    linear-gradient(
      135deg,
      rgba(18,27,49,.92),
      rgba(10,17,31,.96)
    );
}

.home-primary-actions .home-action-card strong {
  font-weight: 950;
}

/* Desktop cards can breathe more */
@media (min-width: 721px) {
  .compact-show-card-v322 {
    padding: 15px;
  }

  .compact-v322-identity {
    grid-template-columns: 52px minmax(0,1fr);
  }

  .compact-v322-avatar {
    width: 52px;
    height: 52px;
  }
}

/* Mobile / PWA */
@media (max-width: 720px) {
  #trackingShowsToggle.home-section-heading {
    padding: 14px 13px 11px;
  }

  .home-live-section .home-section-body {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 12px;
  }

  .compact-show-card-v322 {
    padding: 10px;
    border-radius: 15px;
  }

  .compact-v322-identity {
    grid-template-columns: 38px minmax(0,1fr);
    gap: 8px;
  }

  .compact-v322-avatar {
    width: 38px;
    height: 38px;
    font-size: .78rem;
  }

  .compact-v322-seller-link {
    font-size: clamp(.68rem, 2.65vw, .80rem);
  }

  .compact-v322-category {
    font-size: .49rem;
  }

  .compact-v322-live-status {
    margin-top: 3px;
    font-size: .49rem;
  }

  .compact-v322-status-dot {
    width: 6px;
    height: 6px;
  }

  .compact-v322-metrics {
    margin-top: 10px;
  }

  .compact-v322-metric {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .compact-v322-metric-count strong {
    font-size: clamp(.72rem, 3vw, .84rem);
  }

  .compact-v322-metric-count span {
    font-size: clamp(.43rem, 1.75vw, .51rem);
  }

  .compact-v322-metric-value {
    font-size: clamp(.72rem, 3vw, .84rem);
  }

  .compact-v322-metric-label {
    font-size: .40rem;
  }

  .compact-v322-controls {
    gap: 6px !important;
    margin-top: 9px;
  }

  .compact-v322-controls .compact-show-start,
  .compact-v322-controls .btn {
    min-height: 35px !important;
    height: 35px !important;
    font-size: clamp(.45rem,1.9vw,.53rem) !important;
  }
}

@media (max-width: 390px) {
  .compact-show-card-v322 {
    padding: 9px;
  }

  .compact-v322-identity {
    grid-template-columns: 34px minmax(0,1fr);
    gap: 7px;
  }

  .compact-v322-avatar {
    width: 34px;
    height: 34px;
    font-size: .70rem;
  }

  .compact-v322-metric + .compact-v322-metric {
    padding-left: 8px;
  }
}


/* =========================================================
   v0.3.24 — FINAL CLEAN TRACKING CARDS
========================================================= */

/* Kill all old colored edge accents */
.compact-show-card-v324::before,
.compact-show-card-v324::after,
.home-live-section::before {
  content: none !important;
  display: none !important;
}

/* Main live section */
.home-live-section {
  border-radius: 20px !important;
}

/* Card grid */
.compact-show-list {
  gap: 10px !important;
}

/* Card */
.compact-show-card-v324 {
  box-sizing: border-box;
  min-width: 0;

  padding: 11px !important;

  border:
    1.25px solid
    rgba(12, 190, 211, .34) !important;

  border-radius:
    16px !important;

  background:
    linear-gradient(
      145deg,
      rgba(16, 27, 47, .97),
      rgba(8, 17, 32, .99)
    ) !important;

  box-shadow:
    0 7px 18px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.025)
    !important;
}

.compact-show-card-v324.is-ended {
  border-color:
    rgba(255, 214, 74, .48) !important;
}

/* Identity */
.v324-identity {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 9px;
  align-items: center;
}

.v324-avatar {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 43px;
  height: 43px;

  border: 2px solid transparent;
  border-radius: 50%;

  background:
    linear-gradient(#0d1728,#0d1728) padding-box,
    linear-gradient(
      135deg,
      #ff46ad,
      #a970ff,
      #16d9e3
    ) border-box;

  color: #f8f9ff;

  font-size: .84rem;
  font-weight: 950;
}

.v324-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.v324-seller-block {
  min-width: 0;
}

.v324-seller {
  display: block;

  max-width: 100%;
  padding: 0;

  border: 0;
  background: transparent;

  color: #f8f9ff;

  font-family: inherit;
  font-size: .82rem;
  font-weight: 950;
  line-height: 1.04;

  text-align: left;

  white-space: normal;
  overflow-wrap: anywhere;
}

/* There is intentionally NO LEGO/category row in v0.3.24 */

/* Status pill */
.v324-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;

  width: max-content;

  margin-top: 5px;
  padding: 3px 8px;

  border-radius: 999px;

  font-size: .49rem;
  font-weight: 950;
  letter-spacing: .10em;
}

.v324-status-dot {
  width: 6px;
  height: 6px;

  border-radius: 50%;
}

/* LIVE = PINK */
.v324-status.is-live {
  color: #ff4aab;
  background: rgba(255,42,144,.13);
}

.v324-status.is-live .v324-status-dot {
  background: #ff4aab;
}

/* ENDED = YELLOW */
.v324-status.is-ended {
  color: #ffd64a;
  background: rgba(255,214,74,.11);
}

.v324-status.is-ended .v324-status-dot {
  background: #ffd64a;
}

/* READY = TEAL */
.v324-status.is-ready {
  color: var(--teal);
  background: rgba(8,216,209,.09);
}

.v324-status.is-ready .v324-status-dot {
  background: var(--teal);
}

/* Metrics */
.v324-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;

  margin-top: 9px;

  border-top:
    1px solid rgba(248,249,255,.08);
}

.v324-metric {
  min-width: 0;

  padding:
    8px 8px 2px 0;
}

.v324-metric + .v324-metric {
  padding-left: 10px;

  border-left:
    1px solid rgba(248,249,255,.08);
}

.v324-count-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
}

.v324-count-row strong {
  color: #f8f9ff;

  font-size: .82rem;
  font-weight: 950;
}

.v324-count-row span {
  color: #a7b4cf;

  font-size: .46rem;
  font-weight: 900;
  letter-spacing: .06em;
}

.v324-valid .v324-count-row strong,
.v324-valid .v324-count-row span {
  color: #ff3fa4;
}

.v324-value {
  display: block;

  margin-top: 1px;

  color: #f8f9ff;

  font-size: .78rem;
  font-weight: 950;
  line-height: 1.05;

  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

.v324-label {
  display: block;

  margin-top: 4px;

  color: #7383a2;

  font-size: .39rem;
  font-weight: 900;
  letter-spacing: .12em;
}

/* Live sale-time VOLT signals */
.v324-volt-signals {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 6px;
  border-top: 1px solid rgba(248,249,255,.08);
}

.v324-volt-signal {
  min-width: 0;
  padding: 6px 8px 1px 0;
}

.v324-volt-signal + .v324-volt-signal {
  padding-left: 8px;
  border-left: 1px solid rgba(248,249,255,.08);
}

.v324-volt-signal span {
  display: block;
  color: #7383a2;
  font-size: .37rem;
  font-weight: 900;
  letter-spacing: .08em;
  white-space: nowrap;
}

.v324-volt-signal strong {
  display: block;
  margin-top: 2px;
  color: #f8f9ff;
  font-size: clamp(.68rem,2.7vw,.82rem);
  font-weight: 950;
  line-height: 1;
}

.v324-volt-signal.is-below strong {
  color: #ff3fa4;
}

.v324-volt-signal.is-above strong {
  color: #08d8d1;
}

.v324-volt-signal.is-unavailable strong {
  color: #8fa0b8;
}

/* Schedule */
.v324-schedule {
  display: grid;
  gap: 3px;

  margin-top: 9px;
  padding-top: 8px;

  border-top:
    1px solid rgba(248,249,255,.08);
}

/* Buttons */
.v324-controls {
  display: grid !important;
  grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);

  gap: 7px !important;

  margin-top: 9px !important;
}

.v324-controls .btn,
.v324-controls .compact-show-start {
  width: 100% !important;

  min-width: 0 !important;
  min-height: 35px !important;
  height: 35px !important;

  aspect-ratio: auto !important;

  padding:
    5px 5px !important;

  border-radius:
    10px !important;

  font-size:
    .48rem !important;

  font-weight:
    950 !important;

  letter-spacing:
    .01em !important;

  white-space:
    nowrap !important;
}

.v324-open {
  border:
    1.5px solid
    rgba(8,216,209,.92) !important;

  background:
    rgba(8,216,209,.035) !important;

  color:
    var(--teal) !important;
}

.v324-stop {
  border:
    1.5px solid
    rgba(255,214,74,.96) !important;

  background:
    rgba(255,214,74,.025) !important;

  color:
    #ffd64a !important;
}

/* =========================================================
   LIVE CAPTURE HEADER
========================================================= */

@media (max-width:720px) {

  #trackingShowsToggle.home-section-heading {
    display: grid !important;

    grid-template-columns:
      minmax(0,1fr) !important;

    gap: 9px !important;

    padding:
      13px 12px 10px !important;
  }

  #trackingShowsToggle
  .home-section-toggle-copy {
    width: 100% !important;
  }

  #trackingShowsHeading {
    font-size:
      clamp(1.08rem,4.9vw,1.40rem)
      !important;

    line-height:
      1 !important;
  }

  #trackingShowsToggle
  .tracking-heading-actions {
    display: grid !important;

    grid-template-columns:
      minmax(0,1fr)
      38px
      42px !important;

    gap: 6px !important;

    width: 100% !important;

    margin: 0 !important;
  }

  #trackingShowsToggle
  .tracking-heading-actions
  > button:not(.icon-refresh-button) {
    min-width: 0 !important;
    width: 100% !important;

    min-height: 36px !important;

    padding:
      6px 8px !important;

    border-radius:
      10px !important;

    font-size:
      clamp(.47rem,2.15vw,.59rem)
      !important;

    white-space:
      nowrap !important;
  }

  #trackingShowsToggle
  .icon-refresh-button {
    width: 38px !important;
    min-width: 38px !important;

    height: 36px !important;
    min-height: 36px !important;

    border-radius:
      10px !important;
  }

  #trackingShowsToggle
  .count-live {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 42px !important;
    min-width: 42px !important;

    height: 36px !important;
    min-height: 36px !important;

    border-radius:
      10px !important;
  }

  .home-live-section
  .home-section-body {
    padding-left:
      10px !important;

    padding-right:
      10px !important;
  }

  .compact-show-card-v324 {
    padding:
      9px !important;
  }

  .v324-identity {
    grid-template-columns:
      35px minmax(0,1fr);

    gap:
      7px;
  }

  .v324-avatar {
    width:
      35px;

    height:
      35px;

    font-size:
      .70rem;
  }

  .v324-seller {
    font-size:
      clamp(.65rem,2.65vw,.77rem);
  }

  .v324-status {
    margin-top:
      4px;

    padding:
      2px 7px;

    font-size:
      .45rem;
  }

  .v324-metrics {
    margin-top:
      7px;
  }

  .v324-metric {
    padding-top:
      7px;
  }

  .v324-count-row strong {
    font-size:
      clamp(.68rem,2.8vw,.79rem);
  }

  .v324-count-row span {
    font-size:
      clamp(.40rem,1.65vw,.46rem);
  }

  .v324-value {
    font-size:
      clamp(.64rem,2.65vw,.76rem);
  }

  .v324-controls {
    margin-top:
      7px !important;
  }

  .v324-controls .btn,
  .v324-controls .compact-show-start {
    min-height:
      32px !important;

    height:
      32px !important;

    font-size:
      clamp(.39rem,1.75vw,.46rem)
      !important;
  }

}

@media (max-width:390px) {

  .v324-metric + .v324-metric {
    padding-left:
      7px;
  }

  .v324-value {
    font-size:
      clamp(.61rem,2.65vw,.71rem);
  }

  .v324-controls .btn,
  .v324-controls .compact-show-start {
    font-size:
      clamp(.37rem,1.63vw,.43rem)
      !important;
  }

}


/* =========================================================
   v0.3.25 — compact card polish
========================================================= */

/* ---------------------------------------------------------
   TIGHTER CARD VERTICAL RHYTHM
--------------------------------------------------------- */

.compact-show-card-v324 {
  padding: 8px !important;
}

/* Seller + LIVE/ENDED area */
.v324-identity {
  grid-template-columns: 34px minmax(0,1fr) !important;
  gap: 7px !important;
}

.v324-avatar {
  width: 34px !important;
  height: 34px !important;

  font-size: .68rem !important;
}

/*
 * Mobile seller names are single-line only.
 * Crop cleanly at the available width.
 */
.v324-seller {
  width: 100% !important;
  max-width: 100% !important;

  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;

  overflow-wrap: normal !important;

  font-size:
    clamp(.64rem, 2.55vw, .75rem)
    !important;

  line-height: 1 !important;
}

/* Pull LIVE / ENDED closer to seller */
.v324-status {
  margin-top: 3px !important;

  padding:
    2px 7px !important;

  font-size:
    .43rem !important;
}

/* ---------------------------------------------------------
   SALES AREA
--------------------------------------------------------- */

/* Less gap between LIVE/ENDED and sales data */
.v324-metrics {
  margin-top:
    5px !important;
}

/* Reduce vertical padding inside metrics */
.v324-metric {
  padding:
    5px 6px 1px 0 !important;
}

.v324-metric + .v324-metric {
  padding-left:
    8px !important;
}

.v324-count-row strong {
  font-size:
    clamp(.66rem,2.7vw,.77rem)
    !important;
}

.v324-count-row span {
  font-size:
    clamp(.38rem,1.55vw,.44rem)
    !important;
}

.v324-value {
  margin-top:
    0 !important;

  font-size:
    clamp(.63rem,2.55vw,.74rem)
    !important;
}

.v324-label {
  margin-top:
    2px !important;

  font-size:
    .37rem !important;
}

/* ---------------------------------------------------------
   BUTTON ROW
--------------------------------------------------------- */

/* Less gap between sales metrics and buttons */
.v324-controls {
  margin-top:
    5px !important;

  gap:
    6px !important;
}

.v324-controls .btn,
.v324-controls .compact-show-start {
  min-height:
    30px !important;

  height:
    30px !important;

  padding:
    4px 4px !important;

  border-radius:
    9px !important;

  font-size:
    clamp(.38rem,1.65vw,.45rem)
    !important;
}

/* OPEN remains teal */
.v324-open {
  border-color:
    rgba(8,216,209,.90) !important;

  color:
    var(--teal) !important;
}

/*
 * LIVE STOP TRACK button = PINK
 * Ended RECONCILE button remains yellow below.
 */
.compact-show-card-v324:not(.is-ended)
.v324-stop {
  border:
    1.5px solid
    rgba(255,61,166,.95) !important;

  background:
    rgba(255,61,166,.035) !important;

  color:
    #ff3da6 !important;
}

/* ---------------------------------------------------------
   ENDED CARD EMPHASIS
--------------------------------------------------------- */

/* Much bolder yellow outline */
.compact-show-card-v324.is-ended {
  border:
    2px solid
    rgba(255,214,74,.96) !important;

  box-shadow:
    0 0 0 1px rgba(255,214,74,.08),
    0 8px 20px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.025)
    !important;
}

/* Ended RECONCILE remains yellow */
.compact-show-card-v324.is-ended
.v324-stop {
  border:
    1.5px solid
    rgba(255,214,74,.98) !important;

  background:
    rgba(255,214,74,.035) !important;

  color:
    #ffd64a !important;
}

/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media (max-width:720px) {

  .compact-show-card-v324 {
    padding:
      7px !important;
  }

  .v324-identity {
    grid-template-columns:
      32px minmax(0,1fr)
      !important;

    gap:
      6px !important;
  }

  .v324-avatar {
    width:
      32px !important;

    height:
      32px !important;
  }

  /*
   * Explicit seller-title cutoff.
   * Prevents long usernames from pushing card layout around.
   */
  .v324-seller-block {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .v324-seller {
    display: block !important;

    width: 100% !important;

    overflow: hidden !important;

    white-space: nowrap !important;

    text-overflow: ellipsis !important;
  }

  .v324-metrics {
    margin-top:
      4px !important;
  }

  .v324-metric {
    padding-top:
      5px !important;

    padding-bottom:
      0 !important;
  }

  .v324-controls {
    margin-top:
      4px !important;
  }

  .v324-controls .btn,
  .v324-controls .compact-show-start {
    min-height:
      29px !important;

    height:
      29px !important;
  }

}

/* Narrow phones */
@media (max-width:390px) {

  .compact-show-card-v324 {
    padding:
      6px !important;
  }

  .v324-value {
    font-size:
      clamp(.59rem,2.55vw,.68rem)
      !important;
  }

  .v324-controls .btn,
  .v324-controls .compact-show-start {
    font-size:
      clamp(.35rem,1.55vw,.41rem)
      !important;
  }

}

/* VOLT_SELLER_PROFILE_V5_REFERENCE */

.v324-profile-link {
  cursor:pointer;
}

.v324-profile-link:hover .v324-avatar {
  transform:scale(1.035);
}

.v324-profile-link:hover .v324-seller {
  color:#08D8D1;
}

.v324-avatar {
  transition:transform 120ms ease;
}


/* HERO */

.seller-v5-hero {
  position:relative;

  display:grid;

  grid-template-columns:
    112px
    minmax(0,1fr)
    108px;

  gap:18px;

  align-items:center;

  margin:0 0 12px;

  padding:15px 17px;

  border:
    1px solid rgba(8,216,209,.80);

  border-radius:13px;

  background:
    radial-gradient(
      circle at 0% 30%,
      rgba(255,63,164,.09),
      transparent 30%
    ),
    linear-gradient(
      115deg,
      rgba(169,112,255,.045),
      rgba(8,216,209,.018)
    );

  box-shadow:
    inset 2px 0 rgba(255,63,164,.85),
    inset -2px 0 rgba(8,216,209,.85);
}

.seller-v5-avatar {
  width:108px;
  height:108px;

  display:flex;
  align-items:center;
  justify-content:center;

  box-sizing:border-box;

  overflow:hidden;

  border:4px solid transparent;
  border-radius:50%;

  background:
    linear-gradient(
      #091322,
      #091322
    ) padding-box,

    linear-gradient(
      135deg,
      #FF3FA4,
      #A970FF,
      #FFD64A,
      #08D8D1
    ) border-box;

  color:#F8F9FF;

  font-size:1.2rem;
  font-weight:950;

  box-shadow:
    0 0 22px rgba(169,112,255,.14);
}

.seller-v5-avatar img {
  width:100%;
  height:100%;

  display:block;

  object-fit:cover;

  border-radius:50%;
}

.seller-v5-hero-copy {
  min-width:0;
}

.seller-v5-hero-copy h2 {
  margin:0 0 6px;

  color:#F8F9FF;

  font-size:
    clamp(1.45rem,3.5vw,2rem);

  font-weight:950;

  line-height:.98;

  letter-spacing:-.035em;

  white-space:nowrap;

  overflow:hidden;

  text-overflow:ellipsis;
}

.seller-v5-hero-meta {
  margin-bottom:9px;

  color:#A7B0C4;

  font-size:.65rem;

  line-height:1.5;
}

.seller-v5-actions {
  display:grid;

  grid-template-columns:
    minmax(145px,.85fr)
    minmax(190px,1.15fr);

  gap:8px;

  max-width:620px;
}

.seller-v5-action {
  min-height:36px;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:8px;

  box-sizing:border-box;

  padding:7px 12px;

  border-radius:9px;

  font-size:.59rem;

  font-weight:950;

  letter-spacing:.07em;

  text-decoration:none;
}

.seller-v5-action svg {
  width:16px;
  height:16px;

  fill:none;

  stroke:currentColor;

  stroke-width:2;

  stroke-linecap:round;

  stroke-linejoin:round;
}

.seller-v5-action.is-seller {
  border:
    1px solid rgba(169,112,255,.75);

  color:#A970FF;

  background:
    rgba(169,112,255,.025);
}

.seller-v5-action.is-live {
  border:1px solid #FFD64A;

  color:#091322;

  background:#FFD64A;
}

.seller-v5-status {
  align-self:start;

  min-width:92px;

  display:flex;

  align-items:center;

  justify-content:center;

  padding:7px 11px;

  border:
    1px solid rgba(169,112,255,.30);

  border-radius:999px;

  color:#A7B0C4;

  font-size:.62rem;
}

.seller-v5-status.is-live {
  display:grid;

  grid-template-columns:
    8px auto;

  column-gap:8px;

  border-color:#FF3FA4;

  color:#F8F9FF;

  background:
    rgba(255,63,164,.12);

  box-shadow:
    0 0 15px rgba(255,63,164,.13);
}

.seller-v5-status i {
  width:8px;
  height:8px;

  display:block;

  border-radius:50%;

  background:#F8F9FF;
}

.seller-v5-status strong {
  font-size:.68rem;

  letter-spacing:.04em;
}

.seller-v5-status small {
  grid-column:1 / -1;

  display:block;

  margin-top:5px;

  color:#A7B0C4;

  font-size:.46rem;

  text-align:center;
}


/* PRIMARY KPI CARDS */

.seller-profile-metrics.seller-v5-primary {
  display:grid !important;

  grid-template-columns:
    repeat(4,minmax(0,1fr))
    !important;

  gap:8px !important;

  margin:0 0 8px !important;
}

.seller-v5-kpi {
  min-width:0;

  min-height:82px;

  display:flex;

  align-items:flex-start;

  gap:9px;

  box-sizing:border-box;

  padding:11px 12px;

  border:
    1px solid rgba(169,112,255,.20);

  border-radius:11px;

  background:
    rgba(248,249,255,.015);
}

.seller-v5-kpi-icon {
  flex:0 0 auto;

  width:26px;
  height:26px;

  display:flex;

  align-items:center;

  justify-content:center;
}

.seller-v5-kpi-icon svg {
  width:24px;
  height:24px;

  fill:none;

  stroke:currentColor;

  stroke-width:2;

  stroke-linecap:round;

  stroke-linejoin:round;
}

.seller-v5-kpi-copy {
  min-width:0;
}

.seller-v5-kpi strong {
  display:block;

  color:#F8F9FF;

  font-size:
    clamp(.92rem,1.9vw,1.18rem);

  font-weight:950;

  line-height:1.05;

  letter-spacing:-.02em;

  white-space:nowrap;

  overflow:hidden;

  text-overflow:ellipsis;
}

.seller-v5-kpi span {
  display:block;

  margin-top:5px;

  color:#A7B0C4;

  font-size:.46rem;

  font-weight:950;

  line-height:1.2;

  letter-spacing:.085em;
}

.seller-v5-kpi.is-purple {
  color:#A970FF;
}

.seller-v5-kpi.is-pink {
  color:#FF3FA4;
}

.seller-v5-kpi.is-teal {
  color:#08D8D1;

  border-color:
    rgba(8,216,209,.22);
}

.seller-v5-kpi.is-teal strong {
  color:#08D8D1;
}

.seller-v5-kpi.is-blue {
  color:#08D8D1;
}


/* SECONDARY KPI STRIP */

.seller-v5-secondary {
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:7px;

  margin:0 0 11px;
}

.seller-v5-secondary
.seller-v5-kpi {
  min-height:54px;

  align-items:center;

  padding:8px 10px;

  border-color:
    rgba(8,216,209,.12);
}

.seller-v5-secondary
.seller-v5-kpi-icon {
  width:22px;
  height:22px;
}

.seller-v5-secondary
.seller-v5-kpi-icon svg {
  width:20px;
  height:20px;
}

.seller-v5-secondary
.seller-v5-kpi strong {
  font-size:.85rem;
}

.seller-v5-secondary
.seller-v5-kpi span {
  margin-top:3px;

  font-size:.40rem;
}


/* PERFORMANCE CHART */

.seller-performance-panel {
  margin:
    0 0 12px !important;

  padding:
    12px 13px 7px !important;

  border:
    1px solid rgba(169,112,255,.22)
    !important;

  border-radius:
    12px !important;

  background:
    rgba(248,249,255,.010)
    !important;
}

.seller-performance-heading {
  margin-bottom:
    3px !important;
}

.seller-performance-heading span {
  color:#FF3FA4 !important;

  font-size:
    .53rem !important;
}

.seller-performance-heading strong {
  font-size:
    .86rem !important;
}

.seller-performance-heading small {
  font-size:
    .48rem !important;
}

.seller-performance-chart {
  min-height:
    230px !important;
}

.seller-performance-svg {
  height:
    240px !important;
}

.seller-chart-point.is-above {
  fill:#08D8D1 !important;
}

.seller-chart-point.is-below {
  fill:#FF3FA4 !important;
}

.seller-chart-volt-line,
.seller-chart-baseline {
  stroke:#A970FF !important;
}


/* SHOW HISTORY */

.seller-profile-shows-heading {
  margin:
    0 0 7px !important;

  color:
    #D9E0EE !important;

  font-size:
    .67rem !important;

  font-weight:
    950 !important;

  letter-spacing:
    .105em !important;
}

#sellerProfileShows {
  display:grid;

  gap:6px;
}

.seller-v5-history-card {
  min-width:0;

  display:grid;

  grid-template-columns:
    72px
    minmax(135px,1.2fr)
    minmax(330px,2.55fr)
    88px
    14px;

  gap:9px;

  align-items:center;

  box-sizing:border-box;

  padding:9px 11px;

  border:
    1px solid rgba(248,249,255,.070);

  border-radius:10px;

  background:
    rgba(248,249,255,.010);

  cursor:pointer;
}

.seller-v5-history-card:hover {
  border-color:
    rgba(8,216,209,.32);

  background:
    rgba(8,216,209,.018);
}

.seller-v5-history-date {
  padding-right:8px;

  border-right:
    1px solid rgba(248,249,255,.065);
}

.seller-v5-history-date strong {
  display:block;

  color:#F8F9FF;

  font-size:.68rem;

  font-weight:950;

  line-height:1.05;
}

.seller-v5-history-date span {
  display:block;

  margin-top:3px;

  color:#A7B0C4;

  font-size:.55rem;

  font-weight:850;
}

.seller-v5-history-identity {
  min-width:0;
}

.seller-v5-history-title {
  display:block;

  color:#F8F9FF;

  font-size:.64rem;

  font-weight:900;

  line-height:1.15;

  white-space:nowrap;

  overflow:hidden;

  text-overflow:ellipsis;
}

.seller-v5-history-identity > span {
  display:block;

  margin-top:3px;

  color:#A7B0C4;

  font-size:.45rem;

  white-space:nowrap;

  overflow:hidden;

  text-overflow:ellipsis;
}

.seller-v5-history-metrics {
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:7px;
}

.seller-v5-history-metric {
  min-width:0;
}

.seller-v5-history-metric strong {
  display:block;

  color:#F8F9FF;

  font-size:.66rem;

  font-weight:950;

  line-height:1;

  white-space:nowrap;

  overflow:hidden;

  text-overflow:ellipsis;
}

.seller-v5-history-metric span {
  display:block;

  margin-top:4px;

  color:#A7B0C4;

  font-size:.34rem;

  font-weight:900;

  letter-spacing:.065em;

  white-space:nowrap;
}

.seller-v5-history-metric.is-yellow strong {
  color:#FFD64A;
}

.seller-v5-history-metric.is-purple strong {
  color:#A970FF;
}

.seller-v5-percent {
  padding-left:8px;

  border-left:
    1px solid rgba(248,249,255,.065);
}

.seller-v5-percent strong {
  display:block;

  font-size:.91rem;

  font-weight:950;

  line-height:1;

  letter-spacing:-.03em;
}

.seller-v5-percent span {
  display:block;

  margin-top:4px;

  color:#A7B0C4;

  font-size:.34rem;

  font-weight:950;

  letter-spacing:.07em;
}

.seller-v5-percent.is-positive strong {
  color:#08D8D1;
}

.seller-v5-percent.is-negative strong {
  color:#FF3FA4;
}

.seller-v5-percent.is-neutral strong {
  color:#A7B0C4;
}

.seller-v5-history-arrow {
  color:#F8F9FF;

  font-size:1.15rem;

  line-height:1;

  text-align:center;
}


/* MOBILE */

@media (max-width:800px) {

  .seller-v5-hero {
    grid-template-columns:
      68px
      minmax(0,1fr)
      67px;

    gap:9px;

    padding:10px;
  }

  .seller-v5-avatar {
    width:66px;
    height:66px;

    border-width:3px;
  }

  .seller-v5-hero-copy h2 {
    font-size:1.18rem;
  }

  .seller-v5-hero-meta {
    margin-bottom:7px;

    font-size:.50rem;
  }

  .seller-v5-actions {
    grid-template-columns:
      .9fr 1.1fr;

    gap:5px;
  }

  .seller-v5-action {
    min-height:30px;

    padding:5px 7px;

    font-size:.43rem;
  }

  .seller-v5-action svg {
    width:13px;
    height:13px;
  }

  .seller-v5-status {
    min-width:58px;

    padding:5px 7px;
  }

  .seller-v5-status strong {
    font-size:.50rem;
  }

  .seller-v5-status small {
    display:none;
  }

  .seller-profile-metrics.seller-v5-primary {
    grid-template-columns:
      repeat(2,minmax(0,1fr))
      !important;
  }

  .seller-v5-kpi {
    min-height:68px;

    padding:8px 9px;

    gap:6px;
  }

  .seller-v5-kpi-icon {
    width:20px;
    height:20px;
  }

  .seller-v5-kpi-icon svg {
    width:19px;
    height:19px;
  }

  .seller-v5-kpi strong {
    font-size:.78rem;
  }

  .seller-v5-kpi span {
    font-size:.39rem;
  }

  .seller-v5-secondary {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .seller-performance-chart {
    min-height:
      205px !important;
  }

  .seller-performance-svg {
    min-width:
      500px !important;

    height:
      215px !important;
  }

  .seller-v5-history-card {
    grid-template-columns:
      50px
      minmax(0,1fr)
      70px
      11px;

    grid-template-areas:
      "date identity percent arrow"
      "metrics metrics metrics metrics";

    gap:6px 7px;

    padding:8px 9px;
  }

  .seller-v5-history-date {
    grid-area:date;
  }

  .seller-v5-history-identity {
    grid-area:identity;
  }

  .seller-v5-history-metrics {
    grid-area:metrics;

    grid-template-columns:
      repeat(4,minmax(0,1fr));

    padding-top:6px;

    border-top:
      1px solid rgba(248,249,255,.05);
  }

  .seller-v5-percent {
    grid-area:percent;

    padding-left:6px;
  }

  .seller-v5-history-arrow {
    grid-area:arrow;
  }

  .seller-v5-history-date strong {
    font-size:.57rem;
  }

  .seller-v5-history-date span {
    font-size:.47rem;
  }

  .seller-v5-history-title {
    font-size:.57rem;
  }

  .seller-v5-history-identity > span {
    font-size:.39rem;
  }

  .seller-v5-history-metric strong {
    font-size:.56rem;
  }

  .seller-v5-history-metric span {
    font-size:.29rem;
  }

  .seller-v5-percent strong {
    font-size:.76rem;
  }

  .seller-v5-percent span {
    font-size:.29rem;
  }
}


@media (max-width:520px) {

  .seller-v5-hero {
    grid-template-columns:
      54px
      minmax(0,1fr);

    grid-template-areas:
      "avatar copy"
      "actions actions";

    align-items:start;
  }

  .seller-v5-avatar {
    grid-area:avatar;

    width:52px;
    height:52px;
  }

  .seller-v5-hero-copy {
    grid-area:copy;
  }

  .seller-v5-actions {
    grid-area:actions;

    margin-top:2px;
  }

  .seller-v5-status {
    position:absolute;

    top:9px;
    right:9px;

    min-width:auto;

    padding:4px 7px;
  }

  .seller-v5-hero-copy h2 {
    padding-right:62px;

    font-size:1.05rem;
  }

  .seller-v5-secondary
  .seller-v5-kpi {
    min-height:49px;
  }

  .seller-v5-history-metrics {
    gap:3px;
  }
}