:root { --ink:#ecf1f5; --muted:#8c9aa5; --line:#23303a; --panel:#111b23; --lime:#c7f26b; --orange:#ffb05c; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#071018; font-family:Arial, Helvetica, sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.22; background-image:radial-gradient(#50606b 0.65px,transparent .65px); background-size:7px 7px; mask-image:linear-gradient(to bottom,#000,transparent 75%); }
a { color:inherit; text-decoration:none; }
main { position:relative; width:min(1180px,calc(100% - 48px)); margin:auto; }
.site-header { height:88px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:13px; }
.brand-mark { display:flex; align-items:center; gap:8px; min-height:39px; padding:0 12px; border:1px solid #52616c; border-radius:999px; color:var(--lime); font:700 10px/1 monospace; letter-spacing:.07em; white-space:nowrap; }
.brand-mark b,.brand-mark i { font:inherit; }.brand-mark i { padding-left:8px; border-left:1px solid #40505a; color:#9fb477; }
.brand strong,.brand small { display:block; }.brand strong { font-size:16px; letter-spacing:.08em; }.brand small { margin-top:3px; color:var(--muted); font-size:10px; letter-spacing:.08em; }
nav { display:flex; gap:10px; align-items:center; } nav a { padding:11px 15px; color:#b9c3ca; font-size:13px; border-radius:8px; } nav a:hover { color:white; background:#15212a; }.nav-primary { border:1px solid #3d4b55; }
.demo-banner { margin-top:20px; padding:10px 14px; border:1px solid #63491f; border-radius:7px; color:#e6c58e; background:#2a2114; font-size:12px; letter-spacing:.02em; }.demo-dot { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:var(--orange); box-shadow:0 0 12px var(--orange); }
.hero { min-height:360px; display:flex; align-items:center; justify-content:space-between; gap:60px; padding:60px 0 50px; }
.eyebrow { margin:0 0 13px; color:var(--lime); font:700 11px/1.2 monospace; letter-spacing:.15em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(54px,7.5vw,100px); font-weight:500; line-height:.9; letter-spacing:-.065em; } h1 em { color:#8796a0; font-family:Georgia,serif; font-weight:400; }
.night-verdict { width:340px; display:flex; align-items:center; gap:24px; }.verdict-ring { flex:0 0 132px; aspect-ratio:1; display:grid; place-content:center; text-align:center; border:2px solid var(--lime); border-radius:50%; box-shadow:inset 0 0 30px #c7f26b12,0 0 28px #c7f26b0c; }.verdict-ring strong { color:var(--lime); font-size:23px; }.verdict-ring span { margin-top:3px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.12em; }.night-verdict p { color:#aab6be; font-size:13px; line-height:1.6; }
.night-strip { display:grid; grid-template-columns:repeat(5,1fr); border:1px solid var(--line); border-radius:12px; background:#0d171f; overflow:hidden; }.night-strip>div { min-height:112px; padding:23px; border-right:1px solid var(--line); }.night-strip>div:last-child { border:0; }.night-strip small,.night-strip strong,.night-strip span { display:block; }.night-strip small,.metric small { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.09em; }.night-strip strong { margin:11px 0 6px; font-size:18px; }.night-strip span,.metric span { color:#7f8f9a; font-size:11px; }.good-text { color:var(--lime)!important; }.rain-summary strong { color:#8dcdf2; }.rain-summary span { color:var(--lime); }
.night-strip strong .summary-index { display:inline-grid; place-items:center; width:26px; height:26px; margin-right:5px; border-radius:5px; color:white; font:700 14px/1 monospace; vertical-align:middle; }
.section-block { padding:72px 0 0; }.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:24px; }.section-heading h2 { margin:0; font:400 32px/1.1 Georgia,serif; }.updated,.text-link { color:var(--muted); font-size:12px; }.updated span { display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:var(--lime); }.text-link { padding-bottom:4px; border-bottom:1px solid #43525c; }
.argos-grid { display:grid; gap:12px; }.metric-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }.metric { min-width:0; min-height:165px; padding:22px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }.metric small,.metric strong,.metric span { display:block; }.metric strong { margin:24px 0 8px; font:400 34px/1 monospace; letter-spacing:-.06em; white-space:nowrap; }.metric.good strong { color:var(--lime); }.metric.cool strong { color:#a8d8ff; }
.observatory-status { position:relative; overflow:hidden; border-color:#32424c; }.observatory-status::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,#111b23 4%,#111b23d9 42%,#111b234d 100%); }.observatory-copy { position:relative; z-index:2; }.observatory-copy small,.observatory-copy strong,.observatory-copy span { display:block; }.observatory-copy strong { display:flex; align-items:center; gap:9px; margin:24px 0 8px; color:var(--lime); font:400 29px/1 monospace; letter-spacing:-.05em; }.observatory-copy strong i { flex:0 0 8px; width:8px; height:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 13px #c7f26b99; }.observatory-closed .observatory-copy strong { color:var(--lime); }.observatory-closed .observatory-copy strong i { background:var(--lime); box-shadow:0 0 13px #c7f26b99; }
.observatory-illustration { position:absolute; z-index:0; inset:0; overflow:hidden; background:#071019; }.observatory-illustration img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; opacity:.62; filter:saturate(.6) contrast(1.08); }
.split-section { display:grid; grid-template-columns:1.55fr 1fr; gap:12px; }.astro-card { min-height:250px; padding:27px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }.card-kicker { color:var(--muted); font:700 10px/1 monospace; letter-spacing:.12em; text-transform:uppercase; }.sun-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:45px; }.sun-grid small,.sun-grid strong { display:block; }.sun-grid small { min-height:29px; color:#71818c; font-size:10px; line-height:1.4; }.sun-grid strong { margin-top:8px; font:400 21px/1 monospace; }.darkness-line { position:relative; display:flex; justify-content:space-between; margin-top:43px; padding-top:14px; color:#667781; font:9px/1 monospace; border-top:2px solid #2b3a45; }.darkness-line i { position:absolute; left:20%; right:20%; top:-2px; height:2px; background:var(--lime); box-shadow:0 0 9px #c7f26b88; }.moon-card { display:flex; align-items:center; gap:35px; }.moon-disc { position:relative; flex:0 0 112px; aspect-ratio:1; overflow:hidden; border-radius:50%; background:#dae0d4; box-shadow:0 0 30px #dce7ce24; }.moon-disc i { position:absolute; inset:-3px 36px -3px -40px; border-radius:50%; background:#111b23; }.moon-percent { display:block; margin:14px 0 8px; font:400 45px/1 monospace; }.moon-card p { color:#74848e; font-size:11px; line-height:1.7; }
.moon-full i,.moon-new i{display:none}.moon-new{background:#17232b}.moon-first-quarter i{inset:0 50% 0 0;border-radius:0}.moon-last-quarter i{inset:0 0 0 50%;border-radius:0}.moon-waxing-crescent i{inset:-3px 18px -3px -55px}.moon-waxing-gibbous i{inset:-3px 70px -3px -30px}.moon-waning-crescent i{inset:-3px -55px -3px 18px}.moon-waning-gibbous i{inset:-3px -30px -3px 70px}
.history-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.history-grid article { padding:24px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }.history-title { display:flex; justify-content:space-between; align-items:baseline; }.history-title span { color:var(--muted); font-size:11px; }.history-title strong { font:400 20px/1 monospace; }.chart-with-axis { display:grid; grid-template-columns:34px 1fr; gap:10px; margin-top:25px; }.y-axis { height:110px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; color:#61727d; font:9px/1 monospace; }.bar-chart { height:110px; display:flex; align-items:end; gap:6px; border-bottom:1px solid #43515a; background:repeating-linear-gradient(to bottom,#25343e 0,#25343e 1px,transparent 1px,transparent 27.25px); }.bar-chart i { flex:1; max-width:32px; min-height:3px; background:linear-gradient(to top,#587184,#a8d8ff); opacity:.75; border-radius:2px 2px 0 0; }.bar-chart i:hover { opacity:1; }.wind-chart i { background:linear-gradient(to top,#526b3c,var(--lime)); }.axis-unit { margin:7px 0 0 44px; color:#61727d; font:8px/1 monospace; text-transform:uppercase; letter-spacing:.08em; }
.x-axis { display:flex; justify-content:space-between; margin:8px 0 0 44px; color:#61727d; font:8px/1 monospace; text-transform:uppercase; letter-spacing:.08em; }
.forecast-section { padding-bottom:80px; }.forecast-table { border-top:1px solid var(--line); }.forecast-row { display:grid; grid-template-columns:.65fr 1.35fr .7fr 1.2fr 1.35fr; gap:14px; align-items:center; min-height:58px; border-bottom:1px solid var(--line); color:#aeb8bf; font-size:12px; }.forecast-header { min-height:38px; color:#657580; font:700 9px/1 monospace; text-transform:uppercase; letter-spacing:.12em; }.forecast-row strong { color:white; }.forecast-row>span { display:flex; align-items:center; gap:10px; }.cloud-bar { display:block; width:55px; height:3px; background:#24313a; border-radius:4px; overflow:hidden; }.cloud-bar i { display:block; height:100%; background:#a5b6c0; }.forecast-loading { padding:35px 0; color:var(--muted); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.forecast-row b { font-weight:400; }
.seeing-index { display:inline-grid; place-items:center; width:34px; height:30px; border-radius:5px; color:#fff; font:700 15px/1 monospace; box-shadow:inset 0 0 0 1px #ffffff24; }.arcsec-value { color:#778791; font:10px/1 monospace; }.index-1 { background:#a83b42!important; }.index-2 { background:#d56c3d!important; }.index-3 { background:#bf9f32!important; color:#111a20!important; }.index-4 { background:#328fa6!important; }.index-5 { background:#396fc3!important; }.seeing-legend { display:flex; flex-wrap:wrap; gap:15px; margin-top:18px; color:#7a8993; font-size:10px; }.seeing-legend span { display:flex; align-items:center; gap:6px; }.seeing-legend i { display:grid; place-items:center; width:20px; height:20px; border-radius:4px; color:white; font:700 9px/1 monospace; font-style:normal; }.seeing-note { margin:12px 0 0; color:#657580; font-size:10px; }
.seeing-widget-section { display:grid; grid-template-columns:minmax(0,1fr) 430px; gap:18px; align-items:center; padding-bottom:80px; border-top:1px solid var(--line); }.seeing-widget-frame,.satellite-widget-frame { position:relative; width:100%; padding:14px; overflow:hidden; border:1px solid #30404b; border-radius:14px; background:#0d171f; box-shadow:0 24px 70px #0005; }.satellite-widget-frame { width:min(100%,540px); justify-self:center; }.seeing-widget-frame iframe,.satellite-widget-frame iframe { display:block; width:100%; border:0; border-radius:7px; background:#fff; color-scheme:light; }.seeing-widget-frame iframe { height:790px; }.satellite-widget-frame iframe { height:500px; }.widget-label { position:absolute; z-index:2; top:25px; left:25px; display:flex; flex-direction:column; gap:4px; padding:10px 12px; border:1px solid #ffffff24; border-radius:7px; color:white; background:#09131bd9; pointer-events:none; box-shadow:0 8px 25px #0006; }.widget-label span { font:700 11px/1 monospace; text-transform:uppercase; letter-spacing:.08em; }.widget-label small { color:#91a2ad; font-size:9px; }
.meteogram-section { padding-top:0; padding-bottom:80px; }.meteogram-note,.source-caption { color:#6f808a; font-size:11px; }.meteogram-frame { overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#0c151c; box-shadow:inset 0 0 50px #0006; }.meteogram-frame iframe { display:block; width:100%; height:700px; border:0; color-scheme:dark; filter:saturate(.72) contrast(1.04) brightness(.86); }.source-caption { margin:12px 2px 0; }
footer { display:flex; justify-content:space-between; padding:28px 0 40px; border-top:1px solid var(--line); color:#657580; font:700 10px/1 monospace; letter-spacing:.1em; text-transform:uppercase; }
@media (max-width:800px) { main{width:min(100% - 28px,1180px)}.site-header{height:auto;padding:18px 0;align-items:flex-start}.brand small{display:none}nav{flex-direction:column;align-items:end;gap:0}nav a{padding:6px 8px}.hero{min-height:0;display:block;padding:55px 0 40px}.night-verdict{width:100%;margin-top:45px}.night-strip,.metric-grid{grid-template-columns:1fr 1fr}.night-strip>div{border-bottom:1px solid var(--line)}.night-strip>div:nth-child(even){border-right:0}.night-strip>div:last-child{grid-column:1/-1;border-bottom:0}.section-heading{align-items:flex-start;gap:20px}.split-section,.seeing-widget-section{grid-template-columns:1fr}.seeing-widget-copy{position:static}.seeing-widget-frame{max-width:460px;margin:auto}.forecast-row{grid-template-columns:.65fr 1fr 1.2fr 1.35fr}.forecast-row>*:nth-child(3){display:none}.cloud-bar{width:36px}}
@media (max-width:480px) {.site-header{flex-direction:column;gap:10px}.site-header nav{width:100%;align-items:flex-end}.night-strip,.metric-grid,.history-grid{grid-template-columns:1fr}.night-strip>div{border-right:0;border-bottom:1px solid var(--line)!important}.night-verdict{align-items:flex-start}.verdict-ring{flex-basis:108px}.section-heading h2{font-size:27px}.section-heading>.updated,.section-heading>.text-link{display:none}.metric{min-height:140px}.metric strong,.observatory-copy strong{margin-top:18px}.sun-grid{grid-template-columns:1fr 1fr}.moon-card{gap:22px}.moon-disc{flex-basis:88px}}