:root{color-scheme:dark;--night:#0c1325;--surface:#151f36;--edge:#2d3a55;--gold:#edd69f;background:var(--night);color:#eef2fc;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif}
body{background:radial-gradient(ellipse at 95% 0%,#26325577,transparent 40%),var(--night)}header{padding:26px 28px;font-size:13px;color:#9cabc4;align-items:center}header a{color:#d6e5ff;text-decoration:none}main{padding:20px 28px 48px;max-width:1160px}
.intro{position:relative;isolation:isolate;overflow:hidden;padding:36px 38px 30px;background:linear-gradient(125deg,#1c2943,#141d32);border:1px solid #2b3953;border-radius:34px;margin-bottom:28px}
.intro:after{content:"✦";position:absolute;right:25px;top:6px;z-index:-1;color:#edd69f22;font-size:180px;line-height:1}
.intro h1{font-size:clamp(32px,5vw,54px);font-weight:800;letter-spacing:-.035em;margin:12px 0 18px;line-height:1.35}.intro p{color:#c0cde2;max-width:750px;font-size:15px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.12em;color:#e5cf9e}
.tabs{background:#111b2ff0;backdrop-filter:blur(18px);border:1px solid #2a3750;border-radius:24px;padding:7px;gap:6px;margin:24px 0;top:10px}
.tabs button{flex:1;border:0;border-radius:18px;background:transparent;color:#a8b8d2;font-weight:700;min-height:56px}.tabs button[aria-pressed=true],.tabs button.selected{background:#ecd69e;color:#1b2437;box-shadow:0 4px 14px #0002}
.panel{padding:30px;background:#151f36;border:1px solid #2a3750;border-radius:28px;box-shadow:0 12px 40px #0000000c;margin:24px 0}.panel h2{font-size:25px;letter-spacing:-.025em;color:#eef2fc}.panel h3{color:#e6edf9}
.controls{gap:18px}.controls label{font-size:13px;color:#b5c4dc;gap:9px}button,input,select{border:1px solid #384963;border-radius:15px;background:#1c2942;color:#edf2ff;min-height:50px;font-size:15px;padding:12px 16px}input[type=range]{padding:0;accent-color:#edd69f}button{font-weight:650}button[aria-pressed=true],button.selected{background:#ecd69e;color:#1b2437;border-color:#ecd69e}.look-controls{padding:7px;background:#0d1729;border:1px solid #29364d;border-radius:22px;gap:5px}.look-controls button{background:transparent;border:0;border-radius:16px}.look-controls button[aria-pressed=true]{background:#293d5b;color:#fff}
#sky-map{padding:14px 0}#sky-map svg{background:#0a1426;box-shadow:0 0 50px #6986bd0a}.horizon-view svg{border:1px solid #2c3c57;border-radius:24px!important}.note{color:#a8b9d4;line-height:1.85}#look-guide{font-size:15px;color:#d8e3f5}
.bright-stars{gap:14px;margin:20px 0}.bright-stars button{padding:22px;border:1px solid #34425a;border-radius:22px;background:linear-gradient(135deg,#1c2b43,#172237);box-shadow:0 5px 20px #00000008}.bright-stars strong{color:#efdbad;font-size:23px}.bright-stars small{color:#aebfd9;font-size:12px}.bright-stars span{font-size:14px;line-height:1.7}
.chips span,.phase-dates div{background:#1e2c45;border:1px solid #34415a;border-radius:18px;color:#c7d4e9}.moon-grid{gap:32px;align-items:center}#moon-picture{padding:24px;border-radius:30px;background:radial-gradient(circle,#27375244,transparent 70%)}
.quiz-options{gap:14px}.quiz-options button{padding:20px;border:1px solid #3a4b68;border-radius:20px;background:#1b2941;min-height:64px;text-align:left}.quiz-feedback{background:#1d2d46;border:1px solid #334564;border-radius:22px;padding:22px;line-height:1.85}details{padding:20px;border:1px solid #2f3f58;border-radius:20px;background:#101b2e}summary{cursor:pointer;color:#d0dcef;line-height:1.8}
footer{border-top:1px solid #2c3951;padding-top:28px;color:#aebdd5;font-size:12px;line-height:1.9}a{color:#b9d9ff}.yt-corner-nav>p{color:#aebdd5}.yt-corner-nav a{background:#16223a;border:1px solid #33425c;border-radius:22px;color:#e4edfd}.yt-corner-nav strong{color:#e4edfd}.yt-corner-nav small{color:#aabbd8}.yt-corner-nav a[aria-current=page]{background:#24334c;border-color:#c9b784}
@media(max-width:700px){header{padding:18px;font-size:12px}main{padding:12px 16px 34px}.intro{padding:28px 24px;border-radius:28px}.intro h1{font-size:34px}.intro p{font-size:14px}.panel{padding:22px 18px;border-radius:24px}.tabs button{padding:10px 5px;font-size:13px}.controls label{min-width:130px}.bright-stars{gap:10px}.bright-stars button{padding:16px}.bright-stars strong{font-size:19px}.quiz-options button{padding:16px;font-size:14px}.moon-grid{gap:18px}}
@media(prefers-reduced-motion:no-preference){.intro{animation:night-arrive .7s ease-out both}.intro:after{animation:night-glow 6s ease-in-out infinite}.panel{animation:night-arrive .5s ease-out both}.bright-stars button,.quiz-options button,.tabs button,.look-controls button{transition:transform .22s,background .22s,border-color .22s}@media(hover:hover){.bright-stars button:hover,.quiz-options button:hover{transform:translateY(-4px);border-color:#a6b6d2}.tabs button:hover{transform:translateY(-2px)}}@keyframes night-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes night-glow{50%{opacity:.4;transform:rotate(12deg) scale(1.06)}}}
@media(prefers-reduced-motion:reduce){.intro,.intro:after,.panel{animation:none!important}}
