/* Cinematic Backtester — three-artboard flow (idle / running / results) */

.bt-root {
  position: absolute;
  inset: 0;
  background: #000;
  color: #fff;
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 13px;
  letter-spacing: 0.04em;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}
.bt-root * { box-sizing: border-box; }

.bt-canvas { position: absolute; inset: 0; z-index: 0; opacity: 0.6; }
.bt-scanlines {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.05) 0, rgba(255,255,255,0.05) 1px,
    transparent 1px, transparent 3px
  );
}
.bt-vignette {
  position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 0%, transparent 60%, rgba(0,0,0,0.55) 100%);
}

.bt-body {
  position: relative; z-index: 4;
  height: 100%;
  display: flex; flex-direction: column;
  padding: 16px 28px 28px;
  gap: 14px;
}

/* Head — mirrors prism-header */
.bt-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}
.bt-head .brand { color: #fff; font-weight: 700; letter-spacing: 0.26em; }
.bt-head .sub  { color: rgba(255,255,255,0.45); }

.bt-title {
  font-weight: 700; font-size: 22px; letter-spacing: 0.22em;
  text-align: center; margin: 6px 0 2px;
}
.bt-subtitle {
  text-align: center; font-size: 10px; letter-spacing: 0.28em;
  color: rgba(255,255,255,0.45); text-transform: uppercase;
}

/* Grid layout: form (left) + preview (right) on idle; full-width on running/results */
.bt-grid {
  flex: 1; min-height: 0;
  display: grid; gap: 14px;
}
.bt-grid.idle     { grid-template-columns: 420px 1fr; }
.bt-grid.results  { grid-template-columns: 1fr 300px; grid-template-rows: auto 1fr; }
.bt-grid.results .bt-panel.full-row { grid-column: 1 / -1; }

/* Panel — the base frame with corner brackets */
.bt-panel {
  position: relative;
  border: 1px solid rgba(255,255,255,0.22);
  padding: 14px 16px;
  background: #000;
  display: flex; flex-direction: column;
  min-width: 0; min-height: 0;
}
.bt-panel::before, .bt-panel::after,
.bt-panel > .c-tl, .bt-panel > .c-tr,
.bt-panel > .c-bl, .bt-panel > .c-br {
  content: "";
  position: absolute; width: 10px; height: 10px;
  border: 1px solid rgba(255,255,255,0.85);
  pointer-events: none;
}
.bt-panel::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.bt-panel::after  { top: -1px; right: -1px; border-left: 0; border-bottom: 0; }
.bt-panel > .c-bl { bottom: -1px; left: -1px; border-right: 0; border-top: 0; }
.bt-panel > .c-br { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

.bt-panel-head {
  font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 10px;
  display: flex; justify-content: space-between; align-items: center;
}
.bt-panel-head .hi { color: #fff; }
.bt-panel-head .dim { color: rgba(255,255,255,0.35); }

/* Form */
.bt-field {
  display: flex; flex-direction: column; gap: 6px;
  margin-bottom: 10px;
}
.bt-field .lbl {
  font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  display: flex; justify-content: space-between;
}
.bt-field .lbl em { font-style: normal; color: rgba(255,255,255,0.35); letter-spacing: 0.16em; }

.bt-input {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.35);
  color: #fff;
  font-family: inherit; font-size: 14px; letter-spacing: 0.08em;
  padding: 9px 12px;
  outline: none;
  transition: all 120ms ease;
  width: 100%;
}
.bt-input:focus {
  border-color: #fff;
  box-shadow: 0 0 6px rgba(255,255,255,0.35), inset 0 0 0 1px rgba(255,255,255,0.1);
}
.bt-field.active .bt-input {
  border-color: #fff;
  box-shadow: 0 0 8px rgba(255,255,255,0.4);
}

.bt-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bt-row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.bt-row4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }

/* Chip — used for period presets, filters, sort-dropdown */
.bt-chip {
  position: relative;
  padding: 7px 10px;
  font-family: inherit; font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.3);
  color: rgba(255,255,255,0.7);
  cursor: pointer;
  transition: all 120ms ease;
}
.bt-chip:hover { border-color: #fff; color: #fff; }
.bt-chip.active {
  border-color: #fff; color: #fff;
  box-shadow: 0 0 6px rgba(255,255,255,0.5), inset 0 0 0 1px rgba(255,255,255,0.2);
}

/* Checkbox row */
.bt-check {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 11px; letter-spacing: 0.12em;
  cursor: pointer; color: rgba(255,255,255,0.8);
}
.bt-check .box {
  width: 14px; height: 14px;
  border: 1px solid rgba(255,255,255,0.5);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 10px; color: #fff;
}
.bt-check input { display: none; }

/* Favorite star */
.bt-fav {
  position: relative;
  width: 38px; height: 38px;
  border: 1px solid rgba(255,255,255,0.35);
  background: transparent; color: rgba(255,255,255,0.55);
  font-size: 16px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all 150ms ease;
}
.bt-fav.active { border-color: #ffd23b; color: #ffd23b; box-shadow: 0 0 8px rgba(255,210,59,0.4); }

/* Big RUN button */
.bt-run {
  position: relative;
  width: 100%;
  padding: 16px 22px;
  background: transparent;
  border: 1px solid #fff;
  color: #fff;
  font-family: inherit;
  font-size: 14px; font-weight: 700; letter-spacing: 0.32em;
  text-transform: uppercase;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(255,255,255,0.4), 0 0 28px rgba(255,255,255,0.12), 0 0 56px rgba(255,255,255,0.04);
  transition: all 180ms ease;
}
.bt-run::before, .bt-run::after {
  content: "";
  position: absolute; width: 8px; height: 8px;
  border: 1px solid #fff;
}
.bt-run::before { top: 4px; left: 4px; border-right: 0; border-bottom: 0; }
.bt-run::after  { bottom: 4px; right: 4px; border-left: 0; border-top: 0; }
.bt-run:hover { background: rgba(255,255,255,0.05); letter-spacing: 0.38em; }
.bt-run .arrow { display: inline-block; margin: 0 10px; }

/* Stat card — small/medium with sparkline */
.bt-stat {
  position: relative;
  padding: 12px 14px 10px;
  border: 1px solid rgba(255,255,255,0.22);
  display: flex; flex-direction: column; gap: 4px;
  min-width: 0;
}
.bt-stat::before, .bt-stat::after {
  content: ""; position: absolute; width: 6px; height: 6px;
  border: 1px solid rgba(255,255,255,0.7);
}
.bt-stat::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.bt-stat::after  { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
.bt-stat .lbl {
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(255,255,255,0.5);
}
.bt-stat .val {
  font-size: 24px; font-weight: 700; letter-spacing: 0.06em;
  line-height: 1;
}
.bt-stat .val.pos { color: #fff; text-shadow: 0 0 8px rgba(255,255,255,0.35); }
.bt-stat .val.neg { color: #ff5555; text-shadow: 0 0 8px rgba(255,85,85,0.35); }
.bt-stat .spark { margin-top: 4px; height: 22px; }

/* Chart */
.bt-chart {
  position: relative; flex: 1; min-height: 0;
  display: flex; flex-direction: column;
}
.bt-chart-scanlines {
  position: absolute; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.035) 0, rgba(255,255,255,0.035) 1px,
    transparent 1px, transparent 3px
  );
}

/* Stat row for "Costs" block */
.bt-sr {
  display: flex; justify-content: space-between;
  font-size: 12px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  letter-spacing: 0.08em;
}
.bt-sr:last-child { border-bottom: 0; }
.bt-sr .k { color: rgba(255,255,255,0.55); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; }
.bt-sr .v.pos { color: #fff; }
.bt-sr .v.neg { color: #ff5555; }
.bt-sr .v { font-weight: 700; }

/* History table (backtest snapshots) */
.bt-table { width: 100%; border-collapse: collapse; }
.bt-table th {
  font-family: inherit;
  text-align: left;
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  padding: 6px 10px 8px;
  border-bottom: 1px solid rgba(255,255,255,0.22);
  font-weight: 400;
}
.bt-table th.num, .bt-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.bt-table td {
  font-size: 12px;
  padding: 7px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.82);
  letter-spacing: 0.04em;
}
.bt-table tbody tr { transition: background 120ms ease, box-shadow 120ms ease; }
.bt-table tbody tr:hover td { background: rgba(255,255,255,0.04); color: #fff; }
.bt-table tbody tr.sel td {
  background: rgba(255,255,255,0.06);
  color: #fff;
  box-shadow: inset 3px 0 0 #fff;
}
.bt-table td.pos { color: #fff; font-weight: 700; }
.bt-table td.neg { color: #ff5555; font-weight: 700; }

/* Terminal block (SCANNING, AI eval) */
.bt-term {
  font-size: 13px; line-height: 1.9; letter-spacing: 0.04em;
  color: rgba(255,255,255,0.82);
  white-space: pre-wrap;
  word-wrap: break-word;
}
.bt-term .p { color: rgba(255,255,255,0.55); margin-right: 8px; }
.bt-term .hi { color: #fff; font-weight: 700; }
.bt-term .ok { color: #3fdc6b; }
.bt-term .warn { color: #ff5555; }

.bt-caret {
  display: inline-block; width: 7px; height: 13px; background: #fff;
  vertical-align: text-bottom;
  animation: bt-blink 1s step-end infinite;
  margin-left: 2px;
}
@keyframes bt-blink { 0%,49%{opacity:1} 50%,100%{opacity:0} }

/* RUNNING radar overlay */
.bt-running {
  position: relative;
  flex: 1; min-height: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
.bt-radar-box {
  position: relative;
  min-height: 360px;
}
.bt-progress-row { display: flex; flex-direction: column; gap: 6px; }
.bt-prog-track {
  position: relative; height: 2px; background: rgba(255,255,255,0.1);
}
.bt-prog-bar {
  position: absolute; inset: 0 auto 0 0; background: #fff;
  box-shadow: 0 0 6px rgba(255,255,255,0.6);
  animation: bt-prog 3.2s cubic-bezier(0.4,0,0.8,1) infinite;
}
@keyframes bt-prog {
  0% { width: 0%; }
  90% { width: 92%; }
  100% { width: 100%; }
}

/* Heatmap */
.bt-hm {
  display: grid;
  gap: 4px;
  padding: 8px 0;
}
.bt-hm-cell {
  position: relative;
  aspect-ratio: 1 / 1;
  border: 1px solid rgba(255,255,255,0.15);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; color: rgba(255,255,255,0.75);
  transition: all 120ms ease;
}
.bt-hm-cell:hover {
  color: #fff;
  border-color: #fff;
  box-shadow: 0 0 6px rgba(255,255,255,0.4), inset 0 0 12px rgba(255,255,255,0.08);
}
.bt-hm-cell.i0 { border-color: rgba(255,85,85,0.3); color: rgba(255,85,85,0.65); }
.bt-hm-cell.i1 { border-color: rgba(255,85,85,0.18); }
.bt-hm-cell.i2 { border-color: rgba(255,255,255,0.18); }
.bt-hm-cell.i3 { border-color: rgba(255,255,255,0.4); box-shadow: inset 0 0 6px rgba(255,255,255,0.1); }
.bt-hm-cell.i4 {
  border-color: rgba(255,255,255,0.65);
  box-shadow: inset 0 0 10px rgba(255,255,255,0.18), 0 0 4px rgba(255,255,255,0.2);
  color: #fff; font-weight: 700;
}
.bt-hm-axis {
  display: flex; font-size: 9px; letter-spacing: 0.2em;
  color: rgba(255,255,255,0.4); text-transform: uppercase;
  justify-content: space-between;
  padding: 4px 0;
}

/* Status footer */
.bt-foot {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  padding-top: 6px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.bt-foot .dot {
  display: inline-block; width: 6px; height: 6px; background: #fff;
  border-radius: 50%; margin-right: 8px; vertical-align: middle;
  box-shadow: 0 0 5px rgba(255,255,255,0.7), 0 0 12px rgba(255,255,255,0.25);
  animation: bt-pulse 2s ease-in-out infinite;
}
@keyframes bt-pulse {
  0%,100% { box-shadow: 0 0 5px rgba(255,255,255,0.7), 0 0 12px rgba(255,255,255,0.25); }
  50%     { box-shadow: 0 0 10px rgba(255,255,255,0.95), 0 0 22px rgba(255,255,255,0.4); }
}

/* AI eval rating bars */
.bt-rating { display: flex; gap: 3px; height: 16px; margin-top: 4px; }
.bt-rating i {
  display: block; flex: 1;
  background: rgba(255,255,255,0.15);
}
.bt-rating i.on { background: #fff; box-shadow: 0 0 5px rgba(255,255,255,0.7); }

/* ═══════ MINIMAL / PRISM-STYLE LAYOUTS ═══════ */

/* Shared: section numbering label */
.bt-section-label {
  font-size: 10px; letter-spacing: 0.34em;
  color: rgba(255,255,255,0.42);
  text-transform: uppercase;
  margin-bottom: 20px;
}

/* ─── Artboard 1: SETUP ─── */
.bt-simple {
  flex: 1;
  display: flex; flex-direction: column;
  padding: 10px 40px 0;
  max-width: 960px;
  width: 100%;
  margin: 0 auto;
}

.bt-presets {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.bt-preset {
  position: relative;
  background: #000;
  border: 1px solid rgba(255,255,255,0.22);
  color: #fff;
  padding: 28px 22px 24px;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  transition: border-color .15s, background .15s;
  display: flex; flex-direction: column; gap: 10px;
  min-height: 180px;
}
.bt-preset:hover { border-color: rgba(255,255,255,0.5); }
.bt-preset.on   { border-color: #fff; background: rgba(255,255,255,0.04); }
.bt-preset .c-tl, .bt-preset .c-tr, .bt-preset .c-bl, .bt-preset .c-br {
  position: absolute; width: 10px; height: 10px; pointer-events: none;
  opacity: 0; transition: opacity .15s;
}
.bt-preset.on .c-tl, .bt-preset.on .c-tr, .bt-preset.on .c-bl, .bt-preset.on .c-br { opacity: 1; }
.bt-preset .c-tl { top: -1px; left: -1px;  border-top: 1px solid #fff; border-left: 1px solid #fff; }
.bt-preset .c-tr { top: -1px; right: -1px; border-top: 1px solid #fff; border-right: 1px solid #fff; }
.bt-preset .c-bl { bottom: -1px; left: -1px;  border-bottom: 1px solid #fff; border-left: 1px solid #fff; }
.bt-preset .c-br { bottom: -1px; right: -1px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; }
.bt-preset .g { font-size: 32px; line-height: 1; letter-spacing: 0.02em; }
.bt-preset .n { font-size: 15px; font-weight: 700; letter-spacing: 0.28em; }
.bt-preset .t { font-size: 10px; letter-spacing: 0.22em; color: rgba(255,255,255,0.5); text-transform: uppercase; }
.bt-preset .m {
  margin-top: auto;
  display: flex; gap: 18px;
  font-size: 11px; letter-spacing: 0.22em;
  color: rgba(255,255,255,0.7);
  padding-top: 12px;
  border-top: 1px dashed rgba(255,255,255,0.15);
}

.bt-period-row {
  display: flex; gap: 10px;
}
.bt-period {
  flex: 1;
  background: #000;
  border: 1px solid rgba(255,255,255,0.22);
  color: rgba(255,255,255,0.65);
  font-family: inherit;
  font-size: 14px;
  letter-spacing: 0.26em;
  padding: 18px 0;
  cursor: pointer;
  transition: all .15s;
}
.bt-period:hover { border-color: rgba(255,255,255,0.5); color: #fff; }
.bt-period.on {
  background: #fff; color: #000; border-color: #fff;
  font-weight: 700;
}

.bt-cta-row {
  margin-top: auto;
  padding-top: 56px;
  display: flex; justify-content: center;
}
.bt-cta {
  position: relative;
  background: #fff; color: #000;
  border: 1px solid #fff;
  font-family: inherit;
  font-size: 14px; font-weight: 700;
  letter-spacing: 0.36em;
  padding: 20px 64px;
  cursor: pointer;
  transition: all .15s;
  min-width: 380px;
}
.bt-cta:hover {
  background: #000; color: #fff;
  box-shadow: 0 0 28px rgba(255,255,255,0.35);
}
.bt-cta .arrow { margin-left: 12px; display: inline-block; }

/* ─── Artboard 2: RUNNING ─── */
.bt-run-wrap {
  flex: 1;
  display: flex; align-items: center; justify-content: center;
  padding: 40px;
  position: relative;
}
.bt-run-center {
  text-align: center;
  display: flex; flex-direction: column; align-items: center;
  gap: 18px;
  z-index: 2;
}
.bt-run-label {
  font-size: 11px; letter-spacing: 0.44em;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
}
.bt-run-pct {
  font-size: 128px;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
  text-shadow: 0 0 24px rgba(255,255,255,0.55);
  font-variant-numeric: tabular-nums;
}
.bt-run-status {
  font-size: 12px; letter-spacing: 0.28em;
  color: rgba(255,255,255,0.7);
  display: flex; align-items: center; gap: 10px;
}
.bt-run-status .dot {
  width: 6px; height: 6px; background: #fff; border-radius: 50%;
  box-shadow: 0 0 8px #fff;
  animation: bt-blink 1.2s infinite;
}
@keyframes bt-blink { 0%,100% { opacity: 1; } 50% { opacity: 0.25; } }
.bt-run-prog {
  width: 420px; height: 2px;
  background: rgba(255,255,255,0.15);
  position: relative;
  margin-top: 8px;
}
.bt-run-prog-bar {
  height: 100%;
  background: #fff;
  box-shadow: 0 0 10px rgba(255,255,255,0.8);
  transition: width .12s linear;
}

/* ─── Artboard 3: RESULTS ─── */
.bt-res-wrap {
  flex: 1;
  display: flex; flex-direction: column;
  padding: 10px 40px 0;
  gap: 36px;
}
.bt-res-chart {
  border: 1px solid rgba(255,255,255,0.22);
  background: #000;
  padding: 22px 26px;
  position: relative;
}
.bt-res-chart::before, .bt-res-chart::after {
  content: ""; position: absolute; width: 10px; height: 10px;
}
.bt-res-chart::before { top: -1px; left: -1px; border-top: 1px solid #fff; border-left: 1px solid #fff; }
.bt-res-chart::after  { top: -1px; right: -1px; border-top: 1px solid #fff; border-right: 1px solid #fff; }
.bt-res-chart-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 14px;
}
.bt-res-chart-title {
  font-size: 12px; letter-spacing: 0.32em;
  color: rgba(255,255,255,0.85);
}
.bt-res-chart-sub {
  font-size: 13px; letter-spacing: 0.14em;
  color: rgba(255,255,255,0.55);
}
.bt-res-chart-sub .pos { color: #fff; font-weight: 700; }
.bt-res-chart-body {
  position: relative;
  height: 340px;
}

.bt-res-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid rgba(255,255,255,0.18);
  border-bottom: 1px solid rgba(255,255,255,0.18);
}
.bt-res-kpi {
  padding: 30px 28px;
  display: flex; flex-direction: column; gap: 10px;
  border-right: 1px solid rgba(255,255,255,0.12);
}
.bt-res-kpi:last-child { border-right: none; }
.bt-res-kpi .l {
  font-size: 10px; letter-spacing: 0.32em;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
}
.bt-res-kpi .v {
  font-size: 44px; font-weight: 700;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.bt-res-kpi .v.pos { color: #fff; }
.bt-res-kpi .v.neg { color: #ff5a5a; text-shadow: 0 0 10px rgba(255,90,90,0.35); }

.bt-res-cta-row {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding-top: 8px;
}
.bt-res-link {
  font-size: 11px; letter-spacing: 0.28em;
  color: rgba(255,255,255,0.55);
  text-decoration: none;
  text-transform: uppercase;
}
.bt-res-link:hover { color: #fff; }

/* ═══════ FULL /backtest PAGE — cinematic over real structure ═══════ */

.bt-full {
  flex: 1;
  display: flex; flex-direction: column;
  gap: 18px;
  padding: 4px 24px 0;
  min-height: 0;
  overflow-y: auto;
}

/* ─── fieldset (Parameters) ─── */
.bt-fieldset {
  position: relative;
  border: 1px solid rgba(255,255,255,0.22);
  background: #000;
  padding: 16px 20px 18px;
}
.bt-fieldset .c-tl, .bt-fieldset .c-tr, .bt-fieldset .c-bl, .bt-fieldset .c-br {
  position: absolute; width: 8px; height: 8px; pointer-events: none;
}
.bt-fieldset .c-tl { top: -1px; left: -1px; border-top: 1px solid #fff; border-left: 1px solid #fff; }
.bt-fieldset .c-tr { top: -1px; right: -1px; border-top: 1px solid #fff; border-right: 1px solid #fff; }
.bt-fieldset .c-bl { bottom: -1px; left: -1px; border-bottom: 1px solid #fff; border-left: 1px solid #fff; }
.bt-fieldset .c-br { bottom: -1px; right: -1px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; }

.bt-fieldset-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px dashed rgba(255,255,255,0.14);
}
.bt-fieldset-legend {
  font-size: 11px; letter-spacing: 0.3em;
  color: #fff; font-weight: 700;
}
.bt-fieldset-sub {
  font-size: 10px; letter-spacing: 0.22em;
  color: rgba(255,255,255,0.45);
}

.bt-form {
  display: flex; flex-wrap: wrap; gap: 14px 18px;
  align-items: flex-end;
}
.bt-fg { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.bt-fg label {
  font-size: 9px; letter-spacing: 0.28em;
  color: rgba(255,255,255,0.55);
  text-transform: uppercase;
}

/* input/select */
.bt-input {
  background: #000;
  border: 1px solid rgba(255,255,255,0.28);
  color: #fff;
  font-family: 'Space Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.06em;
  padding: 8px 10px;
  outline: none;
  width: 100%;
  transition: border-color .15s;
}
.bt-input:hover  { border-color: rgba(255,255,255,0.5); }
.bt-input:focus  { border-color: #fff; box-shadow: 0 0 0 1px rgba(255,255,255,0.12); }

.bt-select-wrap { position: relative; }
.bt-select-wrap select.bt-input {
  appearance: none; -webkit-appearance: none;
  padding-right: 28px;
  cursor: pointer;
}
.bt-select-wrap select.bt-input option,
.bt-select-wrap select.bt-input optgroup {
  background: #0a0a0a; color: #fff;
}
.bt-select-caret {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  font-size: 10px; color: rgba(255,255,255,0.6); pointer-events: none;
}

/* period chips */
.bt-chip-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.bt-chip {
  background: #000;
  border: 1px solid rgba(255,255,255,0.28);
  color: rgba(255,255,255,0.75);
  font-family: 'Space Mono', monospace;
  font-size: 11px; letter-spacing: 0.2em;
  padding: 7px 12px;
  cursor: pointer;
  transition: all .15s;
  min-width: 48px;
}
.bt-chip:hover { border-color: rgba(255,255,255,0.6); color: #fff; }
.bt-chip.on    { background: #fff; color: #000; border-color: #fff; font-weight: 700; }
.bt-days { width: 70px; padding: 7px 8px; font-size: 11px; }

.bt-fg-btns label { visibility: hidden; }
.bt-run-btn {
  background: #fff; color: #000;
  border: 1px solid #fff;
  font-family: 'Space Mono', monospace;
  font-size: 12px; font-weight: 700;
  letter-spacing: 0.28em;
  padding: 8px 20px;
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.bt-run-btn:hover { background: #000; color: #fff; box-shadow: 0 0 18px rgba(255,255,255,0.3); }
.bt-run-btn .arrow { margin-left: 6px; }

.bt-fav-btn {
  background: #000;
  border: 1px solid rgba(255,255,255,0.28);
  color: rgba(255,255,255,0.5);
  font-size: 18px;
  padding: 4px 12px;
  cursor: pointer;
  transition: all .15s;
  line-height: 1;
}
.bt-fav-btn:hover { border-color: rgba(255,255,255,0.7); color: #fff; }
.bt-fav-btn.on { color: #ffd24a; border-color: rgba(255,210,74,0.6); text-shadow: 0 0 10px rgba(255,210,74,0.6); }

/* empty state */
.bt-empty {
  position: relative;
  border: 1px dashed rgba(255,255,255,0.2);
  padding: 60px 40px;
  text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  flex: 1;
  min-height: 240px;
  justify-content: center;
}
.bt-empty .c-tl, .bt-empty .c-tr, .bt-empty .c-bl, .bt-empty .c-br {
  position: absolute; width: 10px; height: 10px; pointer-events: none;
}
.bt-empty .c-tl { top: -1px; left: -1px; border-top: 1px solid rgba(255,255,255,0.4); border-left: 1px solid rgba(255,255,255,0.4); }
.bt-empty .c-tr { top: -1px; right: -1px; border-top: 1px solid rgba(255,255,255,0.4); border-right: 1px solid rgba(255,255,255,0.4); }
.bt-empty .c-bl { bottom: -1px; left: -1px; border-bottom: 1px solid rgba(255,255,255,0.4); border-left: 1px solid rgba(255,255,255,0.4); }
.bt-empty .c-br { bottom: -1px; right: -1px; border-bottom: 1px solid rgba(255,255,255,0.4); border-right: 1px solid rgba(255,255,255,0.4); }
.bt-empty-ico { font-size: 42px; color: rgba(255,255,255,0.5); }
.bt-empty-title { font-size: 14px; letter-spacing: 0.34em; font-weight: 700; }
.bt-empty-sub { font-size: 11px; letter-spacing: 0.2em; color: rgba(255,255,255,0.45); text-transform: uppercase; }

/* results section */
.bt-results-wrap { display: flex; flex-direction: column; gap: 14px; }
.bt-results-head {
  display: flex; align-items: baseline; gap: 12px;
  padding-bottom: 6px;
}
.bt-results-head .hi { font-size: 11px; letter-spacing: 0.3em; color: #fff; font-weight: 700; }
.bt-results-head .dim { font-size: 10px; letter-spacing: 0.22em; color: rgba(255,255,255,0.45); }

/* stats grid (8 cards) */
.bt-stats-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,0.18);
}
.bt-stat2 {
  padding: 14px 14px;
  border-right: 1px solid rgba(255,255,255,0.1);
  display: flex; flex-direction: column; gap: 6px;
  background: #000;
  min-width: 0;
}
.bt-stat2:last-child { border-right: none; }
.bt-stat2 .l {
  font-size: 9px; letter-spacing: 0.24em;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.bt-stat2 .v {
  font-size: 18px; font-weight: 700;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}
.bt-stat2 .v.pos { color: #fff; }
.bt-stat2 .v.neg { color: #ff5a5a; text-shadow: 0 0 8px rgba(255,90,90,0.3); }

/* Trade on row */
.bt-trade-row {
  display: flex; align-items: center; gap: 10px;
  padding: 4px 0;
}
.bt-trade-lbl {
  font-size: 10px; letter-spacing: 0.28em;
  color: rgba(255,255,255,0.6);
  font-weight: 700;
}
.bt-trade-btn {
  background: #000;
  border: 1px solid rgba(255,255,255,0.4);
  color: #fff;
  font-family: 'Space Mono', monospace;
  font-size: 11px; letter-spacing: 0.22em;
  padding: 6px 14px;
  text-decoration: none;
  transition: all .15s;
}
.bt-trade-btn:hover {
  background: #fff; color: #000;
}

/* chart panel */
.bt-chart-panel, .bt-periods-panel {
  position: relative;
  border: 1px solid rgba(255,255,255,0.22);
  background: #000;
  padding: 14px 16px 16px;
}
.bt-chart-panel .c-tl, .bt-chart-panel .c-tr, .bt-chart-panel .c-bl, .bt-chart-panel .c-br,
.bt-periods-panel .c-tl, .bt-periods-panel .c-tr, .bt-periods-panel .c-bl, .bt-periods-panel .c-br {
  position: absolute; width: 8px; height: 8px; pointer-events: none;
}
.bt-chart-panel .c-tl, .bt-periods-panel .c-tl { top: -1px; left: -1px; border-top: 1px solid #fff; border-left: 1px solid #fff; }
.bt-chart-panel .c-tr, .bt-periods-panel .c-tr { top: -1px; right: -1px; border-top: 1px solid #fff; border-right: 1px solid #fff; }
.bt-chart-panel .c-bl, .bt-periods-panel .c-bl { bottom: -1px; left: -1px; border-bottom: 1px solid #fff; border-left: 1px solid #fff; }
.bt-chart-panel .c-br, .bt-periods-panel .c-br { bottom: -1px; right: -1px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; }

.bt-chart-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px dashed rgba(255,255,255,0.14);
}
.bt-chart-title { font-size: 11px; letter-spacing: 0.3em; color: #fff; font-weight: 700; }
.bt-chart-legend {
  display: flex; gap: 16px;
  font-size: 9px; letter-spacing: 0.2em;
  color: rgba(255,255,255,0.6);
  text-transform: uppercase;
}
.bt-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.bt-chart-legend .dot { display: inline-block; width: 10px; height: 2px; }
.bt-chart-legend .dot.white { background: #fff; }
.bt-chart-legend .dot.red { background: #ff5a5a; }
.bt-chart-legend .dot.bar { background: rgba(255,255,255,0.4); height: 8px; width: 8px; }

.bt-chart-canvas {
  position: relative;
  height: 340px;
}
.bt-chart-canvas canvas { position: relative; z-index: 1; }

/* periods table */
.bt-periods-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.06em;
}
.bt-periods-table th {
  text-align: left;
  font-size: 9px;
  letter-spacing: 0.26em;
  color: rgba(255,255,255,0.55);
  font-weight: 700;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}
.bt-periods-table th.num { text-align: right; }
.bt-periods-table td {
  padding: 8px 12px;
  color: rgba(255,255,255,0.85);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  font-variant-numeric: tabular-nums;
}
.bt-periods-table td.num { text-align: right; }
.bt-periods-table td.num.pos { color: #fff; }
.bt-periods-table td.num.neg { color: #ff5a5a; }
.bt-periods-table tr:hover td { background: rgba(255,255,255,0.04); color: #fff; }

/* ──────────────────────────────────────────────────────────────────────
   Apr 25 — DEPTH TEXTURE для backtest-панелей
   diagonal stripe + top-light + multi-shadow (как .radar2-card)
   ────────────────────────────────────────────────────────────────────── */
.bt-stat2,
.bt-chart-panel,
.bt-periods-panel,
.bt-fieldset,
.bt-panel {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.018) 28%, rgba(255,255,255,0.008) 100%),
    #131318 !important;
}
.bt-chart-panel,
.bt-periods-panel,
.bt-fieldset,
.bt-panel {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 1px 0 rgba(0,0,0,0.6),
    0 6px 14px -8px rgba(0,0,0,0.9);
}
.bt-stats-grid {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 1px 0 rgba(0,0,0,0.6),
    0 6px 14px -8px rgba(0,0,0,0.9);
}

/* ───── Exchange custom dropdown (BtExchangeSelect) ─────────────────────── */
.bt-ex-select-wrap { position: relative; width: 100%; }
.bt-ex-select-trigger {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; height: 30px;
  padding: 0 10px;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.06em;
  cursor: pointer;
  transition: border-color 140ms ease, background 140ms ease;
  text-align: left;
}
.bt-ex-select-trigger:hover { border-color: rgba(255,255,255,0.55); }
.bt-ex-select-trigger.open { border-color: rgba(255,255,255,0.7); background: rgba(0,0,0,0.7); }
.bt-ex-select-val { color: #fff; text-transform: uppercase; letter-spacing: 0.04em; }
.bt-ex-select-caret { color: rgba(255,255,255,0.55); font-size: 10px; margin-left: 8px; }
.bt-ex-select-menu {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  z-index: 90;
  max-height: 320px; overflow-y: auto;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.018) 28%, rgba(255,255,255,0.008) 100%),
    #131318;
  border: 1px solid rgba(255,255,255,0.32);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.6), 0 18px 36px -12px rgba(0,0,0,0.9);
  padding: 6px 0;
}
.bt-ex-grp + .bt-ex-grp { border-top: 1px dashed rgba(255,255,255,0.12); margin-top: 6px; padding-top: 6px; }
.bt-ex-grp-lbl {
  font-size: 9px; letter-spacing: 0.32em; color: rgba(255,255,255,0.4);
  padding: 4px 12px 6px; text-transform: uppercase;
}
.bt-ex-opt {
  display: block; width: 100%;
  padding: 6px 12px;
  background: transparent; border: 0; outline: none;
  color: rgba(255,255,255,0.85);
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.04em;
  text-align: left; text-transform: uppercase;
  cursor: pointer;
  transition: background 100ms ease, color 100ms ease;
}
.bt-ex-opt:hover { background: rgba(255,255,255,0.06); color: #fff; }
.bt-ex-opt.on { color: #fff; background: rgba(255,255,255,0.08); }
.bt-ex-opt.on::before { content: '◆ '; color: #fff; }

/* ───── Trade-on links after results ────────────────────────────────────── */
.bt-trade-links {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 14px; margin-top: 8px;
  border: 1px dashed rgba(255,255,255,0.18);
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    rgba(0,0,0,0.4);
  flex-wrap: wrap;
}
.bt-trade-lbl {
  font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase;
  color: rgba(255,255,255,0.45); white-space: nowrap;
}
.bt-trade-row { display: flex; gap: 8px; flex-wrap: wrap; }
.bt-trade-btn {
  display: inline-flex; align-items: center;
  padding: 6px 14px;
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
  text-decoration: none;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.45);
  color: #fff;
  cursor: pointer;
  transition: all 140ms ease;
}
.bt-trade-btn:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.85); box-shadow: 0 0 10px rgba(255,255,255,0.18); }
.bt-trade-btn.dim { color: rgba(255,255,255,0.35); border-color: rgba(255,255,255,0.15); cursor: default; }
.bt-trade-btn.dim:hover { background: transparent; box-shadow: none; }
.bt-trade-arrow { color: rgba(255,255,255,0.55); font-weight: 400; }
