/* ============================================================================
   scene-signals.css · Executive "External signals".
   Measured tiles (real public data) + a source/attribution line + the AI read
   (signal cards, the two searched panels, watch list, actions) + a per-store
   exposure table. Reuses exec-* + shared tokens.
   ========================================================================== */
.sig { flex: 1; min-width: 0; min-height: 0; overflow-y: auto; background: var(--softer); padding: 20px 24px 40px; }
#sigRoot { max-width: 1180px; margin: 0 auto; }

.sig__head { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.sig__title h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(20px, 1.2rem + .8vw, 28px); letter-spacing: -.02em; }
.sig__title p { font-size: 12.5px; color: var(--text-soft); margin-top: 2px; max-width: 660px; line-height: 1.45; }
.sig__ctrls { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* ---- measured tiles ---- */
.sig__tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-bottom: 10px; }
.sig__tileload { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; padding: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); font-size: 13px; color: var(--text-soft); }
.sig__tileload .mi { width: 15px; height: 15px; color: var(--mint-700); animation: nlq-spin 1s linear infinite; }
.sig-tile { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 13px 16px; box-shadow: var(--shadow-sm); overflow: hidden; }
.sig-tile::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--text-soft); }
.sig-tile.is-ok::before { background: var(--mint); }
.sig-tile.is-warn::before { background: var(--warn); }
.sig-tile.is-crit::before { background: var(--danger); }
.sig-tile__lab { display: block; font-family: var(--font-mono); font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-soft); }
.sig-tile__v { display: block; font-family: var(--font-display); font-weight: 800; font-size: 26px; line-height: 1.15; letter-spacing: -.02em; margin: 3px 0 1px; }
.sig-tile__v i { font-style: normal; font-size: 13px; font-weight: 600; color: var(--text-soft); }
.sig-tile__sub { display: block; font-size: 11.5px; color: var(--text-2); line-height: 1.4; }

/* ---- source / attribution line: the honesty strip ---- */
.sig__srcline { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 14px; padding: 9px 13px; border-radius: var(--r-md); background: var(--soft); font-size: 11.5px; line-height: 1.5; color: var(--text-2); }
.sig__srcline .mi { width: 14px; height: 14px; flex: none; margin-top: 1px; color: var(--mint-700); }
.sig__srcline b { color: var(--text-1); }
.sig__srcline a { color: var(--info); font-weight: 600; }
.sig__srcline i { font-style: normal; color: var(--text-soft); }
.sig__srcline em { font-style: normal; color: var(--text-soft); margin: 0 5px; }
.sig__deg { color: #92590b; }

.sig__load { display: flex; align-items: center; gap: 10px; padding: 13px 16px; margin-bottom: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-sm); font-size: 13px; color: var(--text-2); }
.sig__spin .mi { width: 16px; height: 16px; color: var(--mint-700); animation: nlq-spin 1s linear infinite; }
.sig__empty { color: var(--text-soft); font-size: 13.5px; line-height: 1.7; text-align: center; padding: 34px 20px; }

/* ---- the AI read ---- */
.sig-headline { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; padding: 13px 16px; border-radius: var(--r-md); background: var(--mint-tint-2); border-left: 3px solid var(--mint); font-family: var(--font-display); font-weight: 700; font-size: 15px; line-height: 1.5; color: var(--text-1); }
.sig-headline .mi { width: 18px; height: 18px; flex: none; margin-top: 1px; color: var(--mint-700); }

.sig-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 12px; margin-bottom: 14px; }
.sig-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px 14px; box-shadow: var(--shadow-sm); }
.sig-card__top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.sig-card__lvl { font-family: var(--font-mono); font-size: 8.5px; font-weight: 700; letter-spacing: .06em; padding: 3px 8px; border-radius: 999px; background: var(--soft); color: var(--text-2); }
.sig-card--calm .sig-card__lvl { background: var(--mint-tint); color: var(--mint-ink); }
.sig-card--watch .sig-card__lvl { background: var(--warn-soft); color: #92590b; }
.sig-card--alert .sig-card__lvl { background: var(--danger-soft); color: #b42318; }
.sig-card__label { font-weight: 700; font-size: 13px; color: var(--text-1); }
.sig-card__read { font-family: var(--font-mono); font-size: 11.5px; color: var(--text-1); background: var(--softer); border-radius: 7px; padding: 6px 9px; margin-bottom: 6px; line-height: 1.45; }
.sig-card__so { font-size: 12.5px; line-height: 1.55; color: var(--text-2); }
.sig-card__act { display: flex; gap: 7px; align-items: flex-start; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); font-size: 12.5px; line-height: 1.5; color: var(--text-1); }
.sig-card__act .mi { width: 13px; height: 13px; flex: none; margin-top: 2px; color: var(--mint-700); }

/* the two web-searched panels */
.sig-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; margin-bottom: 14px; }
.sig-panel { background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--mint); border-radius: var(--r-md); padding: 12px 15px; box-shadow: var(--shadow-sm); }
.sig-panel--watch { border-left-color: var(--warn); }
.sig-panel--alert { border-left-color: var(--danger); }
.sig-panel__h { display: flex; align-items: center; gap: 7px; font-family: var(--font-display); font-weight: 800; font-size: 13.5px; margin-bottom: 7px; }
.sig-panel__h .mi { width: 15px; height: 15px; color: var(--mint-700); }
.sig-panel__badge { margin-left: auto; font-family: var(--font-mono); font-size: 8.5px; font-weight: 700; letter-spacing: .06em; padding: 3px 9px; border-radius: 999px; background: var(--mint-tint); color: var(--mint-ink); }
.sig-panel--watch .sig-panel__badge { background: var(--warn-soft); color: #92590b; }
.sig-panel--alert .sig-panel__badge { background: var(--danger-soft); color: #b42318; }
.sig-panel p { font-size: 12.5px; line-height: 1.55; color: var(--text-2); margin: 0 0 7px; }
.sig-panel a { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--info); }
.sig-panel a .mi { width: 12px; height: 12px; }

/* watch list + actions */
.sig-watch, .sig-actions { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: 13px 16px; box-shadow: var(--shadow-sm); margin-bottom: 12px; }
.sig-watch__h, .sig-actions__h { display: flex; align-items: center; gap: 7px; font-family: var(--font-display); font-weight: 800; font-size: 13.5px; margin-bottom: 8px; }
.sig-watch__h .mi, .sig-actions__h .mi { width: 15px; height: 15px; color: var(--mint-700); }
.sig-watch__row { display: flex; gap: 10px; flex-wrap: wrap; align-items: baseline; padding: 8px 0; border-top: 1px solid var(--line-soft); font-size: 12.5px; }
.sig-watch__row b { color: var(--text-1); font-weight: 700; min-width: 150px; }
.sig-watch__row span { color: var(--text-2); flex: 1; min-width: 160px; }
.sig-watch__row i { font-style: normal; color: var(--mint-ink); font-weight: 600; }
.sig-watch__none { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--text-2); padding: 6px 0; }
.sig-watch__none .mi { width: 15px; height: 15px; color: var(--mint-700); }
.sig-actions ol { padding-left: 20px; margin: 0; list-style: decimal; }
.sig-actions li { font-size: 12.5px; line-height: 1.55; color: var(--text-2); margin-bottom: 7px; }
.sig-actions li b { display: block; color: var(--text-1); }
.sig-actions li span { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-soft); }
.sig-actions li i { display: block; font-style: normal; color: var(--mint-ink); font-size: 11.5px; }

/* ---- per-store exposure table ---- */
.sig__stores { margin-top: 4px; }
.sig-stores__h { display: flex; align-items: center; gap: 7px; font-family: var(--font-display); font-weight: 800; font-size: 14px; margin-bottom: 9px; }
.sig-stores__h .mi { width: 16px; height: 16px; color: var(--mint-700); }
.sig-table__wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }
.sig-table { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 620px; }
.sig-table thead th { text-align: left; font-family: var(--font-mono); font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-soft); padding: 10px 14px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.sig-table td { padding: 10px 14px; border-bottom: 1px solid var(--line-soft); color: var(--text-2); vertical-align: middle; }
.sig-table tbody tr:last-child td { border-bottom: 0; }
.sig-table tbody tr:hover { background: var(--softer); }
.sig-td__store b { display: block; color: var(--text-1); font-weight: 700; }
.sig-td__store span { font-size: 11px; color: var(--text-soft); }
.sig-num { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sig-num i { font-style: normal; font-size: 10px; color: var(--text-soft); margin-left: 2px; }
.sig-pm { font-weight: 700; }
.sig-pm--good, .sig-pm--ok { color: var(--mint-ink); }
.sig-pm--moderate { color: #92590b; }
.sig-pm--unhealthy, .sig-pm--hazardous { color: #b42318; }
.sig-risk { display: inline-block; font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .04em; padding: 3px 9px; border-radius: 999px; background: var(--soft); color: var(--text-2); }
.sig-risk--none { background: var(--mint-tint); color: var(--mint-ink); }
.sig-risk--low { background: var(--soft); color: var(--text-2); }
.sig-risk--medium { background: var(--warn-soft); color: #92590b; }
.sig-risk--high { background: var(--danger-soft); color: #b42318; }
.sig-table tbody tr.sig-r--high { background: var(--danger-soft); }
.sig-table tbody tr.sig-r--high:hover { background: var(--danger-soft); }

@media (max-width: 720px) { .sig { padding: 14px; } .sig__ctrls { width: 100%; } }