.market-status-root {
  --status-green: var(--rt-positive, #247a47);
  --status-green-soft: var(--rt-positive-1, #e7f5ec);
  --status-amber: var(--rt-warning, #9a6500);
  --status-amber-soft: var(--rt-warning-1, #fff4d6);
  --status-red: var(--rt-negative, #a83131);
  --status-red-soft: var(--rt-negative-1, #fdeaea);
  --status-blue: var(--rt-info, #2369a8);
  --status-blue-soft: var(--rt-info-1, #e8f2fb);
  --status-gray: var(--rt-muted, #66707a);
  --status-gray-soft: var(--rt-surface-muted, #f2f4f5);
  --status-line: var(--rt-line, #d7dce0);
  --status-surface: var(--rt-surface, #fff);
  --status-ink: var(--rt-ink, #17212b);
  display: grid;
  gap: 12px;
  min-width: 0;
  color: var(--status-ink);
}

.market-status-root button,
.market-status-root input,
.market-status-root select,
.market-status-root a {
  font: inherit;
}

.market-status-root button:focus-visible,
.market-status-root input:focus-visible,
.market-status-root select:focus-visible,
.market-status-root a:focus-visible,
.market-status-matrix-scroll:focus-visible {
  outline: 3px solid var(--status-blue);
  outline-offset: 2px;
}

.market-status-today,
.market-status-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.market-status-card,
.market-status-metric {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--status-line);
  border-left: 4px solid var(--status-gray);
  border-radius: 4px;
  background: var(--status-surface);
  color: inherit;
  text-decoration: none;
}

.market-status-card {
  display: grid;
  gap: 4px;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.market-status-card-phase,
.market-status-card-state {
  font-weight: 760;
}

.market-status-card-state {
  font-size: 14px;
}

.market-status-metrics {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.market-status-metric {
  display: grid;
  gap: 3px;
}

.market-status-metric strong {
  font-size: 18px;
  font-variant-numeric: tabular-nums;
}

.market-status-metric small {
  color: var(--status-gray);
}

.market-status-controls {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 10px;
  border: 1px solid var(--status-line);
  background: var(--status-surface);
}

.market-status-controls fieldset {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  border: 0;
}

.market-status-controls legend {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.market-status-controls label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
}

.market-status-controls button,
.market-status-controls input,
.market-status-controls select {
  min-height: 34px;
  padding: 5px 9px;
  border: 1px solid var(--status-line);
  border-radius: 3px;
  background: var(--status-surface);
  color: inherit;
}

.market-status-controls button[aria-pressed="true"] {
  border-color: var(--status-blue);
  background: var(--status-blue-soft);
  font-weight: 760;
}

.market-status-controls input {
  width: 70px;
}

.market-status-matrix-scroll {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--status-line);
  background: var(--status-surface);
}

.market-status-matrix {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 11px;
}

.market-status-matrix caption {
  padding: 10px;
  text-align: left;
  font-size: 14px;
  font-weight: 760;
}

.market-status-matrix th,
.market-status-matrix td {
  min-width: 106px;
  padding: 5px;
  border-top: 1px solid var(--status-line);
  border-right: 1px solid var(--status-line);
  text-align: center;
}

.market-status-matrix th:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 104px;
  background: var(--status-surface);
  box-shadow: 1px 0 var(--status-line);
  text-align: left;
}

.market-status-cell {
  width: 100%;
  min-height: 48px;
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: center;
  gap: 4px;
  padding: 5px;
  border: 1px solid currentColor;
  border-radius: 3px;
  background: var(--status-gray-soft);
  color: var(--status-gray);
  cursor: pointer;
  text-align: left;
}

.market-status-cell-symbol {
  font-size: 15px;
  font-weight: 800;
  text-align: center;
}

.market-status-cell-label {
  font-weight: 700;
}

.market-status-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 12px;
  padding: 8px 10px;
  border: 1px solid var(--status-line);
  background: var(--status-surface);
  font-size: 11px;
}

.market-status-card.is-on-time,
.market-status-cell.is-on-time { border-left-color: var(--status-green); background: var(--status-green-soft); color: var(--status-green); }
.market-status-card.is-delayed,
.market-status-card.is-degraded,
.market-status-card.is-recovered,
.market-status-cell.is-delayed,
.market-status-cell.is-degraded,
.market-status-cell.is-recovered { border-left-color: var(--status-amber); background: var(--status-amber-soft); color: var(--status-amber); }
.market-status-card.is-failed,
.market-status-card.is-missing,
.market-status-cell.is-failed,
.market-status-cell.is-missing { border-left-color: var(--status-red); background: var(--status-red-soft); color: var(--status-red); }
.market-status-card.is-pending,
.market-status-cell.is-pending { border-left-color: var(--status-blue); background: var(--status-blue-soft); color: var(--status-blue); }
.market-status-card.is-not-enabled,
.market-status-card.is-market-closed,
.market-status-card.is-unknown,
.market-status-cell.is-not-enabled,
.market-status-cell.is-market-closed,
.market-status-cell.is-unknown { border-left-color: var(--status-gray); background: var(--status-gray-soft); color: var(--status-gray); }

.market-status-cell.is-unknown,
.market-status-legend .is-unknown {
  background-image: repeating-linear-gradient(135deg, transparent 0 5px, rgba(90, 100, 110, .12) 5px 10px);
}

.market-status-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 30;
  width: min(460px, 100vw);
  height: 100vh;
  overflow-y: auto;
  padding: 16px;
  border-left: 4px solid var(--status-gray);
  background: var(--status-surface);
  box-shadow: -8px 0 30px rgba(10, 20, 30, .18);
}

.market-status-drawer > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.market-status-drawer h2,
.market-status-drawer h3,
.market-status-drawer p { margin: 0; }

.market-status-drawer [data-status-close] {
  width: 36px;
  height: 36px;
  border: 1px solid var(--status-line);
  border-radius: 50%;
  background: var(--status-surface);
  font-size: 22px;
}

.market-status-detail-state {
  margin-top: 8px !important;
  font-weight: 760;
}

.market-status-drawer dl > div {
  display: grid;
  grid-template-columns: minmax(110px, .7fr) minmax(0, 1.3fr);
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--status-line);
}

.market-status-drawer dt { color: var(--status-gray); }
.market-status-drawer dd { margin: 0; overflow-wrap: anywhere; }

.market-status-error[aria-live] {
  padding: 10px;
  border: 1px solid var(--status-red);
  border-left-width: 4px;
  background: var(--status-red-soft);
  color: var(--status-red);
  font-weight: 700;
}

@media (max-width: 639px) {
  .market-status-today,
  .market-status-metrics {
    grid-template-columns: 1fr;
  }

  .market-status-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .market-status-controls fieldset {
    align-items: stretch;
  }

  .market-status-controls button {
    flex: 1 1 auto;
  }

  .market-status-cell {
    min-height: 54px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .market-status-root * { scroll-behavior: auto !important; }
}
