:root{color-scheme:dark;font-family:system-ui,'Noto Sans JP',sans-serif;background:#091322;color:#e6edf8}*{box-sizing:border-box}body{margin:0}header,main{max-width:1150px;margin:auto;padding:22px}header{display:flex;justify-content:space-between;gap:18px;font-size:14px}a{color:#acd8ff}h1{font-size:clamp(32px,6vw,58px);line-height:1.3;margin:14px 0 20px}p{line-height:1.85}.intro{padding:20px 5px 30px}.eyebrow{color:#dfc58d;letter-spacing:.1em}.panel{padding:24px;border:1px solid #31415a;background:#111f34;border-radius:22px;margin:20px 0}.tabs,.actions,.controls{display:flex;gap:12px;flex-wrap:wrap;align-items:end}.tabs{position:sticky;top:0;background:#091322f0;padding:10px 0;z-index:2}.controls label{display:grid;gap:7px}.controls label:has(input[type=checkbox]){display:flex;align-items:center}button,input,select{font:inherit;min-height:46px;padding:10px 14px;border:1px solid #516580;border-radius:10px;background:#1b2e49;color:#edf3ff}button{cursor:pointer}button[aria-pressed=true],button.selected{background:#eed79d;color:#18253a;border-color:#eed79d}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,#sky-map:focus-visible{outline:3px solid #f1be66;outline-offset:3px}button:disabled{opacity:.5}input[type=number]{width:105px}input[type=checkbox]{min-height:20px;width:20px}input[type=range]{display:block;width:100%;height:44px;margin:8px 0 20px;padding:0;accent-color:#ebcb83}.actions{margin:15px 0 22px}.note{font-size:13px;color:#b1bfd2}#sky-map svg{display:block;width:min(100%,760px);margin:auto;height:auto;background:#081321;border-radius:50%}#sky-map{touch-action:pan-y}#sky-message{color:#eed79d}.moon-grid{display:grid;grid-template-columns:minmax(190px,1fr) 2fr;gap:25px;align-items:center}#moon-picture svg{width:100%;max-width:300px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{background:#1e3452;padding:7px 12px;border-radius:20px;font-size:13px}#quiz-body svg{display:block;margin:auto;width:260px;max-width:100%}.quiz-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.quiz-feedback{min-height:80px;padding:16px;border-radius:12px;background:#1f3550;margin:16px 0}footer{font-size:14px;color:#bac8da;margin:40px 0}footer h2{font-size:20px}.phase-dates{display:flex;flex-wrap:wrap;gap:12px}.phase-dates div{padding:16px;background:#1c304a;border-radius:12px}#status{color:#ffd89c}@media(max-width:650px){header,main{padding:12px}.panel{padding:16px}.moon-grid{grid-template-columns:1fr}.moon-grid>div:first-child{text-align:center}.tabs{gap:6px}.tabs button{flex:1;font-size:13px;padding:10px 6px}.controls label{flex:1}h1{font-size:36px}}

.look-controls{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.look-controls button{flex:1;min-width:90px}.horizon-view svg{width:min(100%,820px)!important;border-radius:20px!important}.bright-stars{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.bright-stars button{text-align:left;padding:18px;border-color:#6b7890}.bright-stars strong,.bright-stars span,.bright-stars small{display:block}.bright-stars strong{color:#ffe8a4;font-size:20px}.bright-stars span{margin:9px 0}.bright-stars small{color:#becde0}#look-guide{font-weight:600;color:#dbe7f5}.intro{padding:4px 5px 12px}h1{font-size:clamp(30px,5vw,48px)}@media(max-width:600px){.bright-stars{grid-template-columns:1fr 1fr}.bright-stars button{padding:12px}.bright-stars strong{font-size:16px}.bright-stars span,.bright-stars small{font-size:12px}.look-controls button{min-width:75px;font-size:14px;padding:8px}}

/* Short decorative responses; no moving questions or looping backgrounds. */
@media screen and (prefers-reduced-motion:no-preference){
.hero-art>span,.mode-card,.mode,.yt-learning-nav a,.topic-nav button,.tabs button,.look-controls button{transition:transform .18s ease,box-shadow .2s ease,background-color .2s ease}
.hero .chibi-teacher,.hero .teacher-portrait,.hero-art,.intro{animation:yt-welcome .65s cubic-bezier(.2,.7,.3,1) both}
.hero .teacher-guide:nth-of-type(2) .chibi-teacher{animation-delay:.12s}
.mode-card:nth-child(2),.mode:nth-child(2){animation-delay:.07s}.mode-card:nth-child(3),.mode:nth-child(3){animation-delay:.14s}
.result-medal,.result h1,.goal-celebration{animation:yt-award .65s ease-out 1}
.feedback.good,.feedback.success,.feedback.correct,.correct-message{animation:yt-confirm .35s ease-out 1}
.progress-track>div,.progress>span,.track>span{transition:width .45s ease}
#moon-section:not([hidden])>.panel{animation:yt-welcome .4s ease-out 1}.bright-stars button{transition:transform .18s,box-shadow .18s}.bright-stars button:active{transform:scale(.97)}
@media(hover:hover){.mode-card:hover,.mode:hover,.yt-learning-nav a:hover,.hero-art>span:hover,.bright-stars button:hover{transform:translateY(-4px);box-shadow:0 9px 22px #193e4b1c}.topic-nav button:hover,.tabs button:hover,.look-controls button:hover{transform:translateY(-2px)}}
}
@keyframes yt-welcome{from{opacity:.4;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes yt-award{0%{transform:scale(.86) rotate(-4deg)}60%{transform:scale(1.06) rotate(2deg)}100%{transform:scale(1) rotate(0)}}
@keyframes yt-confirm{0%{transform:translateY(5px);opacity:.65}100%{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{*,*::before,*::after{animation:none!important;transition:none!important;transform:none!important}}

.quiz-settings{display:flex;flex-wrap:wrap;gap:16px;margin:18px 0}.quiz-settings label{display:grid;gap:6px}.quiz-settings select{min-height:44px;font:inherit;padding:8px;border-radius:10px}.quiz-note,.quiz-notes{font-size:.9rem;line-height:1.8}.quiz-notes{margin-top:24px}.quiz-notes summary{cursor:pointer;padding:12px}#quiz-source a,.quiz-notes a{color:#a8dcff}#quiz-body h3{line-height:1.7}#quiz-body button{white-space:normal;text-align:left;line-height:1.6}