/**
 * Atlas Trend view. Shares the Sectors shell (.at-sec, .at-sec-in, .at-st, .at-seg, .at-card)
 * from atlas-sectors.css; only what is new lives here.
 */

.at-tr-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--a-sp-5); }
.at-tr-cards .at-card-n { font: var(--a-fw-semibold) var(--a-fs-xl)/var(--a-lh-tight) var(--at-mono); font-variant-numeric: tabular-nums; }

/* Requirement chips: one click cycles Any -> Yes -> No. */
.at-tr-req { display: grid; gap: var(--a-sp-4); }
.at-rq-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--a-sp-2) var(--a-sp-4); }
.at-grp-t { padding: 0 var(--a-sp-5); }
.at-grp-t.on { border-color: var(--a-accent-t3); background: var(--a-accent-t1); color: var(--at-accent); }
.at-rq-k { font: var(--a-fw-semibold) var(--a-fs-2xs)/1 var(--at-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--at-dimmer); margin-right: var(--a-sp-1); }
.at-rq { display: inline-flex; align-items: center; gap: var(--a-sp-4); height: 26px; padding: 0 var(--a-sp-4); cursor: pointer;
  border: 1px solid var(--at-line); border-radius: var(--a-r-md); background: var(--at-panel); color: var(--at-dim);
  font: var(--a-fw-semibold) var(--a-fs-xs)/1 var(--at-sans); }
.at-rq b { font: var(--a-fw-semibold) var(--a-fs-2xs)/1 var(--at-mono); color: var(--at-dimmer); font-variant-numeric: tabular-nums; }
.at-rq:hover { border-color: var(--at-line-2); color: var(--at-text); }
.at-rq.yes { border-color: var(--a-up-t3); background: var(--a-up-t1); color: var(--at-text); }
.at-rq.yes b { color: var(--at-up); }
.at-rq.no { border-color: var(--a-down-t3); background: var(--a-down-t1); color: var(--at-text); }
.at-rq.no b { color: var(--at-down); }
.at-rq-clear { height: 26px; padding: 0 var(--a-sp-4); border: 0; background: transparent; color: var(--at-accent);
  font: var(--a-fw-semibold) var(--a-fs-xs)/1 var(--at-sans); cursor: pointer; }
.at-rq-sp { flex: 1; min-width: 8px; }

.at-tt-tbl { min-width: 1180px; }
.at-tt-tbl td, .at-tt-tbl th { padding-left: var(--a-sp-4); padding-right: var(--a-sp-4); }
.at-tt-tbl td.tg { text-align: left; white-space: nowrap; }
.at-tt-tbl th:nth-child(2) { text-align: left; }
.at-tt-tbl .cs { font: var(--a-fw-semibold) var(--a-fs-sm)/var(--a-lh-tight) var(--at-sans); color: var(--at-text); }
.at-tt-tbl .cs small { color: var(--at-dimmer); font-weight: var(--a-fw-medium); }
.at-tt-tbl tr.tr:hover td { background: var(--a-glass); }
/* Aligned rows carry their side on the left edge, so the eye finds them before reading. */
.at-tt-tbl tr.al-b td:first-child { box-shadow: inset 3px 0 0 var(--at-up); }
.at-tt-tbl tr.al-s td:first-child { box-shadow: inset 3px 0 0 var(--at-down); }

.at-tag { display: inline-block; margin-right: var(--a-sp-2); padding: var(--a-sp-1) var(--a-sp-4); border-radius: var(--a-r-sm);
  background: var(--at-raised); border: 1px solid var(--at-line); color: var(--at-dim);
  font: var(--a-fw-semibold) var(--a-fs-2xs)/var(--a-lh-tight) var(--at-sans); }

.at-pill { display: inline-block; min-width: 38px; padding: var(--a-sp-2) var(--a-sp-4); border-radius: var(--a-r-sm); text-align: center;
  font: var(--a-fw-semibold) var(--a-fs-2xs)/var(--a-lh-tight) var(--at-mono); letter-spacing: .03em; cursor: default; font-variant-numeric: tabular-nums; }
.at-pill.yes { color: var(--at-up); background: var(--a-up-t2); }
.at-pill.no { color: var(--at-down); background: var(--a-down-t2); }
.at-pill.na { color: var(--at-dimmer); background: var(--a-glass); }

.at-meter { display: inline-flex; align-items: center; gap: var(--a-sp-1); }
.at-meter i { width: 7px; height: 12px; border-radius: var(--a-r-sm); background: var(--a-glass-2); }
.at-meter.b i.f { background: var(--at-up); }
.at-meter.s i.f { background: var(--at-down); }
.at-meter b { margin-left: var(--a-sp-4); font: var(--a-fw-semibold) var(--a-fs-xs)/1 var(--at-mono); color: var(--at-dim); min-width: 24px; text-align: right; font-variant-numeric: tabular-nums; }
.at-meter.hot.b b { color: var(--at-up); }
.at-meter.hot.s b { color: var(--at-down); }

.at-tr-foot { padding: var(--a-sp-4) var(--a-sp-5); font: var(--a-fw-medium) var(--a-fs-xs)/1 var(--at-mono); color: var(--at-dimmer); font-variant-numeric: tabular-nums; }

/* Extended columns: each group carries a faint top rule in its own tint, so the eye can tell
   the core five from the add-ons without a second header row. */
.at-tt-tbl th.g-q { box-shadow: inset 0 2px 0 var(--a-accent-t3); }
.at-tt-tbl th.g-f { box-shadow: inset 0 2px 0 var(--a-accent-t3); }
.at-tt-tbl th.g-c { box-shadow: inset 0 2px 0 var(--a-warn-t3); }
.at-tt-tbl th.g-b { box-shadow: inset 0 2px 0 var(--a-up-t3); }
.at-tt-tbl td.warn { color: var(--at-warn); }
.at-crowd { margin-right: var(--a-sp-2); color: var(--at-warn); }
.at-pill.wide { min-width: 82px; }
.at-meter.long i { width: 5px; }
.at-meter.long b { min-width: 28px; }

@media (max-width: 1100px) { .at-tr-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .at-tr-cards { grid-template-columns: minmax(0, 1fr); } }