@import url("./tokens.css");
/* Active reference: supplied screen.png/code.html; shared roles from DESIGN.md. */
@font-face{font-family:"DM Sans";src:url("./fonts/dm-sans-400.ttf") format("truetype");font-weight:400;font-display:swap;}
@font-face{font-family:"DM Sans";src:url("./fonts/dm-sans-500.ttf") format("truetype");font-weight:500;font-display:swap;}
@font-face{font-family:"DM Sans";src:url("./fonts/dm-sans-600.ttf") format("truetype");font-weight:600;font-display:swap;}
@font-face{font-family:"DM Sans";src:url("./fonts/dm-sans-700.ttf") format("truetype");font-weight:700;font-display:swap;}
@font-face{font-family:"Outfit";src:url("./fonts/outfit-400.ttf") format("truetype");font-weight:400;font-display:swap;}
@font-face{font-family:"Outfit";src:url("./fonts/outfit-500.ttf") format("truetype");font-weight:500;font-display:swap;}
@font-face{font-family:"Outfit";src:url("./fonts/outfit-600.ttf") format("truetype");font-weight:600;font-display:swap;}
@font-face{font-family:"Outfit";src:url("./fonts/outfit-700.ttf") format("truetype");font-weight:700;font-display:swap;}
@font-face{font-family:"Roboto Mono";src:url("./fonts/roboto-mono-400.ttf") format("truetype");font-weight:400;font-display:swap;}
@font-face{font-family:"Roboto Mono";src:url("./fonts/roboto-mono-500.ttf") format("truetype");font-weight:500;font-display:swap;}
@font-face{font-family:"Roboto Mono";src:url("./fonts/roboto-mono-600.ttf") format("truetype");font-weight:600;font-display:swap;}
@font-face{font-family:"Roboto Mono";src:url("./fonts/roboto-mono-700.ttf") format("truetype");font-weight:700;font-display:swap;}
:root {
  color-scheme: light;
  --dart-font: "DM Sans", sans-serif;
  --dart-mono: "Roboto Mono", monospace;
  --font-body: var(--dart-font);
  --dart-font-heading: "Outfit", sans-serif;
  --dart-font-metric: "Roboto Mono", monospace;
  --font-heading: "Outfit", sans-serif;
  --dart-space-1: 4px;
  --dart-space-2: 8px;
  --dart-space-3: 12px;
  --dart-space-4: 16px;
  --dart-space-6: 24px;
  --dart-space-8: 32px;
  --dart-radius: 8px;
  --dart-content-width: 1360px;
}
.dart-page {
  margin: 0;
  background: var(--dart-bg);
  color: var(--dart-ink);
  font-family: var(--dart-font);
  line-height: 1.5;
}
.dart-page *,
.dart-page *::before,
.dart-page *::after {
  box-sizing: border-box;
}
.ds-shell {
  width: min(100% - 64px, calc(var(--dart-content-width) - 64px));
  margin-inline: auto;
}
.ds-panel {
  background: var(--dart-surface);
  border: 1px solid var(--dart-border);
  border-radius: var(--dart-radius);
  overflow: hidden;
}
.ds-number {
  font-family: var(--dart-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.ds-muted {
  color: var(--dart-muted);
}
.ds-positive {
  color: var(--dart-positive);
}
.ds-negative {
  color: var(--dart-negative);
}
.ds-eyebrow {
  font-size: 11px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--dart-muted);
}
.ds-title {
  margin: 0;
  font-size: 28px;
  letter-spacing: -0.02em;
  line-height: 36px;
  font-weight: 600;
}
.ds-heading {
  margin: 0;
  font-size: 18px;
  letter-spacing: -0.015em;
  font-weight: 600;
}
.ds-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid var(--dart-border);
  border-radius: 8px;
  background: var(--dart-surface);
  color: var(--dart-ink);
  font: 500 14px/20px var(--dart-font);
  cursor: pointer;
  text-decoration: none;
}
.ds-button:hover {
  border-color: var(--dart-border-hover);
  background: var(--dart-bg);
  color: var(--dart-ink);
  text-decoration: none;
}
.ds-button--primary {
  color: white;
  background: var(--dart-accent);
  border-color: var(--dart-accent);
}
.ds-button--primary:hover {
  border-color: var(--dart-accent-hover);
  background: var(--dart-accent-hover);
  color: white;
}
.ds-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.dart-page :focus-visible {
  outline: 2px solid var(--dart-accent);
  outline-offset: 3px;
}
.dart-page .ds-input {
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid var(--dart-border);
  border-radius: 8px;
  background: var(--dart-surface);
  color: var(--dart-ink);
  font: 14px/20px var(--dart-font);
  box-shadow: none;
}
.ds-table-wrap {
  overflow-x: auto;
}
.ds-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.ds-table th {
  text-align: left;
  color: var(--dart-muted);
  font-size: 11px;
  letter-spacing: 0.03em;
  font-weight: 500;
  text-transform: uppercase;
  background: var(--dart-bg);
}
.ds-table th,
.ds-table td {
  padding: 4px 12px;
  border-bottom: 1px solid var(--dart-border);
}
.ds-table th[data-numeric],
.ds-table td[data-numeric] {
  text-align: right;
  white-space: nowrap;
}
.ds-table tbody tr:last-child td {
  border-bottom: 0;
}
.ds-table tbody tr:hover,
.ds-table tr[data-selected="true"] {
  background: var(--dart-selected);
}
.ds-table tr[data-selected="true"] td:first-child {
  box-shadow: inset 3px 0 var(--dart-accent);
}
.ds-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 500 12px/16px var(--dart-font);
  color: var(--dart-muted);
}
.ds-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--dart-warning);
  display: inline-block;
}
.ds-empty {
  padding: 64px 24px;
  text-align: center;
  color: var(--dart-muted);
  font-size: 13px;
}
.ds-empty strong {
  display: block;
  color: var(--dart-ink);
  font-size: 18px;
  margin-bottom: 10px;
}
.ds-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Review components for scan-oriented market screens. */
.ds-review-flow {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--dart-muted);
  font: 400 13px/18px var(--dart-font);
}
.ds-review-flow span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}
.ds-review-flow b {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid var(--dart-border);
  border-radius: 50%;
  color: var(--dart-muted);
  font: 500 12px/16px var(--dart-mono);
}
.ds-review-flow span[aria-current="step"] {
  color: var(--dart-ink);
}
.ds-review-flow span[aria-current="step"] b {
  color: white;
  border-color: var(--dart-accent);
  background: var(--dart-accent);
}
.ds-review-flow i {
  width: 28px;
  height: 1px;
  background: var(--dart-border);
}
.ds-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  padding: 4px 9px;
  border: 1px solid var(--dart-border);
  border-radius: 999px;
  color: var(--dart-muted);
  background: var(--dart-surface);
  font: 500 12px/16px var(--dart-font);
  white-space: nowrap;
}
.ds-status::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}
.ds-status--fresh {
  color: var(--dart-accent);
  border-color: var(--dart-selected);
  background: var(--dart-selected);
}
.ds-status--watch {
  color: var(--dart-warning);
  border-color: var(--dart-border);
  background: var(--dart-bg);
}
.ds-status--past {
  color: var(--dart-muted);
  background: var(--dart-bg);
}
.ds-callout {
  border-left: 3px solid var(--dart-accent);
  border-radius: 0 6px 6px 0;
  padding: 12px 14px;
  background: var(--dart-selected);
  color: var(--dart-ink);
  font-size: 14px;
  line-height: 20px;
}
.ds-callout strong {
  display: block;
  margin-bottom: 3px;
  font-size: 12px;
}
.ds-callout--watch {
  border-left-color: var(--dart-warning);
  background: var(--dart-bg);
}
.ds-selectable {
  cursor: pointer;
  transition: background-color 120ms ease, border-color 120ms ease;
}
.ds-selectable:hover,
.ds-selectable[aria-pressed="true"] {
  background: var(--dart-selected);
}
.ds-selectable:focus-visible {
  outline: 2px solid var(--dart-accent);
  outline-offset: 2px;
}
@media (max-width: 640px) {
  .ds-shell {
    width: calc(100% - 32px);
  }
  .ds-table th,
  .ds-table td {
    padding: 4px 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .dart-page *,
  .dart-page *::before,
  .dart-page *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

.ds-number {font-feature-settings:"tnum" 1,"cv05" 1;}

/* Density, elevation and phase primitives from the component specification. */
.ds-heading {line-height:24px;}
.ds-data-metric, .ds-number, .ds-table [data-numeric] {font-feature-settings:"tnum" 1,"cv05" 1;font-variant-numeric:tabular-nums;}
.ds-table thead tr {height:36px;}
.ds-table tbody tr {height:44px;}
.ds-table th {font-weight:600;}
.ds-table td {border-bottom-color:var(--dart-row-border);}
.ds-table tbody tr:hover {background:var(--dart-row-hover);}
.ds-table [data-pinned] {position:sticky;left:0;background:var(--dart-surface);z-index:1;}
.ds-panel--hover:hover {border-color:var(--dart-border-hover);box-shadow:0 2px 6px -1px rgba(24,33,47,.04),0 1px 4px -1px rgba(24,33,47,.02);}
.ds-popover {background:var(--dart-surface);border:1px solid var(--dart-border);border-radius:12px;box-shadow:0 10px 15px -3px rgba(24,33,47,.07),0 4px 6px -2px rgba(24,33,47,.04);}
.ds-modal {background:var(--dart-surface);border:1px solid var(--dart-border);border-radius:12px;box-shadow:0 20px 25px -5px rgba(24,33,47,.08),0 10px 10px -5px rgba(24,33,47,.03);}
.ds-button--primary:active {background:var(--dart-accent-active);}
.ds-button--danger {color:var(--dart-negative);}
.ds-button--danger:hover {background:#FFF1F2;}
.dart-page .ds-input:focus {border-color:var(--dart-accent);box-shadow:0 0 0 3px var(--dart-focus-ring);}
.ds-checkbox {width:16px;height:16px;border-radius:4px;accent-color:var(--dart-accent);}
.ds-chip {display:inline-flex;gap:6px;align-items:center;background:var(--dart-surface);border:1px solid var(--dart-border);border-radius:8px;padding:4px 8px;font:500 12px/16px var(--dart-font);color:var(--dart-ink);}
.ds-chip[aria-pressed="true"] {background:var(--dart-selected);border-color:var(--dart-accent);color:var(--dart-accent);}
.ds-phase {display:inline-flex;align-items:center;min-height:22px;padding:2px 8px;border:1px solid;border-radius:6px;font:600 11px/14px var(--dart-font);}
.ds-phase--recovering {background:var(--dart-recovering-bg);color:var(--dart-recovering);border-color:rgba(37,99,235,.2);}
.ds-phase--powering-up {background:var(--dart-powering-up-bg);color:var(--dart-powering-up);border-color:rgba(15,118,110,.2);}
.ds-phase--powering-down {background:var(--dart-powering-down-bg);color:var(--dart-powering-down);border-color:rgba(180,83,9,.2);}
.ds-phase--lagging {background:var(--dart-lagging-bg);color:var(--dart-lagging);border-color:rgba(100,116,139,.2);}
@media (min-width:768px) and (max-width:1024px) {.ds-shell{width:calc(100% - 48px);}}
@media (max-width:767px) {.ds-shell{width:calc(100% - 32px);}.ds-title,.ds-display-title{font-size:22px;line-height:28px;letter-spacing:-.01em;}}

.dart-page button,.dart-page input,.dart-page select,.dart-page textarea{font-family:var(--dart-font);}

.ds-eyebrow {font:600 11px/14px var(--dart-font);letter-spacing:.03em;}
.ds-table {font:400 13px/18px var(--dart-font);}
.ds-table th {line-height:14px;}
.ds-empty {font:400 13px/18px var(--dart-font);}
.ds-empty strong {font:600 18px/24px var(--dart-font);}
.ds-callout strong {font:500 12px/16px var(--dart-font);}

.dart-page pre,.dart-page code{font-family:var(--dart-font);font-feature-settings:"tnum" 1,"cv05" 1;}

.ds-title{font-family:var(--dart-font-heading);font-weight:700;}
.ds-heading{font-family:var(--dart-font-heading);}