/* Strategy layouts inherit the desk's shared typography, surfaces, and theme tokens. */
[hidden] { display: none !important; }
#strategy-content { grid-template-columns: minmax(0, 1fr); }
#strategy-content > * { min-width: 0; }

.sa-breadcrumb, .sa-card-top, .sa-tags, .sa-control-group { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.sa-breadcrumb { padding: 4px 4px 0; color: var(--site-muted); font-size: .88rem; }
.sa-breadcrumb a, .sa-research-link { color: var(--site-accent-soft); }
.sa-library-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.sa-strategy-card, .sa-next-card { display: grid; gap: 20px; align-content: start; padding: 28px; }
.sa-card-top { justify-content: space-between; }
.sa-strategy-card .card-title, .sa-next-card .card-title { font-size: clamp(2rem, 3vw, 3rem); }
.sa-strategy-card .cta { justify-self: start; }
.sa-tags { color: var(--site-muted); font-size: .8rem; }
.sa-tags span { border: 1px solid var(--site-line); border-radius: 999px; padding: 8px 12px; }
.sa-next-card { border-style: dashed; }
.sa-status { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border: 1px solid var(--site-line-strong); border-radius: 999px; color: var(--site-muted); font-size: .78rem; white-space: nowrap; }
.sa-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.sa-status[data-state="signal"] { color: var(--site-accent-soft); background: rgba(183, 139, 81, .12); }
.sa-status[data-state="watch"] { color: #b3c2a7; border-color: rgba(134, 145, 125, .45); }
.sa-status[data-state="error"] { color: #edb29f; border-color: rgba(169, 95, 73, .65); }
.sa-publication { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.sa-publication .panel-copy { margin-top: 10px; }
.sa-date-value { font-size: 1.05rem; line-height: 1.55; }
.sa-rule-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.sa-rule-grid .snapshot-value { white-space: normal; }
.sa-method-notes { margin-top: 18px; white-space: pre-wrap; }
.sa-controls { margin-bottom: 18px; }
.sa-controls .search-shell > span { flex-shrink: 0; white-space: nowrap; }
#rsi-monitor, #backtest-research { scroll-margin-top: 180px; }
.sa-control-group { align-items: end; }
.sa-select-label { display: grid; gap: 8px; min-width: 160px; }
.sa-select-label select { min-height: 48px; max-width: 100%; width: 100%; padding: 10px 36px 10px 12px; border: 1px solid var(--site-line-strong); border-radius: var(--site-radius-md); background: var(--site-panel); color: var(--site-text); font: inherit; }
.sa-table-caption { padding: 16px; text-align: left; color: var(--site-muted); font-size: .85rem; line-height: 1.6; }
.sa-monitor-table, .sa-performance-table { font-size: .9rem; font-variant-numeric: tabular-nums; }
.sa-monitor-table { min-width: 950px; }
.sa-performance-table { min-width: 850px; }
.sa-monitor-table th, .sa-performance-table th { font-size: .76rem; letter-spacing: .04em; }
.sa-monitor-table td:nth-child(2) { min-width: 128px; }
.sa-symbol-button { padding: 8px 10px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--site-accent-soft); font: inherit; font-weight: 600; cursor: pointer; }
.sa-symbol-button[aria-pressed="true"] { border-color: var(--site-line-strong); background: rgba(183, 139, 81, .12); }
.sa-symbol-name { display: block; max-width: 220px; margin-top: 5px; color: var(--site-muted); font-size: .78rem; }
.sa-rsi-bar { display: block; width: 88px; height: 3px; margin-top: 8px; border-radius: 5px; background: var(--site-line); }
.sa-rsi-bar span { display: block; height: 100%; border-radius: inherit; background: var(--site-accent); }
.sa-table-note { margin-top: 16px; font-size: .85rem; }
.sa-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.sa-chart-card { overflow: hidden; margin: 0; border: 1px solid var(--site-line); border-radius: var(--site-radius-lg); }
.sa-chart-media, .sa-chart-placeholder { display: grid; place-items: center; aspect-ratio: 16 / 10; padding: 20px; background: rgba(12, 11, 9, .5); color: var(--site-muted); text-decoration: none; text-align: center; }
.sa-chart-media { position: relative; padding: 0; }
.sa-chart-media img { width: 100%; height: 100%; object-fit: contain; }
.sa-chart-media .figure-open-label { opacity: 1; transform: none; }
.sa-chart-card figcaption { padding: 16px; color: var(--site-soft); line-height: 1.6; }
.sa-chart-card figcaption strong { display: block; }
.sa-chart-card figcaption p { margin: 7px 0 0; color: var(--site-muted); font-size: .85rem; }
.sa-backtest-meta { margin-bottom: 18px; }
.sa-backtest-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sa-backtest-metrics .snapshot-value { white-space: normal; }
.sa-backtest-notes { margin-top: 18px; white-space: pre-wrap; }
.sa-table-scroll { max-height: 540px; }
.sa-table-scroll thead { position: sticky; top: 0; z-index: 1; }
.sa-select-label select:focus-visible, .sa-symbol-button:focus-visible, .sa-table-scroll:focus-visible, .sa-chart-media:focus-visible, .sa-research-link:focus-visible, .sa-breadcrumb a:focus-visible { outline: 2px solid var(--theme-focus); outline-offset: 3px; }

@media (max-width: 980px) {
  .sa-rule-grid, .sa-library-grid { grid-template-columns: 1fr; }
  .sa-backtest-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Strategy comparisons retain column alignment inside a horizontal scroll frame. */
@media (max-width: 760px) {
  body[data-strategy-page] .table-shell { overflow: auto; border: 1px solid var(--site-line); }
  body[data-strategy-page] .market-table { display: table; }
  body[data-strategy-page] .market-table thead { display: table-header-group; }
  body[data-strategy-page] .market-table tbody { display: table-row-group; }
  body[data-strategy-page] .market-table tr { display: table-row; padding: 0; border: 0; background: transparent; }
  body[data-strategy-page] .market-table td,
  body[data-strategy-page] .market-table th { display: table-cell; padding: 12px 14px; border-bottom: 1px solid var(--site-line); }
  body[data-strategy-page] .market-table td::before { display: none; }
}
@media (max-width: 640px) {
  .sa-strategy-card, .sa-next-card { padding: 20px; }
  .sa-chart-grid { grid-template-columns: 1fr; }
  .sa-publication { align-items: start; flex-direction: column; }
  .sa-control-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .sa-select-label { min-width: 0; }
  .sa-select-label select { font-size: .85rem; }
}
