@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Libre+Caslon+Display&display=swap";:root{font-family:DM Sans,sans-serif;color:#294845;background:#c5ddda;font-synthesis:none}*{box-sizing:border-box}html{touch-action:manipulation}body{margin:0;overflow:hidden}canvas{position:fixed;inset:0;z-index:0;width:100%;height:100%}#app{position:relative;height:100svh;z-index:1;pointer-events:none}header{position:absolute;top:20px;left:20px}.corner-actions{position:absolute;top:20px;right:20px;display:flex;gap:8px;pointer-events:auto;z-index:2}.eyebrow{font-size:10px;font-weight:600;letter-spacing:.23em}h1{font-family:Libre Caslon Display,Georgia,serif;font-weight:400;font-size:clamp(40px,5.5vw,84px);line-height:1;margin:0 0 10px;letter-spacing:3px}header .eyebrow{position:relative;top:-18px;left:10px}.version{position:absolute;right:10px;bottom:10px;color:#16302c;font-size:11px}nav{display:flex;gap:8px;pointer-events:auto}button{font:inherit;font-size:11px;color:inherit;background:none;border:none;border-radius:30px;padding:12px 20px;cursor:pointer}button:hover{background:#00000012}.icon-button{padding:8px;display:flex;align-items:center;justify-content:center;border-radius:8px}.icon-button svg{display:block;width:32px;height:32px}.icon-button[aria-expanded=true]{background:#0002}button:focus-visible{outline:2px solid #294845;outline-offset:3px}.toolbar{position:fixed;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:auto;touch-action:none;z-index:2;background:#f9f8ed55;border:1px solid #ffffff80;border-radius:12px;padding:4px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:left .3s ease,top .3s ease}.toolbar[data-orientation=horizontal]{flex-direction:row}.toolbar[data-orientation=vertical] nav{flex-direction:column}.toolbar.dragging{opacity:.85;transition:none}.toolbar-handle{padding:8px;line-height:1;cursor:grab;touch-action:none;border-radius:8px;border:1px solid transparent}.toolbar-handle svg{display:block;width:32px;height:32px}.toolbar-handle:active{cursor:grabbing;border-color:#294845}.toolbar-divider{align-self:stretch;background:#29484533}.toolbar[data-orientation=vertical] .toolbar-divider{height:1px}.toolbar[data-orientation=horizontal] .toolbar-divider{width:1px}.toolbar[hidden]{display:none}.panel{flex-direction:column;position:fixed;z-index:3;display:flex;align-items:center;justify-content:center;padding:12px;pointer-events:auto;background:#f9f8ed55;border:1px solid #ffffff80;border-radius:12px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);letter-spacing:2px;font-weight:300}.panel[hidden]{display:none}#sun-preview{position:static;inset:auto;display:block;width:184px;height:184px;border-radius:50%;cursor:grab;touch-action:none}#sun-preview:active{cursor:grabbing}.sun-orbit.weather-orbit{width:390px;height:88px}#weather-preview{position:static;inset:auto;display:block;width:390px;height:88px;cursor:grab;touch-action:none;overflow:visible;-webkit-user-select:none;user-select:none}#weather-preview:active{cursor:grabbing}.weather-rim{fill:none;stroke:#1e2a3080;stroke-width:3;stroke-linecap:round}.weather-tick{fill:#1e2a3099}.weather-letter{font:700 26px DM Sans,sans-serif;fill:#b07a20;text-anchor:middle;dominant-baseline:central}.weather-lens-glass{r:34px;fill:url(#weather-lens-sheen);stroke:#b07a20;stroke-width:2.5}.weather-lens-label{font:800 18px DM Sans,sans-serif;fill:#1e2a30;text-anchor:middle;dominant-baseline:central;pointer-events:none}.weather-lens-label-letter{fill:#b07a20}.sun-hint+.settings-field{margin-top:14px}#status{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:13px;background:#fff9;padding:12px 22px;border-radius:30px}#status:empty{display:none}@media(max-width:600px){button{padding:10px 15px}}@media(max-width:600px){nav{flex-wrap:wrap;gap:6px}button{padding:10px 12px}}header h1,header .eyebrow,.corner-actions .icon-button{transition:color 2.4s ease-in-out,text-shadow 2.4s ease-in-out}canvas[data-sky=day]~#app header h1,canvas[data-sky=day]~#app header .eyebrow,canvas[data-sky=day]~#app .corner-actions .icon-button{color:#1c332f;text-shadow:0 1px 14px #ffffff70}canvas[data-sky=twilight]~#app header h1,canvas[data-sky=twilight]~#app header .eyebrow,canvas[data-sky=twilight]~#app .corner-actions .icon-button{color:#fff6e6;text-shadow:0 1px 14px #00000066}canvas[data-sky=night]~#app header h1,canvas[data-sky=night]~#app header .eyebrow,canvas[data-sky=night]~#app .corner-actions .icon-button{color:#eef6f2;text-shadow:0 1px 14px #00000070}.corner-actions .icon-button{transition:color 2.4s ease-in-out,background-color .15s ease}.corner-actions .icon-button:is(:hover,:not(#fullscreen):is(:focus-visible,[aria-expanded=true])){transition-duration:.15s}canvas[data-sky=day]~#app .corner-actions .icon-button:is(:hover,:not(#fullscreen):is(:focus-visible,[aria-expanded=true])){color:#f4f8f0;background:#25343b}canvas[data-sky=twilight]~#app .corner-actions .icon-button:is(:hover,:not(#fullscreen):is(:focus-visible,[aria-expanded=true])),canvas[data-sky=night]~#app .corner-actions .icon-button:is(:hover,:not(#fullscreen):is(:focus-visible,[aria-expanded=true])){color:#25343b;background:#f4f8f0}.panel{transition:color 2.4s ease-in-out}canvas[data-sky=day]~#app .panel{color:#25343b}canvas[data-sky=twilight]~#app .panel{color:#fff6e6}canvas[data-sky=night]~#app .panel{color:#eef6f2}.panel button:focus-visible{outline-color:#33454d}.sun-orbit{position:relative;width:184px;height:184px}.sun-guide{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.sun-track{fill:none;stroke:#33454d26;stroke-dasharray:2 6}.sun-ray{stroke:#fff;stroke-width:1}.sun-marker{stroke:#ad701a;stroke-width:1.4;fill:none}.sun-disc{fill:#ffe8a0;stroke:#b07a20}.sun-halo{fill:#ffd26930;stroke:none}.sun-heading{display:block;text-align:center;margin:-12px -12px 10px;width:calc(100% + 24px);padding:10px 16px;font-size:16px;font-weight:600;letter-spacing:2px;text-transform:uppercase;background:#1e2a30;color:#f4f8f0;border-radius:12px 12px 0 0}.sun-readout{font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums}.sun-hint{font-size:14px;opacity:.65;margin-top:5px}.ocean-panel{align-items:stretch;width:566px;max-height:calc(100svh - 40px);overflow:auto}.ocean-options{display:flex;flex-direction:column;gap:2px;margin-top:8px;width:100%}.ocean-option{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px;border-radius:8px;font-size:14px;text-align:left;justify-content:flex-start;white-space:nowrap}.ocean-option[aria-checked=true]{background:#33454d20;font-weight:600}.ocean-swatch{width:16px;height:16px;border-radius:50%;flex:none;border:1px solid #ffffff80}.ocean-group-label{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin:10px 0 0;padding:6px 4px;font-size:16px;font-weight:600;letter-spacing:2px;text-transform:uppercase;opacity:.55;cursor:pointer;transition:opacity .15s ease}.ocean-group-label:first-of-type{margin-top:2px}.ocean-group-label:is(:hover,:focus-visible){opacity:.85}.ocean-group-label:after{content:"⌄";flex:none;font-size:13px;letter-spacing:0;text-transform:none}.ocean-group-label[aria-expanded=true]:after{content:"⌃"}.info-panel{position:fixed;top:80px;right:20px;z-index:3;display:flex;flex-direction:column;gap:6px;padding:12px 16px;width:230px;font-family:DM Sans,sans-serif;font-weight:400;font-size:14px;font-variant-numeric:tabular-nums;color:#f4f8f0;background:#1c1c1ed1;border-radius:8px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:none}.info-panel[hidden]{display:none}.info-row{display:flex;justify-content:space-between;gap:12px}.info-row span:first-child{opacity:.65;flex:0 0 112px}.info-row span:last-child{text-align:right;flex:1 1 auto}.settings-panel{align-items:stretch;gap:10px;width:430px}.settings-field{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px;font-size:14px}.settings-field>span{flex:0 0 140px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-field input{font:inherit;font-variant-numeric:tabular-nums;padding:8px 10px;border-radius:10px;border:1px solid #33454d33;background:#ffffffa0;color:inherit;width:100%}.settings-field input:focus-visible{outline:2px solid #33454d;outline-offset:1px}.range-slider{width:230px;flex:0 0 auto;position:relative;border-radius:10px;border:1px solid #33454d33;background:#ffffffa0;overflow:hidden;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.range-slider-fill{position:absolute;inset:0;clip-path:inset(0 100% 0 0);background:#1e2a30;pointer-events:none}.range-slider-value{position:relative;display:block;padding:8px 10px;font-variant-numeric:tabular-nums;text-align:center;pointer-events:none;color:#1e2a30}.range-slider-fill .range-slider-value{color:#f4f8f0}.range-slider:focus-visible{outline:2px solid #33454d;outline-offset:1px}.range-slider-input{text-align:center}.range-slider-value[hidden]{display:none}.settings-panel{background:linear-gradient(165deg,#ffffff8c,#f9f8ed47 45%,#e2ebe066);border-color:#ffffffb3;-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);box-shadow:0 28px 60px -16px #08161480,0 10px 26px -10px #08161452,inset 0 1px #ffffffd9,inset 0 -1px #08161414}.settings-panel .sun-heading{background:linear-gradient(135deg,#25343b,#111a1f);box-shadow:inset 0 -1px #ffffff1a,inset 0 1px #ffffff14}.settings-panel .range-slider{background:linear-gradient(180deg,#ffffffbf,#fff6);border-color:#fffc;box-shadow:inset 0 1px 4px #09161438,inset 0 -1px #fff9;transition:border-color .2s ease}.settings-panel .range-slider:hover{border-color:#fff}.settings-panel .range-slider-fill{background:linear-gradient(135deg,#25343b,#111a1f)}.toolbar .icon-button,.toolbar-handle{transition:color .16s ease,background-color .16s ease}.toolbar .icon-button:is(:hover,:focus-visible,[aria-expanded=true]),.toolbar-handle:is(:hover,:focus-visible){color:#fff}@media(prefers-reduced-motion:reduce){.toolbar .icon-button,.toolbar-handle{transition:none}}.ocean-panel .settings-field>span{flex-basis:280px;white-space:nowrap;overflow:visible;text-overflow:clip}.ocean-panel .range-slider{width:240px}#weather-panel .sun-readout{margin-top:10px;text-align:center}#weather-panel .sun-hint{text-align:center}#automatic-time-resume-hint{font-size:12px;letter-spacing:.5px;margin:0}.corner-actions #fullscreen{transition:color .15s ease,background-color .15s ease}
