:root {
  color-scheme: light;
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
  --app-max-width: 1760px;
  --sticky-topbar-height: 68px;
  background: #f5f7f6;
  color: #202724;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 320px;
  background:
    linear-gradient(180deg, rgba(24, 83, 109, 0.08), rgba(245, 247, 246, 0) 340px),
    #f5f7f6;
}

button,
input,
textarea {
  font: inherit;
}

button {
  border: 1px solid transparent;
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

input:disabled,
textarea:disabled,
select:disabled {
  cursor: not-allowed;
}

.shell {
  min-height: 100vh;
  padding: 24px;
}

.symbol-input {
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #ccd6d2;
  border-radius: 8px;
  background: #ffffff;
  color: #202724;
  box-shadow: 0 1px 0 rgba(27, 37, 34, 0.04);
}

.symbol-input:focus {
  outline: 2px solid rgba(24, 83, 109, 0.18);
  border-color: #18536d;
}

.symbol-input:disabled {
  border-color: #d5ddda;
  background: #edf1ef;
  color: #7c8984;
  opacity: 1;
  box-shadow: inset 0 0 0 1px rgba(27, 37, 34, 0.03);
}

.chip,
.icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border-radius: 8px;
  border: 1px solid #cfd9d5;
  border-color: #cfd9d5;
  background: #ffffff;
  color: #26302c;
  box-shadow: 0 1px 0 rgba(27, 37, 34, 0.04);
  text-decoration: none;
}

.chip {
  padding: 0 14px;
}

.chip:hover,
.icon-button:hover {
  border-color: #8ea39a;
}

.chip.active,
.icon-button.active {
  background: #18536d;
  border-color: #18536d;
  color: #ffffff;
}

.chip.primary {
  border-color: #18536d;
  background: #18536d;
  color: #ffffff;
  font-weight: 800;
}

.chip.primary:hover {
  border-color: #123f54;
  background: #123f54;
}

.icon-button {
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
}

.icon-button.compact {
  width: 34px;
  height: 34px;
  min-height: 34px;
}

.nav-icon {
  width: 20px;
  height: 20px;
}

.search-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  overflow: hidden;
  border: 1px solid #d8e1dd;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 46px rgba(27, 37, 34, 0.16);
}

.search-option {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border: 0;
  border-bottom: 1px solid #edf2f0;
  border-radius: 0;
  background: #ffffff;
  color: #202724;
  text-align: left;
  text-decoration: none;
}

.search-option:last-child {
  border-bottom: 0;
}

.search-option:hover,
.search-option:focus {
  background: #f3f7f5;
  outline: none;
}

.search-symbol {
  color: #202724;
  font-weight: 850;
}

.search-meta {
  flex: 0 0 auto;
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.search-status {
  padding: 13px 12px;
  color: #66736e;
  font-size: 0.9rem;
}

.search-status.error {
  color: #9a3d39;
  font-weight: 700;
}

.content {
  width: 100%;
  min-width: 0;
  max-width: var(--app-max-width);
  margin: 0 auto;
}

.panel {
  border: 1px solid #dce4e1;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 55px rgba(27, 37, 34, 0.08);
}

.result-panel {
  overflow: hidden;
}

.panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 18px;
  border-bottom: 1px solid #e5ece9;
}

.panel-title {
  margin: 0;
  font-size: 1rem;
}

.panel-kicker {
  margin: 4px 0 0;
  color: #66736e;
  font-size: 0.88rem;
}

.panel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.pipeline-run-controls {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pipeline-run-limit {
  width: 84px;
  min-height: 34px;
  padding: 6px 8px;
}

.pipeline-result-run-status {
  padding: 18px 18px 0;
}

.exchange-body {
  padding: 18px;
}

.symbols-body {
  display: grid;
  gap: 18px;
  padding: 18px;
}

.symbols-actions {
  align-items: end;
}

.symbols-exchange-field {
  display: grid;
  min-width: 150px;
  gap: 6px;
}

.symbols-exchange-field .symbol-input {
  min-height: 40px;
  text-transform: lowercase;
}

.screening-header {
  align-items: center;
}

.screening-title-block {
  min-width: 0;
}

.screening-eyebrow {
  display: block;
  margin-bottom: 6px;
  color: #18536d;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.screening-actions {
  align-items: end;
}

.screening-field {
  display: grid;
  min-width: 160px;
  gap: 6px;
}

.screening-field.compact {
  min-width: 124px;
  max-width: 146px;
}

.screening-field.date-field,
.screening-field.years-field,
.screening-field.risk-field {
  min-width: 156px;
  max-width: 176px;
}

.history-page {
  display: grid;
  gap: 18px;
}

.history-header {
  align-items: center;
}

.history-session-note {
  padding: 7px 10px;
  border: 1px solid #b7d5c7;
  border-radius: 999px;
  background: #f0faf5;
  color: #17664f;
  font-size: 0.76rem;
  font-weight: 800;
}

.history-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 14px;
  padding: 18px;
  background: #fbfcfb;
}

.history-field {
  display: grid;
  gap: 6px;
}

.history-field:nth-child(7) {
  grid-column: span 2;
}

.history-submit {
  align-self: end;
  min-height: 40px;
}

.history-metrics {
  margin: 0;
}

.history-type {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  background: #e7f5ef;
  color: #17664f;
  font-size: 0.76rem;
  font-weight: 800;
}

.history-type.sell {
  background: #fff0ed;
  color: #9a3d39;
}

.history-note {
  max-width: 220px;
  color: #66736e;
  overflow-wrap: anywhere;
}

.history-table-scroll {
  padding: 0 18px 18px;
}

.history-symbol-control {
  position: relative;
}

.history-symbol-control .search-dropdown {
  z-index: 10;
}

.search-name {
  min-width: 0;
  flex: 1 1 auto;
  color: #66736e;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.screening-field.setup-field {
  min-width: 292px;
  max-width: 340px;
}

.screening-field .symbol-input {
  min-height: 40px;
  text-transform: lowercase;
}

.screening-field .money-input {
  text-transform: none;
}

.screening-field.date-field .symbol-input,
.screening-field.years-field .symbol-input,
.screening-field.setup-field .symbol-input,
.screening-field.risk-field .symbol-input {
  text-transform: none;
}

.setup-checkbox-group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: 40px;
  gap: 6px;
}

.setup-checkbox {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid #cfd9d5;
  border-radius: 6px;
  background: #ffffff;
  color: #33423c;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  user-select: none;
}

.setup-checkbox.selected {
  border-color: #227c5a;
  background: #e7f5ef;
  color: #135f43;
}

.setup-checkbox:hover,
.setup-checkbox:focus-within {
  border-color: #79a998;
}

.setup-checkbox input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  accent-color: #227c5a;
}

.setup-pill-group {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.screening-command-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  border-bottom: 1px solid #e5ece9;
  background: #f8fbfa;
}

.screening-command-item {
  min-width: 0;
  padding: 14px 18px;
  border-right: 1px solid #e5ece9;
}

.screening-command-item:last-child {
  border-right: 0;
}

.screening-command-item span {
  display: block;
  color: #66736e;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.screening-command-item strong {
  display: block;
  margin-top: 5px;
  color: #202724;
  font-size: 1.08rem;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.screening-command-item p {
  margin: 5px 0 0;
  color: #66736e;
  font-size: 0.78rem;
}

.screening-body {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.screening-workspace {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.screening-history-rail,
.screening-detail-shell {
  min-width: 0;
}

.screening-history-panel {
  position: sticky;
  top: 18px;
}

.screening-section,
.screening-detail {
  display: grid;
  gap: 12px;
}

.screening-section {
  min-width: 0;
  padding: 14px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.screening-detail {
  align-content: start;
}

.screening-section-header {
  align-items: flex-start;
}

.screening-section-header span {
  text-align: right;
}

.manual-orders-section {
  border-color: #b7d5c7;
  background: #f6fbf8;
}

.manual-orders-table .strategy-reason {
  max-width: 360px;
}

.screening-toast {
  display: flex;
  align-items: center;
  gap: 8px 10px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border: 1px solid #cfe0d9;
  border-radius: 8px;
  background: #f5fbf8;
  color: #39423f;
}

.screening-toast strong {
  color: #202724;
}

.screening-toast.error {
  border-color: #e5b6af;
  background: #fff4f2;
  color: #9a3d39;
}

.screening-spinner {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  border: 2px solid #b8d7c8;
  border-top-color: #17664f;
  border-radius: 50%;
  animation: screening-spin 0.8s linear infinite;
}

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

.screening-run-cards {
  display: grid;
  gap: 10px;
  max-height: calc(100vh - 330px);
  overflow: auto;
  padding-right: 2px;
}

.screening-run-card {
  display: grid;
  width: 100%;
  gap: 8px;
  padding: 12px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #ffffff;
  color: #202724;
  text-align: left;
}

.screening-run-card:hover,
.screening-run-card:focus {
  border-color: #9bc4d3;
  background: #f7fbfc;
  outline: none;
}

.screening-run-card.active {
  border-color: #18536d;
  background: #eef6f8;
  box-shadow: inset 4px 0 0 #18536d;
}

.screening-run-card-top,
.screening-run-card-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.screening-run-id {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 900;
}

.screening-run-card-name {
  display: block;
  font-size: 0.95rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.screening-run-card-meta {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.screening-run-card-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.screening-run-card-stats > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border-radius: 8px;
  background: #f6f9f8;
}

.screening-run-card-stats span span {
  color: #66736e;
  font-size: 0.68rem;
  font-weight: 850;
  text-transform: uppercase;
}

.screening-run-card-stats strong,
.screening-run-card-stats .screening-r-value {
  color: #202724;
  font-size: 0.86rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.screening-run-overview,
.screening-empty-panel {
  min-width: 0;
  border: 1px solid #dbe7e2;
  border-radius: 8px;
  background: #f7fbfa;
}

.screening-run-overview {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.screening-run-overview-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.screening-run-heading-block {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.screening-run-heading {
  color: #202724;
  font-size: 1.24rem;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.screening-run-subtitle {
  color: #66736e;
  font-size: 0.82rem;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.screening-empty-panel {
  display: grid;
  min-height: 340px;
  align-content: center;
  justify-items: center;
  gap: 8px;
  padding: 32px;
  text-align: center;
}

.screening-empty-panel strong {
  font-size: 1rem;
}

.screening-empty-panel p {
  max-width: 520px;
  margin: 0;
  color: #66736e;
  line-height: 1.5;
}

.screening-metrics {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin-bottom: 0;
}

.screening-metrics .metric-card {
  min-height: 104px;
  background: #ffffff;
}

.screening-setup-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.screening-setup-groups {
  display: grid;
  gap: 10px;
}

.screening-setup-count-group {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.screening-setup-count-group-title {
  color: #202724;
  font-size: 0.82rem;
  font-weight: 850;
}

.screening-setup-count-group-hint {
  color: #66736e;
  font-size: 0.76rem;
  font-weight: 750;
}

.screening-setup-count {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 4px 10px 4px 4px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #ffffff;
}

.screening-setup-count.empty {
  width: fit-content;
  padding: 4px 10px;
  color: #66736e;
}

.screening-setup-count strong {
  color: #202724;
  font-size: 0.95rem;
}

.screening-table th,
.screening-table td {
  white-space: nowrap;
}

.screening-backtest-history {
  background: #ffffff;
}

.backtest-comparison-table .symbol-pill {
  min-width: 58px;
}

.backtest-comparison-table td:first-child {
  color: #66736e;
  font-size: 0.82rem;
  font-weight: 800;
}

.backtest-comparison-row {
  cursor: pointer;
}

.backtest-comparison-row:hover,
.backtest-comparison-row:focus {
  background: #eef6f8;
  outline: 2px solid rgba(24, 83, 109, 0.18);
  outline-offset: -2px;
}

.screening-backtest-equity,
.screening-backtest-trades,
.screening-backtest-notes {
  background: #ffffff;
}

.backtest-notes-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
  color: #39423f;
  line-height: 1.45;
}

.screening-signal {
  max-width: 380px;
}

tbody tr.screening-result-row.positive {
  background: #f4fbf7;
}

tbody tr.screening-result-row.positive:hover {
  background: #e6f5ec;
}

tbody tr.screening-result-row.negative {
  background: #fff6f5;
}

tbody tr.screening-result-row.negative:hover {
  background: #f7e4e1;
}

.screening-steps-panel {
  background: #ffffff;
}

.screening-step-list {
  display: grid;
  gap: 10px;
}

.screening-step-card {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.screening-step-card-head {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.screening-step-index {
  display: grid;
  width: 42px;
  height: 36px;
  place-items: center;
  border-radius: 8px;
  background: #eef6f8;
  color: #18536d;
  font-weight: 900;
}

.screening-step-title {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.screening-step-title strong {
  overflow-wrap: anywhere;
}

.screening-step-title span {
  color: #66736e;
  font-size: 0.76rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.screening-step-countline {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 4px;
  color: #66736e;
  white-space: nowrap;
}

.screening-step-countline strong {
  color: #202724;
}

.screening-step-progress {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6eeeb;
}

.screening-step-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #18536d;
}

.screening-step-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.screening-step-rule {
  display: block;
  color: #39423f;
  font-size: 0.84rem;
  line-height: 1.4;
}

.screening-step-math {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding-top: 9px;
  border-top: 1px dashed #d8e4df;
}

.screening-step-math-title {
  color: #202724;
  font-size: 0.8rem;
}

.screening-step-math ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 18px;
}

.screening-step-math li {
  color: #39423f;
  font-size: 0.8rem;
  line-height: 1.42;
  overflow-wrap: anywhere;
}

.screening-step-symbols {
  min-width: 0;
  border-top: 1px solid #e5ece9;
  padding-top: 9px;
}

.screening-step-symbols-summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: #66736e;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 800;
}

.screening-step-symbols-summary strong {
  color: #18536d;
  font-size: 0.84rem;
}

.screening-step-symbols-summary span {
  text-align: right;
}

.screening-step-symbols-table-wrap {
  max-height: 360px;
  margin-top: 10px;
  overflow: auto;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #ffffff;
}

.screening-step-symbols-table th,
.screening-step-symbols-table td {
  font-size: 0.78rem;
}

.screening-step-symbols-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8fbfa;
}

.screening-step-reason {
  display: block;
  min-width: 280px;
  max-width: 620px;
  color: #39423f;
  line-height: 1.35;
  white-space: normal;
}

.screening-step-symbols-empty {
  padding-top: 8px;
  border-top: 1px solid #e5ece9;
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.symbols-sync-summary .metric-grid {
  margin-bottom: 0;
}

.symbols-list {
  display: grid;
  gap: 12px;
}

.symbols-failures {
  margin-top: 12px;
  border-top: 1px solid #edf2f0;
}

.symbols-list-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.symbols-list-header strong {
  color: #202724;
  font-size: 0.95rem;
}

.symbols-list-header span {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.exchange-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.metric-card {
  min-width: 0;
  padding: 12px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #f7faf9;
}

.metric-card span {
  display: block;
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.metric-card strong {
  display: block;
  margin-top: 7px;
  color: #202724;
  font-size: 1.22rem;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.metric-card p {
  margin: 6px 0 0;
  color: #66736e;
  font-size: 0.78rem;
}

.strategy-result-body {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.strategy-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 390px);
  gap: 12px;
  align-items: stretch;
}

.strategy-hero-main,
.strategy-scorecard,
.strategy-highlight-card,
.strategy-section {
  min-width: 0;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.strategy-hero-main {
  display: grid;
  align-content: center;
  min-height: 170px;
  padding: 20px;
}

.strategy-eyebrow {
  display: inline-flex;
  margin-bottom: 10px;
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.strategy-hero-title {
  color: #202724;
  font-size: clamp(1.45rem, 2vw, 2.2rem);
  font-weight: 850;
  line-height: 1.1;
  max-width: 900px;
}

.strategy-hero-main p {
  max-width: 860px;
  margin: 12px 0 0;
  color: #39423f;
  line-height: 1.55;
}

.strategy-scorecard {
  display: grid;
  grid-template-rows: auto minmax(48px, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 170px;
  padding: 20px;
  border-left-width: 5px;
}

.strategy-scorecard span,
.strategy-metric-card span {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.strategy-scorecard strong {
  align-self: center;
  font-size: clamp(2rem, 3.8vw, 3.1rem);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.strategy-scorecard p,
.strategy-highlight-card p,
.strategy-metric-card p {
  margin: 0;
  color: #66736e;
  font-size: 0.86rem;
}

.strategy-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 10px;
  align-items: stretch;
}

.strategy-metric-card {
  display: grid;
  grid-template-rows: auto minmax(36px, 1fr) auto;
  align-items: start;
  min-width: 0;
  min-height: 126px;
  padding: 14px;
  border: 1px solid #e1e8e5;
  border-left-width: 4px;
  border-radius: 8px;
  background: #ffffff;
}

.strategy-metric-card strong {
  align-self: center;
  display: flex;
  min-width: 0;
  align-items: center;
  margin: 6px 0;
  color: #202724;
  font-size: clamp(1.22rem, 1.6vw, 1.52rem);
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.strategy-highlight-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
  align-items: stretch;
}

.strategy-highlight-card {
  display: grid;
  align-content: start;
  gap: 7px;
  padding: 14px;
  border-left-width: 4px;
}

.strategy-highlight-card strong {
  display: block;
  margin: 0;
  color: #202724;
  font-size: 0.95rem;
}

.strategy-scorecard.positive,
.strategy-metric-card.positive,
.strategy-highlight-card.positive {
  border-left-color: #16845a;
  background: #f4fbf7;
}

.strategy-scorecard.warning,
.strategy-metric-card.warning,
.strategy-highlight-card.warning {
  border-left-color: #c48b16;
  background: #fffaf0;
}

.strategy-scorecard.negative,
.strategy-metric-card.negative,
.strategy-highlight-card.negative {
  border-left-color: #b64d45;
  background: #fff6f5;
}

.strategy-scorecard.neutral,
.strategy-metric-card.neutral,
.strategy-highlight-card.neutral {
  border-left-color: #5d7480;
}

.positive-text {
  color: #17664f;
}

.negative-text {
  color: #9a3d39;
}

.strategy-section {
  padding: 14px;
}

.strategy-section-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.strategy-section-title strong {
  color: #202724;
  font-size: 0.96rem;
}

.strategy-section-title span {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 850;
}

.strategy-distribution {
  display: grid;
  gap: 10px;
}

.strategy-distribution-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.strategy-distribution-label span,
.strategy-distribution-label strong {
  display: block;
}

.strategy-distribution-label span {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.strategy-distribution-label strong {
  margin-top: 3px;
  color: #202724;
  font-size: 0.9rem;
}

.strategy-distribution-track {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8efec;
}

.strategy-distribution-fill {
  height: 100%;
  min-width: 2px;
  border-radius: inherit;
}

.strategy-distribution-fill.positive {
  background: #16845a;
}

.strategy-distribution-fill.warning {
  background: #c48b16;
}

.strategy-distribution-fill.negative {
  background: #b64d45;
}

.strategy-distribution-fill.neutral {
  background: #5d7480;
}

.strategy-trade-table th,
.strategy-trade-table td {
  white-space: nowrap;
}

.strategy-trade-row.positive {
  background: #f4fbf7;
}

.strategy-trade-row.positive:hover {
  background: #e6f5ec;
}

.strategy-trade-row.warning {
  background: #fffaf0;
}

.strategy-trade-row.warning:hover {
  background: #fff2d6;
}

.strategy-trade-row.negative {
  background: #fff6f5;
}

.strategy-trade-row.negative:hover {
  background: #f7e4e1;
}

.strategy-outcome-pill,
.strategy-setup-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 850;
}

.strategy-outcome-pill.positive,
.strategy-setup-pill.positive {
  background: #dff4e8;
  color: #17664f;
}

.strategy-outcome-pill.warning,
.strategy-setup-pill.warning {
  background: #fff1c2;
  color: #77540d;
}

.strategy-outcome-pill.negative,
.strategy-setup-pill.negative {
  background: #f5d9d5;
  color: #9a3d39;
}

.strategy-outcome-pill.neutral,
.strategy-setup-pill.neutral {
  background: #e8efec;
  color: #4c5a55;
}

.strategy-reason {
  display: block;
  max-width: 520px;
  overflow: hidden;
  color: #39423f;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pipeline-row td:last-child {
  display: flex;
  gap: 8px;
}

.table-scroll {
  overflow-x: auto;
}

.daily-report-body {
  padding: 18px;
}

.watchlist-body {
  padding: 18px;
}

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

.watchlist-history-metrics {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.history-toolbar {
  justify-content: flex-start;
}

.history-symbol-input {
  width: min(260px, 100%);
  flex: 0 1 260px;
}

.daily-report-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
}

.field-label {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.daily-report-date-select {
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #cfd9d5;
  border-radius: 8px;
  background: #ffffff;
  color: #202724;
  font: inherit;
  font-weight: 700;
}

.daily-report-section + .daily-report-section {
  margin-top: 22px;
}

.daily-report-section-title,
.daily-report-group-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.daily-report-section-title strong,
.daily-report-group-title strong {
  color: #202724;
  font-size: 0.95rem;
}

.daily-report-section-title span,
.daily-report-group-title span {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.daily-report-title-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.csv-export-link {
  min-height: 32px;
  padding: 0 10px;
  font-size: 0.78rem;
  font-weight: 800;
}

.daily-report-group {
  padding-top: 16px;
  border-top: 1px solid #edf2f0;
}

.daily-report-group + .daily-report-group {
  margin-top: 18px;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

th,
td {
  padding: 13px 16px;
  text-align: left;
  border-bottom: 1px solid #e7ecea;
  vertical-align: middle;
}

th {
  color: #66736e;
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

tbody tr:hover {
  background: #f4f8f7;
}

tbody tr.watchlist-row-green {
  background: #daf3e5;
}

tbody tr.watchlist-row-green:hover {
  background: #c2ebd4;
}

tbody tr.watchlist-row-yellow {
  background: #fff8d8;
}

tbody tr.watchlist-row-yellow:hover {
  background: #fff1b7;
}

tbody tr.watchlist-row-orange {
  background: #ffe7cf;
}

tbody tr.watchlist-row-orange:hover {
  background: #ffd7b1;
}

tbody tr.history-row-entry {
  background: #eef6f8;
}

tbody tr.history-row-entry:hover {
  background: #e1eff3;
}

tbody tr.history-row-setup {
  background: #fff7dd;
}

tbody tr.history-row-setup:hover {
  background: #fff0bf;
}

tbody tr.history-row-buy {
  background: #dff4e8;
}

tbody tr.history-row-buy:hover {
  background: #c9ecd8;
}

tbody tr.history-row-removed {
  background: #f9e6e3;
}

tbody tr.history-row-removed:hover {
  background: #f3d4cf;
}

tbody tr.pipeline-row.selected {
  background: #eef6f8;
}

tbody tr.pipeline-row.selected:hover {
  background: #e1eff3;
}

.symbol-pill {
  display: inline-flex;
  min-width: 64px;
  align-items: center;
  justify-content: center;
  padding: 6px 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #202724;
  color: #ffffff;
  font-weight: 800;
  text-decoration: none;
}

.symbol-link {
  border-color: transparent;
}

.symbol-link:hover {
  background: #18536d;
}

.symbol-follow-cell {
  width: 52px;
  text-align: center;
}

.follow-heart-button {
  display: inline-grid;
  width: 32px;
  height: 32px;
  min-height: 32px;
  place-items: center;
  padding: 0;
  border: 1px solid #d5ddda;
  border-radius: 8px;
  background: #ffffff;
  color: #77847f;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 1px 0 rgba(27, 37, 34, 0.04);
}

.follow-heart-button:hover,
.follow-heart-button:focus {
  border-color: #d66f83;
  color: #ba3653;
  outline: none;
}

.follow-heart-button.active {
  border-color: #d66f83;
  background: #fff0f3;
  color: #ba3653;
}

.follow-body {
  display: grid;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  gap: 12px;
  padding: 18px;
}

.follow-page.result-panel {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.follow-tag-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 0 18px 4px;
}

.follow-tag-control {
  display: grid;
  min-width: 190px;
  gap: 6px;
}

.follow-tag-control .follow-column-select {
  min-height: 38px;
}

.research-filter-panel {
  display: grid;
  gap: 12px;
  padding: 16px 18px 0;
}

.research-filter-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
}

.research-filter-heading strong {
  color: #26302c;
  font-size: 0.9rem;
}

.research-filter-heading span {
  color: #66736e;
  font-size: 0.78rem;
}

.research-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  max-width: 980px;
}

.research-filter-field {
  display: grid;
  gap: 6px;
}

.research-filter-field .symbol-input {
  width: 100%;
}

.follow-current-price-cell,
.portfolio-current-price-cell {
  font-weight: 850;
}

.portfolio-current-price-cell.green {
  color: #17664f;
  background: #edf7f1;
}

.portfolio-current-price-cell.yellow {
  color: #856a16;
  background: #fff8dc;
}

.portfolio-current-price-cell.red {
  color: #9a3d39;
  background: #fff0f3;
}

.portfolio-body,
.portfolio-content,
.portfolio-accounts {
  display: grid;
  gap: 16px;
}

.portfolio-body {
  padding: 18px;
}

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

.portfolio-account {
  overflow: hidden;
  border: 1px solid #e1e8e5;
  border-radius: 9px;
  background: #fff;
}

.portfolio-account-header > div {
  display: grid;
  gap: 3px;
}

.portfolio-account-meta {
  color: #66736e;
  font-size: 0.78rem;
}

.portfolio-table-scroll {
  border-top: 1px solid #e5ece9;
}

.portfolio-table th,
.portfolio-table td {
  white-space: nowrap;
}

.portfolio-positive {
  color: #17664f;
  font-weight: 800;
}

.portfolio-negative {
  color: #9a3d39;
  font-weight: 800;
}

@media (max-width: 800px) {
  .portfolio-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.follow-column-config {
  display: grid;
  max-width: 760px;
  gap: 10px;
  padding: 12px;
  border: 1px solid #d7e0dc;
  border-radius: 8px;
  background: #f7faf8;
}

.follow-column-config-heading {
  display: grid;
  gap: 3px;
}

.follow-column-config-heading strong {
  color: #26302c;
  font-size: 0.84rem;
}

.follow-column-config-heading span {
  color: #66736e;
  font-size: 0.78rem;
}

.follow-column-config-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.follow-column-config-row {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 6px;
  padding: 3px 4px 3px 9px;
  border: 1px solid #cfd9d5;
  border-radius: 7px;
  background: #ffffff;
}

.follow-column-config-label {
  color: #39423f;
  font-size: 0.8rem;
  font-weight: 800;
}

.follow-column-config-actions {
  display: inline-flex;
  gap: 3px;
}

.follow-column-config-actions .icon-button {
  width: 25px;
  height: 25px;
  min-height: 25px;
  border-radius: 5px;
  font-size: 0.9rem;
  font-weight: 900;
}

.follow-column-config-actions .icon-button.danger {
  color: #9a3d39;
}

.follow-column-config-actions .icon-button:disabled {
  cursor: default;
  opacity: 0.35;
}

.follow-column-add {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.follow-column-select {
  min-height: 34px;
  min-width: 210px;
  padding: 0 9px;
  border: 1px solid #cfd9d5;
  border-radius: 7px;
  background: #ffffff;
  color: #39423f;
  font: inherit;
  font-size: 0.82rem;
}

.follow-column-select:focus {
  border-color: #5d8a74;
  outline: none;
  box-shadow: 0 0 0 3px rgba(66, 122, 95, 0.12);
}

.follow-table-shell {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  contain: inline-size;
}

.follow-table-sticky-viewport {
  position: sticky;
  top: var(--sticky-topbar-height);
  z-index: 30;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
  background: #f4f7f6;
  box-shadow: inset 0 0 0 1px #dbe5e1, 0 5px 14px rgba(32, 39, 36, 0.1);
}

.follow-table-sticky-track {
  will-change: transform;
}

.follow-table-scroll {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
}

.follow-table {
  min-width: 100%;
  table-layout: fixed;
}

.follow-table-header-table,
.follow-table-body-table {
  margin: 0;
}

.follow-table-header-table {
  background: #f4f7f6;
}

.follow-table th,
.follow-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.follow-table th.follow-sort-header {
  position: relative;
  padding: 0;
  border: 0;
  border-right: 1px solid #dbe5e1;
  border-bottom: 1px solid #cbd8d3;
  background: transparent;
  color: #53615c;
  transition: background-color 140ms ease, box-shadow 140ms ease, color 140ms ease, opacity 140ms ease;
}

.follow-table th.follow-sort-header:last-child {
  border-right: 0;
}

.follow-table th.follow-sort-header:hover {
  background: #edf3f1;
  color: #18536d;
}

.follow-table th.follow-sort-level-1,
.follow-table th.follow-sort-level-2,
.follow-table th.follow-sort-level-3 {
  background: #eef6f8;
  color: #18536d;
  box-shadow: inset 0 -2px 0 #18536d;
}

.follow-table th.follow-sort-level-1:hover,
.follow-table th.follow-sort-level-2:hover,
.follow-table th.follow-sort-level-3:hover {
  background: #e4f0f3;
}

.follow-table th.follow-column-dragging {
  z-index: 2;
  background: #e3eef1;
  box-shadow: inset 0 0 0 2px #18536d;
  opacity: 0.62;
}

.follow-table th.follow-column-drag-active:not(.follow-column-dragging):hover {
  background: #e8f2f4;
  box-shadow: inset 3px 0 0 #18536d;
}

.follow-sort-button {
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  gap: 6px;
  padding: 7px 10px 7px 19px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-align: left;
  text-transform: inherit;
  cursor: pointer;
  container-type: inline-size;
}

.follow-sort-button:hover {
  color: #18536d;
}

.follow-sort-button:focus-visible {
  outline: 2px solid #18536d;
  outline-offset: -3px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8);
}

.follow-sort-label {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.follow-numeric-column .follow-sort-label {
  text-align: right;
}

.follow-table td.follow-numeric-cell {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.follow-sort-label-full,
.follow-sort-label-abbr {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.follow-sort-label-abbr {
  display: none;
  letter-spacing: 0.02em;
}

@container (max-width: 75px) {
  .follow-label-compact-at-75 .follow-sort-label-full {
    display: none;
  }

  .follow-label-compact-at-75 .follow-sort-label-abbr {
    display: block;
  }
}

@container (max-width: 90px) {
  .follow-label-compact-at-90 .follow-sort-label-full {
    display: none;
  }

  .follow-label-compact-at-90 .follow-sort-label-abbr {
    display: block;
  }
}

@container (max-width: 130px) {
  .follow-label-compact-at-130 .follow-sort-label-full {
    display: none;
  }

  .follow-label-compact-at-130 .follow-sort-label-abbr {
    display: block;
  }
}

@container (max-width: 150px) {
  .follow-label-compact-at-150 .follow-sort-label-full {
    display: none;
  }

  .follow-label-compact-at-150 .follow-sort-label-abbr {
    display: block;
  }
}

@container (max-width: 180px) {
  .follow-label-compact-at-180 .follow-sort-label-full {
    display: none;
  }

  .follow-label-compact-at-180 .follow-sort-label-abbr {
    display: block;
  }
}

@container (max-width: 210px) {
  .follow-label-compact-at-210 .follow-sort-label-full {
    display: none;
  }

  .follow-label-compact-at-210 .follow-sort-label-abbr {
    display: block;
  }
}

.follow-sort-arrows {
  position: relative;
  display: inline-flex;
  width: 24px;
  min-width: 24px;
  height: 24px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  color: #6f7d78;
  transition: color 140ms ease;
}

.follow-sort-level-1 .follow-sort-arrows,
.follow-sort-level-2 .follow-sort-arrows,
.follow-sort-level-3 .follow-sort-arrows {
  border-radius: 6px;
  background: #dcecf0;
  color: #18536d;
}

.follow-sort-button:hover .follow-sort-arrows {
  color: #18536d;
}

.follow-sort-icon {
  display: block;
  width: 18px;
  height: 18px;
}

.follow-sort-arrow {
  opacity: 0.45;
  transition: opacity 140ms ease;
}

.follow-sort-arrow.active {
  opacity: 1;
}

.follow-sort-rank {
  position: absolute;
  top: -5px;
  right: -5px;
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #18536d;
  color: #ffffff;
  box-shadow: 0 1px 2px rgba(24, 83, 109, 0.22);
  font-size: 0.62rem;
  font-weight: 900;
  line-height: 1;
}

.follow-column-drag-grip {
  position: absolute;
  top: 50%;
  left: 5px;
  z-index: 2;
  width: 12px;
  height: 25px;
  border-radius: 4px;
  background-image: radial-gradient(circle, currentColor 1.1px, transparent 1.3px);
  background-position: center;
  background-size: 4px 5px;
  color: #8a9993;
  cursor: grab;
  opacity: 0.2;
  transform: translateY(-50%);
  transition: background-color 140ms ease, color 140ms ease, opacity 140ms ease;
}

.follow-sort-header:hover .follow-column-drag-grip,
.follow-column-drag-grip:hover {
  background-color: rgba(24, 83, 109, 0.08);
  color: #18536d;
  opacity: 1;
}

.follow-column-dragging .follow-column-drag-grip {
  color: #18536d;
  cursor: grabbing;
  opacity: 1;
}

.follow-column-resize-handle {
  position: absolute;
  top: 4px;
  right: -5px;
  bottom: 4px;
  z-index: 4;
  width: 11px;
  cursor: col-resize;
  outline: none;
  touch-action: none;
}

.follow-column-resize-handle::after {
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  width: 1px;
  border-radius: 2px;
  background: #aab8b3;
  content: "";
  opacity: 0;
  transition: box-shadow 120ms ease, opacity 120ms ease, background-color 120ms ease, width 120ms ease;
}

.follow-column-resize-handle:hover::after,
.follow-column-resize-handle:focus-visible::after,
.follow-column-resize-handle.is-resizing::after {
  width: 2px;
  background: #18536d;
  box-shadow: 0 0 0 3px rgba(24, 83, 109, 0.13);
  opacity: 1;
}

@media (min-width: 1024px) {
  .follow-sort-button {
    min-height: 50px;
  }
}

body.follow-column-resizing,
body.follow-column-resizing * {
  cursor: col-resize !important;
  user-select: none !important;
}

.follow-tags-cell {
  overflow: visible !important;
  white-space: normal;
  vertical-align: top;
}

.follow-next-event-cell {
  white-space: normal !important;
}

.follow-next-event,
.follow-next-event-link {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: #26332e;
  line-height: 1.35;
}

.follow-next-event-link {
  text-decoration: none;
}

.follow-next-event-link:hover span {
  text-decoration: underline;
}

.follow-next-event strong,
.follow-next-event-link strong {
  flex: 0 0 auto;
  color: #18536d;
  font-size: 0.78rem;
}

.follow-next-event-empty {
  color: #8a9691;
}

.follow-tag-combobox {
  position: relative;
  width: 100%;
  max-width: 100%;
}

.follow-tag-input-shell {
  box-sizing: border-box;
  display: flex;
  width: 100%;
  min-height: 36px;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  overflow: hidden;
  border: 1px solid #cfd9d5;
  border-radius: 7px;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(32, 39, 36, 0.03);
}

.follow-tag-input-shell.active {
  border-color: #5d8a74;
  box-shadow: 0 0 0 3px rgba(66, 122, 95, 0.12);
}

.follow-tag-chip {
  display: inline-flex;
  flex: 0 1 auto;
  max-width: 130px;
  min-height: 25px;
  align-items: center;
  overflow: hidden;
  padding: 0 6px 0 8px;
  border: 1px solid #b7d4c5;
  border-radius: 7px;
  background: #edf7f1;
  color: #1f5d48;
  font-size: 0.78rem;
  font-weight: 800;
  gap: 5px;
  line-height: 1;
}

.follow-tag-chip:hover,
.follow-tag-chip:focus {
  border-color: #ba3653;
  background: #fff0f3;
  color: #9a3d39;
  outline: none;
}

.follow-tag-chip span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
}

.follow-tag-chip-remove {
  display: inline-grid;
  width: 15px;
  height: 15px;
  place-items: center;
  border-radius: 999px;
  background: rgba(23, 102, 79, 0.12);
  color: #17664f;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.follow-tag-search-input {
  box-sizing: border-box;
  flex: 1 1 74px;
  min-width: 74px;
  max-width: 100%;
  min-height: 25px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #39423f;
  font: inherit;
  font-size: 0.82rem;
}

.follow-tag-search-input::placeholder {
  color: #7a8580;
}

.follow-tag-search-input:focus {
  outline: none;
}

.follow-tag-search-input:disabled {
  background: transparent;
}

.follow-tag-suggestions {
  position: absolute;
  z-index: 40;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  max-height: 190px;
  overflow: auto;
  border: 1px solid #d7e0dc;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(32, 39, 36, 0.14);
}

.follow-tag-suggestion,
.follow-tag-suggestion-link,
.follow-tag-suggestion-status {
  display: flex;
  width: 100%;
  min-height: 34px;
  align-items: center;
  padding: 0 10px;
  color: #39423f;
  font-size: 0.84rem;
  text-align: left;
  text-decoration: none;
}

.follow-tag-suggestion {
  border: 0;
  background: #ffffff;
  font-weight: 800;
}

.follow-tag-suggestion:hover,
.follow-tag-suggestion:focus,
.follow-tag-suggestion-link:hover,
.follow-tag-suggestion-link:focus {
  background: #eef6f8;
  outline: none;
}

.follow-tag-suggestion-status {
  color: #66736e;
}

.follow-tag-suggestion-status.error {
  color: #9a3d39;
  font-weight: 700;
}

.tags-body {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.tags-create-row {
  display: grid;
  grid-template-columns: minmax(220px, 360px) auto;
  gap: 8px;
  align-items: center;
  justify-content: start;
}

.tags-name-input {
  min-height: 34px;
  padding-inline: 10px;
  font-size: 0.86rem;
}

.tags-table-scroll {
  overflow: auto;
}

.tags-table th,
.tags-table td {
  white-space: nowrap;
}

.tags-table td:first-child {
  min-width: 280px;
}

.tags-actions-cell {
  display: flex;
  gap: 8px;
}

.danger-chip {
  border-color: #efc6c1;
  background: #fff5f3;
  color: #9a3d39;
}

.inline-link {
  text-decoration: none;
}

.chart-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-top: 1px solid #e5ece9;
}

.symbol-chart-route .chart-panel {
  border-top: 0;
}

.chart-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.chart-summary {
  text-align: right;
}

.chart-header-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 10px;
}

.symbol-chart-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  padding-bottom: 14px;
  border-bottom: 1px solid #e5ece9;
}

.symbol-chart-identity {
  display: grid;
  min-width: 0;
  gap: 7px;
}

.symbol-chart-eyebrow {
  color: #18536d;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.symbol-chart-title-row,
.symbol-quote-strip,
.symbol-chart-action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.symbol-chart-title-row {
  gap: 10px;
}

.symbol-chart-title {
  color: #202724;
  font-size: clamp(1.65rem, 2vw, 2.35rem);
  line-height: 1;
  overflow-wrap: anywhere;
}

.symbol-chart-range-pill {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 0 9px;
  border: 1px solid #c8d8d1;
  border-radius: 999px;
  background: #eef6f2;
  color: #17664f;
  font-size: 0.76rem;
  font-weight: 900;
}

.symbol-quote-strip {
  gap: 8px 12px;
  min-height: 32px;
}

.symbol-quote-price {
  color: #202724;
  font-size: 1.24rem;
  line-height: 1;
}

.symbol-quote-change {
  font-size: 0.9rem;
  font-weight: 900;
}

.symbol-quote-strip .quote-positive {
  color: #17664f;
}

.symbol-quote-strip .quote-negative,
.symbol-quote-strip.quote-error {
  color: #9a3d39;
}

.symbol-quote-name,
.symbol-chart-date-range {
  color: #66736e;
}

.symbol-chart-controls {
  display: grid;
  justify-items: end;
  gap: 9px;
}

.symbol-chart-action-row {
  justify-content: flex-end;
  gap: 8px;
}

.compact-chip {
  min-height: 34px;
  padding: 0 12px;
}

.chart-range-control {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 3px;
  padding: 3px;
  border: 1px solid #d7e0dc;
  border-radius: 8px;
  background: #f5f8f6;
}

.chart-range-button {
  display: inline-flex;
  width: 42px;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 0 7px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #39423f;
  font-size: 0.78rem;
  font-weight: 800;
}

.chart-range-button:hover {
  border-color: #b7c6c0;
  background: #ffffff;
}

.chart-range-button.active {
  border-color: #18536d;
  background: #18536d;
  color: #ffffff;
}

.symbol-period-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.symbol-period-card {
  min-width: 0;
  padding: 12px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #f8fbfa;
}

.symbol-period-card span {
  display: block;
  color: #66736e;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.symbol-period-card strong {
  display: block;
  margin-top: 7px;
  color: #202724;
  font-size: clamp(0.98rem, 1vw, 1.18rem);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.symbol-period-card p {
  margin: 6px 0 0;
  color: #66736e;
  font-size: 0.76rem;
}

.symbol-period-card.positive strong {
  color: #17664f;
}

.symbol-period-card.negative strong {
  color: #9a3d39;
}

.chart-summary span,
.chart-summary strong {
  display: block;
}

.chart-summary span {
  color: #66736e;
  font-size: 0.78rem;
}

.chart-summary strong {
  margin-top: 4px;
  font-size: 0.95rem;
}

.chart-summary .quote-positive {
  color: #17664f;
  font-weight: 800;
}

.chart-summary .quote-negative,
.chart-summary .quote-error {
  color: #9a3d39;
  font-weight: 800;
}

.symbol-sync-status {
  margin-top: 7px;
  font-weight: 750;
}

.symbol-sync-status.success {
  color: #17664f;
}

.symbol-sync-status.error {
  color: #9a3d39;
}

.chart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(260px, 18vw, 380px);
  gap: 14px;
  align-items: stretch;
}

.chart-main {
  min-width: 0;
}

.chart-side {
  display: grid;
  gap: 12px;
  align-content: start;
  min-width: 0;
}

.candle-chart {
  display: block;
  width: 100%;
  height: auto;
  min-height: 300px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.indicators-panel,
.watchlist-detail-panel,
.education-history-panel {
  min-width: 0;
  padding: clamp(13px, 1vw, 18px);
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.watchlist-detail-panel {
  border-color: #cdded6;
  background: #f4faf7;
}

.education-history-panel {
  border-color: #bde6cd;
  background: #f4fbf7;
}

.education-history-list {
  display: grid;
  gap: 10px;
  max-height: 520px;
  overflow: auto;
  padding-right: 4px;
}

.education-session {
  border: 1px solid #d8ece0;
  border-radius: 8px;
  background: #ffffff;
}

.education-session.visible {
  border-color: #8dd2ad;
  box-shadow: inset 3px 0 0 #16a45f;
}

.education-session-head {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 10px;
  border-bottom: 1px solid #edf2f0;
}

.session-eye-button {
  width: 34px;
  height: 34px;
  min-height: 34px;
  color: #65716c;
}

.session-eye-button.active {
  background: #17664f;
  border-color: #17664f;
  color: #ffffff;
}

.education-session-title {
  min-width: 0;
}

.education-session-title strong,
.education-session-title span {
  display: block;
}

.education-session-title strong {
  color: #202724;
  font-size: 0.86rem;
  overflow-wrap: anywhere;
}

.education-session-title span {
  margin-top: 3px;
  color: #66736e;
  font-size: 0.76rem;
  font-weight: 800;
}

.education-session-events {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.education-history-item {
  padding: 10px;
  border: 1px solid #d8ece0;
  border-radius: 8px;
  background: #ffffff;
}

.education-history-item.buy-card {
  border-color: #9edbb8;
  background: #fbfffc;
}

.education-history-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.education-history-item-head strong {
  font-size: 0.88rem;
}

.education-history-reason {
  margin-top: 8px;
  color: #39423f;
  font-size: 0.78rem;
  line-height: 1.35;
}

.trade-outcome {
  margin-top: 9px;
  padding: 9px;
  border: 1px solid #d8e1dd;
  border-radius: 8px;
  background: #f8faf9;
}

.trade-outcome.win {
  border-color: #9edbb8;
  background: #eefaf3;
}

.trade-outcome.loss {
  border-color: #e3aaa3;
  background: #fff1ef;
}

.trade-outcome.open {
  border-color: #d9c789;
  background: #fff9e6;
}

.trade-outcome.invalid {
  border-color: #d8dfdb;
  background: #f1f4f2;
}

.trade-outcome-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.trade-outcome-section-title {
  margin-bottom: 7px;
  color: #202724;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.trade-outcome-head strong {
  font-size: 0.84rem;
}

.trade-outcome-head span {
  color: #202724;
  font-size: 0.82rem;
  font-weight: 900;
}

.trade-outcome-reason {
  margin-top: 8px;
  color: #39423f;
  font-size: 0.76rem;
  line-height: 1.35;
}

.indicators-title {
  color: #202724;
  font-size: 0.9rem;
  font-weight: 850;
}

.indicators-date,
.indicators-footnote,
.indicator-empty {
  color: #66736e;
  font-size: 0.78rem;
}

.indicators-date {
  margin-top: 4px;
  margin-bottom: 10px;
}

.indicator-empty {
  margin-top: 10px;
}

.indicators-error .indicator-empty {
  color: #9a3d39;
  font-weight: 700;
}

.indicator-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid #edf2f0;
}

.indicator-row span {
  color: #66736e;
  font-size: 0.78rem;
  font-weight: 800;
}

.indicator-row strong {
  color: #202724;
  font-size: 0.88rem;
  overflow-wrap: anywhere;
  text-align: right;
}

.indicator-row strong.indicator-bullish {
  color: #17664f;
}

.indicator-row strong.indicator-watchlist {
  color: #9a6a00;
}

.indicator-row strong.indicator-bearish {
  color: #9a3d39;
}

.strict-buy-panel {
  display: grid;
  gap: 9px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #dce7e2;
}

.strict-buy-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.strict-buy-title {
  color: #202724;
  font-size: 0.88rem;
  font-weight: 900;
}

.strict-buy-next-action,
.strict-buy-reason,
.strict-buy-check-details {
  color: #52605b;
  font-size: 0.76rem;
  line-height: 1.35;
}

.strict-buy-next-action {
  margin-top: 4px;
}

.strict-buy-status {
  flex: 0 0 auto;
  max-width: 150px;
  padding: 5px 8px;
  border-radius: 7px;
  background: #eef2f0;
  color: #52605b;
  font-size: 0.72rem;
  line-height: 1.15;
  text-align: center;
  overflow-wrap: anywhere;
}

.strict-buy-status.ready {
  background: #ddf3e8;
  color: #17664f;
}

.strict-buy-status.watching {
  background: #fff2cc;
  color: #8a5f00;
}

.strict-buy-status.blocked {
  background: #f8e3e1;
  color: #9a3d39;
}

.strict-buy-check {
  display: grid;
  gap: 5px;
  padding: 9px 0;
  border-top: 1px solid #edf2f0;
}

.strict-buy-check-head,
.strict-buy-check-values {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.strict-buy-check-head span {
  color: #202724;
  font-size: 0.78rem;
  font-weight: 850;
}

.strict-buy-check-head strong {
  font-size: 0.72rem;
  font-weight: 900;
}

.strict-buy-check.pass .strict-buy-check-head strong {
  color: #17664f;
}

.strict-buy-check.fail .strict-buy-check-head strong {
  color: #9a3d39;
}

.strict-buy-check.unknown .strict-buy-check-head strong {
  color: #8a5f00;
}

.strict-buy-check-values span {
  min-width: 0;
  color: #66736e;
  font-size: 0.72rem;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.strict-buy-check-values span:last-child {
  text-align: right;
}

.indicators-footnote {
  margin-top: 10px;
}

.status-pill {
  display: inline-flex;
  min-width: 82px;
  justify-content: center;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 800;
}

.status-pill.ok {
  background: #e4f1eb;
  color: #17664f;
}

.status-pill.warning {
  background: #fff1ce;
  color: #765f12;
}

.status-pill.error {
  background: #f5d9d5;
  color: #9a3d39;
}

.status-pill.off {
  background: #ecefed;
  color: #65716c;
}

.screening-status-pill {
  min-width: 0;
  white-space: nowrap;
}

.screening-watchlist-status-pill {
  min-width: 96px;
  white-space: nowrap;
}

.screening-status-axis-pill {
  min-width: 72px;
  white-space: nowrap;
}

.cron-date-grid {
  display: grid;
  min-width: 300px;
  grid-template-columns: repeat(2, minmax(135px, 1fr));
  gap: 10px;
}

.cron-date-field {
  min-width: 0;
}

.cron-date-field .field-label {
  display: block;
  margin-bottom: 6px;
}

.pipeline-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.05fr);
  gap: 22px;
  padding: 22px;
}

.pipeline-list-page-body,
.pipeline-editor-page-body {
  padding: 22px;
}

.pipeline-editor-page-body {
  max-width: var(--app-max-width);
}

.pipeline-list,
.pipeline-editor {
  min-width: 0;
}

.pipeline-list {
  padding: 14px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.pipeline-editor {
  display: grid;
  align-content: start;
  gap: 16px;
  padding: 18px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.pipeline-section-title {
  margin-bottom: 10px;
  color: #202724;
  font-size: 0.88rem;
  font-weight: 850;
}

.pipeline-editor .pipeline-section-title {
  margin-bottom: 0;
}

.pipeline-field {
  display: grid;
  gap: 7px;
}

.pipeline-select {
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #cfd9d5;
  border-radius: 8px;
  background: #ffffff;
  color: #202724;
  font: inherit;
  font-weight: 700;
}

.pipeline-step-builder {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 16px;
  border: 1px solid #e5ece9;
  border-radius: 8px;
  background: #ffffff;
}

.pipeline-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pipeline-builder-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.pipeline-builder-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.pipeline-builder-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pipeline-builder-grid.compact {
  grid-template-columns: minmax(120px, 0.42fr) minmax(0, 1fr);
}

.pipeline-builder-stack {
  display: grid;
  gap: 12px;
}

.pipeline-builder-json {
  min-height: 120px;
  max-height: 230px;
}

.pipeline-filter-json {
  min-height: 230px;
}

.pipeline-schema-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.pipeline-schema-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.pipeline-schema-json {
  min-height: 110px;
  max-height: 260px;
}

.pipeline-template-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #d8e7e2;
  border-radius: 8px;
  background: #f7fbfa;
}

.pipeline-template-groups {
  display: grid;
  gap: 10px;
}

.pipeline-template-group {
  display: grid;
  gap: 6px;
}

.pipeline-template-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pipeline-template-input-wrap {
  position: relative;
  min-width: 0;
}

.pipeline-template-input-wrap > .symbol-input,
.pipeline-template-input-wrap > .json-output {
  width: 100%;
}

.pipeline-template-autocomplete {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  max-height: 240px;
  overflow: auto;
  border: 1px solid #cbded8;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 38px rgba(27, 37, 34, 0.16);
}

.pipeline-template-option {
  display: flex;
  width: 100%;
  min-height: 36px;
  align-items: center;
  justify-content: flex-start;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid #edf2f0;
  border-radius: 0;
  background: #ffffff;
  color: #202724;
  font-family: "Cascadia Mono", Consolas, "Liberation Mono", monospace;
  font-size: 0.82rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
  text-align: left;
}

.pipeline-template-option:last-child {
  border-bottom: 0;
}

.pipeline-template-option:hover,
.pipeline-template-option:focus {
  background: #eef6f8;
  outline: none;
}

.filter-condition-list {
  display: grid;
  gap: 12px;
}

.filter-condition {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #fbfcfb;
}

.filter-condition-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.filter-condition-header strong {
  font-size: 0.86rem;
}

.filter-condition-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 0.32fr) minmax(0, 1.35fr);
  gap: 10px;
  align-items: end;
}

.filter-right-control {
  display: grid;
  gap: 8px;
}

.filter-right-control.field-mode {
  grid-template-columns: minmax(92px, 0.35fr) minmax(0, 1fr);
}

.filter-right-control.value-mode {
  grid-template-columns: minmax(92px, 0.35fr) minmax(92px, 0.35fr) minmax(0, 1fr);
}

.filter-right-control .filter-right-kind {
  min-width: 0;
}

.filter-right-control .filter-value-type {
  min-width: 0;
}

.filter-right-control .filter-right-input {
  min-width: 0;
}

.filter-right-control .pipeline-template-input-wrap {
  min-width: 0;
}

.filter-template-group {
  display: grid;
  gap: 6px;
}

.filter-template-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pipeline-preview-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  padding: 16px;
  border: 1px solid #e5ece9;
  border-radius: 8px;
  background: #ffffff;
}

.pipeline-preview-content {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.pipeline-preview-output {
  min-width: 0;
}

.pipeline-preview-sections {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.pipeline-preview-json {
  min-height: 220px;
  max-height: 520px;
}

.pipeline-preview-json.compact {
  min-height: 120px;
  max-height: 260px;
}

.pipeline-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pipeline-steps-workspace {
  display: grid;
  grid-template-columns: minmax(260px, 0.7fr) minmax(360px, 1.05fr) minmax(360px, 1fr);
  gap: 16px;
  align-items: stretch;
  max-height: calc(100vh - 260px);
  min-height: 520px;
}

.pipeline-configured-steps {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
  gap: 10px;
  min-width: 0;
  min-height: 0;
  padding: 16px;
  overflow: hidden;
  border: 1px solid #e5ece9;
  border-radius: 8px;
  background: #ffffff;
}

.pipeline-step-list {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 4px;
}

.pipeline-step-card {
  display: grid;
  gap: 8px;
}

.pipeline-step-card.map {
  padding: 8px;
  border: 1px solid #dce8e4;
  border-radius: 8px;
  background: #f8fbfa;
}

.pipeline-step-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid #e1e8e5;
  border-radius: 8px;
  background: #ffffff;
  cursor: pointer;
}

.pipeline-step-row.selected {
  border-color: #9bc4d3;
  background: #eef6f8;
}

.pipeline-step-row.nested {
  padding: 8px;
  background: #ffffff;
}

.pipeline-step-children {
  display: grid;
  gap: 8px;
  padding-left: 18px;
  border-left: 2px solid #dce8e4;
}

.pipeline-step-select {
  display: grid;
  min-width: 0;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  text-decoration: none;
}

.pipeline-step-select.readonly {
  cursor: default;
}

.icon-button {
  min-width: 34px;
  width: 34px;
  padding-inline: 0;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
}

.chip.danger {
  border-color: #f1c8c8;
  background: #fff7f7;
  color: #9f2f2f;
}

.chip.danger:hover {
  background: #fdeeee;
}

.pipeline-step-index {
  display: grid;
  width: 42px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: #eef6f8;
  color: #18536d;
  font-weight: 850;
}

.pipeline-step-copy {
  min-width: 0;
}

.pipeline-step-copy strong {
  display: block;
  overflow-wrap: anywhere;
}

.pipeline-step-select .status-pill {
  grid-column: 2;
  justify-self: start;
  margin-top: 6px;
}

.setup-pill {
  display: inline-flex;
  min-width: 118px;
  justify-content: center;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 850;
  white-space: nowrap;
}

.setup-pill.green {
  background: #96dfb4;
  color: #064629;
}

.setup-pill.yellow {
  background: #ffe98f;
  color: #6f5900;
}

.setup-pill.orange {
  background: #ffbd83;
  color: #743900;
}

.setup-pill.off {
  background: #ecefed;
  color: #65716c;
}

.screening-setup-pill {
  min-width: 96px;
}

.screening-r-value {
  color: #52605b;
  font-weight: 900;
}

.screening-r-value.positive {
  color: #17664f;
}

.screening-r-value.negative {
  color: #9a3d39;
}

.missing-count-pill {
  display: inline-grid;
  min-width: 32px;
  height: 28px;
  place-items: center;
  border-radius: 8px;
  background: #f5d9d5;
  color: #8f312f;
  font-size: 0.82rem;
  font-weight: 850;
}

.missing-count-pill.missing-count-zero {
  background: #dff4e8;
  color: #17664f;
}

.watchlist-missing-labels {
  max-width: 220px;
  overflow-wrap: anywhere;
}

.history-event-pill {
  display: inline-flex;
  min-width: 86px;
  justify-content: center;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 850;
  white-space: nowrap;
}

.history-event-pill.entry {
  background: #c9e7ef;
  color: #174d5c;
}

.history-event-pill.setup {
  background: #ffe28c;
  color: #705800;
}

.history-event-pill.buy {
  background: #99dfb7;
  color: #06462a;
}

.history-event-pill.removed {
  background: #ecaaa2;
  color: #73261f;
}

.history-event-pill.off {
  background: #ecefed;
  color: #65716c;
}

.history-reason {
  display: block;
  max-width: 520px;
  overflow: hidden;
  color: #39423f;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.block {
  display: block;
  margin-top: 4px;
}

.muted {
  color: #66736e;
  font-size: 0.84rem;
}

.empty-state,
.error-state,
.success-state {
  padding: 22px 18px;
  color: #66736e;
}

.empty-state.compact,
.error-state.compact,
.success-state.compact {
  padding: 12px 0;
}

.error-state {
  color: #9a3d39;
  font-weight: 700;
}

.success-state {
  color: #17664f;
  font-weight: 700;
}

.trigger-output {
  padding: 18px;
  border-top: 1px solid #e5ece9;
}

.json-title {
  margin-bottom: 8px;
  color: #39423f;
  font-weight: 800;
}

.json-output {
  width: 100%;
  min-height: 180px;
  max-height: 360px;
  margin: 0;
  padding: 14px;
  overflow: auto;
  border: 1px solid #d8dfdb;
  border-radius: 8px;
  background: #fbfcfb;
  color: #202724;
  font-family: "Cascadia Mono", Consolas, "Liberation Mono", monospace;
  font-size: 0.84rem;
  line-height: 1.5;
}

@media (min-width: 1800px) {
  :root {
    --app-max-width: 1920px;
  }

  .shell {
    padding: 32px;
  }

  .chart-panel,
  .exchange-body,
  .panel-header,
  .trigger-output {
    padding: 22px;
  }

  .chart-layout {
    gap: 18px;
  }

  .candle-chart {
    min-height: 520px;
  }
}

@media (min-width: 2600px) {
  :root {
    --app-max-width: 2320px;
  }

  .shell {
    padding: 40px;
  }

  .chart-layout {
    grid-template-columns: minmax(0, 1fr) 420px;
    gap: 22px;
  }

  .candle-chart {
    min-height: 680px;
  }

  .metric-grid {
    gap: 14px;
  }
}

@media (min-width: 3400px) {
  :root {
    --app-max-width: 2880px;
  }

  .chart-layout {
    grid-template-columns: minmax(0, 1fr) 460px;
  }

  .candle-chart {
    min-height: 780px;
  }
}

@media (max-width: 820px) {
  :root {
    --sticky-topbar-height: 172px;
  }

  .shell {
    padding: 16px;
  }

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

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

  .strategy-hero {
    grid-template-columns: 1fr;
  }

  .strategy-metric-grid,
  .strategy-highlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .strategy-distribution-row {
    grid-template-columns: 1fr;
  }

  .chart-layout {
    grid-template-columns: 1fr;
  }

  .symbol-chart-top {
    grid-template-columns: 1fr;
  }

  .symbol-chart-controls {
    justify-items: start;
  }

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

  .chart-header {
    display: grid;
  }

  .chart-header-actions {
    justify-content: flex-start;
  }

  .chart-summary {
    text-align: left;
  }

  .screening-header {
    display: grid;
  }

  .screening-command-strip {
    grid-template-columns: 1fr;
  }

  .screening-command-item {
    border-right: 0;
    border-bottom: 1px solid #e5ece9;
  }

  .screening-command-item:last-child {
    border-bottom: 0;
  }

  .screening-workspace {
    grid-template-columns: 1fr;
  }

  .screening-history-panel {
    position: static;
  }

  .screening-run-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: none;
  }

  .screening-run-overview-head {
    display: grid;
  }

  .pipeline-layout {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .pipeline-list-page-body,
  .pipeline-editor-page-body {
    padding: 16px;
  }

  .pipeline-builder-grid {
    grid-template-columns: 1fr;
  }

  .pipeline-builder-grid.compact {
    grid-template-columns: 1fr;
  }

  .filter-condition-row,
  .filter-right-control {
    grid-template-columns: 1fr;
  }

  .pipeline-steps-workspace {
    grid-template-columns: 1fr;
    max-height: none;
    min-height: 0;
  }

  .pipeline-configured-steps {
    max-height: 45vh;
  }

  .pipeline-step-row {
    grid-template-columns: 1fr;
  }

  .pipeline-step-row .chip {
    justify-self: start;
  }
}

@media (min-width: 821px) and (max-width: 1279px) {
  :root {
    --sticky-topbar-height: 172px;
  }
}

@media (max-width: 560px) {
  th,
  td {
    padding: 11px;
  }

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

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

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

  .history-field:nth-child(7) {
    grid-column: auto;
  }

  .history-header {
    display: grid;
  }

  .history-session-note {
    justify-self: start;
  }

  .strategy-metric-grid,
  .strategy-highlight-grid {
    grid-template-columns: 1fr;
  }

  .strategy-result-body {
    padding: 14px;
  }

  .screening-body {
    padding: 14px;
  }

  .screening-actions {
    justify-content: stretch;
  }

  .screening-field,
  .screening-field.compact {
    min-width: 0;
    max-width: none;
    flex: 1 1 100%;
  }

  .screening-actions .chip {
    flex: 1 1 140px;
  }

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

  .symbol-period-grid {
    grid-template-columns: 1fr;
  }

  .chart-range-control {
    width: 100%;
  }

  .chart-range-button {
    flex: 1 1 40px;
  }

  .screening-run-card-stats {
    grid-template-columns: 1fr;
  }

  .screening-step-card-head {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .screening-step-countline {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .screening-section-header {
    display: grid;
  }

  .screening-section-header span {
    text-align: left;
  }

}