.indicator-lab-page * {
  box-sizing: border-box;
}

.indicator-lab-page {
  --indicator-lab-topbar-height: 50px;
  --indicator-lab-topbar-bg: linear-gradient(90deg, #0c6f70, #12979a);
  --indicator-lab-topbar-border: rgba(255, 255, 255, 0.12);
  --indicator-lab-nav-text: #ffffff;
  --indicator-lab-nav-link-bg: rgba(255, 255, 255, 0.10);
  --indicator-lab-nav-link-active-bg: rgba(255, 255, 255, 0.20);
  --indicator-lab-nav-link-hover-bg: rgba(255, 255, 255, 0.16);
  --indicator-lab-theme-toggle-bg: rgba(255, 255, 255, 0.14);
  --indicator-lab-theme-toggle-border: rgba(255, 255, 255, 0.28);
  --indicator-lab-theme-toggle-text: #ffffff;
  --indicator-lab-user-btn-bg: rgba(255, 255, 255, 0.15);
  --indicator-lab-user-badge-bg: rgba(255, 255, 255, 0.18);
  --indicator-lab-user-avatar-bg: #ffffff;
  --indicator-lab-user-avatar-text: #0f8b8d;
  --indicator-lab-user-menu-bg: #ffffff;
  --indicator-lab-user-menu-border: rgba(15, 23, 42, 0.10);
  --indicator-lab-user-menu-text: #172033;
  --indicator-lab-user-menu-hover: #f2f6fb;
  --indicator-lab-bg: #f6f8fb;
  --indicator-lab-card: #ffffff;
  --indicator-lab-soft: #f8fafc;
  --indicator-lab-soft-strong: #f1f5f9;
  --indicator-lab-ink: #172033;
  --indicator-lab-ink-strong: #0f172a;
  --indicator-lab-ink-soft: #24324a;
  --indicator-lab-muted: #66728a;
  --indicator-lab-muted-strong: #4b5875;
  --indicator-lab-muted-soft: #64748b;
  --indicator-lab-line: #dbe3ef;
  --indicator-lab-line-strong: #ccd6e4;
  --indicator-lab-line-soft: #e2e8f0;
  --indicator-lab-control-bg: #ffffff;
  --indicator-lab-control-disabled-bg: #eef2f7;
  --indicator-lab-readonly-bg: #f1f5f9;
  --indicator-lab-help-bg: rgba(255, 255, 255, 0.98);
  --indicator-lab-tooltip-bg: rgba(255, 255, 255, 0.96);
  --indicator-lab-chart-grid: #e2e8f0;
  --indicator-lab-chart-guide: #cbd5e1;
  --indicator-lab-chart-label: #64748b;
  --indicator-lab-chart-crosshair: #475569;
  --indicator-lab-chart-focus-fill: #ffffff;
  --indicator-lab-active-bg: #172033;
  --indicator-lab-active-text: #ffffff;
  --indicator-lab-hover-bg: #eff6ff;
  --indicator-lab-hover-border: #93c5fd;
  --indicator-lab-shadow: 0 12px 30px rgba(23, 32, 51, 0.08);
  --indicator-lab-floating-shadow: 0 12px 30px rgba(23, 32, 51, 0.14);
  --indicator-lab-help-shadow: 0 18px 42px rgba(23, 32, 51, 0.18);
  --indicator-lab-shell-gutter: 16px;
  --indicator-lab-shell-padding-y: 12px;
  --indicator-lab-grid-gap: 14px;
  --indicator-lab-builder-col: minmax(244px, 292px);
  --indicator-lab-results-col: minmax(190px, 232px);
  --indicator-lab-panel-padding: 14px;
  --indicator-lab-panel-header-gap: 12px;
  --indicator-lab-panel-title-size: 16px;
  --indicator-lab-panel-kicker-size: 12px;
  --indicator-lab-label-size: 12px;
  --indicator-lab-form-gap: 10px;
  --indicator-lab-field-gap: 5px;
  --indicator-lab-control-height: 34px;
  --indicator-lab-control-padding-y: 6px;
  --indicator-lab-control-padding-x: 9px;
  --indicator-lab-button-height: 38px;
  --indicator-lab-note-size: 12px;
  --indicator-lab-chart-height: clamp(280px, 44vh, 620px);
  --indicator-lab-chart-padding: 20px;
  --indicator-lab-chart-title-size: 22px;
  --indicator-lab-chart-title-margin-bottom: 10px;
  --indicator-lab-chart-text-size: 15px;
  --indicator-lab-results-gap: 10px;
  --indicator-lab-metric-gap: 6px;
  --indicator-lab-metric-padding: 12px;
  --indicator-lab-metric-label-size: 12px;
  --indicator-lab-metric-value-size: 24px;
  --indicator-lab-trade-log-margin: 14px;
  --indicator-lab-trade-log-padding: 14px;
  --indicator-lab-table-cell-padding: 10px 9px;
  --indicator-lab-table-font-size: 13px;

  margin: 0;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
  font-family: Arial, sans-serif;
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-bg);
  color-scheme: light;
}

html[data-theme="dark"] .indicator-lab-page,
.indicator-lab-page.is-dark,
.indicator-lab-page.dark {
  --indicator-lab-topbar-bg: linear-gradient(90deg, #05070c, #0f172a);
  --indicator-lab-topbar-border: #1f2937;
  --indicator-lab-nav-link-bg: rgba(255, 255, 255, 0.09);
  --indicator-lab-nav-link-active-bg: rgba(255, 255, 255, 0.18);
  --indicator-lab-nav-link-hover-bg: rgba(255, 255, 255, 0.14);
  --indicator-lab-theme-toggle-bg: #f8fafc;
  --indicator-lab-theme-toggle-border: #f8fafc;
  --indicator-lab-theme-toggle-text: #0f172a;
  --indicator-lab-user-btn-bg: rgba(255, 255, 255, 0.12);
  --indicator-lab-user-badge-bg: rgba(255, 255, 255, 0.12);
  --indicator-lab-user-avatar-bg: #e5edf7;
  --indicator-lab-user-avatar-text: #0f172a;
  --indicator-lab-user-menu-bg: #111827;
  --indicator-lab-user-menu-border: #263244;
  --indicator-lab-user-menu-text: #dbe7f5;
  --indicator-lab-user-menu-hover: #1f2a3d;
  --indicator-lab-bg: #070a0f;
  --indicator-lab-card: #111827;
  --indicator-lab-soft: #15202d;
  --indicator-lab-soft-strong: #0b1220;
  --indicator-lab-ink: #e5edf7;
  --indicator-lab-ink-strong: #f8fafc;
  --indicator-lab-ink-soft: #dbe7f5;
  --indicator-lab-muted: #94a3b8;
  --indicator-lab-muted-strong: #cbd5e1;
  --indicator-lab-muted-soft: #94a3b8;
  --indicator-lab-line: #263244;
  --indicator-lab-line-strong: #34445c;
  --indicator-lab-line-soft: #263244;
  --indicator-lab-control-bg: #0b1220;
  --indicator-lab-control-disabled-bg: #111827;
  --indicator-lab-readonly-bg: #15202d;
  --indicator-lab-help-bg: rgba(17, 24, 39, 0.98);
  --indicator-lab-tooltip-bg: rgba(17, 24, 39, 0.96);
  --indicator-lab-chart-grid: #263244;
  --indicator-lab-chart-guide: #34445c;
  --indicator-lab-chart-label: #94a3b8;
  --indicator-lab-chart-crosshair: #94a3b8;
  --indicator-lab-chart-focus-fill: #0b1220;
  --indicator-lab-active-bg: #f8fafc;
  --indicator-lab-active-text: #0f172a;
  --indicator-lab-hover-bg: #1f2a3d;
  --indicator-lab-hover-border: #34445c;
  --indicator-lab-shadow: 0 12px 32px rgba(0, 0, 0, 0.34);
  --indicator-lab-floating-shadow: 0 12px 30px rgba(0, 0, 0, 0.42);
  --indicator-lab-help-shadow: 0 18px 44px rgba(0, 0, 0, 0.44);
  color-scheme: dark;
}

.indicator-lab-topbar {
  min-height: var(--indicator-lab-topbar-height);
  position: sticky;
  top: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 16px;
  background: var(--indicator-lab-topbar-bg);
  border-bottom: 1px solid var(--indicator-lab-topbar-border);
  color: var(--indicator-lab-nav-text);
}

.indicator-lab-topnav {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1 1 auto;
  min-width: 0;
}

.indicator-lab-brand {
  color: var(--indicator-lab-nav-text);
  font-size: 18px;
  font-weight: 800;
  white-space: nowrap;
}

.indicator-lab-nav-link {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--indicator-lab-nav-link-bg);
  color: var(--indicator-lab-nav-text);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.indicator-lab-nav-link:hover,
.indicator-lab-nav-link:focus-visible {
  background: var(--indicator-lab-nav-link-hover-bg);
  outline: none;
}

.indicator-lab-nav-link.is-active {
  background: var(--indicator-lab-nav-link-active-bg);
}

.indicator-lab-top-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 0 0 auto;
  min-width: 0;
}

.indicator-lab-shell {
  width: calc(100vw - var(--indicator-lab-shell-gutter));
  height: calc(100vh - var(--indicator-lab-topbar-height));
  margin: 0 auto;
  padding: var(--indicator-lab-shell-padding-y) 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) minmax(96px, 22vh);
  gap: var(--indicator-lab-grid-gap);
}

.indicator-lab-help-button {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid var(--indicator-lab-chart-guide);
  border-radius: 7px;
  background: var(--indicator-lab-control-bg);
  color: var(--indicator-lab-ink-strong);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: var(--indicator-lab-shadow);
}

.indicator-lab-help-button:hover,
.indicator-lab-help-button:focus-visible {
  border-color: var(--indicator-lab-hover-border);
  background: var(--indicator-lab-hover-bg);
  outline: none;
}

.indicator-lab-theme-toggle {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid var(--indicator-lab-theme-toggle-border);
  border-radius: 16px;
  background: var(--indicator-lab-theme-toggle-bg);
  color: var(--indicator-lab-theme-toggle-text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

.indicator-lab-theme-toggle:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.70);
  outline-offset: 2px;
}

.indicator-lab-user-menu {
  position: relative;
  flex: 0 0 auto;
}

.indicator-lab-user-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 10px;
  border: 0;
  border-radius: 16px;
  background: var(--indicator-lab-user-btn-bg);
  color: #ffffff;
  cursor: pointer;
}

.indicator-lab-user-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.70);
  outline-offset: 2px;
}

.indicator-lab-user-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--indicator-lab-user-avatar-bg);
  color: var(--indicator-lab-user-avatar-text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.indicator-lab-user-badge {
  max-width: 150px;
  overflow: hidden;
  padding: 4px 9px;
  border-radius: 16px;
  background: var(--indicator-lab-user-badge-bg);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.indicator-lab-user-caret {
  color: #ffffff;
  font-size: 11px;
  line-height: 1;
}

.indicator-lab-user-dd {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 100001;
  display: none;
  min-width: 128px;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--indicator-lab-user-menu-border);
  border-radius: 8px;
  background: var(--indicator-lab-user-menu-bg);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.22);
}

.indicator-lab-user-menu.open .indicator-lab-user-dd {
  display: flex;
}

.indicator-lab-user-dd-item {
  width: 100%;
  padding: 9px 12px;
  border: 0;
  background: transparent;
  color: var(--indicator-lab-user-menu-text);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.indicator-lab-user-dd-item:hover,
.indicator-lab-user-dd-item:focus-visible {
  background: var(--indicator-lab-user-menu-hover);
  outline: none;
}

.indicator-lab-workspace {
  display: grid;
  grid-template-columns: var(--indicator-lab-builder-col) minmax(0, 1fr) var(--indicator-lab-results-col);
  gap: var(--indicator-lab-grid-gap);
  align-items: stretch;
  min-height: 0;
}

.indicator-lab-panel,
.indicator-lab-chart,
.indicator-lab-trade-log {
  border: 1px solid var(--indicator-lab-line);
  border-radius: 8px;
  background: var(--indicator-lab-card);
  box-shadow: var(--indicator-lab-shadow);
}

.indicator-lab-panel {
  min-height: 100%;
  min-height: 0;
  padding: var(--indicator-lab-panel-padding);
  overflow: hidden;
}

.indicator-lab-builder {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.indicator-lab-builder .indicator-lab-form {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding-bottom: 8px;
  padding-right: 2px;
}

.indicator-lab-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: var(--indicator-lab-panel-header-gap);
}

.indicator-lab-panel-header h2 {
  margin: 0;
  font-size: var(--indicator-lab-panel-title-size);
  line-height: 1.2;
}

.indicator-lab-panel-header span {
  color: var(--indicator-lab-muted);
  font-size: var(--indicator-lab-panel-kicker-size);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.indicator-lab-form {
  display: grid;
  gap: var(--indicator-lab-form-gap);
}

.indicator-lab-field {
  display: grid;
  gap: var(--indicator-lab-field-gap);
}

.indicator-lab-field span {
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-field input,
.indicator-lab-field select {
  width: 100%;
  min-height: var(--indicator-lab-control-height);
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  padding: var(--indicator-lab-control-padding-y) var(--indicator-lab-control-padding-x);
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-control-bg);
  font: inherit;
}

.indicator-lab-field input[readonly] {
  color: var(--indicator-lab-muted-strong);
  background: var(--indicator-lab-readonly-bg);
}

.indicator-lab-top-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--indicator-lab-form-gap) 8px;
}

.indicator-lab-top-grid .indicator-lab-field input,
.indicator-lab-top-grid .indicator-lab-field select {
  min-width: 0;
}

.indicator-lab-date-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--indicator-lab-form-gap) 8px;
}

.indicator-lab-date-grid .indicator-lab-field input {
  padding-left: 8px;
  padding-right: 8px;
  font-size: 12px;
}

.indicator-lab-date-grid.indicator-lab-date-grid-muted {
  opacity: 0.48;
}

.indicator-lab-date-grid.indicator-lab-date-grid-muted input {
  color: var(--indicator-lab-muted-soft);
  background: var(--indicator-lab-readonly-bg);
}

.indicator-lab-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--indicator-lab-control-height);
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  padding: var(--indicator-lab-control-padding-y) var(--indicator-lab-control-padding-x);
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-control-bg);
  font-weight: 700;
}

.indicator-lab-toggle input {
  width: auto;
  min-height: 0;
  margin: 0;
}

.indicator-lab-market-move {
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--indicator-lab-line);
  border-radius: 8px;
  background: var(--indicator-lab-soft);
}

.indicator-lab-market-move.indicator-lab-market-move-disabled {
  opacity: 0.52;
}

.indicator-lab-market-move-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.indicator-lab-market-move-header strong {
  color: var(--indicator-lab-ink);
  font-size: var(--indicator-lab-label-size);
  font-weight: 800;
}

.indicator-lab-market-move-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-market-move-toggle input {
  width: auto;
  min-height: 0;
  margin: 0;
}

.indicator-lab-market-move-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px 70px;
  gap: 6px;
  align-items: end;
}

.indicator-lab-market-move-option-row {
  grid-template-columns: 58px minmax(0, 1fr) 70px;
}

.indicator-lab-market-move-row label {
  display: grid;
  gap: 3px;
}

.indicator-lab-market-move-exit {
  display: grid;
  gap: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--indicator-lab-line);
}

.indicator-lab-market-move-exit strong {
  color: var(--indicator-lab-ink);
  font-size: var(--indicator-lab-label-size);
  font-weight: 800;
}

.indicator-lab-market-move-exit label {
  display: grid;
  gap: 3px;
}

.indicator-lab-market-move-exit-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.indicator-lab-market-move-exit-row[hidden] {
  display: none;
}

.indicator-lab-market-move span {
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-market-move input,
.indicator-lab-market-move select {
  width: 100%;
  min-height: var(--indicator-lab-control-height);
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  padding: var(--indicator-lab-control-padding-y) var(--indicator-lab-control-padding-x);
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-control-bg);
  font: inherit;
}

.indicator-lab-market-move .indicator-lab-market-move-toggle input {
  width: auto;
  min-height: 0;
  inline-size: 14px;
  block-size: 14px;
  margin: 0;
  padding: 0;
  border: 0;
  accent-color: #1f6feb;
}

.indicator-lab-trade-plan {
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--indicator-lab-line);
  border-radius: 8px;
  background: var(--indicator-lab-soft);
}

.indicator-lab-trade-plan.indicator-lab-trade-plan-disabled {
  opacity: 0.52;
}

.indicator-lab-trade-plan-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.indicator-lab-trade-plan-header strong {
  color: var(--indicator-lab-ink);
  font-size: var(--indicator-lab-label-size);
  font-weight: 800;
}

.indicator-lab-trade-plan-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-trade-plan .indicator-lab-trade-plan-toggle input {
  width: auto;
  min-height: 0;
  inline-size: 14px;
  block-size: 14px;
  margin: 0;
  padding: 0;
  border: 0;
  accent-color: #1f6feb;
}

.indicator-lab-trade-plan-leg {
  display: grid;
  gap: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--indicator-lab-line);
}

.indicator-lab-trade-plan-leg[hidden] {
  display: none;
}

.indicator-lab-trade-plan-leg-title {
  color: var(--indicator-lab-ink);
  font-size: var(--indicator-lab-label-size);
  font-weight: 800;
}

.indicator-lab-trade-plan-leg-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.indicator-lab-remove-leg {
  width: 22px;
  min-width: 22px;
  min-height: 22px;
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  color: var(--indicator-lab-muted-strong);
  background: var(--indicator-lab-control-bg);
  font: inherit;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.indicator-lab-remove-leg:disabled {
  color: var(--indicator-lab-muted);
  background: var(--indicator-lab-control-disabled-bg);
  cursor: default;
}

.indicator-lab-trade-plan-row,
.indicator-lab-trade-plan-next-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px 70px;
  gap: 6px;
  align-items: end;
}

.indicator-lab-trade-plan-option-row {
  grid-template-columns: 58px minmax(0, 1fr) 70px;
}

.indicator-lab-trade-plan-exit-row,
.indicator-lab-trade-plan-next-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.indicator-lab-trade-plan-exit-method-row {
  grid-template-columns: minmax(0, 1fr);
}

.indicator-lab-trade-plan-exit-fields[hidden] {
  display: none;
}

.indicator-lab-add-leg {
  width: 100%;
  min-height: var(--indicator-lab-control-height);
  border: 1px dashed var(--indicator-lab-muted);
  border-radius: 6px;
  color: #1f6feb;
  background: var(--indicator-lab-soft);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.indicator-lab-add-leg:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.indicator-lab-trade-plan-leg label {
  display: grid;
  gap: 3px;
}

.indicator-lab-trade-plan span {
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-trade-plan input,
.indicator-lab-trade-plan select {
  width: 100%;
  min-height: var(--indicator-lab-control-height);
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  padding: var(--indicator-lab-control-padding-y) var(--indicator-lab-control-padding-x);
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-control-bg);
  font: inherit;
}

.indicator-lab-blocks {
  display: grid;
  gap: 8px;
}

.indicator-lab-blocks.indicator-lab-indicators-disabled {
  opacity: 0.48;
  pointer-events: none;
}

.indicator-lab-block {
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--indicator-lab-line);
  border-radius: 8px;
  background: var(--indicator-lab-soft);
}

.indicator-lab-block-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 76px auto;
  gap: 6px;
  align-items: end;
}

.indicator-lab-block-row + .indicator-lab-block-row {
  grid-template-columns: minmax(0, 1fr) 76px;
}

.indicator-lab-block-timeframe-row {
  grid-template-columns: minmax(0, 1fr);
}

.indicator-lab-block-timeframe-row.indicator-lab-block-trend-mode-visible {
  grid-template-columns: 88px minmax(0, 1fr);
}

.indicator-lab-block-timeframe-row.indicator-lab-block-start-only-visible {
  grid-template-columns: minmax(0, 1fr);
}

.indicator-lab-block-trade-settings {
  display: grid;
  gap: 8px;
}

.indicator-lab-block-exit-row {
  grid-template-columns: minmax(0, 1fr);
}

.indicator-lab-block-exit-row.indicator-lab-block-exit-value-visible {
  grid-template-columns: minmax(0, 1fr) 86px;
}

.indicator-lab-block-row.indicator-lab-block-trade-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.indicator-lab-block-trade-row > label {
  min-width: 0;
}

.indicator-lab-block-trade-row select,
.indicator-lab-block-trade-row input {
  min-width: 0;
  width: 100%;
}

.indicator-lab-block-row.indicator-lab-block-quantity-row {
  grid-template-columns: 70px;
}

.indicator-lab-block label {
  display: grid;
  gap: 3px;
}

.indicator-lab-block-value-field[hidden] {
  display: none;
}

.indicator-lab-block-multiplier-field[hidden] {
  display: none;
}

.indicator-lab-block-trend-mode-field[hidden] {
  display: none;
}

.indicator-lab-block-timeframe-row[hidden] {
  display: none;
}

.indicator-lab-block-exit-row[hidden],
.indicator-lab-block-exit-value-field[hidden] {
  display: none;
}

.indicator-lab-block-side-field[hidden] {
  display: none;
}

.indicator-lab-block-strike-field[hidden] {
  display: none;
}

.indicator-lab-block span {
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-block input,
.indicator-lab-block select {
  width: 100%;
  min-height: var(--indicator-lab-control-height);
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  padding: var(--indicator-lab-control-padding-y) var(--indicator-lab-control-padding-x);
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-control-bg);
  font: inherit;
}

.indicator-lab-add-block {
  width: 100%;
  min-height: var(--indicator-lab-control-height);
  border: 1px dashed var(--indicator-lab-muted);
  border-radius: 6px;
  color: #1f6feb;
  background: var(--indicator-lab-soft);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.indicator-lab-add-block.indicator-lab-indicators-disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.indicator-lab-remove-block {
  width: var(--indicator-lab-control-height);
  min-width: var(--indicator-lab-control-height);
  min-height: var(--indicator-lab-control-height);
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  color: var(--indicator-lab-muted-strong);
  background: var(--indicator-lab-control-bg);
  font: inherit;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.indicator-lab-remove-block:disabled {
  color: var(--indicator-lab-muted);
  background: var(--indicator-lab-control-disabled-bg);
  cursor: default;
}

.indicator-lab-scope {
  display: grid;
  gap: 3px 6px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 8px;
  border: 1px solid var(--indicator-lab-line);
  border-radius: 8px;
  background: var(--indicator-lab-soft);
}

.indicator-lab-scope-title {
  grid-column: 1;
  color: var(--indicator-lab-muted-strong);
  font-size: var(--indicator-lab-label-size);
  font-weight: 700;
}

.indicator-lab-scope-coming-soon {
  grid-column: 2;
  align-self: end;
  color: var(--indicator-lab-muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

.indicator-lab-scope-options {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.indicator-lab-scope-option {
  min-height: 28px;
  border: 1px solid var(--indicator-lab-line-strong);
  border-radius: 6px;
  color: var(--indicator-lab-ink);
  background: var(--indicator-lab-control-bg);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.indicator-lab-scope-option.is-active {
  border-color: var(--indicator-lab-active-bg);
  color: var(--indicator-lab-active-text);
  background: var(--indicator-lab-active-bg);
}

.indicator-lab-scope-option-disabled,
.indicator-lab-scope-option:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.indicator-lab-scope-month-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.indicator-lab-scope-month-controls[hidden] {
  display: none;
}

.indicator-lab-scope-month-controls select {
  min-width: 0;
}

.indicator-lab-run {
  width: 100%;
  min-height: var(--indicator-lab-button-height);
  margin-top: 2px;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  background: #1f6feb;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  opacity: 1;
}

.indicator-lab-run:disabled {
  cursor: wait;
  opacity: 0.65;
}

.indicator-lab-note {
  margin: 0;
  color: var(--indicator-lab-muted);
  font-size: var(--indicator-lab-note-size);
  line-height: 1.4;
}

.indicator-lab-main {
  display: grid;
  grid-template-rows: 30px minmax(0, 1fr);
  min-height: 0;
  min-width: 0;
  height: 100%;
}

.indicator-lab-chart {
  display: grid;
  grid-row: 2;
  grid-template-rows: minmax(0, 1fr);
  position: relative;
  height: 100%;
  min-height: 0;
  max-height: var(--indicator-lab-chart-height);
  place-items: stretch;
  padding: var(--indicator-lab-chart-padding);
  text-align: left;
  overflow: hidden;
}

.indicator-lab-chart-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  grid-row: 1;
  height: 30px;
  min-width: 0;
  padding: 0 2px;
  background: transparent;
  z-index: 4;
}

.indicator-lab-chart-toolbar select {
  flex: 0 0 auto;
  height: 28px;
  max-width: 128px;
  border: 1px solid var(--indicator-lab-chart-guide);
  border-radius: 6px;
  background: var(--indicator-lab-tooltip-bg);
  color: var(--indicator-lab-ink);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  box-shadow: var(--indicator-lab-shadow);
}

.indicator-lab-chart-toolbar select:focus-visible {
  border-color: #60a5fa;
  outline: 2px solid rgba(96, 165, 250, 0.35);
  outline-offset: 2px;
}

.indicator-lab-chart-ohlc {
  position: absolute;
  top: 0;
  left: calc(var(--indicator-lab-chart-padding) + 16px);
  z-index: 3;
  display: flex;
  align-items: baseline;
  gap: 8px;
  max-width: calc(100% - (var(--indicator-lab-chart-padding) * 2) - 32px);
  overflow: hidden;
  border: none;
  background: transparent;
  box-shadow: none;
  color: var(--indicator-lab-muted-strong);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  pointer-events: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.indicator-lab-chart-ohlc-meta {
  flex: 0 0 auto;
  color: var(--indicator-lab-ink);
}

.indicator-lab-chart-ohlc-values {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--indicator-lab-muted-soft);
  text-overflow: ellipsis;
}

.indicator-lab-chart-ohlc-item {
  display: inline-flex;
  gap: 3px;
}

.indicator-lab-chart-ohlc-label {
  color: var(--indicator-lab-ink);
}

.indicator-lab-chart-ohlc-number.is-up {
  color: #15803d;
}

.indicator-lab-chart-ohlc-number.is-down {
  color: #dc2626;
}

.indicator-lab-chart-ohlc-number.is-flat {
  color: var(--indicator-lab-muted-soft);
}

.indicator-lab-chart-ohlc-number.is-vwap {
  color: #0f766e;
}

.indicator-lab-chart-ohlc-values.is-up {
  color: #15803d;
}

.indicator-lab-chart-ohlc-values.is-down {
  color: #dc2626;
}

.indicator-lab-chart-ohlc-values.is-flat {
  color: var(--indicator-lab-muted-soft);
}

.indicator-lab-help-overlay[hidden] {
  display: none;
}

.indicator-lab-help-overlay {
  position: absolute;
  inset: var(--indicator-lab-chart-padding);
  z-index: 8;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--indicator-lab-chart-guide);
  border-radius: 8px;
  background: var(--indicator-lab-help-bg);
  box-shadow: var(--indicator-lab-help-shadow);
  color: var(--indicator-lab-ink);
}

.indicator-lab-help-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--indicator-lab-line-soft);
}

.indicator-lab-help-header h2 {
  margin: 0 0 4px;
  font-size: 20px;
  line-height: 1.2;
}

.indicator-lab-help-header p {
  max-width: 680px;
  margin: 0;
  color: var(--indicator-lab-muted-soft);
  font-size: 13px;
  line-height: 1.45;
}

.indicator-lab-help-close {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border: 1px solid var(--indicator-lab-chart-guide);
  border-radius: 7px;
  background: var(--indicator-lab-control-bg);
  color: var(--indicator-lab-muted-strong);
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.indicator-lab-help-close:hover,
.indicator-lab-help-close:focus-visible {
  border-color: var(--indicator-lab-hover-border);
  background: var(--indicator-lab-hover-bg);
  outline: none;
}

.indicator-lab-help-body {
  min-height: 0;
  padding: 16px 18px 20px;
  overflow-y: auto;
}

.indicator-lab-help-flow {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid var(--indicator-lab-chart-guide);
  border-radius: 8px;
  background: var(--indicator-lab-soft);
}

.indicator-lab-help-flow strong {
  color: var(--indicator-lab-ink-strong);
  font-size: 13px;
}

.indicator-lab-help-flow p {
  margin: 0;
  color: var(--indicator-lab-muted-strong);
  font-size: 13px;
  line-height: 1.5;
}

.indicator-lab-help-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.indicator-lab-help-card {
  padding: 12px;
  border: 1px solid var(--indicator-lab-line-soft);
  border-radius: 8px;
  background: var(--indicator-lab-card);
}

.indicator-lab-help-card h3 {
  margin: 0 0 7px;
  color: var(--indicator-lab-ink-strong);
  font-size: 14px;
}

.indicator-lab-help-card p {
  margin: 0;
  color: var(--indicator-lab-muted-strong);
  font-size: 13px;
  line-height: 1.45;
}

.indicator-lab-help-card ul {
  margin: 0;
  padding-left: 18px;
  color: var(--indicator-lab-muted-strong);
  font-size: 13px;
  line-height: 1.45;
}

.indicator-lab-help-card li + li {
  margin-top: 4px;
}

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

@media (max-width: 760px) {
  .indicator-lab-topbar {
    flex-wrap: wrap;
  }

  .indicator-lab-topnav {
    flex-wrap: wrap;
  }

  .indicator-lab-top-actions {
    flex-wrap: wrap;
  }
}

@media (max-width: 560px) {
  .indicator-lab-page {
    --indicator-lab-topbar-height: 86px;
  }

  .indicator-lab-topbar {
    align-items: flex-start;
  }

  .indicator-lab-topnav {
    flex-wrap: wrap;
    gap: 8px;
  }

  .indicator-lab-top-actions {
    width: 100%;
    justify-content: flex-start;
    gap: 8px;
  }

  .indicator-lab-help-button {
    width: auto;
  }

  .indicator-lab-user-badge {
    max-width: 120px;
  }
}

.indicator-lab-chart-surface {
  display: grid;
  grid-row: 1;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.indicator-lab-chart-empty {
  place-self: center;
  text-align: center;
}

.indicator-lab-chart h2 {
  margin: 0 0 var(--indicator-lab-chart-title-margin-bottom);
  font-size: var(--indicator-lab-chart-title-size);
}

.indicator-lab-chart p {
  max-width: 420px;
  margin: 0;
  color: var(--indicator-lab-muted);
  font-size: var(--indicator-lab-chart-text-size);
  line-height: 1.5;
}

.indicator-lab-chart-svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.indicator-lab-chart-surface.is-chart-panning,
.indicator-lab-chart-surface.is-chart-price-dragging,
.indicator-lab-chart-surface.is-chart-rsi-resizing {
  user-select: none;
}

.indicator-lab-chart-surface.is-chart-panning .indicator-lab-chart-svg,
.indicator-lab-chart-surface.is-chart-panning .indicator-lab-chart-overlay {
  cursor: grabbing;
}

.indicator-lab-chart-surface.is-chart-price-hover .indicator-lab-chart-svg,
.indicator-lab-chart-surface.is-chart-price-hover .indicator-lab-chart-overlay,
.indicator-lab-chart-surface.is-chart-price-dragging .indicator-lab-chart-svg,
.indicator-lab-chart-surface.is-chart-price-dragging .indicator-lab-chart-overlay,
.indicator-lab-chart-surface.is-chart-rsi-resizing .indicator-lab-chart-svg,
.indicator-lab-chart-surface.is-chart-rsi-resizing .indicator-lab-chart-overlay {
  cursor: ns-resize;
}

.indicator-lab-chart-grid {
  stroke: var(--indicator-lab-chart-grid);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-line {
  fill: none;
  stroke: #2563eb;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-ema-line {
  fill: none;
  stroke: #f59e0b;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-vwap-line {
  fill: none;
  stroke: #0f766e;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-candle-wick {
  stroke-width: 1;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-candle-body {
  stroke-width: 1;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-candle-up {
  fill: #16a34a;
  stroke: #16a34a;
}

.indicator-lab-chart-candle-down {
  fill: #dc2626;
  stroke: #dc2626;
}

.indicator-lab-chart-candle-flat {
  fill: #64748b;
  stroke: #64748b;
}

.indicator-lab-chart-rsi-line {
  fill: none;
  stroke: #7c3aed;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-rsi-guide {
  stroke: var(--indicator-lab-chart-guide);
  stroke-width: 1;
  stroke-dasharray: 3 5;
  opacity: 0.9;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-rsi-label {
  fill: var(--indicator-lab-chart-label);
  font-size: 10px;
  font-weight: 700;
  pointer-events: none;
}

.indicator-lab-chart-price-label {
  fill: var(--indicator-lab-chart-label);
  font-size: 10px;
  font-weight: 700;
  pointer-events: none;
}

.indicator-lab-chart-time-label {
  fill: var(--indicator-lab-chart-label);
  font-size: 10px;
  font-weight: 700;
  pointer-events: none;
}

.indicator-lab-chart-panel-divider {
  stroke: var(--indicator-lab-chart-grid);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-marker {
  stroke: var(--indicator-lab-card);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-marker-entry {
  fill: #16a34a;
}

.indicator-lab-chart-marker-exit {
  fill: #dc2626;
}

.indicator-lab-chart-marker-eod {
  fill: #64748b;
}

.indicator-lab-chart-crosshair {
  stroke: var(--indicator-lab-chart-crosshair);
  stroke-width: 1;
  stroke-dasharray: 4 4;
  opacity: 0.72;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-price-crosshair,
.indicator-lab-chart-rsi-crosshair {
  stroke: var(--indicator-lab-chart-crosshair);
  stroke-width: 1;
  stroke-dasharray: 4 4;
  opacity: 0.58;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-hover-price-tag,
.indicator-lab-chart-hover-rsi-tag {
  fill: var(--indicator-lab-ink-strong);
  font-size: 10px;
  font-weight: 800;
  pointer-events: none;
}

.indicator-lab-chart-focus-dot {
  fill: var(--indicator-lab-chart-focus-fill);
  stroke: #2563eb;
  stroke-width: 2;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.indicator-lab-chart-overlay {
  fill: transparent;
  cursor: crosshair;
  pointer-events: all;
}

.indicator-lab-chart-price-scale-hit-area {
  fill: transparent;
  cursor: ns-resize;
  pointer-events: all;
}

.indicator-lab-chart-rsi-divider-hit-area {
  fill: transparent;
  cursor: ns-resize;
  pointer-events: all;
}

.indicator-lab-chart-tooltip {
  position: absolute;
  z-index: 3;
  min-width: 132px;
  padding: 8px 10px;
  border: 1px solid var(--indicator-lab-line);
  border-radius: 8px;
  background: var(--indicator-lab-tooltip-bg);
  box-shadow: var(--indicator-lab-floating-shadow);
  color: var(--indicator-lab-ink);
  font-size: 12px;
  line-height: 1.35;
  pointer-events: none;
}

.indicator-lab-chart-tooltip strong {
  display: block;
  margin-bottom: 4px;
  color: var(--indicator-lab-ink-strong);
  font-size: 12px;
}

.indicator-lab-results {
  display: grid;
  align-content: start;
  gap: var(--indicator-lab-results-gap);
  min-height: 0;
  overflow: hidden;
}

.indicator-lab-results .indicator-lab-panel-header {
  display: block;
}

.indicator-lab-results .indicator-lab-panel-header h2 {
  white-space: nowrap;
}

.indicator-lab-results-compact-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--indicator-lab-results-gap);
}

.indicator-lab-metric {
  display: grid;
  gap: var(--indicator-lab-metric-gap);
  padding: var(--indicator-lab-metric-padding);
  border: 1px solid var(--indicator-lab-line-soft);
  border-radius: 8px;
  background: var(--indicator-lab-soft);
}

.indicator-lab-metric-compact {
  padding: 8px;
}

.indicator-lab-metric span {
  color: var(--indicator-lab-muted);
  font-size: var(--indicator-lab-metric-label-size);
  font-weight: 700;
}

.indicator-lab-metric strong {
  color: var(--indicator-lab-ink);
  font-size: var(--indicator-lab-metric-value-size);
  line-height: 1;
}

.indicator-lab-metric-compact strong {
  font-size: 18px;
}

.indicator-lab-metric-drawdown[hidden] {
  display: none;
}

.indicator-lab-positive {
  color: #16a34a !important;
  font-weight: 700;
}

.indicator-lab-negative {
  color: #dc2626 !important;
  font-weight: 700;
}

.indicator-lab-neutral {
  color: var(--indicator-lab-muted-soft) !important;
  font-weight: 700;
}

.indicator-lab-trade-log {
  margin-top: var(--indicator-lab-trade-log-margin);
  padding: var(--indicator-lab-trade-log-padding);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}

.indicator-lab-table-wrap {
  min-height: 0;
  overflow: auto;
}

.indicator-lab-trade-log table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
}

.indicator-lab-trade-log th,
.indicator-lab-trade-log td {
  border-bottom: 1px solid var(--indicator-lab-line-soft);
  padding: var(--indicator-lab-table-cell-padding);
  text-align: left;
  font-size: var(--indicator-lab-table-font-size);
}

.indicator-lab-trade-log th {
  color: var(--indicator-lab-muted-strong);
  background: var(--indicator-lab-soft);
  font-weight: 700;
}

.indicator-lab-trade-log td {
  color: var(--indicator-lab-ink-soft);
}

.indicator-lab-trade-log td.indicator-lab-value,
.indicator-lab-trade-log td.indicator-lab-money {
  font-weight: 700;
}

.indicator-lab-hide-indicator-column th:nth-child(4),
.indicator-lab-hide-indicator-column td:nth-child(4) {
  display: none;
}

@media (min-width: 1800px) {
  .indicator-lab-page {
    --indicator-lab-shell-gutter: 24px;
    --indicator-lab-chart-height: clamp(520px, 68vh, 920px);
    --indicator-lab-chart-title-size: 24px;
    --indicator-lab-chart-text-size: 16px;
  }
}

@media (min-height: 900px) {
  .indicator-lab-chart {
    max-height: none;
  }
}

@media (max-height: 820px) {
  .indicator-lab-page {
    --indicator-lab-shell-padding-y: 10px;
    --indicator-lab-grid-gap: 10px;
    --indicator-lab-panel-padding: 8px;
    --indicator-lab-panel-header-gap: 5px;
    --indicator-lab-panel-title-size: 15px;
    --indicator-lab-panel-kicker-size: 11px;
    --indicator-lab-label-size: 11px;
    --indicator-lab-form-gap: 5px;
    --indicator-lab-field-gap: 3px;
    --indicator-lab-control-height: 28px;
    --indicator-lab-control-padding-y: 4px;
    --indicator-lab-button-height: 32px;
    --indicator-lab-chart-height: clamp(180px, 28vh, 300px);
    --indicator-lab-chart-padding: 14px;
    --indicator-lab-chart-title-size: 19px;
    --indicator-lab-chart-title-margin-bottom: 5px;
    --indicator-lab-chart-text-size: 14px;
    --indicator-lab-results-gap: 8px;
    --indicator-lab-metric-gap: 4px;
    --indicator-lab-metric-padding: 8px;
    --indicator-lab-metric-value-size: 21px;
    --indicator-lab-trade-log-margin: 8px;
    --indicator-lab-trade-log-padding: 7px;
    --indicator-lab-table-cell-padding: 5px 7px;
    --indicator-lab-table-font-size: 12px;
  }

  .indicator-lab-shell {
    grid-template-rows: minmax(0, 1fr) minmax(56px, 12vh);
  }

  .indicator-lab-builder {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    min-height: 0;
    height: 100%;
    overflow: hidden;
  }

  .indicator-lab-builder .indicator-lab-form {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 6px;
  }

  .indicator-lab-trade-log {
    margin-top: 0;
  }

  .indicator-lab-trade-log .indicator-lab-panel-header {
    margin-bottom: 4px;
  }
}

@media (max-height: 700px) {
  .indicator-lab-page {
    --indicator-lab-shell-padding-y: 8px;
    --indicator-lab-grid-gap: 8px;
    --indicator-lab-panel-padding: 6px;
    --indicator-lab-panel-header-gap: 4px;
    --indicator-lab-panel-kicker-size: 10px;
    --indicator-lab-form-gap: 3px;
    --indicator-lab-field-gap: 2px;
    --indicator-lab-control-height: 24px;
    --indicator-lab-control-padding-y: 3px;
    --indicator-lab-button-height: 28px;
    --indicator-lab-note-size: 10px;
    --indicator-lab-chart-height: clamp(120px, 20vh, 200px);
    --indicator-lab-chart-padding: 10px;
    --indicator-lab-chart-title-size: 16px;
    --indicator-lab-chart-title-margin-bottom: 3px;
    --indicator-lab-chart-text-size: 12px;
    --indicator-lab-results-gap: 6px;
    --indicator-lab-metric-gap: 3px;
    --indicator-lab-metric-padding: 6px;
    --indicator-lab-metric-value-size: 18px;
    --indicator-lab-trade-log-margin: 6px;
    --indicator-lab-trade-log-padding: 6px;
    --indicator-lab-table-cell-padding: 4px 6px;
    --indicator-lab-table-font-size: 11px;
  }

  .indicator-lab-shell {
    grid-template-rows: minmax(0, 1fr) minmax(44px, 10vh);
  }

  .indicator-lab-note {
    line-height: 1.1;
    max-height: 11px;
    overflow: hidden;
  }

  .indicator-lab-trade-log .indicator-lab-panel-header {
    margin-bottom: 3px;
  }
}

@media (min-width: 761px) and (max-width: 1366px) {
  .indicator-lab-chart {
    max-height: none;
  }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .indicator-lab-workspace {
    grid-template-columns: 260px 1fr;
    grid-template-rows: minmax(0, 1fr) auto;
    align-items: stretch;
    height: 100%;
  }

  .indicator-lab-main {
    min-height: 0;
    height: 100%;
  }

  .indicator-lab-chart {
    height: 100%;
    max-height: none;
  }

  .indicator-lab-results {
    grid-column: 1 / -1;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .indicator-lab-page {
    --indicator-lab-shell-gutter: 20px;
  }

  .indicator-lab-shell {
    width: calc(100vw - var(--indicator-lab-shell-gutter));
    padding: var(--indicator-lab-shell-padding-y) 0;
  }

  .indicator-lab-workspace,
  .indicator-lab-results {
    grid-template-columns: 1fr;
  }

  .indicator-lab-top-grid {
    grid-template-columns: 1fr;
  }
}