/* SCOUT — site-specific styles layered over https://tough.services/shared/tough.css */

/* ---------- Notices ---------- */
.notice {
    background: var(--surface);
    border: 1px solid var(--border);
    border-left: 4px solid var(--status-warning);
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 0.9rem;
    color: var(--ink-2);
    margin-bottom: 16px;
}
.notice-sim { border-left-color: var(--accent); }

/* ---------- Live pill (tracker state) ---------- */
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.live-pill.st-tracking .live-dot { background: var(--status-good); box-shadow: 0 0 0 3px rgba(12, 163, 12, 0.18); animation: scout-pulse 1.4s ease-in-out infinite; }
.live-pill.st-setup .live-dot { background: var(--status-warning); }
.live-pill.st-idle .live-dot { background: var(--accent); }
.live-pill.st-offline .live-dot { background: var(--status-critical); }
@keyframes scout-pulse { 50% { box-shadow: 0 0 0 6px rgba(12, 163, 12, 0.06); } }
@media (prefers-reduced-motion: reduce) { .live-pill .live-dot { animation: none; } }

/* ---------- Hero ---------- */
.hero-big { font-size: 2.2rem; }
.hero-meta { grid-template-columns: repeat(3, 1fr); }
.hero-countdown { font-size: 2.8rem; }

/* ---------- Sky chart ---------- */
.sky-card { display: flex; flex-direction: column; }
.sky-wrap { display: grid; grid-template-columns: minmax(220px, 320px) 1fr; gap: 20px; align-items: center; flex: 1; }
#sky { width: 100%; height: auto; max-width: 320px; display: block; }
.sky-ring { fill: none; stroke: var(--grid); stroke-width: 1; }
.sky-horizon { stroke: var(--baseline); stroke-width: 1.4; }
.sky-axis { stroke: var(--grid); stroke-width: 1; stroke-dasharray: 3 4; }
.sky-lbl { font-family: Inter, system-ui, sans-serif; font-size: 11px; fill: var(--muted); font-weight: 500; }
.sky-el { font-size: 9px; }
.sky-end { font-size: 9px; fill: var(--ink-2); }
.sky-path { fill: none; stroke: var(--series-orange); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: .7; }
.sky-path-live { opacity: 1; }
.sky-sat { fill: var(--series-orange); stroke: var(--surface); stroke-width: 1.5; }
.sky-sat-below { opacity: .35; }
.sky-rot { fill: none; stroke: var(--accent); stroke-width: 1.8; }
.sky-rot-x { stroke: var(--accent); stroke-width: 1; opacity: .7; }
.sky-readout { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
.sky-readout .ro { display: flex; flex-direction: column; gap: 2px; }
.ro-val { font-weight: 600; font-variant-numeric: tabular-nums; font-size: 1rem; white-space: nowrap; }

/* ---------- Tiles ---------- */
.tiles-4 { grid-template-columns: repeat(4, 1fr); }

/* ---------- Tables ---------- */
.data-table .small { font-size: 0.8rem; }
.data-table td.num, .data-table th.num { font-variant-numeric: tabular-nums; }
.sched tr[data-pass] td:first-child { white-space: nowrap; }
.status-badge.st-live { animation: none; }

/* ---------- How it works ---------- */
.how-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.how-grid h3 { font-size: 0.95rem; margin: 0 0 6px; }
.how-grid p { margin: 0; font-size: 0.88rem; color: var(--ink-2); line-height: 1.5; }

/* ---------- Catalogue ---------- */
.search-form { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.search-form input[type="search"] {
    flex: 1 1 260px; padding: 9px 12px; font: inherit; border: 1px solid var(--border); border-radius: 8px;
    background: var(--surface); color: var(--ink);
}
.search-form input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.search-form button { padding: 9px 14px; font: inherit; font-weight: 600; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--ink); cursor: pointer; }
.search-form button:hover { border-color: var(--baseline); }
.sat-head { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: start; }
.sat-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px 18px; margin-top: 12px; }
.tx-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.tx-list li { display: flex; gap: 12px; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--grid); font-size: 0.9rem; }
.tx-list li:last-child { border-bottom: 0; }
.tx-freq { font-weight: 600; font-variant-numeric: tabular-nums; min-width: 120px; }
.tx-dead { opacity: .5; }

/* ---------- Log ---------- */
.log-events { list-style: none; margin: 0; padding: 0; font-size: 0.88rem; }
.log-events li { display: grid; grid-template-columns: 110px 70px 1fr; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--grid); }
.log-events li:last-child { border-bottom: 0; }
.log-events .ev-t { color: var(--muted); font-variant-numeric: tabular-nums; }
.log-events .ev-k { font-weight: 600; text-transform: uppercase; font-size: 0.72rem; letter-spacing: .05em; color: var(--ink-2); align-self: center; }
.log-events .ev-k.k-error, .log-events .ev-k.k-failed, .log-events .ev-k.k-missed { color: var(--status-critical); }
.log-events .ev-k.k-los, .log-events .ev-k.k-aos { color: var(--status-good); }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
    .tiles-4, .how-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
    .hero-meta { grid-template-columns: 1fr 1fr; }
    .sky-wrap { grid-template-columns: 1fr; justify-items: center; }
    .sky-readout { width: 100%; }
    .log-events li { grid-template-columns: 90px 1fr; }
    .log-events .ev-msg { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
    .tiles-4, .how-grid, .sky-readout { grid-template-columns: 1fr; }
    .hero-big { font-size: 1.7rem; }
}