:root {
  color-scheme: light;
  --background: #f4f6f8;
  --surface: #ffffff;
  --foreground: #182026;
  --muted: #68737d;
  --border: #d9dee3;
  --grid: #e7eaed;
  --positive: #c62d32;
  --negative: #16845b;
  --neutral: #8b949c;
  --accent: #f0b429;
}

* {
  box-sizing: border-box;
  letter-spacing: 0;
}

body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Microsoft YaHei", sans-serif;
  font-size: 15px;
}

.app-header {
  background: #20262b;
  color: #ffffff;
  border-bottom: 3px solid var(--accent);
}

.header-inner,
main {
  width: min(1240px, calc(100% - 40px));
  margin: 0 auto;
}

.header-inner {
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 0;
}

.header-inner > :first-child { flex:0 0 auto; }

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  font-size: 30px;
  font-weight: 500;
}

.header-inner p {
  margin-top: 5px;
  color: #c8d0d6;
}

.brand-mark,
.login-brand {
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex:1 1 auto;
  min-width:0;
  flex-wrap:wrap;
  gap: 14px;
}

.header-nav { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px 14px; min-width:0; }
.header-nav .header-link { white-space:nowrap; }
.header-nav .header-link[aria-current="page"] { color:var(--accent); text-decoration-thickness:2px; }

.header-link {
  color: #ffffff;
  text-underline-offset: 4px;
}

.header-link:hover {
  color: var(--accent);
}

.current-user {
  padding-left: 14px;
  border-left: 1px solid #4b555d;
  color: #c8d0d6;
}

.header-button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #626d75;
  background: transparent;
  font-size: 13px;
}

.detail-action-link {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  padding: 0 13px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--surface);
  color: var(--foreground);
  font-size: 13px;
  text-decoration: none;
}

.detail-action-link:hover {
  border-color: #aab3ba;
  background: #f8fafb;
}

.minute-page {
  width: min(1440px, calc(100% - 40px));
}

.minute-toolbar,
.minute-panel {
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
}

.minute-toolbar {
  overflow: hidden;
}

.minute-common-controls {
  display: grid;
  grid-template-columns: minmax(250px, 1.6fr) repeat(3, minmax(125px, .65fr)) minmax(200px, 1fr);
  gap: 15px;
  align-items: end;
  padding: 20px;
}

.minute-common-controls label,
.minute-panel-actions label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 13px;
}

.minute-common-controls input,
.minute-common-controls select,
.minute-panel-actions select {
  width: 100%;
  min-height: 42px;
}

.minute-provider {
  align-self: center;
  padding: 9px 12px;
  border-left: 3px solid var(--positive);
  background: #f4faf7;
  color: #236643;
  font-size: 13px;
}

.minute-parameter-state {
  flex: 1 0 100%;
  padding: 8px 10px;
  border-left: 3px solid var(--accent);
  background: #fff8e6;
  color: #705500;
  font-size: 12px;
  line-height: 1.5;
}

.minute-provider.is-error {
  border-color: #c47400;
  background: #fff8ec;
  color: #855000;
}

.minute-tabs {
  display: flex;
  border-top: 1px solid var(--border);
  background: #f7f8f9;
}

.minute-tab {
  min-height: 48px;
  padding: 0 24px;
  border: 0;
  border-right: 1px solid var(--border);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
}

.minute-tab.is-active {
  box-shadow: inset 0 -3px 0 var(--accent);
  background: var(--surface);
  color: var(--foreground);
  font-weight: 600;
}

.minute-panel {
  margin-top: 20px;
  padding: 22px;
}

.minute-panel-heading,
.minute-panel-actions {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.minute-panel-heading > div:first-child p {
  max-width: 760px;
  margin-top: 6px;
  color: var(--muted);
  line-height: 1.6;
}

.minute-panel-actions label {
  min-width: 120px;
}

.secondary-button {
  border-color: var(--border);
  background: #eef1f3;
  color: var(--foreground);
}

.minute-progress {
  margin-top: 18px;
  padding: 13px 15px;
  border: 1px solid #ead9a6;
  border-radius: 5px;
  background: #fffaf0;
}

.minute-progress > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 8px;
  color: #6d5a22;
  font-size: 13px;
}

.minute-progress progress {
  display: block;
  width: 100%;
  height: 7px;
  accent-color: var(--accent);
}

.minute-summary {
  margin-top: 18px;
}

.minute-summary small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
}

.minute-live-note {
  display: flex;
  gap: 12px;
  margin-top: 18px;
  padding: 11px 13px;
  border-left: 3px solid var(--positive);
  background: #f5faf7;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.minute-live-note strong {
  flex: 0 0 auto;
  color: #236643;
}

.minute-chart-card {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 6px;
}

.minute-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 17px;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 12px;
}

.minute-chart-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
}

.minute-visible-window {
  color: var(--muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

.minute-chart-legend span::before {
  display: inline-block;
  width: 18px;
  height: 3px;
  margin: 0 6px 3px 0;
  background: #34424c;
  content: "";
}

.minute-chart-legend .legend-threshold::before { background: #d69b00; }
.minute-chart-legend .legend-entry::before { background: var(--positive); }
.minute-chart-legend .legend-exit::before { background: var(--negative); }

.minute-chart-shell,
.minute-strength-shell {
  position: relative;
  width: 100%;
  height: 420px;
}

.minute-strength-shell {
  height: 230px;
}

.minute-chart-shell canvas,
.minute-strength-shell canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
}

.minute-strength-title {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin: 15px 18px 0 64px;
  color: var(--foreground);
  font-size: 13px;
  font-weight: 600;
}

.minute-strength-title span {
  color: var(--muted);
  font-weight: 400;
}

.minute-price-tooltip {
  min-width: 248px;
  max-width: min(360px, calc(100% - 16px));
}

.minute-strength-tooltip {
  min-width: 205px;
  max-width: min(320px, calc(100% - 16px));
}

.minute-price-tooltip b {
  color: #ffd36a;
  font-weight: 600;
}

.minute-range-selector {
  margin: 22px 10px 6px 64px;
}

.minute-assumptions {
  margin-top: 18px;
}

.minute-assumptions .minute-checkbox > span:last-child {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: 7px;
  color: var(--foreground);
  white-space: nowrap;
}

.minute-assumptions .minute-checkbox input {
  width: 18px;
  min-height: 18px;
  margin: 0;
}

.minute-table-section {
  padding-right: 0;
  padding-left: 0;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
}

.minute-table-section .strength-section-heading,
.minute-table-section .strength-table-shell {
  padding-right: 2px;
  padding-left: 2px;
}

.minute-trades .strength-table {
  min-width: 900px;
}

.minute-warning {
  margin-top: 14px;
  padding: 10px 12px;
  border-left: 3px solid #c47400;
  background: #fff8ec;
  color: #855000;
  font-size: 13px;
}

@media (max-width: 920px) {
  .minute-common-controls {
    grid-template-columns: 1fr 1fr;
  }

  .minute-provider {
    grid-column: 1 / -1;
  }

  .minute-panel-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .minute-panel-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 620px) {
  .minute-page {
    width: min(100% - 20px, 1440px);
  }

  .minute-common-controls {
    grid-template-columns: 1fr;
    padding: 14px;
  }

  .minute-provider {
    grid-column: auto;
  }

  .minute-tab {
    flex: 1 1 50%;
    padding: 0 9px;
  }

  .minute-panel {
    padding: 15px;
  }

  .minute-panel-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .minute-panel-actions label {
    grid-column: 1 / -1;
  }

  .minute-chart-card {
    padding: 8px 4px;
  }

  .minute-chart-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .minute-visible-window {
    text-align: left;
    white-space: normal;
  }

  .minute-range-selector {
    margin-left: 10px;
  }

  .minute-chart-shell {
    height: 340px;
  }

  .minute-live-note {
    flex-direction: column;
  }
}

main {
  padding: 24px 0 44px;
}

.strength-result {
  margin-top: 24px;
}

.strength-title-row,
.strength-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.strength-title-row p,
.strength-section-heading p {
  color: var(--muted);
  font-size: 13px;
}

.strength-title-row > div > p {
  margin-top: 5px;
}

.strength-rule {
  max-width: 560px;
  text-align: right;
}

.strength-summary {
  margin-top: 18px;
}

.strength-table-section {
  margin-top: 24px;
  padding: 22px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
}

.strength-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  cursor: pointer;
  list-style: none;
}

.strength-disclosure > summary::-webkit-details-marker {
  display: none;
}

.strength-disclosure > summary > span:first-child {
  display: grid;
  gap: 5px;
}

.strength-disclosure > summary strong {
  font-size: 19px;
  font-weight: 600;
}

.strength-disclosure > summary small,
.strength-disclosure-action {
  color: var(--muted);
  font-size: 13px;
}

.strength-disclosure-action::after {
  content: " ▼";
}

.strength-disclosure[open] .strength-disclosure-action::after {
  content: " ▲";
}

.instrument-context-note {
  margin-top: 18px;
  padding: 11px 13px;
  border-left: 3px solid var(--accent);
  background: #fffaf0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.strength-table-shell {
  margin-top: 16px;
  overflow-x: auto;
}

.strength-table {
  width: 100%;
  min-width: 1160px;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

.strength-index-section {
  padding-top: 18px;
  padding-bottom: 18px;
}

.strength-index-table {
  min-width: 640px;
}

.strength-table th,
.strength-table td {
  padding: 11px 12px;
  border-bottom: 1px solid var(--grid);
  text-align: right;
  white-space: nowrap;
}

.strength-table th:first-child,
.strength-table td:first-child,
.strength-table th:nth-child(2),
.strength-table td:nth-child(2) {
  text-align: left;
}

.strength-table th {
  background: #f7f8f9;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.return-positive {
  color: var(--positive);
}

.return-negative {
  color: var(--negative);
}

.strength-trade-table tr.is-open-position td {
  background: #fff8e6;
  font-weight: 500;
}

.controls {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 130px;
  align-items: end;
  gap: 16px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.strength-controls {
  grid-template-columns: minmax(250px, 1.7fr) repeat(4, minmax(130px, 0.75fr)) minmax(210px, 1.2fr) 120px;
}

.strength-controls label {
  min-width: 0;
}

.strength-controls label > span {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 12px;
}

.strength-window-table,
.strength-trade-table {
  min-width: 720px;
}

.strength-assumptions {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
}

.strength-assumptions summary {
  width: max-content;
  cursor: pointer;
  color: var(--foreground);
}

.strength-assumptions > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.strength-assumptions p {
  margin-top: 9px;
}

.pool-mode-tabs {
  display: flex;
  gap: 8px;
  margin-top: 22px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.pool-mode-tabs button {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid var(--border);
  background: #f7f8f9;
  color: var(--foreground);
  font-size: 13px;
}

.pool-mode-tabs button:hover,
.pool-mode-tabs button.is-active {
  border-color: #20262b;
  background: #20262b;
  color: #ffffff;
}

.history-date-field {
  min-width: 180px;
}

.pool-section {
  margin-top: 24px;
  padding: 22px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
}

.pool-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}

.pool-heading p,
.pool-description {
  color: var(--muted);
  font-size: 13px;
}

.pool-heading p {
  margin-top: 5px;
}

.pool-refresh {
  max-width: 460px;
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.pool-refresh[data-state="running"]::before {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 7px;
  border-radius: 50%;
  background: var(--accent);
  content: "";
  animation: pool-pulse 1.2s ease-in-out infinite;
}

.pool-refresh[data-state="error"] {
  color: var(--positive);
}

.pool-tabs {
  display: flex;
  gap: 8px;
  margin-top: 20px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.pool-tabs button {
  min-height: 36px;
  flex: 0 0 auto;
  padding: 0 13px;
  border: 1px solid var(--border);
  background: #f7f8f9;
  color: var(--foreground);
  font-size: 13px;
}

.pool-tabs button:hover,
.pool-tabs button.is-active {
  border-color: #20262b;
  background: #20262b;
  color: #ffffff;
}

.pool-description {
  min-height: 20px;
  margin-top: 13px;
}

.pool-description-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.pool-help {
  position: relative;
  flex: 0 0 auto;
  margin-top: 8px;
}

.pool-help-button {
  width: 28px;
  min-height: 28px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: #f7f8f9;
  color: var(--muted);
  font-size: 15px;
}

.pool-help-button:hover,
.pool-help-button:focus-visible {
  border-color: #20262b;
  background: #20262b;
  color: #ffffff;
}

.pool-help-content {
  position: absolute;
  z-index: 8;
  top: 34px;
  right: 0;
  display: none;
  width: min(450px, calc(100vw - 48px));
  padding: 16px 18px;
  border: 1px solid #b8c0c6;
  border-radius: 6px;
  background: #20262b;
  color: #ffffff;
  box-shadow: 0 12px 34px rgba(24, 32, 38, 0.26);
  font-size: 12px;
  line-height: 1.65;
}

.pool-help:hover .pool-help-content,
.pool-help:focus-within .pool-help-content {
  display: block;
}

.pool-help-content p + p,
.pool-help-content ul + p {
  margin-top: 10px;
}

.pool-help-content ul {
  margin: 7px 0 0;
  padding-left: 19px;
}

.watchlist-controls {
  display: grid;
  grid-template-columns: minmax(240px, 420px) 110px minmax(160px, 1fr);
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}

.watchlist-controls[hidden] {
  display: none;
}

.watchlist-controls button {
  min-height: 38px;
}

.watchlist-controls span {
  color: var(--muted);
  font-size: 12px;
}

.pool-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.pool-card {
  display: flex;
  min-width: 0;
  min-height: 0;
  align-items: stretch;
  flex-direction: column;
  gap: 9px;
  padding: 16px;
  border: 1px solid var(--border);
  background: #ffffff;
  color: var(--foreground);
  text-align: left;
}

.pool-card:hover {
  border-color: var(--accent);
  background: #fffdf8;
  box-shadow: 0 4px 14px rgba(24, 32, 38, 0.08);
}

.pool-card-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.pool-card-top strong {
  overflow: hidden;
  font-size: 16px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pool-card-top small,
.pool-card-context,
.pool-card-reason {
  color: var(--muted);
  font-size: 12px;
}

.pool-card-reason {
  min-height: 36px;
  line-height: 1.5;
}

.pool-card-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 12px;
  padding-top: 10px;
  border-top: 1px solid var(--grid);
  color: var(--muted);
  font-size: 12px;
}

.pool-card-metrics b {
  color: var(--foreground);
  font-weight: 500;
}

.pool-warning {
  padding: 5px 7px;
  border-radius: 3px;
  background: #fff0f0;
  color: #812127;
  font-size: 11px;
}

.pool-empty {
  margin-top: 14px;
  padding: 32px;
  border: 1px dashed var(--border);
  color: var(--muted);
  text-align: center;
}

.pool-table-shell {
  margin-top: 14px;
  overflow-x: auto;
  border: 1px solid var(--border);
  background: var(--surface);
}

.pool-table {
  width: 100%;
  min-width: 1120px;
  border-collapse: collapse;
  font-size: 13px;
}

.pool-table th,
.pool-table td {
  padding: 11px 12px;
  border-bottom: 1px solid var(--grid);
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.pool-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f7f8f9;
  color: var(--muted);
  font-weight: 500;
}

.pool-table tbody tr {
  cursor: pointer;
}

.pool-table tbody tr:hover,
.pool-table tbody tr:focus-visible {
  outline: none;
  background: #fffaf0;
}

.pool-table tbody tr:last-child td {
  border-bottom: 0;
}

.pool-table td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.stock-link,
.row-action {
  color: var(--foreground);
  font-weight: 500;
  text-decoration: none;
}

.stock-link:hover,
.row-action:hover {
  color: #9b6a00;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.breadth-badge {
  display: inline-block;
  min-width: 54px;
  padding: 5px 8px;
  border: 1px solid rgba(24, 32, 38, 0.08);
  border-radius: 4px;
  color: var(--foreground);
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.breadth-badge.is-deep {
  color: #ffffff;
}

.signal-status-cell {
  min-width: 130px;
}

.signal-status {
  display: inline-block;
  padding: 5px 8px;
  border-radius: 4px;
  background: #f1f3f4;
  color: #48535c;
  font-weight: 500;
}

.signal-status-new_consensus,
.signal-status-persistent_reversal,
.signal-status-sustained,
.signal-status-new,
.signal-status-strong,
.signal-status-confirming {
  background: #fff0f0;
  color: #a22228;
}

.signal-status-contrarian {
  background: #fff6df;
  color: #805c08;
}

.signal-status-risk {
  background: #e9f6ef;
  color: #12633f;
}

.signal-status-weak,
.signal-status-industry-risk,
.signal-status-industry-weak,
.signal-status-market-risk,
.signal-status-market-weak,
.signal-status-error {
  background: #e9f6ef;
  color: #12633f;
}

.status-preparing {
  color: var(--muted) !important;
}

.row-remove,
.account-delete {
  min-height: 30px;
  margin-left: 9px;
  padding: 0 9px;
  border: 1px solid #d9aeb0;
  background: #ffffff;
  color: #8c262b;
  font-size: 12px;
}

.account-disable,
.account-enable,
.history-access-disable,
.history-access-enable {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12px;
}

.account-disable {
  background: #72510b;
}

.history-access-disable {
  background: #72510b;
}

.account-enable {
  background: #176b4a;
}

.history-access-enable {
  background: #176b4a;
}

.history-access-control {
  white-space: nowrap;
}

.history-access-control button {
  margin-left: 9px;
}

.row-remove:hover,
.account-delete:hover {
  background: #fff0f0;
}

.pool-warning-inline {
  color: #9c272d !important;
}

@keyframes pool-pulse {
  50% { opacity: 0.25; transform: scale(0.75); }
}

label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}

input[type="search"],
input[type="text"],
input[type="password"],
input[type="number"],
input:not([type]) {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--surface);
  color: var(--foreground);
  font: inherit;
}

input:focus {
  border-color: #87919a;
  outline: 3px solid rgba(240, 180, 41, 0.2);
}

button {
  min-height: 42px;
  border: 0;
  border-radius: 5px;
  background: #20262b;
  color: #ffffff;
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}

button:hover {
  background: #343d44;
}

button:disabled {
  cursor: wait;
  opacity: 0.58;
}

.error {
  margin-top: 16px;
  padding: 10px 12px;
  border-left: 3px solid var(--positive);
  background: #fff0f0;
  color: #812127;
}

.loading {
  padding: 56px 0;
  color: var(--muted);
  text-align: center;
}

#strength-loading::before {
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  margin-right: 9px;
  border: 2px solid var(--grid);
  border-top-color: var(--accent);
  border-radius: 50%;
  vertical-align: -4px;
  animation: progress-spin 0.8s linear infinite;
}

.loading[hidden],
.result[hidden] {
  display: none;
}

.result {
  padding-top: 24px;
}

.overview {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}

h2 {
  font-size: 19px;
  font-weight: 500;
}

#chart-range {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.overview-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 18px 0 0;
  border-block: 1px solid var(--border);
}

.detail-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.detail-metrics dd {
  overflow-wrap: anywhere;
}

.overview-metrics div {
  padding: 13px 16px 13px 0;
}

.overview-metrics dt {
  color: var(--muted);
  font-size: 12px;
}

.overview-metrics dd {
  margin: 5px 0 0;
  font-size: 18px;
  font-variant-numeric: tabular-nums;
}

.ai-group {
  margin-top: 28px;
}

.independent-window-note {
  margin-top: 24px;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  background: #fff9e9;
  color: var(--muted);
  font-size: 13px;
}

.ai-group + .ai-group {
  margin-top: 38px;
}

.algorithm-title {
  padding-left: 10px;
  border-left: 3px solid var(--accent);
  font-size: 17px;
  font-weight: 500;
}

.chart-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

.chart-window-controls,
.chart-window-label {
  display: flex;
  align-items: center;
  gap: 9px;
}

.chart-window-label > span,
.chart-window-status {
  color: var(--muted);
  font-size: 12px;
}

.chart-window-label {
  flex: 0 0 auto;
  flex-wrap: nowrap;
}

.chart-window-label > span {
  flex: 0 0 auto;
  white-space: nowrap;
}

.chart-window-select {
  width: auto;
  min-width: 142px;
  flex: 0 0 auto;
  padding: 7px 30px 7px 10px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--foreground);
  font: inherit;
}

.detail-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.watchlist-toggle {
  min-width: 104px;
  border: 1px solid #20262b;
  background: var(--surface);
  color: #20262b;
}

.watchlist-toggle.is-selected {
  border-color: #9b6b08;
  background: #fff7df;
  color: #72510b;
}

.chart-window-status::before {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 6px;
  border: 2px solid var(--grid);
  border-top-color: var(--accent);
  border-radius: 50%;
  vertical-align: -3px;
  animation: progress-spin 0.8s linear infinite;
  content: "";
}

.ai-group.is-window-loading .chart-block {
  opacity: 0.72;
  transition: opacity 160ms ease;
}

.ai-group.has-window-error .chart-window-status {
  color: var(--negative);
}

.ai-group.has-window-error .chart-window-status::before {
  display: none;
}

.chart-block {
  padding: 16px 0 0;
}

.context-layer-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  padding: 0 16px 10px;
  color: var(--muted);
  font-size: 12px;
}

.context-layer-controls label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  white-space: nowrap;
}

.context-layer-controls input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.context-layer-swatch {
  display: inline-block;
  width: 18px;
  height: 3px;
  border-radius: 2px;
  background: var(--foreground);
  opacity: 0.22;
}

.context-layer-controls input:checked + .context-layer-swatch {
  opacity: 1;
}

.context-layer-swatch.is-stock {
  background: linear-gradient(90deg, var(--positive) 0 50%, var(--negative) 50%);
}

.context-layer-swatch.is-context {
  height: 2px;
  background: repeating-linear-gradient(90deg, #326ea8 0 6px, transparent 6px 9px);
}

.context-layer-swatch.is-background {
  height: 10px;
  background: linear-gradient(90deg, rgba(211, 47, 47, 0.45), rgba(19, 122, 77, 0.45));
}

.context-rebase-note {
  margin-left: auto;
  white-space: nowrap;
}

.chart-shell {
  position: relative;
  width: 100%;
  min-height: 340px;
  aspect-ratio: 16 / 6;
  overflow: hidden;
  background: var(--surface);
}

.strength-value-block {
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--grid);
  background: var(--surface);
}

.strength-value-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 0 16px 8px;
}

.strength-value-heading h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}

.strength-value-heading span {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.strength-value-shell {
  position: relative;
  width: 100%;
  height: 210px;
  overflow: hidden;
  background: var(--surface);
}

.strength-value-chart {
  display: block;
  width: 100%;
  height: 100%;
}

.strength-value-line {
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.strength-zero-line {
  stroke: var(--foreground);
  stroke-width: 1;
  stroke-dasharray: 4 4;
  opacity: 0.55;
  vector-effect: non-scaling-stroke;
}

.strength-value-tooltip {
  min-width: 190px;
}

.price-chart {
  display: block;
  width: 100%;
  height: 100%;
}

.tooltip {
  position: absolute;
  z-index: 3;
  min-width: 154px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: #20262b;
  color: #ffffff;
  pointer-events: none;
  font-size: 12px;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
}

.tooltip strong {
  font-weight: 500;
}

.tooltip .up {
  color: #ff8e91;
}

.tooltip .down {
  color: #65d3a7;
}

.axis-text,
.axis-title {
  fill: var(--muted);
  font-size: 12px;
}

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

.frame-line {
  stroke: var(--border);
  stroke-width: 1;
  fill: none;
  vector-effect: non-scaling-stroke;
}

.price-line {
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.context-chart-block .price-line {
  stroke-width: 2.1;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.95));
}

.context-index-line {
  fill: none;
  stroke: #326ea8;
  stroke-width: 1.55;
  stroke-dasharray: 7 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.92;
  vector-effect: non-scaling-stroke;
}

.context-index-marker {
  fill: #326ea8;
  stroke: var(--surface);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.hover-guide {
  stroke: var(--neutral);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.range-selector {
  margin-top: 34px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}

.range-instructions {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
}

.range-instructions strong {
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 500;
}

.range-instructions span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
  text-align: right;
}

.range-dates {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.range-shell {
  position: relative;
  width: 100%;
  height: 92px;
  overflow: visible;
  border: 1px solid var(--border);
  background: var(--surface);
  touch-action: none;
  user-select: none;
}

.range-overview {
  display: block;
  width: 100%;
  height: 100%;
}

.range-line {
  fill: none;
  stroke-width: 1.15;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.range-shade,
.range-selection,
.range-handle {
  position: absolute;
  top: 0;
  bottom: 0;
}

.range-shade {
  z-index: 1;
  background: rgba(24, 32, 38, 0.42);
  pointer-events: none;
}

.range-shade-start {
  left: 0;
}

.range-shade-end {
  right: 0;
}

.range-selection {
  z-index: 2;
  border-block: 2px solid var(--accent);
  background: rgba(240, 180, 41, 0.07);
  cursor: grab;
}

.range-selection:active,
.range-dragging .range-selection {
  cursor: grabbing;
}

.range-handle {
  z-index: 3;
  width: 18px;
  min-height: 0;
  padding: 0;
  transform: translateX(-50%);
  border: 2px solid #20262b;
  border-radius: 3px;
  background: #ffffff;
  box-shadow: 0 1px 4px rgba(24, 32, 38, 0.2);
  cursor: ew-resize;
}

.range-handle::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 24px;
  transform: translate(-50%, -50%);
  border-inline: 1px solid #68737d;
  content: "";
}

.range-handle:hover {
  background: #ffffff;
  border-color: var(--accent);
}

.range-handle:focus-visible {
  outline: 3px solid rgba(240, 180, 41, 0.4);
  outline-offset: 2px;
}

.context-progress-card {
  display: grid;
  min-height: 150px;
  align-content: center;
  gap: 18px;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(31, 42, 50, 0.06);
}

.context-progress-status {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--muted);
  font-size: 15px;
}

.context-progress-spinner {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border: 2px solid rgba(32, 38, 43, 0.16);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: progress-spin 0.9s linear infinite;
}

.context-progress-track {
  position: relative;
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(32, 38, 43, 0.1);
}

.context-progress-bar {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), #d98224);
  transition: width 300ms ease;
}

.context-progress-track.is-indeterminate .context-progress-bar {
  width: 38% !important;
  animation: progress-slide 1.4s ease-in-out infinite;
}

[data-progress-state="error"] .context-progress-spinner {
  border-color: var(--negative);
  animation: none;
}

[data-progress-state="error"] .context-progress-text {
  color: var(--negative);
}

.auth-page {
  min-height: 100vh;
  background: #20262b;
}

.auth-main {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding-block: 32px;
}

.login-card {
  width: min(420px, 100%);
  padding: 38px;
  border-top: 3px solid var(--accent);
  border-radius: 6px;
  background: var(--surface);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3);
}

.login-card h1 {
  margin-top: 28px;
  color: var(--foreground);
}

.login-card > p {
  margin-top: 8px;
  color: var(--muted);
  line-height: 1.6;
}

.login-form {
  display: grid;
  gap: 18px;
  margin-top: 28px;
}

.login-form .error {
  margin-top: 0;
}

.admin-main {
  display: grid;
  gap: 42px;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 16px;
}

.section-heading p {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
}

.account-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.account-create {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.4fr) 150px 110px;
  align-items: end;
  gap: 10px;
  margin-bottom: 14px;
}

select {
  width: 100%;
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--surface);
  color: var(--foreground);
  font: inherit;
}

.account-message {
  margin-bottom: 12px;
  padding: 9px 11px;
  border-left: 3px solid var(--accent);
  background: #fffaf0;
  color: var(--muted);
}

.account-message[data-state="success"] {
  border-color: var(--negative);
  background: #eef8f3;
  color: #126544;
}

.account-message[data-state="error"] {
  border-color: var(--positive);
  background: #fff0f0;
  color: #812127;
}

.account-table-shell {
  overflow-x: auto;
  border: 1px solid var(--border);
  background: var(--surface);
}

.account-table {
  width: 100%;
  min-width: 1080px;
  border-collapse: collapse;
  font-size: 13px;
}

.account-table th,
.account-table td {
  padding: 11px 13px;
  border-bottom: 1px solid var(--grid);
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.account-table th {
  background: #f7f8f9;
  color: var(--muted);
  font-weight: 500;
}

.account-table tbody tr:last-child td {
  border-bottom: 0;
}

.password-reset-form {
  display: grid;
  grid-template-columns: 180px 62px;
  gap: 7px;
}

.password-reset-form input,
.password-reset-form button {
  min-height: 34px;
}

.password-reset-form button {
  font-size: 12px;
}

.account-card {
  display: grid;
  gap: 6px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--surface);
}

.account-card strong {
  font-size: 16px;
  font-weight: 500;
}

.account-card span,
.account-card small {
  color: var(--muted);
}

.audit-filter {
  display: grid;
  grid-template-columns: 140px 190px 76px;
  gap: 8px;
}

.audit-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 13px;
}

.audit-pagination button {
  min-height: 34px;
  padding: 0 13px;
  font-size: 13px;
}

.audit-pagination label {
  display: flex;
  align-items: center;
  gap: 6px;
}

.audit-pagination select {
  width: 82px;
  min-height: 34px;
}

.pool-history-filter {
  display: grid;
  grid-template-columns: 150px 160px 76px;
  gap: 8px;
}

.pool-history-filter select,
.pool-history-filter input,
.pool-history-filter button {
  min-height: 38px;
}

.pool-history-summary {
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.history-stats-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 8px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.history-stats-heading > span {
  color: var(--muted);
}

.history-stats-shell {
  margin-bottom: 16px;
  overflow-x: auto;
  border: 1px solid var(--border);
  background: var(--surface);
}

.history-stats-table {
  width: 100%;
  min-width: 1240px;
  border-collapse: collapse;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.history-stats-table th,
.history-stats-table td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  white-space: nowrap;
}

.history-stats-table th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}

.history-stats-table tbody tr:last-child td {
  border-bottom: 0;
}

.history-benchmark-cell span {
  display: block;
  line-height: 1.55;
}

.history-benchmark-cell span:last-child {
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}

.audit-filter input,
.audit-filter button {
  min-height: 38px;
}

.audit-table-shell {
  overflow-x: auto;
  border: 1px solid var(--border);
  background: var(--surface);
}

.pool-history-table-shell {
  overflow-x: auto;
  border: 1px solid var(--border);
  background: var(--surface);
}

.audit-table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  font-size: 13px;
}

.pool-history-table {
  width: 100%;
  min-width: 1120px;
  border-collapse: collapse;
  font-size: 13px;
}

.audit-table th,
.audit-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--grid);
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}

.pool-history-table th,
.pool-history-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--grid);
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}

.audit-table th {
  background: #f7f8f9;
  color: var(--muted);
  font-weight: 500;
}

.pool-history-table th {
  background: #f7f8f9;
  color: var(--muted);
  font-weight: 500;
}

.audit-table tbody tr:last-child td {
  border-bottom: 0;
}

.pool-history-table tbody tr:last-child td {
  border-bottom: 0;
}

.pool-history-table td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.history-positive {
  color: var(--positive);
  font-weight: 600;
}

.history-negative {
  color: var(--negative);
  font-weight: 600;
}

.history-waiting,
.history-no-trade {
  color: var(--muted);
}

.audit-table td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.audit-target-link {
  color: inherit;
  font-weight: 600;
  text-decoration: none;
}

.audit-target-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

.status-success {
  color: var(--negative);
}

.status-error {
  color: var(--positive);
}

.empty-state {
  padding: 42px;
  color: var(--muted);
  text-align: center;
}

@keyframes progress-spin {
  to { transform: rotate(360deg); }
}

@keyframes progress-slide {
  from { transform: translateX(-120%); }
  to { transform: translateX(320%); }
}

@media (max-width: 720px) {
  .header-inner,
  main {
    width: min(100% - 24px, 1240px);
  }

  .header-inner {
    min-height: 82px;
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }

  .brand-mark {
    max-width: 145px;
    text-align: right;
  }

  .header-actions {
    width:100%;
    justify-content:flex-start;
    gap: 9px;
  }

  .header-nav { justify-content:flex-start; gap:8px 12px; }

  .current-user {
    display: none;
  }

  .controls {
    grid-template-columns: 1fr;
  }

  .strength-assumptions > div {
    grid-template-columns: 1fr;
  }

  .pool-section {
    padding: 18px 14px;
  }

  .pool-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .pool-refresh {
    text-align: left;
  }

  .pool-cards {
    grid-template-columns: 1fr;
  }

  .watchlist-controls,
  .account-create {
    grid-template-columns: 1fr;
  }

  .back-link {
    white-space: nowrap;
  }

  .overview {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .chart-group-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .chart-window-controls {
    width: 100%;
    justify-content: space-between;
  }

  .overview-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .chart-shell {
    min-height: 300px;
    aspect-ratio: auto;
  }

  .strength-value-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .strength-value-heading span {
    white-space: normal;
  }

  .strength-value-shell {
    height: 190px;
  }

  .range-selector {
    margin-top: 28px;
  }

  .range-instructions {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .range-instructions span {
    text-align: left;
  }

  .range-shell {
    height: 84px;
  }

  .range-handle {
    width: 22px;
  }

  .login-card {
    padding: 28px 22px;
  }

  .section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .account-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .audit-filter {
    grid-template-columns: 1fr;
  }

  .pool-history-filter {
    grid-template-columns: 1fr;
  }
}

/* Crypto indicator and on-demand backtest */
.crypto-controls { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; align-items:end; background:#fff; border:1px solid #dce2e7; border-radius:12px; padding:22px; margin-bottom:12px; }
.crypto-controls label { display:grid; gap:8px; color:#697783; font-size:14px; font-weight:600; }
.crypto-controls input,.crypto-controls select { min-width:0; height:48px; border:1px solid #ccd5dc; border-radius:8px; background:#fff; padding:0 12px; color:#20282d; font:inherit; }
.crypto-controls button { height:48px; white-space:nowrap; }
#crypto-query { grid-column:4 / 6; }
.crypto-symbol { min-width:170px; }
.crypto-cache-note { margin:0 0 18px; color:#687680; font-size:14px; }
.crypto-state { display:grid; gap:4px; text-align:right; }
.crypto-state span { color:#7a8790; font-size:13px; }
.crypto-state strong { font-size:22px; }
.crypto-chart-card,.crypto-backtest { position:relative; margin-top:18px; padding:22px; border:1px solid #dce2e7; border-radius:12px; background:#fff; }
.crypto-chart-card h3,.crypto-backtest h3 { margin:0 0 6px; }
.crypto-chart-card p { margin:0 0 14px; color:#74818a; }
.crypto-range-selector { margin:18px 0 20px; padding-top:16px; }
.crypto-range-help { display:flex; align-items:center; justify-content:flex-end; gap:12px; }
.crypto-range-help span { text-align:right; }
#crypto-range-reset { flex:0 0 auto; min-height:30px; padding:0 10px; border:1px solid #cbd4da; border-radius:5px; background:#fff; color:#53616b; font-size:12px; }
#crypto-range-reset:hover { border-color:#aab5bd; background:#f7f9fa; }
.crypto-range-line { fill:none; stroke:#536f83; stroke-width:1.15; vector-effect:non-scaling-stroke; }
.crypto-chart { display:block; width:100%; height:300px; overflow:visible; }
.crypto-strength-chart { height:190px; margin-top:12px; border-top:1px solid #edf0f2; }
.crypto-subchart-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:18px; color:#53616b; font-size:13px; }
.crypto-subchart-heading strong { color:#263037; font-size:15px; }
.crypto-ma-legend { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:5px 10px; }
.crypto-ma-legend button,.crypto-raw-legend { display:inline-flex; align-items:center; gap:5px; }
.crypto-ma-legend button { appearance:none; border:0; background:transparent; padding:3px 4px; color:inherit; font:inherit; cursor:pointer; border-radius:4px; }
.crypto-ma-legend button:hover { background:#eef2f4; }
.crypto-ma-legend button.is-disabled { opacity:.35; text-decoration:line-through; }
.crypto-ma-legend i { display:inline-block; width:18px; height:3px; border-radius:2px; }
.crypto-ma-legend .is-raw { background:#303a40; }
.crypto-ma-legend .is-ma10 { background:#e39a18; }
.crypto-ma-legend .is-ma20 { background:#2878c7; }
.crypto-ma-legend .is-ma40 { background:#8b55b5; }
.crypto-axis { fill:none; stroke:#cbd3d9; stroke-width:1; }
.crypto-zero { stroke:#98a4ad; stroke-dasharray:5 5; }
.crypto-axis-label { fill:#77838c; font-size:12px; }
.crypto-line-strong { stroke:#dc3438; stroke-width:2.2; }
.crypto-line-weak { stroke:#159368; stroke-width:2.2; }
.crypto-volume-bar { pointer-events:none; opacity:.2; }
.crypto-volume-bar.is-up { fill:#dc3438; }
.crypto-volume-bar.is-down { fill:#159368; }
.crypto-volume-label { fill:#87939b; font-size:11px; pointer-events:none; }
.crypto-strength-line { fill:none; stroke:#303a40; stroke-width:1.7; }
.crypto-ma10-line,.crypto-ma20-line,.crypto-ma40-line { fill:none; stroke-width:.9; }
.crypto-slope-line { fill:none; stroke-width:1.7; }
.crypto-ma10-line { stroke:#e39a18; }
.crypto-ma20-line { stroke:#2878c7; }
.crypto-ma40-line { stroke:#8b55b5; }
.crypto-slope-line { stroke:#455e72; }
.crypto-slope-chart { margin-top:8px; }
.crypto-trade-price-chart { height:240px; margin-top:8px; border-top:1px solid #edf0f2; }
.crypto-trade-marker { vector-effect:non-scaling-stroke; pointer-events:none; stroke:#fff; stroke-width:1.5; }
.crypto-trade-marker.is-entry.is-long { fill:#d42f34; }
.crypto-trade-marker.is-entry.is-short { fill:#0b8a60; }
.crypto-trade-marker.is-exit { fill:#f0b429; stroke:#303a40; }
.crypto-cursor { stroke:#20282d; stroke-width:1; stroke-dasharray:3 3; pointer-events:none; }
.crypto-hit { fill:transparent; cursor:crosshair; }
.crypto-tooltip { position:absolute; z-index:4; right:30px; top:72px; min-width:220px; display:grid; gap:5px; padding:11px 13px; border-radius:6px; color:#fff; background:rgba(23,29,33,.92); font-size:13px; pointer-events:none; }
.crypto-tooltip[hidden] { display:none; }
.crypto-backtest .overview-metrics { margin-top:18px; }
.crypto-summary-note { margin-top:8px; color:#6f7d86; font-size:13px; }
.crypto-mode-note { margin:18px 0 0; padding:12px 14px; border:1px solid #f0d59a; border-radius:8px; background:#fff9eb; color:#59451f; font-size:14px; line-height:1.6; }
.crypto-mode-note[hidden] { display:none; }
.crypto-mode-note button { margin-left:8px; padding:0; border:0; background:none; color:#155d8d; font:inherit; font-weight:600; text-decoration:underline; cursor:pointer; }
.crypto-side-summaries { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
.crypto-side-summaries[hidden] { display:none; }
.crypto-side-summaries > section { min-width:0; padding:18px; border:1px solid #e0e5e9; border-radius:10px; background:#fafbfc; }
.crypto-side-summaries h4 { margin:0; font-size:17px; }
.crypto-side-summaries p { margin-top:5px; color:#74818a; font-size:13px; }
.crypto-side-summaries .overview-metrics { margin-top:14px; }
.crypto-backtest details { margin-top:18px; }
.crypto-backtest tr.is-open-position td { background:#fff8e6; font-weight:500; }
.crypto-trade-table-shell { display:inline-block; width:auto; max-width:100%; margin-top:12px; overflow-x:auto; border:1px solid #dfe5e9; border-radius:8px; vertical-align:top; }
.crypto-trade-table { width:auto; min-width:780px; border-collapse:collapse; table-layout:auto; background:#fff; }
.crypto-trade-table th,.crypto-trade-table td { padding:12px 14px; border-bottom:1px solid #e4e9ec; text-align:left; vertical-align:middle; white-space:nowrap; }
.crypto-trade-table th { background:#f4f6f8; color:#5e6c76; font-size:13px; font-weight:600; }
.crypto-trade-table td { color:#263037; font-size:14px; font-variant-numeric:tabular-nums; }
.crypto-trade-table tbody tr:last-child td { border-bottom:0; }
.crypto-trade-table tbody tr:hover td { background:#f8fafb; }
.crypto-trade-table tbody tr.is-locatable { cursor:pointer; }
.crypto-trade-table tbody tr.is-locatable:focus-visible { outline:3px solid rgba(240,180,41,.45); outline-offset:-3px; }
.crypto-trade-table tbody tr.is-open-position:hover td { background:#fff4d6; }
.crypto-trade-table td.trade-profit { color:#d42f34; font-weight:600; }
.crypto-trade-table td.trade-loss { color:#0b8a60; font-weight:600; }
.trade-direction-badge { display:inline-flex; min-width:66px; align-items:center; justify-content:center; gap:4px; padding:4px 8px; border-radius:999px; font-size:13px; font-weight:700; }
.trade-direction-badge.is-long { color:#c82d32; background:#fff0f0; }
.trade-direction-badge.is-short { color:#087b58; background:#eaf8f2; }
@media (max-width:1200px) { .crypto-controls { grid-template-columns:repeat(3,minmax(150px,1fr)); } #crypto-query { grid-column:auto; } }
@media (max-width:720px) { .crypto-controls { grid-template-columns:1fr 1fr; } .crypto-controls button,#crypto-query { grid-column:1/-1; } .crypto-chart-card,.crypto-backtest { padding:14px; } .crypto-side-summaries { grid-template-columns:1fr; } }

/* Independent crypto engines and SMC workspace */
.crypto-engine-tabs,.smc-view-tabs { display:flex; gap:0; margin:0 0 18px; border-bottom:1px solid #d6dde2; }
.crypto-engine-tabs button,.smc-view-tabs button { appearance:none; border:0; border-bottom:3px solid transparent; background:transparent; padding:14px 24px; color:#65737d; font:inherit; font-size:16px; font-weight:600; cursor:pointer; }
.crypto-engine-tabs button.is-active,.smc-view-tabs button.is-active { border-bottom-color:#f5b51b; color:#20282d; }
.smc-controls { grid-template-columns:repeat(6,minmax(130px,1fr)) auto; }
.smc-parameters { grid-column:1/-1; border-top:1px solid #e5e9ec; padding-top:12px; }
.smc-parameters summary { color:#56646e; font-weight:600; cursor:pointer; }
.smc-parameters > div { display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)); gap:14px; margin-top:14px; }
.smc-view-tabs { margin-top:20px; background:#fff; border:1px solid #dce2e7; border-radius:10px 10px 0 0; }
.smc-chart-heading,.smc-backtest-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.smc-chart-tools { display:grid; justify-items:end; gap:10px; max-width:720px; }
.smc-bars-select { display:flex; align-items:center; gap:8px; color:#5d6b75; font-size:13px; white-space:nowrap; }
.smc-bars-select select { height:32px; border:1px solid #ccd5dc; border-radius:6px; background:#fff; padding:0 8px; color:#313b41; }
.smc-layers { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px 16px; color:#5d6b75; font-size:13px; }
.smc-layers label { white-space:nowrap; }
.smc-layer-stats { display:block; margin-top:8px; color:#87929a; font-size:12px; }
.smc-chart { height:480px; margin-top:10px; }
.smc-zone-bullish { fill:rgba(220,52,56,.11); stroke:rgba(220,52,56,.45); }
.smc-zone-bearish { fill:rgba(21,147,104,.11); stroke:rgba(21,147,104,.45); }
.smc-candle-up { stroke:#dc3438; stroke-width:1; }
.smc-candle-down { stroke:#159368; stroke-width:1; }
.smc-candle-up-fill { fill:#dc3438; }
.smc-candle-down-fill { fill:#159368; }
.smc-pivot-high { fill:#159368; stroke:#fff; stroke-width:1; }
.smc-pivot-low { fill:#dc3438; stroke:#fff; stroke-width:1; }
.smc-event-line { stroke-width:1; stroke-dasharray:4 5; opacity:.55; }
.smc-bullish { stroke:#dc3438; }
.smc-bearish { stroke:#159368; }
.smc-structure-line { stroke-width:1.2; stroke-dasharray:5 3; opacity:.75; }
.smc-event-marker { fill:#fff; stroke-width:2; }
.smc-event-label { fill:#3b474f; stroke:#f7f9fa; stroke-width:3px; paint-order:stroke; font-size:9px; font-weight:700; }
.smc-displacement { fill:#fff; stroke-width:2; }
.smc-reference-line { stroke:#6d78a8; stroke-width:1; stroke-dasharray:8 5; opacity:.65; }
.smc-liquidity-line { stroke:#d59a13; stroke-width:1.2; stroke-dasharray:3 3; }
.smc-strong-line { stroke:#303940; stroke-width:1.5; }
.smc-weak-line { stroke:#909aa1; stroke-width:1; stroke-dasharray:4 3; }
.smc-side-label { fill:#59656e; stroke:#fff; stroke-width:3px; paint-order:stroke; font-size:9px; font-weight:600; }
.smc-ob-bullish { fill:rgba(49,121,245,.09); stroke:rgba(49,121,245,.55); stroke-dasharray:4 2; }
.smc-ob-bearish { fill:rgba(178,40,51,.09); stroke:rgba(178,40,51,.55); stroke-dasharray:4 2; }
.smc-plan-line { stroke-width:1.5; stroke-dasharray:8 4; }
.smc-plan-入场 { stroke:#d79c0b; }
.smc-plan-止损 { stroke:#159368; }
.smc-plan-目标 { stroke:#dc3438; }
.smc-plan-label { fill:#333d43; font-size:11px; font-weight:600; }
.smc-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr); gap:18px; }
.smc-grid .crypto-backtest { min-width:0; }
.smc-evidence-note { margin:5px 0 13px; color:#74818a; font-size:13px; line-height:1.5; }
.smc-evidence-table th:nth-child(1),.smc-evidence-table td:nth-child(1) { width:64px; white-space:nowrap; }
.smc-evidence-table th:nth-child(2),.smc-evidence-table td:nth-child(2) { min-width:136px; }
.smc-evidence-table th:nth-child(3),.smc-evidence-table td:nth-child(3) { width:76px; white-space:nowrap; }
.smc-evidence-table td:nth-child(4) { min-width:210px; color:#5d6b75; font-size:13px; }
.smc-evidence-status { display:inline-flex; align-items:center; min-height:24px; padding:2px 8px; border-radius:999px; font-size:12px; font-weight:700; }
.smc-evidence-status.is-satisfied { color:#a5272b; background:#fde9ea; }
.smc-evidence-status.is-triggered { color:#fff; background:#d93439; }
.smc-evidence-status.is-waiting { color:#775a08; background:#fff3cd; }
.smc-evidence-status.is-expired,.smc-evidence-status.is-invalid { color:#08714e; background:#e1f3ec; }
.smc-evidence-status.is-filtered { color:#87550a; background:#f9ead1; }
.smc-evidence-status.is-disabled { color:#66737c; background:#e9edf0; }
.smc-status { margin-top:14px; }
.smc-backtest-heading p { margin:6px 0 0; color:#74818a; }
.smc-spot-note { max-width:280px; padding:7px 10px; border-radius:5px; color:#785b0b; background:#fff5d8; font-size:13px; }
.smc-help,.field-help { position:relative; }
.smc-help { cursor:help; }
.field-help { display:inline-grid; width:16px; height:16px; margin-left:3px; place-items:center; border:1px solid #98a5ae; border-radius:50%; color:#6f7c85; font-size:11px; font-weight:700; line-height:1; cursor:help; }
.smc-help::after,.field-help::after { content:attr(data-help); position:absolute; z-index:30; top:calc(100% + 9px); width:300px; padding:10px 12px; border-radius:7px; color:#fff; background:rgba(25,31,35,.96); box-shadow:0 5px 18px rgba(0,0,0,.2); font-size:12px; font-weight:400; line-height:1.55; white-space:normal; text-align:left; pointer-events:none; opacity:0; visibility:hidden; transform:translateY(-3px); transition:opacity .12s ease,transform .12s ease; }
.smc-help::after { right:0; }
.field-help::after { left:50%; transform:translate(-50%,-3px); }
.smc-help:hover::after,.smc-help:focus::after,.field-help:hover::after,.field-help:focus::after { opacity:1; visibility:visible; transform:translateY(0); }
.field-help:hover::after,.field-help:focus::after { transform:translate(-50%,0); }
@media (max-width:1200px) { .smc-controls { grid-template-columns:repeat(3,minmax(150px,1fr)); } }
@media (max-width:720px) {
  .crypto-engine-tabs button,.smc-view-tabs button { flex:1; padding:12px 8px; }
  .smc-controls,.smc-parameters > div,.smc-grid { grid-template-columns:1fr; }
  .smc-chart-heading,.smc-backtest-heading { flex-direction:column; }
  .smc-chart-tools { justify-items:start; max-width:none; }
  .smc-layers { justify-content:flex-start; }
}