/* Scoped connection status for the two homepages. */
.home-network { max-width: 540px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--studio-line); display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: start; gap: 12px; }
.home-network-reading { min-width: 0; }
.studio-design .home-network-label { display: flex; align-items: center; gap: 7px; margin: 0 0 7px; color: var(--studio-muted); font-size: 12px; line-height: 1.5; }
.home-network-label svg { width: 15px; height: 15px; flex: none; }
.home-network-values { display: flex; align-items: baseline; align-content: flex-start; flex-wrap: wrap; column-gap: 14px; row-gap: 3px; min-height: 52px; }
.home-network-values strong { min-width: 0; max-width: 100%; color: var(--studio-ink); font-size: 17px; font-weight: 650; line-height: 1.55; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.home-network-values span { min-width: 0; color: var(--studio-muted); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.home-network-refresh { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--studio-line); border-radius: 7px; background: var(--studio-paper); color: var(--studio-muted); cursor: pointer; transition: color 180ms, background-color 180ms, border-color 180ms; }
.home-network-refresh svg { width: 18px; height: 18px; }
.home-network-refresh:hover:not(:disabled) { background: var(--studio-soft); color: var(--studio-ink); border-color: var(--studio-muted); }
.home-network-refresh:disabled { cursor: default; opacity: .5; }
.studio-design .home-network-details { display: block; min-width: 0; min-height: 44px; text-decoration: none; }
.home-network-details .home-network-label svg:last-child { width: 13px; height: 13px; }
.home-network-details:hover .home-network-label { color: var(--studio-red); }
.studio-design .home-network-license { padding-top: 16px; color: var(--studio-muted); font-size: 12px; line-height: 1.8; }
.home-network-license a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 600px) {
    .home-network { margin-top: 20px; }
    .home-network-values { flex-direction: column; min-height: 80px; }
    .home-network-values strong { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) { .home-network-refresh { transition: none; } }
