.sr-observatory { display:grid; grid-template-columns:minmax(220px,1fr) minmax(240px,340px) minmax(260px,1fr); align-items:center; gap:0 24px; position:relative; margin:0 0 22px; padding:12px 26px 0; border:1px solid rgba(130,185,169,.17); border-radius:18px; background:linear-gradient(110deg,rgba(15,26,31,.98),rgba(8,16,22,.97)); color:#e8f5f1; overflow:hidden; isolation:isolate; }
.sr-observatory__intro h2 { margin:9px 0 7px; font:600 clamp(22px,2vw,30px)/1.1 Inter,system-ui,sans-serif; letter-spacing:-.04em; }
.sr-observatory__intro p { margin:0; color:#91a9a2; font:400 12px/1.6 Inter,system-ui,sans-serif; }
.sr-observatory__status { display:flex; align-items:center; gap:7px; color:#aac1b9; font:500 11px/1.4 Inter,system-ui,sans-serif; }
.sr-observatory__status i { width:5px; height:5px; border-radius:50%; background:#82928c; }
.sr-observatory[data-status="scanning"] .sr-observatory__status { color:#82edc8; }
.sr-observatory[data-status="scanning"] .sr-observatory__status i { background:#82edc8; box-shadow:0 0 9px #82edc880; }
.sr-observatory__core { width:100%; height:146px; color:#74e7c9; pointer-events:none; }
.sr-observatory__core svg { display:block; width:100%; height:100%; overflow:visible; }
.sr-observatory__fibers { stroke:currentColor; stroke-width:.65; opacity:.42; transform-origin:150px 80px; animation:sr-optical-turn 42s linear infinite; }
.sr-observatory__channels { stroke:#81b3a6; stroke-width:.6; opacity:.35; }
.sr-observatory[data-status="scanning"] .sr-observatory__channels { stroke:#9fffe0; stroke-dasharray:2 6; animation:sr-optical-channel 6s linear infinite; }
.sr-observatory__orbit { stroke:#bc9cef; stroke-width:.85; opacity:.7; transform-origin:150px 80px; animation:sr-optical-turn 24s linear reverse infinite; }
.sr-observatory__results { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.sr-observatory__results > div { padding:8px 0 8px 15px; border-left:1px solid #badbcd1c; }
.sr-observatory__results span { display:block; color:#8aa29a; font:500 11px/1.3 Inter,system-ui,sans-serif; }
.sr-observatory__results strong { display:block; margin-top:9px; color:#e6f9f1; font:500 28px/1 Inter,system-ui,sans-serif; font-variant-numeric:tabular-nums; letter-spacing:-.05em; }
.sr-observatory__results > div:last-child strong { color:#86f0ca; }
.sr-observatory__event { grid-column:1/-1; display:flex; align-items:center; gap:8px; min-height:33px; border-top:1px solid #b1dccd13; color:#91aca2; font:400 11px/1.4 Inter,system-ui,sans-serif; }
.sr-observatory__event [data-scan="event"] { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sr-observatory__event-dot { width:3px; height:3px; border-radius:50%; background:#809c92; flex:none; }
.sr-observatory[data-event="signal:confirmed"] .sr-observatory__event { color:#80ebc4; }
.sr-observatory[data-motion="paused"] *, html[data-observatory-motion="paused"] .sr-observatory * { animation-play-state:paused !important; }
@keyframes sr-optical-turn { to { transform:rotate(360deg); } }
@keyframes sr-optical-channel { to { stroke-dashoffset:-64; } }
@media(max-width:1100px) and (min-width:901px) { .sr-observatory { grid-template-columns:1fr 220px 1fr; gap:12px; padding-inline:18px; } .sr-observatory__results { gap:5px; } }
@media(max-width:900px) {
  .sr-observatory { grid-template-columns:minmax(0,1fr) 112px; margin:0 0 14px; padding:13px 15px 0; gap:0 5px; border-radius:17px; }
  .sr-observatory__intro h2 { font-size:23px; margin:6px 0; }
  .sr-observatory__intro p { font-size:11px; }
  .sr-observatory__status { font-size:10px; }
  .sr-observatory__core { height:100px; width:180px; margin-left:-34px; }
  .sr-observatory__results { grid-column:1/-1; display:flex; align-items:center; gap:16px; margin:2px 0 12px; }
  .sr-observatory__results > div { display:flex; align-items:baseline; gap:6px; padding:0; border:0; }
  .sr-observatory__results span { font-size:10px; }
  .sr-observatory__results strong { margin:0; font-size:16px; }
  .sr-observatory__event { min-height:30px; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { .sr-observatory * { animation:none !important; } }
body[data-theme="day"] .sr-observatory { background:#f1f7f5; border-color:#c4d4ce; color:#12372a; }
body[data-theme="day"] .sr-observatory__intro p, body[data-theme="day"] .sr-observatory__status, body[data-theme="day"] .sr-observatory__results span, body[data-theme="day"] .sr-observatory__event { color:#43665a; }
body[data-theme="day"] .sr-observatory__results strong { color:#18684b; }

/* Compact mobile summary: retain every live count and the latest event. */
@media (max-width: 900px) {
  html[data-signal-visual="observatory"] .sr-observatory {
    grid-template-columns: minmax(0, 1fr) 80px;
    grid-template-rows: auto auto auto;
    gap: 0 4px;
    padding: 10px 13px 0;
    margin-bottom: 12px;
    border-radius: 15px;
  }

  html[data-signal-visual="observatory"] .sr-observatory__intro {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  html[data-signal-visual="observatory"] .sr-observatory__intro h2 {
    margin: 4px 0;
    font-size: 21px;
    line-height: 1.15;
  }

  html[data-signal-visual="observatory"] .sr-observatory__intro p {
    font-size: 10.5px;
    line-height: 1.4;
  }

  html[data-signal-visual="observatory"] .sr-observatory__status {
    gap: 6px;
    font-size: 10px;
    line-height: 1.3;
  }

  html[data-signal-visual="observatory"] .sr-observatory__core {
    grid-column: 2;
    grid-row: 1;
    width: 124px;
    height: 66px;
    margin: 0 0 0 -22px;
  }

  html[data-signal-visual="observatory"] .sr-observatory__results {
    grid-column: 1 / -1;
    grid-row: 2;
    gap: 14px;
    margin: 6px 0 8px;
    flex-wrap: wrap;
  }

  html[data-signal-visual="observatory"] .sr-observatory__results > div { gap: 5px; }
  html[data-signal-visual="observatory"] .sr-observatory__results span { font-size: 10px; }
  html[data-signal-visual="observatory"] .sr-observatory__results strong { font-size: 16px; }

  html[data-signal-visual="observatory"] .sr-observatory__event {
    grid-column: 1 / -1;
    grid-row: 3;
    min-height: 26px;
    font-size: 10px;
  }

  /* Only spacing changes; ticker items and action visibility stay runtime-owned. */
  html[data-signal-visual="observatory"] #signal-ticker.signal-ticker {
    min-height: 36px;
    padding: 0 8px !important;
    margin: 5px 10px !important;
    border-radius: 10px !important;
    box-sizing: border-box;
    background: var(--obs-panel, #10191f);
    border-color: var(--obs-line, rgba(173,209,209,.13));
    box-shadow: none;
  }

  html[data-signal-visual="observatory"] #signal-ticker .signal-ticker__inner {
    min-height: 34px;
    padding: 0 !important;
    gap: 7px !important;
  }

  html[data-signal-visual="observatory"] #signal-ticker .signal-ticker__dot {
    width: 5px;
    height: 5px;
    box-shadow: 0 0 0 3px rgba(121,232,189,.07);
  }

  html[data-signal-visual="observatory"] #signal-ticker .signal-ticker__label {
    gap: 7px;
    font-size: 9px !important;
  }
}

@media (max-width: 900px) and (min-width: 600px) and (max-height: 540px) {
  html[data-signal-visual="observatory"] .sr-observatory {
    grid-template-columns: minmax(0, 1.2fr) 90px minmax(225px, 1fr);
    grid-template-rows: auto auto;
    gap: 0 12px;
    padding-top: 8px;
    margin-bottom: 9px;
  }

  html[data-signal-visual="observatory"] .sr-observatory__intro h2 { font-size: 19px; }
  html[data-signal-visual="observatory"] .sr-observatory__core { width: 116px; height: 62px; margin-left: -13px; }
  html[data-signal-visual="observatory"] .sr-observatory__results {
    grid-column: 3;
    grid-row: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin: 0;
  }

  html[data-signal-visual="observatory"] .sr-observatory__results > div {
    display: grid;
    gap: 5px;
    padding-left: 10px;
    border-left: 1px solid rgba(173,209,209,.13);
  }

  html[data-signal-visual="observatory"] .sr-observatory__results strong { font-size: 19px; }
  html[data-signal-visual="observatory"] .sr-observatory__event { grid-row: 2; min-height: 24px; }
}