/* Resonde product shell. Neutral brand primitives allow other tools to share it. */
:root { color-scheme: light; --concrete:#f0f1f3; --concrete-deep:#e3e6ea; --ink:#252a31; --ink-soft:#505965; --muted:#606772; --rule:#d4d8de; --oxide:#315fad; }
body.internet-product { background:#f0f1f3; color:#252a31; font:16px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; --concrete:#f0f1f3; --concrete-deep:#e3e6ea; --ink:#252a31; --ink-soft:#505965; --muted:#606772; --rule:#d4d8de; --oxide:#315fad; }
.internet-product a { text-decoration-color:#8ca9d8; text-underline-offset:4px; }
.internet-product a:hover { color:#244a89; }
.product-header { max-width:1240px; margin:auto; padding:22px 24px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid #d4d8de; }
.product-brand { display:inline-flex; align-items:center; gap:10px; font-size:25px; font-weight:750; letter-spacing:-1px; text-decoration:none; }
.brand-symbol { display:grid; place-content:center; width:32px; height:32px; border-radius:10px; background:#315fad; color:white; font:700 24px Georgia,serif; }
.product-header nav,.product-footer nav { display:flex; align-items:center; gap:26px; font-size:14px; }
.product-header nav a { text-decoration:none; }
.product-header nav a:first-child { color:#315fad; font-weight:650; }
.product-footer { max-width:1192px; margin:40px auto 0; border-top:1px solid #d4d8de; padding:28px 0 40px; display:flex; justify-content:space-between; gap:24px; color:#505965; font-size:14px; }
.product-footer p { margin:4px 0; }
.skip-content { position:fixed; top:8px; left:8px; transform:translateY(-200%); z-index:20; background:white; padding:12px; }
.skip-content:focus { transform:none; }
.internet-product :focus-visible { outline:3px solid #286dc0; outline-offset:4px; }
.internet-product main { max-width:1240px; padding:38px 24px 24px; }
.internet-product .test-page article { grid-template-columns:minmax(280px,.72fr) minmax(0,1.4fr); gap:0 24px; }
.internet-product .eyebrow { color:#315fad; font:650 11px/1.5 Arial,sans-serif; letter-spacing:.12em; }
.internet-product h1 { font-family:inherit; font-size:clamp(30px,3.4vw,46px); font-weight:650; letter-spacing:-1.7px; line-height:1.12; max-width:100%; }
.internet-product .test-intro { font-size:18px; line-height:1.5; margin:14px 0 2px; color:#505965; }
.internet-product .start-note { font-size:12px; color:#606772; margin:0 0 26px; }
.internet-product .connection-column { margin-top:0!important; }
.internet-product .connection-card { background:white; border:1px solid #d4d8de; border-radius:18px; padding:24px; box-shadow:0 4px 20px #252a3106; }
.internet-product .connection-card .dial { margin:0; gap:10px; }
.internet-product .connection-card .dial .eyebrow { margin:0; color:#606772; }
.internet-product .connection-card .dial-number { font:500 clamp(58px,6vw,86px)/1.15 -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; letter-spacing:-5px; margin:14px 0 8px; }
.internet-product .dial-unit { font:13px Arial,sans-serif; letter-spacing:0; color:#606772; }
.internet-product .dial-phase { font:13px/1.6 Arial,sans-serif; letter-spacing:0; min-height:2.8em; }
.internet-product .dial-button { border-radius:9px; padding:12px 18px; min-height:44px; font:600 14px/1.4 Arial,sans-serif; letter-spacing:0; text-transform:none; background:#315fad; color:white; }
.internet-product .dial-button-quiet { background:white; border:1px solid #b7bec8; color:#315fad; }
.internet-product .dial-button:hover { filter:brightness(.95); }
.internet-product #run-test:disabled { display:none; }
.internet-product .result { border-top:1px solid #d4d8de; margin-top:22px; padding-top:18px; }
.internet-product .result-summary { display:grid; grid-template-columns:1fr 1fr; gap:18px 12px; font-size:13px; margin:0; }
.internet-product .result-summary > div:first-child { display:none; }
.internet-product .result-summary span { display:block; color:#606772; margin-bottom:3px; }
.internet-product .result-summary strong { font-size:21px; font-weight:600; }
.internet-product .result-summary b { color:#252a31!important; }
.internet-product .result-summary small { font-size:12px; color:#606772; font-weight:400; }
.internet-product .receipt { font:12px/1.65 Arial,sans-serif; color:#606772; }
.internet-product .measurement-detail summary { font-size:12px; }
.internet-product .nearby { margin:0!important; padding:20px!important; border:1px solid #d4d8de!important; border-radius:18px; background:white; }
.internet-product .map-heading h2 { font:600 18px/1.3 Arial,sans-serif; letter-spacing:-.3px; }
.internet-product .map-heading > span { font-size:11px; }
.internet-product .speed-legend { margin:14px 0; gap:4px; }
.internet-product .speed-legend span { border-radius:3px; color:#505965; }
.internet-product .landing-map { height:400px; border:0; border-radius:10px; margin:0 0 14px!important; }
.internet-product .map-loading { color:#505965; font:14px/1.5 Arial,sans-serif; }
.internet-product .map-hint { font-size:12px; margin:10px 0 14px; color:#606772; }
.internet-product .location-tools { gap:8px; }
.internet-product #locate-area { background:#eaf2ff; border:1px solid #c2d7f6; color:#23599d; }
.internet-product .map-controls { margin:12px 0; max-width:180px; }
.internet-product .field span { font:600 12px/1.4 Arial,sans-serif; letter-spacing:0; text-transform:none; color:#505965; }
.internet-product .field input,.internet-product .field select { background:white; color:#252a31; border:1px solid #b7bec8; border-radius:8px; font-size:16px; min-height:44px; padding:9px 12px; }
.internet-product .area-reading { background:#e8edf5; border-left:3px solid #315fad; padding:12px 14px; border-radius:0 8px 8px 0; font-size:13px; }
.internet-product #nearby-status { font-size:14px; line-height:1.6; }
.internet-product .comparison-detail,.internet-product .cp-fallback { font-size:13px; margin:12px 0; }
.internet-product summary { cursor:pointer; }
.internet-product summary::marker { color:#315fad; }
.internet-product .map-link { font-size:13px; margin-top:8px; }
.internet-product .invite { margin-top:28px; padding:24px; border:0; border-radius:14px; background:#e3e6ea; }
.internet-product .invite h2 { margin:0 0 6px; font:600 23px/1.3 Arial,sans-serif; }
.internet-product .invite p { margin:0 0 16px; color:#505965; font-size:14px; }
.internet-product .contribution-section,.internet-product .outage-section,.internet-product .attribution-section { margin-top:16px; border:1px solid #d4d8de; border-radius:12px; background:white; padding:18px 22px; }
.internet-product .contribution-section > summary,.internet-product .outage-section > summary,.internet-product .attribution-section > summary { font-size:15px; font-weight:600; }
.internet-product .contribution-section summary span { font-size:11px; font-weight:400; color:#606772; margin-left:8px; }
.internet-product .test-form { margin-top:18px; }
.internet-product .test-form h2 { margin:0; font:600 19px/1.4 Arial,sans-serif; }
.internet-product .form-note,.internet-product .check { font:14px/1.6 Arial,sans-serif; }
.internet-product .outage { border:0; padding-top:0; margin-top:16px; }
.internet-product .outage h2 { margin-top:0; }
.internet-product .no-ads { border:0; max-width:none; margin:18px 0 0; font-size:11px; line-height:1.6; }
.internet-product .test-page .prose { max-width:none; font-size:12px; margin-top:14px; }
.internet-product .source-list { margin-top:18px; }
.internet-product .test-page .dial-nav { display:none; }
@media(max-width:900px) {
 .internet-product .test-page article { display:block; }
 .internet-product .connection-card { position:static; margin-bottom:18px; }
 .internet-product .connection-card .dial-number { font-size:70px; }
 .product-footer { margin-inline:24px; }
}
@media(max-width:600px) {
 .product-header { padding:16px; gap:12px; }
 .product-brand { font-size:21px; }
 .brand-symbol { width:28px; height:28px; font-size:21px; }
 .product-header nav { gap:14px; font-size:12px; }
 .product-header nav a:last-child { display:none; }
 .internet-product main { padding:26px 16px 16px; }
 .internet-product h1 { font-size:32px; letter-spacing:-1px; }
 .internet-product .test-intro { font-size:16px; margin-top:10px; }
 .internet-product .start-note { font-size:11px; margin-bottom:20px; }
 .internet-product .connection-card { padding:20px; }
 .internet-product .connection-card .dial-number { font-size:clamp(48px,17vw,72px); letter-spacing:-3px; }
 .internet-product .nearby { padding:14px!important; }
 .internet-product .landing-map { height:330px; min-height:280px; }
 .internet-product .map-heading { display:block; }
 .internet-product .map-heading > span { display:block; margin-top:4px; }
 .internet-product .speed-legend { font-size:10px; }
 .internet-product .location-tools { display:grid; }
 .internet-product .invite { padding:20px; }
 .internet-product .contribution-section,.internet-product .outage-section,.internet-product .attribution-section { padding:16px; }
 .product-footer { display:block; margin:24px 16px 0; padding-bottom:28px; }
 .product-footer nav { margin-top:18px; font-size:13px; }
}

.contribution-wait { font-size:14px; color:#606772; }
.contribution-section:has(#test-form:not([hidden])) .contribution-wait { display:none; }
#nearby-title { scroll-margin-top:24px; }

/* Keep the test and location action visible before the supporting detail. */
.internet-product main.test-page { padding-top:20px; }
.internet-product .test-page h1 { font-size:24px; letter-spacing:-.6px; margin:0; }
.internet-product .test-page .start-note { margin:6px 0 18px; }
.internet-product .test-page article > .connection-column,
.internet-product .test-page article > .nearby { grid-row:3; }
.internet-product .location-primary { margin-top:12px; }

.result-sharing { margin-top:20px; padding-top:16px; border-top:1px solid #d4d8de; }
.share-heading { font-size:14px; font-weight:600; margin:0 0 12px; }
.share-actions { display:flex; flex-wrap:wrap; gap:8px; }
.internet-product .share-actions .dial-button { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; box-sizing:border-box; }
.internet-product [hidden] { display:none!important; }
#result-share-copy, #map-share-copy { width:100%; box-sizing:border-box; font-size:16px; }
#capacity-map-link { width:100%; order:4; font-size:14px; }
@media(max-width:600px) { .share-actions > * { flex:1 1 140px; } }
