/* owner: core-satellite — 核心＋衛星 sub-tab (§14), 0050 benchmark swatches, descriptive tags (§14.3). */

.sw--etf { background: var(--warn); height: 3px; }
.sw--sat { height: 2px; border-radius: 0; background: repeating-linear-gradient(90deg, var(--accent-2, #36d6e7) 0 4px, transparent 4px 7px); }
.sv-table tr.is-etf td { color: var(--text); background: color-mix(in srgb, var(--warn) 8%, transparent); }
.sv-table tr.is-etf td:first-child { box-shadow: inset 3px 0 0 var(--warn); }
.sv-table--ten { margin: 8px 0 2px; font-size: var(--fs-xs); }
.sv-table--ten td, .sv-table--ten th { padding: 5px 8px; }
.sv-table--ten tbody tr { cursor: default; }

/* ---- the one-line ten-year conclusion ---- */
.cs-truth {
  display: flex; align-items: baseline; gap: 10px; margin: 0; padding: 9px 14px; border-radius: var(--r-md);
  font-size: var(--fs-sm); line-height: 1.6; color: var(--text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--warn) 14%, transparent), color-mix(in srgb, var(--warn) 3%, transparent) 70%);
  border: 1px solid color-mix(in srgb, var(--warn) 32%, var(--border));
}
.cs-truth__k {
  flex: none; font-size: var(--fs-2xs); font-weight: 700; letter-spacing: 0.08em; padding: 1px 8px; border-radius: var(--r-pill);
  color: var(--bg, #070a12); background: var(--warn);
}
.cs-truth--top { margin-top: 2px; }
.sv-pane[data-pane="cs"] > .cs-truth { display: none; } /* the header already carries it */

/* ---- controls ---- */
.cs-controls { grid-template-columns: minmax(220px, 1.4fr) repeat(3, auto) minmax(200px, 1fr); }
.cs-split { margin-left: 8px; font-size: var(--fs-2xs); color: var(--accent-2, var(--accent)); font-family: var(--font-mono); }
.cs-satdesc { font-size: var(--fs-2xs); color: var(--muted); line-height: 1.5; }
.cs-satdesc b { color: var(--text-2); font-weight: 600; }
.cs-link { all: unset; cursor: pointer; color: var(--accent-strong, var(--accent)); font-weight: 600; margin-left: 4px; }
.cs-link:hover, .cs-link:focus-visible { text-decoration: underline; }

/* ---- layout ---- */
.cs-grid { display: grid; grid-template-columns: 1fr; gap: var(--sv-gap); margin-top: var(--sv-gap); }
@container (min-width: 1180px) { .cs-grid { grid-template-columns: minmax(0, 1fr) 470px; align-items: start; } }
.cs-main { display: grid; gap: var(--sv-gap); min-width: 0; }
.cs-kpis { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important; }
.cs-kpis .sv-kpi:first-child { grid-column: auto; }
.cs-kpis .sv-kpi:first-child .sv-kpi__v { font-size: 30px; }
.cs-kpis .sv-kpi__v { font-size: 24px; }
.cs-kpis .sv-kpi:last-child { background: radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--warn) 14%, transparent), transparent 60%), var(--panel); }
.cs-kpis .sv-kpi:last-child .sv-kpi__v { font-size: 17px; line-height: 1.5; padding-top: 6px; }

/* ---- by-year ---- */
.cs-ysec + .cs-ysec { margin-top: 14px; }
.cs-ysec__t { font-size: var(--fs-xs); font-weight: 650; color: var(--text-2); margin: 0 0 4px; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.cs-ysec__t small { font-weight: 400; }
.cs-yt tbody tr { cursor: default; }
.cs-yt td, .cs-yt th { padding: 6px 7px; }
.cs-yt thead th { font-family: var(--font-mono); vertical-align: bottom; }
.cs-yt thead th small { display: block; font-size: 9.5px; margin: 0; font-family: var(--font-sans); }
.cs-yt tbody th { text-align: left; font-weight: 500; color: var(--text-2); white-space: nowrap; }
.cs-yt tr.cs-yt__combined th { color: var(--text); font-weight: 650; }
.cs-yt tr.cs-yt__etf td, .cs-yt tr.cs-yt__etf th { color: color-mix(in srgb, var(--warn) 85%, var(--text)); }
.cs-yt .is-hl { background: color-mix(in srgb, var(--down) 11%, transparent); }
.cs-yt thead th.is-hl { box-shadow: inset 0 3px 0 var(--down); color: var(--text); }
.cs-hl-tag { display: block; font-style: normal; font-size: 9.5px; padding: 0 5px; border-radius: var(--r-pill); color: var(--down); border: 1px solid color-mix(in srgb, var(--down) 50%, transparent); margin: 2px 0 0 auto; width: max-content; font-family: var(--font-sans); }

/* ---- 10-year research card ---- */
.cs-research {
  background: linear-gradient(180deg, color-mix(in srgb, var(--warn) 5%, transparent), transparent 30%), var(--panel);
  border-color: color-mix(in srgb, var(--warn) 22%, var(--border));
}
.cs-headline { margin: 0 0 10px; font-size: var(--fs-md); font-weight: 650; line-height: 1.55; color: var(--text); }
.cs-verdict { font-size: var(--fs-xs); line-height: 1.65; color: var(--text-2); padding: 8px 10px; border-radius: var(--r-md); background: var(--panel-2); border: 1px solid var(--border); margin-bottom: 10px; }
.cs-verdict b { color: var(--text); }
.cs-verdict em { color: var(--warn); font-style: normal; font-weight: 600; }
.cs-rt { font-size: var(--fs-xs); margin: 10px 0 2px; }
.cs-rt td, .cs-rt th { padding: 5px 6px; }
.cs-rt tbody tr { cursor: default; }
.cs-rt td:first-child { white-space: normal; min-width: 120px; }
.cs-rt__sub th { font-size: 10px; padding-top: 0; }
.cs-rt__rg { font-size: 10px; font-family: var(--font-mono); }
.cs-rt--bear td.num > div { font-size: 10px; }
.cs-research .sv-foot { font-size: 10.5px; }
.cs-research a { color: var(--accent-strong, var(--accent)); }
@media (max-width: 640px) {
  .cs-controls { grid-template-columns: 1fr; }
  .cs-truth { flex-direction: column; gap: 4px; }
}

/* ---- descriptive tags (leaders board, ranking, drawer) ---- */
.tg-row { display: inline-flex; flex-wrap: wrap; gap: 3px; vertical-align: middle; }
.tg {
  display: inline-flex; align-items: center; gap: 2px; padding: 0 6px; height: 17px; border-radius: var(--r-pill);
  font-size: 10.5px; font-weight: 600; line-height: 1; white-space: nowrap; cursor: help;
  border: 1px solid var(--tg-c, var(--border)); color: var(--tg-c, var(--text-2));
  background: color-mix(in srgb, var(--tg-c, var(--muted)) 12%, transparent);
}
.tg--leader { --tg-c: var(--accent-strong, var(--accent)); }
.tg--pullback { --tg-c: var(--accent-2, #36d6e7); }
.tg--launch { --tg-c: var(--warn); }
.tg--star { --tg-c: var(--up); background: color-mix(in srgb, var(--up) 18%, transparent); }
.tg--sm { height: 15px; padding: 0 4px; font-size: 10px; }
.ld-launch-note { font-size: var(--fs-2xs); color: var(--muted); }
.ld-tagcount { font-size: var(--fs-2xs); color: var(--muted); display: inline-flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.ld-tagcount b { font-family: var(--font-mono); color: var(--text-2); }
.rk-tags:empty { display: none; }
.rk-tags { display: inline-flex; flex: none; }
.ins .lg-port__card--pending { border-style: dashed; background: color-mix(in srgb, var(--ins-warn, #f5b544) 4%, transparent); }
.tg-tip {
  position: fixed; z-index: 9999; pointer-events: none; padding: 10px 12px; border-radius: var(--r-md, 10px);
  background: color-mix(in srgb, var(--panel-solid, #0e1320) 97%, transparent); border: 1px solid var(--border-strong, #2a3346);
  box-shadow: var(--shadow-2, 0 12px 32px rgba(0, 0, 0, 0.45)); color: var(--text-2, #c5cee0); font-size: 12px; line-height: 1.6;
}
.tg-tip[hidden] { display: none; }
.tg-tip p { margin: 0 0 6px; }
.tg-tip__hd { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.tg-tip__k { font-size: 10.5px; color: var(--warn); font-weight: 600; }
.tg-tip__l { font-size: 10.5px; color: var(--muted); letter-spacing: 0.06em; }
.tg-tip__n { color: var(--muted); font-size: 11px; margin: 0 !important; }
.tg-tip .tg { cursor: default; }
.tg:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
/* sim controls: keep each switch group on one line */
.sv-controls .sv-ctl--sw .sv-sws { flex-wrap: nowrap; }
@container (min-width: 900px) { .sv-pane[data-pane="sim"] .sv-controls { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } .sv-pane[data-pane="sim"] .sv-ctl--sw { grid-column: span 2; } }
.ins .lg-port__card--pending .ins-muted { font-size: 11px; line-height: 1.55; margin: 0; }
.ins .lg-port__hold .ins-chip { white-space: normal; max-width: 100%; overflow-wrap: anywhere; }
.sv-risks li { min-width: 0; }
