:root { --muted: #9aa8bf; }
[hidden] { display: none !important; }
.help-top { height:52px; padding:0 22px; flex-wrap:nowrap; }
main { max-width:1040px; padding:0 28px; margin:auto; }
.arrival-banner { display:flex; align-items:center; gap:10px; padding:10px 14px; margin-top:20px; border:1px solid #745126; background:#ffb3470c; border-radius:8px; color:#e4cfae; font-size:12px; }
.arrival-banner b { margin-left:auto; white-space:nowrap; color:var(--accent); }
.status-dot { width:6px; height:6px; border-radius:50%; background:var(--accent); flex-shrink:0; }
.hero { padding:32px 0 0; }
.eyebrow { color:var(--accent); font-size:10px; letter-spacing:1.7px; margin-bottom:10px; font-weight:700; }
h1 { font-size:clamp(30px,4.3vw,49px); line-height:1.14; letter-spacing:-1.6px; max-width:900px; }
h1 em { font-style:normal; color:var(--accent); }
.intro { max-width:710px; font-size:15px; line-height:1.65; color:#aebbd0; margin:16px 0 20px; }
.actions { display:flex; gap:24px; align-items:center; flex-wrap:wrap; margin-bottom:26px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:11px 17px; border:0; border-radius:7px; font:700 12px var(--font); cursor:pointer; }
.primary { background:var(--accent); color:#1a1205; }
.primary:hover { background:#ffc873; text-decoration:none; }
.text-link { color:#bcc7da; font-size:12px; }
/* Same hero embed treatment as the live homepage. */
.live-frame { position:relative; }
.live-frame iframe { display:block; width:100%; aspect-ratio:16 / 10; border:1px solid var(--line); border-radius:10px; background:#07090f; pointer-events:none; transition:border-color .2s ease; }
.live-frame:hover iframe { border-color:var(--accent); }
.live-tag { position:absolute; top:10px; left:10px; z-index:3; font-size:10px; font-weight:700; letter-spacing:1px; color:#1a1205; background:var(--green); border-radius:5px; padding:3px 8px; pointer-events:none; }
h2 { font-size:23px; line-height:1.3; letter-spacing:-.4px; }
.views-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:1040px; margin-inline:auto; }
.views-note { max-width:1040px; margin:10px auto 0; font-size:10px; color:#a4b1c6; }
.views-grid a { display:flex; flex-direction:column; gap:6px; min-width:0; color:#cbd9eb; text-decoration:none; }
.views-grid img { display:block; width:100%; height:auto; aspect-ratio:16 / 10; object-fit:cover; border:1px solid var(--line); border-radius:10px; background:#07090f; transition:border-color .2s ease; }
.views-grid a:hover img { border-color:var(--accent); }
.views-grid b { font-size:12px; color:var(--text); margin-top:4px; }
.views-grid span { font-size:11px; line-height:1.5; color:var(--muted); }
@media (max-width:640px) { .views-grid { grid-template-columns:1fr; gap:16px; } }
.outlook { margin-top:24px; padding:22px; border:1px solid #27344a; border-radius:10px; background:linear-gradient(135deg,#111b2b,#0c1220); }
.section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }
.section-heading > span { font-size:10px; color:#a4b1c6; }
#outlook-summary { margin:12px 0 20px; color:#b4c1d4; font-size:13px; max-width:770px; }
.readings { display:grid; grid-template-columns:1fr 1fr 1.3fr; gap:20px; padding:18px 0; border-top:1px solid #263348; border-bottom:1px solid #263348; }
.readings > div { display:flex; flex-direction:column; gap:5px; }
.metric-label { font-size:9px; color:#a5b5ca; letter-spacing:.6px; }
.readings strong { font-size:21px; font-weight:500; }
.readings small { font-size:10px; color:var(--muted); }
.outlook-links { display:flex; gap:24px; margin-top:14px; font-size:11px; }
.validation { display:flex; gap:32px; align-items:center; padding:26px 4px; border-bottom:1px solid var(--line); }
.validation > div { display:flex; flex-direction:column; flex-shrink:0; }
.validation strong { font-size:24px; color:#cbd9eb; }
.validation span { font-size:10px; color:var(--muted); }
.validation p { margin-left:auto; font-size:11px; color:var(--muted); }
.validation a { color:var(--accent); }
.replay { display:grid; grid-template-columns:.8fr 1.2fr; gap:32px; align-items:center; padding:40px 0; }
.replay-copy p:not(.eyebrow) { color:#aebbd0; font-size:13px; margin:13px 0 20px; }
.replay-copy .text-link { display:inline-block; margin:12px 0 0 14px; }
.replay-art { min-height:235px; border:1px solid #27334a; border-radius:12px; background:radial-gradient(ellipse at 34% 54%,#50322044,#0a1121 65%); position:relative; overflow:hidden; }
.orbit { border:1px solid #47608777; border-radius:50%; position:absolute; width:180px; height:180px; left:calc(34% - 90px); top:calc(54% - 90px); transform:rotate(-20deg) scaleY(.68); }
.orbit-two { width:300px; height:300px; left:calc(34% - 150px); top:calc(54% - 150px); }
.replay-sun { position:absolute; width:20px; height:20px; left:calc(34% - 10px); top:calc(54% - 10px); background:#ffcd77; border-radius:50%; box-shadow:0 0 22px 9px #ffb34755; }
.replay-earth { position:absolute; width:9px; height:9px; background:#83d6ff; border-radius:50%; left:67%; top:65%; box-shadow:0 0 14px #83d6ff99; }
.replay-wave { position:absolute; width:155px; height:155px; border:2px solid #ffb347aa; border-left:0; border-bottom:0; border-radius:50%; transform:rotate(35deg); left:30%; top:23%; box-shadow:8px -7px 25px #ffb34718; }
.art-label { position:absolute; bottom:18px; left:18px; font-size:10px; letter-spacing:1.5px; color:#e2be8a; }
.signup { display:grid; grid-template-columns:1.1fr 1fr; gap:36px; padding:28px; background:#151722; border:1px solid #403525; border-radius:12px; }
.signup p { color:#aebbd0; font-size:12px; margin:12px 0; }
.signup a { font-size:11px; color:var(--accent); }
.signup form { align-self:center; }
.signup label { display:block; font-size:12px; margin-bottom:10px; }
.signup-row { display:flex; gap:8px; }
.signup input { width:100%; min-width:0; background:#090e18; border:1px solid #344059; border-radius:6px; padding:10px; color:var(--text); font:12px var(--font); }
.signup form p,.signup small { font-size:10px; color:#9cabc2; }
.explore,.answers { padding:36px 0; }
.explore-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:18px; }
.explore-grid a { display:flex; flex-direction:column; gap:6px; padding:15px; border:1px solid #263146; border-radius:8px; background:#0e1421; }
.explore-grid a:hover { border-color:#8c6836; text-decoration:none; }
.explore-grid b { font-size:12px; color:#d6dfed; }
.explore-grid span { color:#9cabc2; font-size:11px; }
.answers { border-top:1px solid var(--line); padding-top:26px; }
.faq { margin:16px 0; }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { cursor:pointer; padding:12px 0; font-size:13px; }
.faq p { color:#aebbd0; font-size:12px; padding-bottom:16px; max-width:780px; }
footer { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; color:#8f9eb5; border-top:1px solid var(--line); font-size:10px; padding:22px; }
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible { outline:2px solid #8dd8ff; outline-offset:4px; }
@media(max-width:640px) {
 main { padding:0 18px; } .help-top { padding:0 18px; } .preview-note { padding:7px 18px; font-size:9px; } .preview-note > span { display:none; }
 .arrival-banner { flex-wrap:wrap; gap:5px 8px; font-size:10px; margin-top:14px; padding:8px 10px; } .arrival-banner b { font-size:10px; }
 .hero { padding-top:22px; } h1 { letter-spacing:-1px; } .intro { font-size:13px; margin:12px 0 16px; } .actions { gap:13px; margin-bottom:20px; } .button { padding:10px 13px; font-size:11px; } .text-link { font-size:11px; }
 h2 { font-size:20px; } .outlook { padding:16px; margin-top:18px; } .section-heading { flex-wrap:wrap; gap:8px; } #outlook-summary { font-size:12px; margin-bottom:14px; }
 .readings { grid-template-columns:1fr 1fr; gap:16px; padding:14px 0; } .readings > div:last-child { grid-column:1/-1; } .readings strong { font-size:18px; } .outlook-links { gap:16px; font-size:10px; }
 .validation { flex-wrap:wrap; gap:16px 28px; padding:20px 0; } .validation p { margin-left:0; width:100%; } .validation strong { font-size:22px; }
 .replay { grid-template-columns:1fr; gap:18px; padding:28px 0; } .replay-art { min-height:180px; } .signup { grid-template-columns:1fr; gap:16px; padding:20px; } .signup-row { flex-wrap:wrap; } .signup-row input { flex:1; min-width:140px; }
 .explore,.answers { padding:28px 0; } .explore-grid { grid-template-columns:1fr 1fr; gap:8px; } .explore-grid a { padding:12px; } .explore-grid b { font-size:11px; } .explore-grid span { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }



.spacecraft { padding:30px 0; border-bottom:1px solid var(--line); }
.spacecraft > p { margin:10px 0 20px; color:var(--muted); font-size:13px; }
.spacecraft-grid { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
.spacecraft-grid a { display:flex; flex-direction:column; align-items:center; gap:8px; min-width:0; color:#cbd9eb; font-size:10px; text-align:center; }
.spacecraft-grid img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; border:1px solid var(--line); border-radius:10px; background:#07090f; }
.spacecraft-grid a:hover { color:var(--accent); text-decoration:none; }
.spacecraft-grid a:hover img { border-color:var(--accent); }
@media(max-width:800px) { .spacecraft-grid { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media(max-width:640px) { .spacecraft { padding:26px 0; } .spacecraft-grid { gap:14px 8px; } .spacecraft-grid a { font-size:9px; } .spacecraft > p { font-size:12px; } }

/* The Sun right now: SDO tile beside the copy. */
.sun-now { display:grid; grid-template-columns:1fr 240px; gap:28px; align-items:center; margin-top:24px; padding:22px; border:1px solid #27344a; border-radius:10px; background:linear-gradient(135deg,#111b2b,#0c1220); }
.sun-copy p { color:#b4c1d4; font-size:13px; max-width:60ch; margin:12px 0; }
.sun-stats-line { color:var(--text); }
.sun-tile { width:240px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:10px; justify-self:end; }
.sun-tile:hover { border-color:var(--accent); }
.sun-tile img { width:100%; aspect-ratio:1 / 1; object-fit:cover; border-radius:8px; display:block; background:#000; }
.sun-tabs { display:flex; gap:4px; margin-top:8px; }
.sun-tabs button { flex:1; font:inherit; font-size:10px; letter-spacing:.3px; padding:4px 2px; cursor:pointer; background:transparent; color:var(--muted); border:1px solid var(--line); border-radius:5px; }
.sun-tabs button:hover { border-color:var(--accent); color:var(--text); }
.sun-tabs button.on { background:rgba(255,179,71,.12); border-color:var(--accent); color:var(--accent); }
.sun-src { display:block; font-size:10.5px; color:var(--muted); margin-top:6px; }
.learn-home { margin-top:36px; padding:22px; border:1px solid #27344a; border-radius:10px; }
.learn-home p { color:#b4c1d4; font-size:13px; max-width:72ch; margin:12px 0 18px; }
.learn-home .actions { margin-bottom:0; }
@media (max-width: 720px) { .sun-now { grid-template-columns:1fr; } .sun-tile { justify-self:start; width:100%; max-width:300px; } }
.outlook-regions { margin:-10px 0 18px; color:#9fb3cc; font-size:12px; max-width:770px; }
