.moon-page{max-width:1220px;margin:20px auto;padding:0 14px;color:#172b45}.moon-page>h1{font-size:clamp(23px,3vw,32px);margin:0 0 6px}.moon-page>.kids-seo-lead{margin:0 0 20px}#host{container-type:inline-size;position:relative;isolation:isolate;aspect-ratio:16/9;overflow:hidden;background:#152438 url('./assets/observatory.webp') center/cover;border:4px solid #b19a63;border-radius:18px;color:#fff3d4;font-family:'Zen Maru Gothic',sans-serif;box-shadow:0 12px 30px #11203930}#host *{box-sizing:border-box}#host [hidden]{display:none!important}#base{height:100%;display:flex;flex-direction:column}#host p,#host h2{margin:0}#host button{font:800 clamp(12px,1.55cqw,22px)/1.25 'Zen Maru Gothic',sans-serif;padding:.6em .8em;border:2px solid #c4ab70;border-radius:12px;background:#f5e8c8;color:#142a45;cursor:pointer;min-height:38px;touch-action:manipulation}#host button:hover{filter:brightness(1.06)}#host button:focus-visible{outline:4px solid #72e5e8;outline-offset:3px}#host button:disabled{cursor:default}#host .primary{background:#e8be5e;color:#182b40;border-color:#e3c889;box-shadow:0 4px 0 #8c703a}#host b{font-family:'Fredoka',sans-serif}.observatory-top{height:10%;min-height:44px;padding:0 2%;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#12233ce8;border-bottom:2px solid #b59b66}.observatory-top>strong{font-size:2.2cqw;white-space:nowrap}.observatory-top nav{display:flex;gap:7px}.observatory-top button{background:#12233c!important;color:#ffedc6!important;font-size:1.3cqw!important;min-height:34px!important;padding:.5em .8em!important}#cover{flex:1;min-height:0;display:grid;grid-template-columns:52% minmax(0,1fr);gap:3%;padding:3%}.window-view{display:flex;align-items:flex-start;justify-content:center}.window-view p{background:#0b1a33ad;border:1px solid #ccb771;padding:.45em 1.5em;text-align:center;font-size:2.1cqw;line-height:1.6}.ticket{background:#fff0d1;color:#132a45;box-shadow:0 0 0 3px #a58c56,0 0 0 10px #f7eaca;padding:7% 7%;display:flex;flex-direction:column;justify-content:space-between;text-align:center;min-height:0;gap:8px}.eyebrow{font-size:1.25cqw;letter-spacing:.08em}.ticket h2{font-size:4cqw;line-height:1.25}.ticket>p{font-size:1.6cqw}.cover-moons{display:flex;gap:8%;justify-content:center}.cover-moons canvas{width:26%;height:auto;aspect-ratio:1;background:#11223a;border-radius:50%}#start{font-size:1.9cqw!important;min-height:45px!important}#ready-note{font-size:1.2cqw;line-height:1.5}#play{min-height:0;flex:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:9% minmax(0,1fr) 13%;gap:2%;padding:1.5% 3%;background:#112035b0}.stats{grid-column:1/3;display:flex;justify-content:center;gap:2%;min-height:0}.stats>span{font-size:1.25cqw;display:flex;align-items:center;gap:1em;background:#f4e6c5;color:#182d43;padding:1px 3%;border-radius:7px;border:1px solid #c8ad72;min-width:22%;justify-content:center}.stats b{font-size:2.2cqw;line-height:1}.question{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:2%;padding:2% 1%}.question h2{font-size:2cqw;white-space:nowrap}.moon-window{min-height:0;height:74%;aspect-ratio:1;border-radius:50%;padding:5%;border:3px solid #d4b975;background:#09192b;box-shadow:0 0 0 6px #223647}.moon-window canvas{display:block;height:100%;width:auto;aspect-ratio:1}.question>p{font-size:1.3cqw;background:#17283ae6;border-radius:6px;padding:4px 8px}#current-name{font-weight:900}#choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4%;padding:1% 4%;min-height:0;justify-items:center}#choices button{height:100%;aspect-ratio:1;max-width:100%;min-height:0;min-width:0;padding:0;border:2px solid #e3d3aa;border-radius:8px;position:relative;background:#f7eacb url('./assets/plate.webp') center/100% 100%;display:grid;place-items:center;box-shadow:0 4px 0 #061528}#choices canvas{width:78%;height:auto;aspect-ratio:1;display:block;border-radius:50%;background:#10213a}#choices .choice-number{position:absolute;top:3%;left:5%;font-family:'Fredoka',sans-serif;font-size:1.8cqw;line-height:1.1;z-index:1;color:#14283d}#choices .choice-mark{position:absolute;bottom:0;right:0;font-size:1.3cqw;background:#fff0ca;border-radius:7px;padding:1px 5px;min-width:0}#choices button[data-correct=true]{border-color:#6ae0d2;box-shadow:0 0 0 4px #52b8ab}#choices button[data-wrong=true]{border-color:#e8a26b;box-shadow:0 0 0 4px #d69862}#choices button:disabled{opacity:1}.play-bottom{grid-column:1/3;display:flex;align-items:center;gap:1.5%;min-height:0}.play-bottom>p{flex:1;background:#f7ebd0;color:#18283e;border:1px solid #cbb580;border-radius:9px;padding:.45em .6em;font-size:1.4cqw;font-weight:900;text-align:center}.play-bottom>div{display:flex;gap:7px}.play-bottom button{font-size:1.25cqw!important;padding:.6em .65em!important}#result{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) 12%;gap:3%;padding:2% 5%}.journal{background:url('./assets/journal.webp') center/100% 100%;display:grid;grid-template-columns:45% 55%;color:#182b43;padding:5% 6%;min-height:0;gap:0}.record-summary{display:flex;flex-direction:column;justify-content:space-around;align-items:center;text-align:center;padding-right:10%}.record-summary h2{font-size:2cqw}.record-summary .eyebrow{font-size:1.4cqw}.record-summary p{font-size:1.6cqw}.record-summary b{font-size:2.8cqw}.record-summary .final-score{display:flex;flex-direction:column;font-size:1.8cqw}.record-summary .final-score b{font-size:6.5cqw;color:#987224;line-height:1.1}.record-summary small{font-size:1.05cqw;line-height:1.6}.record-sequence{display:flex;flex-direction:column;justify-content:space-between;text-align:center;padding-left:10%;min-height:0}.record-sequence h2{font-size:2cqw}.record-sequence>p{font-size:1.25cqw}#sequence{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 6px;padding:0;margin:5% 0;min-height:0}#sequence li{min-width:0;position:relative;font-size:1cqw;line-height:1.4;font-weight:800}#sequence canvas{width:100%;aspect-ratio:1;height:auto;border-radius:50%;background:#11223a;display:block}#sequence b{display:block;font-size:1.35cqw}.result-buttons{display:flex;justify-content:center;gap:2%;min-height:0;align-items:center}.result-buttons button{font-size:1.6cqw!important;min-height:38px!important;padding:.5em 1.8em!important}.result-buttons #menu{background:#17283de8;color:#ffedcb}.parent-note{font-size:14px;line-height:1.9;margin:20px 0}#modal{position:absolute;inset:0;background:#051326ba;display:grid;place-items:center;padding:3%;z-index:5}.dialog{background:#fff2d7;color:#172c44;width:68%;max-height:100%;overflow:auto;padding:3%;border:3px solid #c4a269;border-radius:14px}.dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dialog h2{font-size:2.4cqw}#dialog-content{display:grid;gap:12px}.dialog p{font-size:1.65cqw;line-height:1.7}.dialog small{font-size:1.2cqw;line-height:1.7}.dialog label{font-size:1.65cqw}.dialog input{width:100%;min-height:42px}#host:fullscreen{width:100vw;height:100dvh;aspect-ratio:auto;border:0;border-radius:0}#host:fullscreen #base{position:absolute;inset:0;margin:auto;width:min(100vw,177.778dvh);height:min(100dvh,56.25vw)}
@media(max-width:600px) and (orientation:portrait){#host{aspect-ratio:9/18;border-width:3px;border-radius:14px}.observatory-top{height:12%;min-height:68px;flex-direction:column;justify-content:center;gap:5px;padding:4px}.observatory-top>strong{font-size:5cqw}.observatory-top nav{gap:4px;width:100%;justify-content:center}.observatory-top button{font-size:clamp(11px,3.1cqw,15px)!important;min-height:34px!important;padding:.4em .55em!important}#cover{grid-template-columns:1fr;grid-template-rows:28% minmax(0,1fr);padding:4% 7%;gap:5%;background:linear-gradient(transparent 20%,#102038 50%)}.window-view{justify-content:flex-end;align-items:center}.window-view p{font-size:4.5cqw;padding:.5em .7em;background:#13253cad}.ticket{padding:7%;gap:8px;box-shadow:0 0 0 2px #a58c56,0 0 0 6px #f7eaca}.ticket h2{font-size:8cqw}.ticket>p{font-size:4cqw}.ticket .eyebrow{font-size:3.3cqw}.cover-moons{gap:8%}#start{font-size:5cqw!important;min-height:44px!important}#ready-note{font-size:3.3cqw}#play{grid-template-columns:1fr;grid-template-rows:7% 33% minmax(0,1fr) 14%;gap:2%;padding:3% 4%}.stats{grid-column:auto;gap:2%}.stats>span{font-size:3cqw;padding:1px 2%;gap:.6em;flex:1;min-width:0;white-space:nowrap}.stats b{font-size:5cqw}.question{padding:0;gap:2%}.question h2{font-size:4.5cqw}.moon-window{height:71%;padding:3%;border-width:2px;box-shadow:0 0 0 3px #223647}.question>p{font-size:3.2cqw;padding:2px 6px}.question canvas{height:100%}#choices{gap:6px 12%;padding:0 8%}#choices .choice-number{font-size:4cqw}#choices .choice-mark{font-size:3cqw;padding:1px 4px}.play-bottom{grid-column:auto;flex-direction:column;gap:6%;align-items:stretch}.play-bottom>p{font-size:3.3cqw;line-height:1.4;display:grid;place-items:center;padding:.3em .5em}.play-bottom>div{display:flex;justify-content:center;gap:8px}.play-bottom button{font-size:3.6cqw!important;min-height:34px!important;padding:.35em .6em!important;flex:1}#result{grid-template-rows:minmax(0,1fr) 15%;padding:3% 5%;gap:2%}.journal{background-size:205% 100%;background-position:95% center;grid-template-columns:1fr;grid-template-rows:36% minmax(0,1fr);gap:5%;padding:9% 7%}.record-summary{padding:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto auto;gap:2px 5px}.record-summary .eyebrow,.record-summary h2,.record-summary small{grid-column:1/3}.record-summary .eyebrow{font-size:3.3cqw}.record-summary h2{font-size:5cqw}.record-summary p{font-size:3.4cqw}.record-summary .final-score{grid-row:3/5;display:flex;font-size:3.6cqw}.record-summary .final-score b{font-size:12cqw}.record-summary b{font-size:5cqw}.record-summary small{font-size:2.9cqw}.record-sequence{padding:0;gap:4px}.record-sequence h2{font-size:4.5cqw}.record-sequence>p{font-size:3cqw}#sequence{gap:9px 5px;margin:5px 0}#sequence li{font-size:2.75cqw;line-height:1.4}#sequence b{font-size:3.2cqw}.result-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px;align-items:stretch}.result-buttons #resume{grid-column:1/3}.result-buttons button{font-size:4cqw!important;min-height:34px!important;padding:.25em .6em!important}.dialog{width:98%;max-height:96%;padding:5%}.dialog h2{font-size:5.6cqw}.dialog p{font-size:4cqw}.dialog small{font-size:3.1cqw}.dialog label{font-size:4cqw}.dialog button{font-size:4cqw!important}.dialog header{margin-bottom:12px}#host:fullscreen #base{height:100%;width:100%;position:relative}}
@media(min-width:601px) and (max-width:1000px){.observatory-top button{font-size:clamp(11px,1.35cqw,16px)!important;min-height:30px!important}.ticket{padding:5%;gap:5px}.ticket h2{font-size:3.5cqw}#start{min-height:36px!important;font-size:1.8cqw!important}.play-bottom button{min-height:32px!important;padding:.4em!important}.result-buttons button{min-height:32px!important;padding:.4em 1em!important}.dialog small{font-size:12px}.dialog p{font-size:14px}}
@media(prefers-reduced-motion:reduce){#host *{scroll-behavior:auto}}
#sequence{margin:8px 0}#sequence canvas{width:74%;margin:0 auto}#sequence li{line-height:1.4}.record-sequence>p{flex-shrink:0}
@media(max-width:600px) and (orientation:portrait){#sequence canvas{width:100%}#sequence{margin:4px 0;gap:8px 5px}#sequence li{font-size:clamp(10px,2.75cqw,12px)}.record-summary small{font-size:clamp(10px,2.9cqw,12px)}}
.record-sequence{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px}#sequence{grid-template-rows:repeat(2,minmax(0,1fr));height:100%;margin:0}#sequence li{display:grid;grid-template-rows:minmax(0,1fr) 1.4em 4.2em;align-items:start}#sequence canvas{width:100%;height:100%;max-height:100%;min-height:0;object-fit:contain;border-radius:0;background:none;margin:0}#sequence b{font-size:1.15em;line-height:1.2}#sequence li>span{line-height:1.4}
@media(max-width:600px) and (orientation:portrait){.record-sequence{gap:7px}#sequence{gap:7px 5px}#sequence li{grid-template-rows:minmax(0,1fr) 1.4em 4.2em}}
#sequence li{grid-template-rows:minmax(0,1fr) 1.4em 2.8em}
@media(max-width:600px) and (orientation:portrait){.journal{grid-template-rows:30% minmax(0,1fr);gap:5%}#sequence li{grid-template-rows:minmax(0,1fr) 1.4em 2.8em}}