:root{color-scheme:light;--paper:#eeede5;--ink:#38483e;--sage:#53664e;--line:#d4d8cd;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,summary{cursor:pointer}button,a,input,select,summary{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #8c9c7d}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}a{color:inherit}.studio-header{height:50px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:auto}.wordmark{font:28px var(--serif);letter-spacing:-1.4px;text-decoration:none}.wordmark span{color:#82916e}.edition{font-size:9px;letter-spacing:3px;color:#7c8478}.back{font-size:11px;text-decoration:none;color:#717b6b}.back span{margin-left:8px}.studio-main{padding:0 16px 12px;max-width:1600px;margin:auto}.moon-scene{position:relative;height:calc(100svh - 222px);min-height:350px;max-height:1000px;isolation:isolate;overflow:hidden;border:1px solid #afb5ab;border-radius:7px;background:radial-gradient(ellipse at 49% 42%,#647b80 0%,#3b555d 33%,#213a46 70%,#142d3b 100%);box-shadow:0 15px 32px -24px #25392e85,inset 0 0 0 7px #e9e8db0a;color:#f5f3e9}.moon-scene:before{content:'';position:absolute;inset:8px;border:1px solid #e2e8d71c;border-radius:2px;pointer-events:none;z-index:3}.sky{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 2% 100%,#adb9b438,transparent 56%),radial-gradient(ellipse at 90% 0%,#cccdc014,transparent 47%)}.sky:after{content:'';position:absolute;inset:0;opacity:.6;background-image:radial-gradient(circle at 19% 24%,#e5e9db 0 1px,transparent 1.5px),radial-gradient(circle at 76% 19%,#e5e9db 0 .7px,transparent 1px),radial-gradient(circle at 84% 59%,#e5e9db 0 .7px,transparent 1px),radial-gradient(circle at 31% 69%,#e5e9db 0 .6px,transparent 1px),radial-gradient(circle at 65% 78%,#e5e9db 0 .7px,transparent 1px)}.scene-heading{position:absolute;top:25px;left:34px;z-index:2}.scene-heading h1{font:400 26px/1.3 var(--serif);letter-spacing:.3px;margin:0}.scene-heading p{font-size:11px;letter-spacing:.5px;margin:8px 0;color:#c7d1ce}.moon-view{height:100%;display:flex;align-items:center;justify-content:center;gap:3%;padding:65px 8% 44px}.moon-orbit{width:min(46vh,420px);max-width:100%;position:relative;transition:transform .35s ease}.moon-disc{position:relative;aspect-ratio:1;filter:drop-shadow(0 0 35px #d8debd19)}.moon-disc:before{content:'';position:absolute;inset:5%;border-radius:50%;background:radial-gradient(circle,#dce3c814,transparent 70%);box-shadow:0 0 70px 12px #cfd8bb0a}.moon-disc svg,.moon-disc canvas{display:block;width:100%;height:100%;position:relative}.moon-caption{text-align:center;display:flex;flex-direction:column;gap:8px;position:absolute;top:100%;left:-25%;right:-25%;font-size:10px;color:#bdcccb;letter-spacing:.7px;line-height:1.4}.moon-caption-title{font:19px var(--serif);letter-spacing:.4px;color:#f0eee3}.scene-bottom{position:absolute;left:34px;right:30px;bottom:23px;display:flex;align-items:center;justify-content:space-between;z-index:4}.scene-note{font-size:10px;letter-spacing:.6px;color:#c3d0ce}.save-print{display:flex;align-items:center;gap:8px;padding:9px 12px;color:#f1f1e7;background:#ffffff0b;border:1px solid #d9e1d736;border-radius:4px;font-size:11px;backdrop-filter:blur(8px)}.save-print:not(:disabled):hover{background:#ffffff20}.save-print svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.is-pair .moon-orbit{width:min(34vh,310px)}.is-pair .moon-orbit:first-child{transform:translateX(calc(var(--overlap,0)*.6%))}.is-pair .moon-orbit:last-child{transform:translateX(calc(var(--overlap,0)*-.6%))}.is-pair .moon-caption{font-size:9px;letter-spacing:.2px}.is-pair .moon-caption-title{font-size:17px}.is-pair .moon-view{padding-bottom:170px;gap:4%}.blend-control{position:absolute;bottom:65px;left:50%;transform:translateX(-50%);width:180px;color:#c9d3ce}.blend-control label{display:flex;flex-direction:column;gap:9px;align-items:center;font-size:9px;letter-spacing:.5px}.blend-control input{width:100%;height:3px;accent-color:#c6d0b6;cursor:ew-resize}.moon-controls{max-width:760px;margin:auto;padding-top:13px}.mode-switch{display:flex;justify-content:center;gap:3px;margin:0 auto 10px}.mode-switch button{background:none;border:0;border-bottom:1px solid transparent;color:#92988a;padding:4px 17px 6px;font-size:11px;letter-spacing:.3px}.mode-switch button[aria-pressed=true]{color:#38483e;border-color:#6c7a60}.date-controls{display:flex;justify-content:center;gap:10px;align-items:stretch}.date-field{display:flex;align-items:center;gap:18px;background:#f8f7f1;border:1px solid #ccd1c2;padding:7px 15px;border-radius:4px;min-width:0;font-size:11px;color:#6e7868}.date-field input{border:0;background:none;color:#38483e;padding:4px 0;min-width:134px;font-size:15px;width:145px;max-width:100%;height:29px}.find-moon{border:1px solid var(--sage);border-radius:4px;background:var(--sage);color:#fffef3;padding:10px 24px;font-size:12px;letter-spacing:.4px;min-height:46px;white-space:nowrap}.find-moon span{margin-left:18px}.find-moon:hover{background:#43563e}.studio-status{font-size:10px;text-align:center;color:#7d8576;line-height:1.5;margin:8px 0 6px;min-height:15px}.studio-error{font-size:12px;color:#963e34;text-align:center;margin:7px 0}.secondary-controls{display:flex;align-items:start;justify-content:center;gap:28px}.secondary-controls summary{font-size:10px;color:#737d6b;list-style:none;padding:4px 0;line-height:1.5;letter-spacing:.25px}.secondary-controls summary::-webkit-details-marker{display:none}.secondary-controls summary span{margin-left:9px;color:#909a86}.secondary-controls details[open] summary{color:#334b35}.secondary-controls details{position:relative}.details-panel,.about-panel{position:absolute;z-index:10;bottom:31px;left:50%;transform:translateX(-50%);width:min(530px,calc(100vw - 32px));background:#f5f4ed;border:1px solid #d1d5c8;padding:22px;border-radius:8px;box-shadow:0 12px 50px #152c392c;max-height:65svh;overflow:auto}.details-panel fieldset{margin:0 0 14px;padding:0;border:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.details-panel legend{font:19px var(--serif);margin-bottom:16px}.details-panel label{font-size:11px;color:#56644e;display:flex;flex-direction:column;gap:8px}.details-panel label span{font-size:9px;color:#8f9588;display:inline}.details-panel input,.details-panel select{background:#fffdf7;border:1px solid #d0d5c6;border-radius:4px;min-height:39px;width:100%;min-width:0;padding:8px;color:#344831;font-size:13px}.details-panel .location{grid-column:1/-1}.details-panel p,.about-panel p{font-size:12px;line-height:1.7;color:#687361;margin:8px 0}.about-panel{left:auto;right:0;transform:none;width:min(340px,calc(100vw - 32px))}.about-panel p:first-child{font:20px/1.45 var(--serif);color:#364a35;margin-top:0}.about-panel p:last-child{font-size:10px}.about-panel a{text-underline-offset:3px}@media(min-width:1500px){.moon-scene{max-height:920px}}@media(max-width:760px){.studio-header{height:44px;padding:0 17px}.wordmark{font-size:25px}.edition{font-size:8px;letter-spacing:1.8px}.back{font-size:10px}.back span{display:none}.studio-main{padding:0 9px 12px}.moon-scene{height:calc(100svh - 255px);min-height:310px;border-radius:6px}.scene-heading{top:21px;left:24px}.scene-heading h1{font-size:24px}.scene-heading p{font-size:10px;margin-top:6px}.moon-view{padding:65px 6% 72px}.moon-orbit{width:min(60vw,31svh)}.moon-caption{gap:5px;font-size:9px}.moon-caption-title{font-size:16px}.scene-bottom{left:22px;right:19px;bottom:18px}.scene-note{font-size:8px;max-width:48%;line-height:1.5}.save-print{font-size:10px;padding:8px 10px}.moon-controls{padding:12px 8px 0}.date-controls{display:grid;grid-template-columns:1fr auto;gap:8px}.date-field{padding:7px 10px;display:flex;flex-direction:column;gap:3px;align-items:start;font-size:10px}.date-field input{width:100%;min-width:0;height:28px;font-size:16px}.find-moon{font-size:11px;padding:10px 14px;min-height:58px}.find-moon span{margin-left:9px}.mode-switch{margin-bottom:8px}.mode-switch button{font-size:11px;padding:4px 16px 6px}.studio-status{font-size:9px;margin:8px 0 5px}.secondary-controls{gap:24px}.secondary-controls summary{font-size:9px}.details-panel{position:fixed;left:16px;right:16px;width:auto;bottom:55px;transform:none;max-height:70svh}.about-panel{position:fixed;left:16px;right:16px;width:auto;bottom:55px;transform:none}.pair-mode .date-controls{grid-template-columns:1fr 1fr}.pair-mode .find-moon{grid-column:1/-1;min-height:39px}.moon-studio:has(.pair-mode) .moon-scene{height:calc(100svh - 298px);min-height:300px}.is-pair .moon-orbit{width:43%;max-width:160px}.is-pair .moon-view{padding:70px 8% 115px;gap:3%}.is-pair .moon-caption-title{font-size:14px}.is-pair .moon-caption{font-size:8px;left:-13%;right:-13%;gap:5px}.blend-control{bottom:63px;width:145px}.blend-control label{font-size:8px}.is-pair .scene-note{max-width:44%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@media(max-width:360px){.edition{display:none}.scene-heading h1{font-size:22px}.moon-orbit{width:62vw}.date-field{padding:6px 8px}.find-moon{padding:9px 10px}.is-pair .moon-caption span:last-child{font-size:7px}}
/* Accessible panels with reachable, persistent actions. */
.secondary-controls>button{border:0;background:none;color:#65725f;padding:8px 0;font-size:11px;letter-spacing:.2px}.secondary-controls>button span{margin-left:10px}
.panel-dialog{padding:0;border:1px solid #cbd2c3;border-radius:12px;background:#f5f4ed;color:#38483e;width:min(540px,calc(100vw - 28px));max-height:88svh;margin:auto;overflow:hidden;box-shadow:0 20px 80px #102d3c40}
.panel-dialog::backdrop{background:#152c3980;backdrop-filter:blur(4px)}
.panel-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid #d8ddcf;gap:14px}.panel-header h2{font:25px Georgia,serif;margin:0}.panel-header button{flex-shrink:0;width:44px;height:44px;border:1px solid #cbd2c3;border-radius:50%;background:#ebece2;color:#3f5541;font-size:27px}
.panel-dialog .panel-body{position:static;inset:auto;transform:none;width:100%;max-height:calc(88svh - 180px);overflow:auto;overscroll-behavior:contain;border:0;border-radius:0;box-shadow:none;padding:22px}
.panel-footer{padding:14px 22px;background:#f5f4ed;border-top:1px solid #d8ddcf}.panel-footer button{display:block;width:100%;min-height:46px;border:0;border-radius:5px;background:#53664e;color:#fffdf4;padding:12px 18px;font-size:13px}.details-error{font-size:12px;color:#963e34;line-height:1.5;margin:0 0 12px}.panel-dialog .details-panel fieldset:first-child legend{display:none}
@media(max-width:760px){.moon-scene,.moon-studio:has(.pair-mode) .moon-scene{height:82svh;min-height:480px;max-height:none}.moon-orbit{width:min(70vw,39svh)}.moon-view{padding-bottom:100px}.is-pair .moon-view{padding-bottom:145px}.is-pair .moon-orbit{width:44%;max-width:190px}.secondary-controls{gap:25px;padding-bottom:20px}.secondary-controls>button{font-size:11px;min-height:44px}.panel-dialog .panel-body{padding:20px}.panel-header{padding:14px 20px}.panel-header h2{font-size:25px}.panel-dialog .details-panel input,.panel-dialog .details-panel select{font-size:16px;min-height:46px}.panel-footer{padding:14px 20px;padding-bottom:max(14px,env(safe-area-inset-bottom))}}
/* Compact mobile viewport: the picture uses space left by the controls. */
.save-print{width:44px;height:44px;padding:0;justify-content:center;border-radius:50%}.save-print svg{width:21px;height:21px}.find-moon .find-label{margin:0}
@media(max-width:760px){
 .studio-header{height:40px;padding:0 14px}.wordmark{font-size:24px}
 .studio-main{height:calc(100svh - 40px);min-height:440px;padding:0 9px max(6px,env(safe-area-inset-bottom));display:flex;flex-direction:column}
 .moon-scene,.moon-studio:has(.pair-mode) .moon-scene{flex:1;min-height:280px;height:auto;max-height:none;container-type:size}
 .scene-heading{top:17px;left:22px}.scene-heading h1{font-size:23px}.scene-heading p{display:none}
 .moon-view{padding:45px 6% 88px}.moon-orbit{width:min(66vw,55cqh)}
 .moon-caption{gap:4px}.moon-caption-title{font-size:16px}
 .scene-bottom{left:20px;right:16px;bottom:14px}.scene-note{font-size:9px;max-width:70%}
 .is-pair .moon-view{padding:44px 6% 120px}.is-pair .moon-orbit{width:min(43%,45cqh);max-width:190px}.blend-control{bottom:65px}
 .moon-controls{flex:none;width:100%;padding:5px 4px 0}
 .mode-switch{margin:0 0 4px}.mode-switch button{padding:5px 16px;min-height:30px}
 .date-controls,.pair-mode .date-controls{display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:6px}
 .pair-mode .date-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 48px}
 .date-field{padding:3px 8px;gap:0;font-size:9px}.date-field input{font-size:16px;height:27px;padding:1px 0}
 .find-moon,.pair-mode .find-moon{grid-column:auto;min-height:46px;padding:0}.find-moon .find-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.find-moon .find-arrow{margin:0;font-size:24px}
 .studio-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
 .secondary-controls{padding:0;gap:28px}.secondary-controls>button{font-size:10px;min-height:40px;padding:4px 0}
}
@media(max-width:400px){.pair-mode .date-field{padding-left:5px;padding-right:5px}.pair-mode .date-field input{position:relative}.pair-mode .date-field input::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer}}