*{box-sizing:border-box}body{margin:0;background:#080f1c;color:#e9eef3;font-family:Arial,'Noto Sans KR',sans-serif}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{border:1px solid #ffffff25;background:#ffffff07;color:#dce7ed;padding:12px 17px;border-radius:11px;cursor:pointer;transition:background .2s}button:hover{background:#ffffff16}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #e6c58d;outline-offset:3px}button.primary{background:#dec59b;border-color:#dec59b;color:#182129;font-weight:600}button.primary:hover{background:#eed8b4}button[hidden],[hidden]{display:none!important}#sky{position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 10%,#172c42,#080f1c 70%)}#stars{position:absolute;inset:0}.star{position:absolute;background:#fff;border-radius:50%}.haze{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%,#5d859a09,transparent 70%)}header{max-width:1320px;margin:auto;padding:26px 38px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center;font-size:32px;text-decoration:none;color:#dfcaa3}.brand span{font-size:18px;font-weight:600;letter-spacing:1px;color:#eef2f3}.brand small{display:block;font-size:10px;color:#8ea4b9;font-weight:400;margin-top:6px;letter-spacing:2px}.header-actions{display:flex;gap:8px}.header-actions button{font-size:12px}main{max-width:1110px;margin:auto;padding:12px 30px 25px}.mode-switch{display:flex;justify-content:center;gap:6px;background:#0003;border:1px solid #ffffff10;width:max-content;max-width:100%;padding:5px;border-radius:14px;margin:auto}.mode-switch button{border:0;font-size:13px;background:transparent;color:#9db0c2}.mode-switch button.active{background:#2b3c4e;color:#fff}.intro{text-align:center;margin:26px 0}.eyebrow{font-size:11px;color:#d9bd90;letter-spacing:3px}h1{font-size:29px;font-weight:500;letter-spacing:-.8px;margin:12px 0}#lead{font-size:13px;color:#9eafbf}.scene{height:430px;position:relative;border-radius:23px;overflow:hidden;border:1px solid #7b9eb332;background:radial-gradient(ellipse at 55% 10%,#1d334b,#0c1829 60%,#111f2c);isolation:isolate;box-shadow:0 24px 90px #0004}.scene::before{content:'';position:absolute;inset:0;background-image:radial-gradient(1px 1px at 12% 25%,#dbefff 99%,transparent),radial-gradient(1px 1px at 26% 53%,#dbefff 99%,transparent),radial-gradient(1px 1px at 75% 25%,#dbefff 99%,transparent),radial-gradient(1px 1px at 85% 42%,#dbefff 99%,transparent),radial-gradient(1px 1px at 32% 17%,#dbefff 99%,transparent),radial-gradient(1px 1px at 61% 14%,#dbefff 99%,transparent),radial-gradient(1px 1px at 47% 47%,#dbefff 99%,transparent);opacity:.7}.sky-tag,.clock{position:absolute;top:22px;font-size:11px;color:#a6becd;z-index:5}.sky-tag{left:23px;display:flex;gap:8px;align-items:center}.clock{right:23px}.dot{width:5px;height:5px;border-radius:50%;background:#b9ccb8}.moon-position{position:absolute;left:52%;top:11%;width:160px;height:160px;transform:translateX(-50%);transition:width 1.3s,height 1.3s,top 1.3s;z-index:1}.moon-position canvas{width:100%;height:100%;filter:drop-shadow(0 0 16px #dde5e015)}.scene.zoomed .moon-position{width:350px;height:350px;top:7%}.landscape{position:absolute;bottom:0;width:100%;height:180px;transition:opacity 1s}.scene.zoomed .landscape{opacity:.2}.scene-bottom{position:absolute;bottom:18px;left:23px;right:23px;display:flex;justify-content:space-between;align-items:center;z-index:5;font-size:11px;color:#a9bac6}.scene-bottom button{padding:8px 12px;font-size:11px;background:#0c1929cc}.window-frame{position:absolute;inset:-10px;border:25px solid #493e32;border-bottom-width:40px;z-index:3;pointer-events:none;transition:transform 1.5s,opacity 1s;box-shadow:inset 0 0 0 5px #78634a}.window-bar{position:absolute;top:0;bottom:0;left:48%;width:19px;background:#493e32;box-shadow:0 0 0 3px #78634a}.window-sill{position:absolute;left:0;right:0;bottom:21%;height:15px;background:#493e32;box-shadow:0 0 0 3px #78634a}.inside-shade{position:absolute;inset:0;background:#080d15a8;z-index:4;transition:opacity 1s}.entry{position:absolute;z-index:6;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:radial-gradient(ellipse,#0b1226a0,transparent)}.entry>span{font-size:11px;letter-spacing:3px;color:#e1c698}.entry h2{font-size:32px;font-weight:400;line-height:1.5;letter-spacing:-1px;margin:17px}.entry p{color:#b2bec7;font-size:12px;margin-bottom:24px}.scene.outside .window-frame{transform:scale(1.8);opacity:0}.scene.outside .inside-shade{opacity:0;pointer-events:none}.scene.outside .entry{display:none}.scene.outside .window-frame{pointer-events:none}.transition{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#080d19;opacity:0;pointer-events:none;transition:opacity .6s}.transition.show{opacity:1}.transition span{font-size:23px;letter-spacing:2px;color:#dfcba9}.information{display:flex;justify-content:space-between;gap:25px;margin:25px 3px;align-items:center}.label{display:block;font-size:10px;letter-spacing:2px;color:#92aabd}.phase-block h2{margin:8px 0;font-size:26px;font-weight:500}.phase-block p{font-size:12px;color:#a7bac9;margin:0;line-height:1.7}.date-block{display:flex;gap:25px;align-items:center;flex-shrink:0}.date-block strong{display:block;font-size:17px;font-weight:400;margin:10px 0}.date-block small{font-size:11px;color:#8aa1b7}.date-divider{width:1px;height:55px;background:#ffffff18}.controls{display:flex;justify-content:center;gap:10px;align-items:center;margin:20px 0 25px}.date-input input{color-scheme:dark;background:#152235;color:#e5edf3;border:1px solid #ffffff20;border-radius:10px;padding:11px;max-width:160px}.panel{background:#111f30a0;border:1px solid #ffffff13;border-radius:18px;padding:22px 25px}.panel-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.panel-top p{font-size:13px;color:#c2d0db;line-height:1.7;margin:8px 0}.panel-top button{font-size:12px;white-space:nowrap}input[type=range]{width:100%;accent-color:#d9bd90;margin:20px 0 8px}.range-label{display:flex;justify-content:space-between;font-size:11px;color:#a1b4c5}.speed-label{font-size:11px;display:block;margin-top:22px;color:#9fb1c1}select{margin-left:8px;background:#17283b;color:#dfebf3;padding:7px;border:1px solid #ffffff25;border-radius:7px}.note-row{display:flex;align-items:center;gap:12px;margin-top:20px;flex-wrap:wrap}.note-row label{font-size:12px;color:#b0c3d0}.note-row textarea{flex:1;min-width:230px;background:#081421;border:1px solid #ffffff20;border-radius:10px;color:#dce6ed;padding:12px;height:65px;resize:vertical;font-size:12px}.note-row button{font-size:12px}.saved{font-size:11px;color:#d9bd90;margin-bottom:0}#comparison{display:flex;justify-content:center;gap:55px;border-top:1px solid #ffffff12;margin-top:18px;padding-top:14px}#comparison>div{text-align:center}#comparison canvas{width:110px;height:110px;display:block}#comparison span{display:block;font-size:11px;color:#aabfce;margin:8px 0}footer{text-align:center;font-size:10px;color:#6e879d;line-height:1.9;margin:25px 0 0}footer a{color:#96aebf}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}:fullscreen{overflow:auto;background:#080f1c}@media(max-width:750px){header{padding:18px}.header-actions button{padding:9px;font-size:10px}.brand span{font-size:14px}.brand small{font-size:8px}main{padding:10px 16px 25px}h1{font-size:23px}.scene{height:390px}.clock{font-size:9px;right:14px}.sky-tag{left:14px;font-size:9px}.information{display:block}.date-block{justify-content:space-between;gap:13px;border-top:1px solid #ffffff15;margin-top:17px;padding-top:18px}.date-block strong{font-size:15px}.date-block>div{flex:1}.scene.zoomed .moon-position{width:300px;height:300px;top:13%}.controls{gap:6px}.controls button{padding:11px 9px;font-size:12px}.date-input input{padding:10px 6px;font-size:12px;max-width:139px}.panel{padding:18px}.scene-bottom{left:14px;right:14px}.scene-bottom>span{max-width:54%;font-size:10px}.note-row textarea{min-width:100%;order:2}.note-row button{margin-left:auto}.entry h2{font-size:28px}.mode-switch button{padding:11px;font-size:12px}}

.tilt-control{display:flex;justify-content:center;align-items:center;gap:14px;margin:15px auto 0;flex-wrap:wrap}.tilt-control>span{color:#8da5b9;font-size:11px}.tilt-control button{display:flex;gap:10px;align-items:center;font-size:12px;padding:10px 14px}.tilt-control strong{font-size:10px;color:#8fa4b6;font-weight:400}.switch-track{background:#3b4d61;width:28px;height:16px;border-radius:10px;position:relative}.switch-track i{position:absolute;width:10px;height:10px;top:3px;left:3px;background:#b9c8d4;border-radius:50%;transition:transform .2s}.tilt-control button[aria-pressed=true]{border-color:#d6ba8466;background:#d6ba8412}.tilt-control button[aria-pressed=true] .switch-track{background:#cdb17c}.tilt-control button[aria-pressed=true] .switch-track i{transform:translateX(12px);background:#152132}.tilt-control button[aria-pressed=true] strong{color:#e3c797}.tilt-explain{text-align:center;color:#a6b8c8;font-size:11px;line-height:1.8;max-width:700px;margin:10px auto 0}.visibility-badge{position:absolute;left:50%;transform:translateX(-50%);bottom:58px;z-index:5;max-width:90%;text-align:center;font-size:11px;line-height:1.7;background:#091522eb;border:1px solid #6d8da34d;padding:7px 13px;border-radius:9px;color:#c2d5df;white-space:nowrap}.scene.below-horizon .visibility-badge{color:#ead2a8;border-color:#cfaa6566}.scene.below-horizon .visibility-badge::before{content:'◌ ';}.scene.zoomed .visibility-badge{bottom:22px}.scene.zoomed:has(.visibility-badge:not([hidden])) .scene-bottom{bottom:72px}.moon-position{transition:width 1.3s,height 1.3s,top 1.3s,opacity .3s}@media(max-width:750px){.tilt-control{gap:9px}.tilt-control>span{font-size:10px}.tilt-explain{font-size:10px;padding:0 10px}.visibility-badge{white-space:normal;width:max-content;max-width:92%;font-size:10px}.scene.zoomed:has(.visibility-badge:not([hidden])) .scene-bottom{bottom:79px}}

.park-landscape{height:195px}.scene.outside .window-frame{transform:scale(2.1)}.scene.outside .park-landscape{animation:park-arrival 1.7s ease-out both}@keyframes park-arrival{from{transform:scale(1.08) translateY(6px)}to{transform:scale(1) translateY(0)}}@media(prefers-reduced-motion:reduce){.scene.outside .park-landscape{animation:none}}

.creator-credit{font-size:12px;line-height:1.9;color:#b6c7d4;margin:0 0 18px}.creator-credit strong{color:#e6d0a8;font-size:14px;font-weight:600}.creator-credit span{font-size:10px;color:#8ba3b6}