/* ==========================================================================
   strategy.css — Strategy Analysis.
   Extends styles.css and statements.css; every colour comes from their
   tokens so all three dashboards stay one system.
   ========================================================================== */

.ind-picker { display: flex; align-items: center; gap: 8px; }
.ind-picker-label {
  font-size: 10px; font-weight: 600; letter-spacing: .05em;
  text-transform: uppercase; color: var(--kimi-color-text-tertiary);
}
#industry-select {
  font: inherit; font-size: 12.5px;
  color: var(--kimi-color-text-primary);
  background: var(--input-bg);
  border: 1px solid var(--kimi-color-border-strong);
  border-radius: 7px; padding: 7px 10px; min-block-size: 34px;
  max-inline-size: 260px;
}
#industry-select:focus-visible { outline: 2px solid var(--rt-focus); outline-offset: 2px; }

.struct-note, .chart-caption {
  font-size: 11.5px; line-height: 1.6; color: var(--kimi-color-text-tertiary);
  margin: 12px 0 0; max-inline-size: 84ch;
}
.struct-note strong, .chart-caption strong { color: var(--kimi-color-text-secondary); }
/* A caveat that changes how a number should be read is not a footnote. */
.caution {
  border-inline-start: 2px solid var(--rt-gold-border);
  padding-inline-start: 11px; margin-top: 10px;
  color: var(--kimi-color-text-secondary);
}

/* ---- charts ---- */
#roic-chart, #pool-chart, #position-chart, #growth-chart,
#pillars-chart, #margin-chart, #cash-chart, #backlog-chart {
  inline-size: 100%; position: relative; margin-top: 4px;
}
#roic-chart svg, #pool-chart svg, #position-chart svg, #growth-chart svg,
#pillars-chart svg, #margin-chart svg, #cash-chart svg, #backlog-chart svg {
  display: block; inline-size: 100%; block-size: auto;
}
#roic-chart svg text, #pool-chart svg text,
#position-chart svg text, #growth-chart svg text,
#pillars-chart svg text, #margin-chart svg text,
#cash-chart svg text, #backlog-chart svg text {
  font-family: var(--rt-font-mono);
}

/* ---- five forces ---- */
.force-list { display: grid; gap: 10px; }
.force {
  border: 1px solid var(--kimi-color-border); border-radius: 10px;
  background: var(--page-bg); padding: 13px 15px 12px;
}
.force h3 {
  font-size: 12px; font-weight: 600; margin: 0 0 3px;
  color: var(--kimi-color-text-primary); text-transform: none; letter-spacing: 0;
}
.force .force-evidence {
  font-size: 12px; line-height: 1.6; color: var(--kimi-color-text-secondary);
  margin: 4px 0 0;
}
.force .force-metric {
  font-family: var(--rt-font-mono); font-size: 13px; font-weight: 600;
  color: var(--rt-gold); margin-inline-end: 8px;
}
.force .force-gap {
  font-size: 11.5px; line-height: 1.55; color: var(--kimi-color-text-tertiary);
  margin-top: 7px; padding-top: 7px;
  border-top: 1px solid var(--kimi-color-surface-muted);
}

/* ---- sustainability tool ---- */
.sustain-tool { display: grid; gap: 6px; max-inline-size: 460px; }
.sustain-tool label {
  font-size: 11.5px; color: var(--kimi-color-text-secondary);
  display: flex; justify-content: space-between; align-items: baseline;
  margin-top: 6px;
}
.sustain-tool output {
  font-family: var(--rt-font-mono); font-size: 13px; font-weight: 600;
  color: var(--rt-gold);
}
.sustain-tool input[type="range"] { accent-color: var(--rt-gold); inline-size: 100%; }
.sustain-result {
  font-size: 12.5px; line-height: 1.6; color: var(--kimi-color-text-primary);
  margin: 14px 0 0; padding-top: 12px;
  border-top: 1px solid var(--kimi-color-surface-muted);
}
.sustain-result .big {
  font-family: var(--rt-font-mono); font-size: 22px; font-weight: 600;
  color: var(--rt-gold); display: block; margin-bottom: 5px;
}

/* ---- pool table ---- */
table.grid td.pool-you, table.grid td.pool-you:first-child {
  color: var(--rt-gold); font-weight: 600;
}
.mono { font-family: var(--rt-font-mono); }

@media (max-width: 680px) {
  .fsa-controls { flex-direction: column; align-items: stretch; }
  #industry-select { max-inline-size: none; inline-size: 100%; min-block-size: 42px; }
  .ind-picker { flex-direction: column; align-items: stretch; gap: 5px; }
}

/* ---- company view ---- */
#company-view h3 {
  font-size: 12.5px; font-weight: 600; margin: 22px 0 4px;
  color: var(--kimi-color-text-primary); letter-spacing: 0;
}
#company-view .hint {
  font-size: 11.5px; line-height: 1.6; color: var(--kimi-color-text-tertiary);
  margin: 0 0 12px; max-inline-size: 84ch;
}
/* An aside inside a finding: present, readable, clearly secondary. */
.chart-caption .soft, .struct-note .soft { color: var(--kimi-color-text-quaternary); }

/* peer meters */
.meter { margin: 0 0 14px; max-inline-size: 560px; }
.meter-head {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12px; color: var(--kimi-color-text-secondary); margin-bottom: 5px;
}
.meter-val { font-family: var(--rt-font-mono); font-weight: 600; color: var(--rt-gold); }
.meter-val.na { color: var(--kimi-color-text-quaternary); }
.meter-track {
  position: relative; block-size: 8px; border-radius: 4px;
  background: var(--kimi-color-surface-muted); overflow: hidden;
}
.meter-fill {
  position: absolute; inset-block: 0; inset-inline-start: 0;
  background: var(--rt-gold); border-radius: 4px; opacity: .85;
}
/* The peer median, so a filled bar is read as a position and not a score. */
.meter-median {
  position: absolute; inset-block: -2px; inline-size: 2px;
  background: var(--kimi-color-text-secondary); opacity: .7;
}
.meter-note {
  font-size: 10.5px; color: var(--kimi-color-text-tertiary);
  margin: 4px 0 0; font-family: var(--rt-font-mono);
}

/* chart legends */
.mix-legend {
  display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px;
  font-size: 11px; color: var(--kimi-color-text-tertiary);
}
.mix-legend span { display: inline-flex; align-items: center; gap: 5px; }
.mix-legend i { inline-size: 9px; block-size: 9px; border-radius: 2px; display: inline-block; }

/* evidence register */
.evidence-table td { vertical-align: top; font-size: 11.5px; line-height: 1.55; }
.evidence-table td:first-child { color: var(--kimi-color-text-secondary); font-weight: 500; }

/* refresh control in the footer */
.src-footer { display: flex; align-items: flex-start; gap: 14px; justify-content: space-between; }
.refresh-btn {
  font: inherit; font-size: 11.5px; padding: 6px 13px; flex: 0 0 auto;
  min-block-size: 32px; border-radius: 7px; cursor: pointer;
  background: var(--input-bg); color: var(--kimi-color-text-secondary);
  border: 1px solid var(--kimi-color-border-strong);
}
.refresh-btn:hover:not(:disabled) { color: var(--rt-gold); border-color: var(--rt-gold-border); }
.refresh-btn:disabled { opacity: .55; cursor: default; }
.refresh-btn:focus-visible { outline: 2px solid var(--rt-focus); outline-offset: 2px; }

@media (max-width: 680px) {
  .fsa-controls .seg { inline-size: 100%; }
  .fsa-controls .seg button { flex: 1 1 auto; min-block-size: 42px; }
  .src-footer { flex-direction: column; gap: 12px; }
  .refresh-btn { inline-size: 100%; min-block-size: 44px; }
  .meter { max-inline-size: none; }
}

/* risk register */
#risk-register ol { margin: 6px 0 0; padding-inline-start: 22px; }
#risk-register li {
  font-size: 12px; line-height: 1.6; color: var(--kimi-color-text-secondary);
  margin-bottom: 5px;
}
#risk-register details { margin-top: 8px; }
#risk-register summary {
  font-size: 11.5px; color: var(--rt-gold); cursor: pointer;
  min-block-size: 32px; display: flex; align-items: center;
}
#risk-register .register-meta {
  font-size: 11.5px; color: var(--kimi-color-text-tertiary); margin: 10px 0 0;
}
#risk-register .register-meta a { color: var(--rt-gold); }
.cycle-group-label {
  font-size: 10px; font-weight: 600; letter-spacing: .06em;
  text-transform: uppercase; color: var(--kimi-color-text-tertiary);
  margin: 14px 0 6px;
}

/* search results reaching beyond the covered panel */
.live-tag {
  font-size: 9.5px; font-weight: 600; letter-spacing: .04em;
  text-transform: uppercase; color: var(--rt-gold);
  border: 1px solid var(--rt-gold-border); border-radius: 4px;
  padding: 1px 5px; margin-inline-start: 6px; white-space: nowrap;
}

/* macro drill-down */
#macro-detail, .cycle-dial {
  border: 1px solid var(--rt-gold-border); border-radius: 10px;
  background: var(--page-bg); padding: 14px 16px 12px; margin: 12px 0 4px;
}
.cycle-dial { margin: 0 0 16px; }
.md-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.md-title { font-size: 13px; font-weight: 600; color: var(--rt-gold); }
.md-tag {
  font-size: 9.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase;
  color: var(--kimi-color-text-tertiary);
}
.md-close {
  margin-inline-start: auto; font: inherit; font-size: 16px; line-height: 1;
  background: none; border: 0; color: var(--kimi-color-text-tertiary);
  cursor: pointer; padding: 4px 8px; min-block-size: 32px;
}
.md-close:hover { color: var(--kimi-color-text-primary); }
#macro-detail svg { display: block; inline-size: 100%; block-size: auto; margin: 4px 0 8px; }
#macro-detail svg text { font-family: var(--rt-font-mono); }
.md-stats {
  display: flex; flex-wrap: wrap; gap: 14px; font-size: 11px;
  color: var(--kimi-color-text-tertiary); margin: 0 0 10px;
  font-family: var(--rt-font-mono);
}
.md-stats strong { color: var(--kimi-color-text-primary); font-weight: 600; }
.md-para {
  font-size: 12.5px; line-height: 1.65; color: var(--kimi-color-text-secondary);
  margin: 0 0 9px; max-inline-size: 86ch;
}
.md-para strong { color: var(--kimi-color-text-primary); }
.md-sector {
  font-size: 12px; line-height: 1.6; color: var(--kimi-color-text-secondary);
  border-inline-start: 2px solid var(--rt-gold-border);
  padding-inline-start: 10px; margin: 0 0 9px;
}
.md-fail {
  font-size: 11px; line-height: 1.55; color: var(--kimi-color-text-quaternary);
  margin: 0;
}
.cycle-play { margin: 6px 0 10px; padding-inline-start: 20px; }
.cycle-play li {
  font-size: 12px; line-height: 1.6; color: var(--kimi-color-text-secondary);
  margin-bottom: 4px;
}

/* the strategist's note */
#strategy-note-body p {
  font-size: 13px; line-height: 1.7; color: var(--kimi-color-text-secondary);
  margin: 0 0 13px; max-inline-size: 86ch;
}
#strategy-note-body .note-meta {
  font-size: 10.5px; color: var(--kimi-color-text-quaternary);
  font-family: var(--rt-font-mono); margin-top: 4px;
}

/* valuation: where today sits in the company's own decade */
.decade-bar { position: relative; block-size: 6px; border-radius: 3px;
  background: var(--kimi-color-surface-muted); margin: 6px 0 2px; }
.decade-bar i { position: absolute; inset-block: -3px; inline-size: 3px; border-radius: 2px;
  background: var(--rt-gold); }
.decade-bar b { position: absolute; inset-block: 0; inline-size: 1px; background: var(--kimi-color-text-quaternary); }
.decade-note { font-size: 10.5px; color: var(--kimi-color-text-tertiary); font-family: var(--rt-font-mono); }
.val-card { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--kimi-color-border);
  border-radius: 9px; background: var(--page-bg); }
.val-card .m-label { font-size: 10px; letter-spacing: .05em; text-transform: uppercase; color: var(--kimi-color-text-tertiary); }
.val-card .m-value { font-family: var(--rt-font-mono); font-size: 17px; font-weight: 600; color: var(--kimi-color-text-primary); }
.val-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
/* said-versus-did */
.said-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.said-quote { font-size: 12.5px; line-height: 1.65; color: var(--kimi-color-text-secondary);
  border-inline-start: 2px solid var(--rt-gold-border); padding-inline-start: 11px; margin: 0 0 8px; }
.said-src { font-size: 11px; color: var(--kimi-color-text-tertiary); margin-top: 6px; }
.said-src a { color: var(--rt-gold); }
.beat { color: #59b87a; } .miss { color: #d4756b; }
table.grid.recon td { font-size: 11px; }

/* ---- valuation block ---- */
.val-h { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--kimi-color-text-tertiary); margin: 18px 0 8px; }
.val-h:first-child { margin-top: 4px; }
table.grid.bridge td:first-child { inline-size: 40%; }
table.grid.bridge tr.total td { font-weight: 600; color: var(--kimi-color-text-primary); border-top: 1px solid var(--kimi-color-border); }
table.grid.bridge td:last-child, table.grid.multiples th .soft, table.grid.implied td .soft { color: var(--kimi-color-text-tertiary); font-size: 11px; }
table.grid sup { font-size: 9px; color: var(--kimi-color-text-tertiary); margin-inline-start: 2px; }
table.grid tfoot tr.agg td { font-weight: 600; color: var(--kimi-color-text-secondary); border-top: 1px solid var(--kimi-color-border); }
table.grid.implied td strong { color: var(--kimi-color-text-primary); }

/* ---- perpetual growth selector ---- */
.tg-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 10px; font-size: 12px; }
.tg-row label { color: var(--kimi-color-text-secondary); font-weight: 600; }
.tg-row select { font: inherit; font-size: 12px; padding: 4px 8px; border-radius: 6px; border: 1px solid var(--kimi-color-border);
  background: var(--kimi-color-surface-raised); color: var(--kimi-color-text-primary); }
.tg-row .soft { color: var(--kimi-color-text-tertiary); }
table.grid.steady td strong { color: var(--kimi-color-text-primary); }