/* Workstation recipes for laggard application panes.
   Consume these from dashboard.html renderers. Do not restyle .poly-* /
   .metric-grid (Polymarket Suite benchmark). Glass is opt-in via
   .mpo-surface-dark / .mpo-surface-light in mpo-shell.css. Motion FX
   (profit-only money rain/pile) stays in the FX lane. */
.dark {
  background: var(--mpo-term-bg);
  color: var(--mpo-term-fg);
  border: var(--mpo-border-inset);
}
.terminal { font-family: var(--mpo-font-term); }
.green { color: var(--mpo-green); }
.amber { color: var(--mpo-amber); }
.red { color: var(--mpo-red); }
.cyan { color: var(--mpo-cyan); }
.muted { color: var(--mpo-term-muted-light); }
.dark .muted { color: var(--mpo-term-muted); }
.mpo-surface-light .muted,
.mpo-surface-dark .muted { font-size: var(--mpo-fs-micro-target); }

.inset { border: var(--mpo-border-inset); background: #fff; }
.toolbar {
  display: flex;
  gap: 4px;
  align-items: center;
  margin-bottom: 5px;
}
.btn,
button.btn {
  background: var(--mpo-chrome);
  border: var(--mpo-border-outset);
  padding: 3px 8px;
  min-height: 25px;
  color: #000;
}
.btn:hover,
button.btn:hover { background: var(--mpo-chrome-mid); }
.btn:active,
button.btn:active { border-style: inset; }
.btn:disabled,
button.btn:disabled { color: #666; background: var(--mpo-chrome); }
.field,
input,
select,
textarea {
  background: #fff;
  border: var(--mpo-border-inset);
  padding: 3px 5px;
  min-height: 25px;
  color: #111;
}
.field:disabled,
input:disabled,
select:disabled,
textarea:disabled {
  background: #e8e8e8;
  color: #666;
}
.status { display: flex; gap: 5px; margin-top: 5px; }
.status span {
  border: var(--mpo-border-inset);
  padding: 3px 6px;
  background: #d9d9d9;
  flex: 1;
}
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }

.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:6px}
.metric {
  padding: 6px;
  border: 1px solid var(--mpo-metric-border);
  background: var(--mpo-metric-bg);
}
.metric label {
  display: block;
  font: var(--mpo-fs-micro) Tahoma, sans-serif;
  color: var(--mpo-term-label);
}
.metric b {
  display: block;
  color: #fff;
  font: var(--mpo-fs-metric) var(--mpo-font-term);
  margin-top: 2px;
}
.heroPrice {
  font: var(--mpo-fs-hero) var(--mpo-font-term);
  color: var(--mpo-green);
}

.mpo-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: var(--mpo-space-3);
  font: bold 12px var(--mpo-font-chrome);
}
.mpo-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--mpo-space-2);
  margin-bottom: var(--mpo-space-2);
}
.mpo-metric {
  padding: var(--mpo-space-2);
  border: 1px solid var(--mpo-metric-border);
  background: #061008;
}
.mpo-metric label {
  display: block;
  font: var(--mpo-fs-micro-target) var(--mpo-font-chrome);
  color: var(--mpo-term-label);
}
.mpo-metric b {
  display: block;
  color: #fff;
  font: bold var(--mpo-fs-metric-target) var(--mpo-font-term);
  margin-top: 2px;
}
.mpo-metric-sub { margin-top: 2px; }

.mpo-badge {
  display: inline-block;
  padding: 1px 6px;
  border: 1px solid currentColor;
  font: bold 11px var(--mpo-font-chrome);
  letter-spacing: .3px;
  background: #0000;
}
.mpo-badge--live { color: var(--mpo-green); }
.mpo-badge--degraded,
.mpo-badge--safe { color: var(--mpo-amber); }
.mpo-badge--down,
.mpo-badge--armed { color: var(--mpo-red); }
.mpo-badge--paper { color: var(--mpo-cyan); }

.mpo-table-wrap { overflow: auto; max-height: 100%; }
.mpo-table th,
.mpo-table td {
  border: 1px solid var(--mpo-table-grid);
  padding: 3px 5px;
  text-align: left;
  font-size: var(--mpo-fs-cell-target);
}
.mpo-table td.mpo-wrap,
.table td.mpo-wrap { white-space: normal; min-width: 140px; }

.mpo-empty,
.mpo-loading {
  padding: var(--mpo-space-4);
  color: var(--mpo-term-muted);
  font: var(--mpo-fs-body) var(--mpo-font-term);
  text-align: center;
}
.mpo-surface-light .mpo-empty,
.mpo-surface-light .mpo-loading { color: #555; }
.mpo-error {
  padding: var(--mpo-space-2) var(--mpo-space-3);
  margin-bottom: var(--mpo-space-2);
  border: var(--mpo-border-inset);
  color: var(--mpo-red);
  background: #061008;
}
.mpo-success {
  padding: var(--mpo-space-2) var(--mpo-space-3);
  color: var(--mpo-green);
}

.mpo-tabs { height: var(--mpo-tabs-h); }
.mpo-tab { border: var(--mpo-border-outset); background: var(--mpo-chrome); padding: 4px 8px; }
.mpo-tab:hover:not(.on),
.tab98:hover:not(.on) { background: var(--mpo-chrome-mid); }
.mpo-tab.on,
.tab98.on { border-style: inset; background: #ddd; }

.mpo-fieldset {
  border: var(--mpo-border-inset);
  padding: 8px 10px;
  margin: 0 0 8px;
  min-width: 0;
}
.mpo-fieldset legend {
  padding: 0 4px;
  font-weight: bold;
}

.chart {
  height: 220px;
  position: relative;
  background: linear-gradient(#050807, #090d0b);
  border: 1px solid #27352c;
  overflow: hidden;
  cursor: crosshair;
  user-select: none;
}
.chart canvas { width: 100%; height: 100%; touch-action: none; }
.chart-grid {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(#29403055 1px, transparent 1px),
    linear-gradient(90deg, #29403055 1px, transparent 1px);
  background-size: 50px 44px;
  pointer-events: none;
}
.chart-tip,
.mpo-tip {
  position: absolute;
  display: none;
  z-index: 4;
  background: #ffffe1;
  color: #000;
  border: 1px solid #000;
  padding: 3px 5px;
  font: 11px Tahoma, sans-serif;
  pointer-events: none;
  white-space: nowrap;
}
.chart-help { color: #8fb69b; margin-left: 5px; }
.range-btn.on { border-style: inset; background: #fff; }
.chart-readout {
  margin-left: auto;
  color: #3cff68;
  white-space: nowrap;
}

.log {
  height: 100%;
  overflow: auto;
  white-space: pre-wrap;
  line-height: 1.42;
}
.table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  color: #111;
}
.table th,
.table td {
  border: 1px solid var(--mpo-table-grid);
  padding: 3px 5px;
  text-align: left;
  white-space: nowrap;
}
.table th { background: var(--mpo-table-head); }
.tabs { display: flex; gap: 2px; margin-bottom: 5px; }
.tab98 {
  border: var(--mpo-border-outset);
  background: var(--mpo-chrome);
  padding: 4px 8px;
}
.progress {
  height: 15px;
  background: #fff;
  border: var(--mpo-border-inset);
  padding: 1px;
}
.progress i {
  display: block;
  height: 100%;
  background: repeating-linear-gradient(90deg, #39e65b 0 9px, #117728 9px 11px);
  width: 0;
}
.kv {
  display: grid;
  grid-template-columns: 145px 1fr;
  gap: 3px 8px;
  line-height: 1.45;
}
.kv b { color: #111; }
.dark .kv b:not(.green):not(.cyan):not(.amber):not(.red) { color: #fff; }
.controls-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 8px; }
.formrow {
  display: grid;
  grid-template-columns: 1fr 140px;
  gap: 8px;
  align-items: center;
  margin: 6px 0;
}

/* Pump.fun Control Bay: source-first controls with a persistent manual draft. */
.control-bay {
  min-height: 100%;
  padding: 8px;
  color: #111;
}
.control-bay__status { margin-bottom: 7px; }
.control-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}
.control-source-card {
  border: var(--mpo-border-outset);
  background: var(--mpo-chrome);
  padding: 8px;
  min-width: 0;
}
.control-source-card.is-active {
  background: #fff;
  box-shadow: inset 4px 0 0 #111, inset 0 0 0 1px #fff;
}
.control-source-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 7px;
}
.control-source-card__head .muted {
  margin-top: 2px;
  line-height: 1.3;
}
.control-source-card__champ {
  display: grid;
  gap: 2px;
  border: var(--mpo-border-inset);
  background: #fff;
  padding: 6px;
  margin-bottom: 7px;
  overflow: hidden;
}
.control-source-card__champ b,
.control-source-card__champ span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.control-layout {
  display: grid;
  grid-template-columns: minmax(340px, 1.35fr) minmax(260px, .85fr);
  gap: 8px;
  align-items: start;
}
.control-panel .mpo-module-body { padding: 8px; }
.control-panel .formrow {
  grid-template-columns: minmax(130px, .85fr) minmax(160px, 1.15fr);
  margin: 7px 0;
}
.control-range-row label {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.control-range { width: 100%; }
.control-subhead {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
  margin: 11px 0 4px;
  padding-top: 8px;
  border-top: 1px solid #999;
}
.control-exit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 8px;
  margin-top: 7px;
}
.control-exit-grid label {
  display: grid;
  grid-template-columns: 1fr 84px;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.control-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 11px;
  padding-top: 8px;
  border-top: 1px solid #999;
}
.control-primary { font-weight: 700; }
.control-save-status {
  min-width: 150px;
  font-size: 10px;
  color: #555;
}
.control-save-status.is-dirty { color: #8a5200; font-weight: 700; }
.control-save-status.is-pending { color: #084e84; font-weight: 700; }
.control-save-status.is-error { color: #9d1010; font-weight: 700; }
.control-side {
  display: grid;
  gap: 8px;
}
.control-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}
.control-summary > div {
  border: var(--mpo-border-inset);
  background: #fff;
  padding: 6px;
  min-width: 0;
}
.control-summary span,
.control-summary b {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.control-summary span {
  color: #666;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.control-note {
  margin-top: 7px;
  padding: 6px;
  border-left: 4px solid #555;
  background: #eee;
  line-height: 1.35;
}
.control-note--lab {
  border-left-color: #146b2e;
  background: #e8f4ea;
}
.control-bankroll {
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.control-bankroll .field { width: 82px; }
.control-preset-buttons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 6px;
}
.control-kill {
  margin: 7px 0;
  padding: 5px;
}
.control-bay button:disabled {
  opacity: .55;
  cursor: not-allowed;
}
@media (max-width: 820px) {
  .control-source-grid,
  .control-layout { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .control-exit-grid,
  .control-summary { grid-template-columns: 1fr; }
  .control-panel .formrow { grid-template-columns: 1fr; }
}

.sysbar {
  height: 18px;
  border: 1px solid #135828;
  background: #020503;
  padding: 2px;
}
.sysbar i {
  display: block;
  height: 100%;
  background: #25d95a;
}
.sysbar.warn i { background: var(--mpo-amber); }
.sysbar.hot i { background: var(--mpo-red); }
.mpo-sysrow {
  display: grid;
  grid-template-columns: 70px 1fr 45px;
  gap: 6px;
  align-items: center;
  margin: 7px 0;
}
.mpo-spark {
  height: 8px;
  border: 1px solid var(--mpo-table-grid);
  background: #eee;
  padding: 1px;
  width: 72px;
}
.mpo-spark i {
  display: block;
  height: 100%;
  background: var(--mpo-amber);
}
.mpo-spark.hot i { background: var(--mpo-red); }
.mpo-peer {
  padding: 6px;
  margin-bottom: 5px;
  background: var(--mpo-table-dark-bg);
  border: var(--mpo-border-inset);
}
.mpo-peer .mpo-peer-meta { margin-top: 2px; }
.mpo-log-pane {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  padding: 8px;
}
.mpo-log-pane > .log {
  flex: 1;
  min-height: 0;
  height: auto;
}
.mpo-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}
.mpo-dot.err { background: var(--mpo-red); box-shadow: 0 0 4px var(--mpo-red); }
.mpo-dot.evo { background: var(--mpo-green); box-shadow: 0 0 4px var(--mpo-green); }
.mpo-dot.info { background: var(--mpo-cyan); box-shadow: 0 0 4px var(--mpo-cyan); }
.mpo-gauge {
  margin: 8px 0 4px;
}
.mpo-gauge label {
  display: flex;
  justify-content: space-between;
  font: var(--mpo-fs-micro-target) var(--mpo-font-chrome);
  color: var(--mpo-term-label);
  margin-bottom: 3px;
}
.mpo-surface-light .mpo-status { color: var(--mpo-paper-ink); }
.mpo-surface-light .mpo-metrics { margin-top: 2px; }

.dark .table { background: var(--mpo-table-dark-bg); color: #dbffe4; }
.dark .table th { background: var(--mpo-table-dark-head); color: #f2fff5; }
.dark .table td { border-color: var(--mpo-table-dark-grid); }
.dark fieldset,
.dark .inset,
.dark .mpo-fieldset {
  background: var(--mpo-table-dark-bg);
  color: #dbffe4;
  border-color: var(--mpo-table-dark-grid);
}
.dark fieldset legend,
.dark .mpo-fieldset legend { color: #f2fff5; padding: 0 4px; }

.poly-strip {
  padding: 6px 7px;
  background: var(--mpo-term-bg);
  color: var(--mpo-term-fg);
  border: var(--mpo-border-inset);
  margin-bottom: 5px;
  font-family: var(--mpo-font-term);
}
.poly-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding: 4px 7px;
  background: var(--mpo-chrome);
  border: var(--mpo-border-outset);
  margin-bottom: 5px;
  color: #000;
  font-size: 11px;
  font-weight: bold;
}
.poly-bar label {
  display: flex;
  gap: 4px;
  align-items: center;
  font-weight: normal;
}
.poly-mod {
  display: block;
  border: var(--mpo-border-outset);
  background: var(--mpo-chrome);
  margin-bottom: 6px;
}
.poly-mod[hidden] { display: none; }
.poly-mod > header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 5px;
  background: linear-gradient(90deg, #000080, #1084d0);
  color: #fff;
  font-weight: bold;
  font-size: 11px;
}
.poly-mod > header .btn {
  margin-left: auto;
  min-height: 18px;
  padding: 0 8px;
  line-height: 15px;
}
.poly-body { min-height: 0; }
.poly-mod.closed .poly-body { display: none; }
.poly-mod > header .btn:hover { background: var(--mpo-chrome-mid); }

/* Shared multi-section module chrome — generalizes .poly-mod's gradient header +
   outset panel + collapse affordance for other multi-section screens (System,
   Research Monitor, Control Bay). .poly-mod itself is untouched above. */
.mpo-module {
  display: block;
  border: var(--mpo-border-outset);
  background: var(--mpo-chrome);
  margin-bottom: 6px;
}
.mpo-module[hidden] { display: none; }
.mpo-module > header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 5px;
  background: linear-gradient(90deg, #000080, #1084d0);
  color: #fff;
  font-weight: bold;
  font-size: 11px;
}
.mpo-module > header .btn {
  margin-left: auto;
  min-height: 18px;
  padding: 0 8px;
  line-height: 15px;
}
.mpo-module > header .btn:hover { background: var(--mpo-chrome-mid); }
.mpo-module-body { min-height: 0; padding: var(--mpo-space-2); }
.mpo-module.closed .mpo-module-body { display: none; }

/* Shared labeled-bar meter — generalizes Wallet's inline .mpo-spark, Risk's
   .mpo-gauge markup, and Research Monitor's inline leaderboard bars into one
   component. Bar visuals are copied byte-for-byte from .sysbar/.mpo-spark so
   swapping classes at each call site is a no-op for rendering. */
.mpo-meter { margin: 8px 0 4px; }
.mpo-meter > label {
  display: flex;
  justify-content: space-between;
  font: var(--mpo-fs-micro-target) var(--mpo-font-chrome);
  color: var(--mpo-term-label);
  margin-bottom: 3px;
}
.mpo-meter-bar {
  height: 18px;
  border: 1px solid #135828;
  background: #020503;
  padding: 2px;
}
.mpo-meter-bar i { display: block; height: 100%; background: #25d95a; }
.mpo-meter-bar.warn i { background: var(--mpo-amber); }
.mpo-meter-bar.hot i { background: var(--mpo-red); }
.mpo-meter-bar--sm {
  height: 8px;
  border: 1px solid var(--mpo-table-grid);
  background: #eee;
  padding: 1px;
  width: 72px;
}
.mpo-meter-bar--sm i { display: block; height: 100%; background: var(--mpo-amber); }
.mpo-meter-bar--sm.hot i { background: var(--mpo-red); }

/* Shared brand title — the duplicated `font:bold italic 22px Impact,'Arial
   Black',sans-serif` rule, sourced from tokens. */
.mpo-brand-title {
  font: bold italic var(--mpo-fs-head) var(--mpo-font-brand);
  line-height: 1;
}

/* Shared danger/real-money fieldset accent, driven by --mpo-warn/--mpo-warn-bg.
   Only sets color + background so a plain <fieldset> keeps its default border
   style/width — identical rendering to the inline style it replaces. */
.mpo-danger-fieldset {
  border-color: var(--mpo-warn);
  background: var(--mpo-warn-bg);
}
.mpo-danger-fieldset legend { color: #ffb37a; }

.mpo-surface-light .inset {
  background: #fff;
  color: #111;
}
.mpo-surface-light .mpo-fieldset {
  background: #fff;
  color: #111;
  border-color: #808080;
}
.mpo-surface-light .mpo-fieldset legend { color: #111; }
.dark.mpo-surface-dark {
  background: var(--mpo-glass-dark);
  color: var(--mpo-term-fg);
}

.body:has(> .mpo-journal) {
  padding: 0;
  overflow: hidden;
}
.mpo-journal {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 8px;
  overflow: hidden;
}
.mpo-journal-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 4px 7px;
  background: var(--mpo-chrome);
  border: var(--mpo-border-outset);
  margin-bottom: 6px;
  color: #000;
  font: 11px var(--mpo-font-chrome);
  flex-shrink: 0;
}
.mpo-journal-bar-label {
  font-weight: bold;
  letter-spacing: .3px;
}
.mpo-journal-bar .btn {
  min-height: 22px;
  padding: 1px 7px;
  font-size: 11px;
}
.mpo-journal-bar .btn.on {
  border-style: inset;
  background: #ddd;
}
.mpo-journal-search {
  flex: 1;
  min-width: 120px;
  margin-left: auto;
}
.mpo-journal-pane {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.mpo-journal-glance {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 7px;
  margin-bottom: 7px;
}
.mpo-journal-entry {
  border: 1px solid var(--mpo-table-dark-grid);
  background: #061008;
  padding: 7px 8px 6px;
  margin-bottom: 6px;
}
.mpo-journal-entry.is-milestone {
  border-color: var(--mpo-amber);
  box-shadow: inset 3px 0 0 var(--mpo-amber);
  background: #0a1408;
}
.mpo-journal-entry.is-focus {
  outline: 1px dotted var(--mpo-cyan);
  outline-offset: 1px;
}
.mpo-journal-entry header {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: baseline;
}
.mpo-journal-entry h3 {
  margin: 0;
  flex: 1 1 160px;
  font: bold 13px var(--mpo-font-chrome);
  color: #f2fff5;
}
.mpo-journal-entry.is-milestone h3 { color: var(--mpo-amber); }
.mpo-journal-when {
  font: var(--mpo-fs-micro-target) var(--mpo-font-term);
  color: var(--mpo-cyan);
}
.mpo-journal-entry p {
  margin: 4px 0 0;
  font: 12px/1.35 var(--mpo-font-chrome);
  color: var(--mpo-term-fg);
}
.mpo-journal-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
.mpo-journal-tags span {
  font: 10px var(--mpo-font-term);
  color: var(--mpo-term-muted);
  border: var(--mpo-border-inset);
  padding: 0 5px;
  background: #041006;
}
.mpo-journal-metrics {
  margin-top: 4px;
  font: 11px var(--mpo-font-term);
  color: var(--mpo-green);
}
.mpo-journal-compact {
  display: grid;
  gap: 3px;
}
.mpo-journal-compact a,
.mpo-journal-compact button.linkish {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  color: var(--mpo-term-fg);
  font: 11px var(--mpo-font-chrome);
  padding: 2px 0;
  min-height: 0;
  cursor: pointer;
}
.mpo-journal-compact button.linkish:hover { color: var(--mpo-cyan); }
.mpo-journal-compact button.linkish:focus-visible {
  outline: 1px dotted var(--mpo-cyan);
  outline-offset: 1px;
}
.mpo-journal-compact b { color: var(--mpo-amber); }

/* Robinhood panel: one view at a time, laid out to fit the window without scrolling. */
.evolution-lab-panel {
  margin-top: 6px;
  border: 1px solid var(--mpo-metric-border);
  background: var(--mpo-metric-bg);
  color: var(--mpo-term-fg);
}
.evolution-lab-panel > summary {
  padding: 5px 7px;
  background: linear-gradient(90deg, #07150b, #12351d);
  color: var(--mpo-green);
  font-weight: 700;
  text-shadow: 1px 1px #000;
}
.evolution-lab-panel[open] > summary { border-bottom: 1px solid var(--mpo-metric-border); }
.evolution-lab-panel .mpo-fieldset { margin: 6px; color: var(--mpo-term-fg); }
#body-robinhood .rh-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:4px 0}
#body-robinhood h2{margin:0 0 4px;font-size:15px}
#body-robinhood .mpo-fieldset,#body-robinhood .mpo-danger-fieldset{margin:0 0 6px;padding:4px 8px}
#body-robinhood p{margin:3px 0}
#body-robinhood .metric-grid{margin:4px 0}
/* Every view is a card grid: as many columns as the (zoomed) width allows, header and wide parts span. */
[class*=rh-v-]{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:0 10px;align-content:start}
[class*=rh-v-]>[data-rh-part=head],[class*=rh-v-]>[data-rh-part=live],[class*=rh-v-]>[data-rh-part=charts],[class*=rh-v-]>[data-rh-part=signals]{grid-column:1/-1}
#body-robinhood #rhCharts .mpo-table-wrap{max-height:110px!important}
#body-robinhood #rhCharts svg[id^=rhEquity]{max-height:70px}
.rh-v-why .metric-grid,.rh-v-charts .metric-grid,.rh-v-explore .metric-grid,.rh-v-more .metric-grid{display:none}
#body-robinhood>div{padding:6px 10px!important}
#body-robinhood #rhGauges small,#body-robinhood [data-rh-part=signals] p{display:none}
#body-robinhood #rhPriceChart{max-height:230px}
#body-robinhood .mpo-table td,#body-robinhood .mpo-table th{padding:1px 5px}
#body-robinhood #rhPriceChart{max-height:190px}
#body-robinhood #rhCharts svg[id^=rhEquity]{max-height:48px}
#body-robinhood #rhCharts .mpo-table-wrap{max-height:84px!important}
#body-robinhood #rhPriceChart{max-height:165px}

/* Trading Terminal: fits its default window. */
#body-trade .chart{height:130px}
#body-trade .mpo-table-wrap{max-height:118px;overflow:auto}
#body-trade .mpo-table td,#body-trade .mpo-table th{padding:1px 5px}
#body-trade #solanaBook{margin:3px 0!important}
#body-trade #solanaBook .mpo-metric,#body-trade .mpo-metrics .mpo-metric{padding:2px 6px}
#body-trade .toolbar{margin-top:3px!important}
#body-trade .chart{height:105px}
#body-trade .mpo-table-wrap{max-height:none;overflow:visible}

/* Polymarket US: one natural-height module; fit-to-window scales it instead of scrolling it. */
#body-sportsbook>.poly-mod>.poly-body{overflow:visible}

/* Fit to window (fitWindow in dashboard.html). Panes are container-query roots: once a pane is wide
   (a wide window, or a small zoom), modules reflow into columns before they have to shrink more. */
.body:not(.tabbed),.tabpane{container-type:inline-size}
.fit-pct{font:bold 10px ui-monospace,Consolas,monospace;color:#cfe;margin:0 6px 0 4px;white-space:nowrap}
.win-buttons button.fit-btn{width:20px;font-size:12px;line-height:12px}
.win-buttons button.fit-btn.on{border-style:inset;background:#ddd}
.task-tool{height:29px;padding:0 9px;font-size:11px;font-weight:bold;border:var(--mpo-border-outset);background:var(--mpo-chrome);white-space:nowrap}
.task-tool:hover{background:var(--mpo-chrome-mid)}
.task-tool:active{border-style:inset;background:#ddd}
.mpo-split{display:grid;grid-template-columns:minmax(0,1fr);gap:0 10px;align-items:start}
.mpo-split>*{min-width:0}
@container (min-width:820px){.mpo-split{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
.mpo-fold{margin-top:6px;border:1px solid rgba(120,170,135,.3)}
.mpo-fold>summary{cursor:pointer;padding:3px 6px;font:bold 10px ui-monospace,Consolas,monospace;letter-spacing:.06em;color:#9fd8b0;user-select:none}
.mpo-fold>summary:hover{color:#fff}
.mpo-fold[open]>summary{border-bottom:1px solid rgba(120,170,135,.3)}

/* Live visuals (public/js/mpo-viz.js). Canvases are drawn by one animation loop. */
.mpo-viz{position:relative;margin:6px 0;border:1px solid rgba(120,170,135,.22);background:linear-gradient(180deg,rgba(0,20,10,.55),rgba(0,0,0,.35));border-radius:2px}
.mpo-viz__title{padding:2px 6px 0;font:10px ui-monospace,Consolas,monospace;letter-spacing:.08em;color:#6f9a7f;text-transform:uppercase;pointer-events:none}
.mpo-viz canvas{display:block;width:100%}
.mpo-viz-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:6px}
.mpo-viz-grid>.mpo-viz{margin:0}
.rh-v-paper>[data-rh-part=live],.rh-v-why>[data-rh-part=live]{grid-column:1/-1}
#body-trade .pf-viz-row{display:grid;grid-template-columns:minmax(110px,150px) minmax(120px,1fr) minmax(150px,220px);gap:6px}
@container (min-width:820px){
 #body-trade .mpo-table-wrap{max-height:none}
 /* Wide: the chart takes whatever height the left column has spare (150px minimum for fitting). */
 #body-trade .mpo-split{height:100%;grid-template-rows:100%}
 #body-trade .pf-left{display:flex;flex-direction:column;min-height:0;align-self:stretch}
 #body-trade .pf-left .chart{flex:1 1 150px;min-height:150px;height:auto}
}
#body-trade .pf-viz-row>.mpo-viz{margin:4px 0}