.observation-live-block{margin:24px 0;padding:24px!important;border:1px solid #d7e7ef;background:linear-gradient(135deg,#fff,#f1f8fb);border-radius:22px;color:#102c44}
.observation-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}.observation-heading h2{margin:5px 0 0;font-size:clamp(21px,3vw,28px)}.observation-kicker{font-size:11px;letter-spacing:.14em;font-weight:800;color:#087787}.observation-intro{color:#50677d;margin:0 0 20px}
.observation-nearby-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.observation-reading{padding:18px;border-radius:16px;background:#fff;border:1px solid #dfebf1;min-width:0}.observation-reading h3{font-size:14px;margin:0 0 10px}.observation-value{display:block;font-size:32px;line-height:1.2;color:#102c44}.observation-value small{font-size:16px;font-weight:500}.observation-measure-time{font-size:12px;color:#50677d;margin:10px 0}.observation-reading a{font-size:13px;line-height:1.5;display:block;overflow-wrap:anywhere}.observation-change{font-size:12px;font-weight:700;color:#087787;margin:10px 0 0}
.observation-method{margin:16px 0;font-size:13px;color:#50677d}.observation-method summary{cursor:pointer;font-weight:600}.observation-method p{max-width:90ch;line-height:1.6}.observation-method li{margin:6px 0}.observation-update{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:12px;color:#50677d}.observation-update button{border:0;background:transparent;color:#087787;text-decoration:underline;cursor:pointer;padding:7px}.observation-update [role=status]{font-size:12px}
.observation-events{display:grid;grid-template-columns:repeat(var(--event-columns,3),minmax(0,1fr));gap:16px}.observation-event{border:1px solid #dce8f0;border-radius:18px;background:#fff;padding:20px;min-width:0}.observation-event-icon{display:flex;align-items:center;justify-content:center;background:#e8f5f8;border-radius:12px;width:42px;height:42px;color:#087787;margin-bottom:12px}.observation-event h3{font-size:20px;line-height:1.25;margin:6px 0 12px}.observation-event p{font-size:14px;line-height:1.5}.observation-event .observation-place{font-size:12px;font-weight:700;color:#50677d;margin:0}.observation-event-link{font-weight:700;font-size:14px}.observation-event details{margin-top:14px;font-size:12px}.observation-event summary{cursor:pointer}.observation-event ul{padding-left:17px;max-height:220px;overflow:auto}.observation-event li{margin:10px 0}.observation-event li small{display:block;color:#50677d}.observation-empty{grid-column:1/-1;color:#50677d}.observation-event[hidden]{display:none}.observation-reading.is-old .observation-value{font-size:20px;color:#50677d}
.obs-replay{padding:18px;border:1px solid #cce0e9;border-radius:16px;background:#f0f8fb;margin:18px 0}.obs-replay h2{margin:0 0 8px;font-size:20px}.obs-replay p{font-size:13px;color:#50677d}.obs-replay-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.obs-replay-controls button{min-height:42px;border-radius:10px;border:1px solid #bfd6e3;background:#fff;padding:8px 12px;cursor:pointer}.obs-replay-controls input{flex:1;min-width:130px;accent-color:#087787}.obs-replay-state{display:block;font-size:16px;font-weight:700;margin:12px 0;color:#087787}.obs-replay.is-history{background:#fff4df;border-color:#e7cc95}.obs-replay.is-history .obs-replay-state{color:#715117}.obs-focus-note{font-size:14px}.obs-focus-note button{margin-left:12px;cursor:pointer}
@media(max-width:850px){.observation-events{grid-template-columns:repeat(2,minmax(0,1fr))}.observation-nearby-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.observation-live-block{padding:18px!important;margin:18px 0}.observation-events{grid-template-columns:1fr}.observation-reading{padding:14px}.observation-value{font-size:27px}.observation-heading .soft{font-size:13px}.obs-replay-controls{gap:6px}.obs-replay-controls button{padding:8px}.obs-replay-controls input{flex-basis:100%;order:5;width:100%}}