.chart-wrapper{position:absolute;inset:0}.sun-canvas{background:oklch(2% .2 200);width:100%;height:100%;display:block}.scrubber{cursor:ew-resize;touch-action:none;position:absolute;inset:0}.zoom-controls{z-index:5;background:var(--surface);-webkit-backdrop-filter:blur(8px);white-space:nowrap;border-radius:8px;gap:2px;max-width:calc(100vw - 32px);padding:4px;display:flex;position:absolute;bottom:16px;left:50%;overflow-x:auto;transform:translate(-50%)}.zoom-sep{background:#ffffff2e;flex-shrink:0;align-self:center;width:1px;height:14px;margin:0 4px}:root{--dots:oklch(from var(--neutral) l c h / calc(alpha - .8));--location:oklch(from var(--neutral) calc(l - .4) calc(c - .1) h);--location-hover:var(--accent);--location-active:var(--accent);--location-pulse:oklch(from var(--location-active) l c h / calc(alpha - .7))}.location-map{aspect-ratio:2;border-radius:6px;width:100%;display:none;overflow:hidden}@media (width>500px){.location-map{display:block}}.location-map .dots circle{stroke:none;fill:var(--dots)}.map-dot{cursor:pointer}.map-dot-fill{fill:var(--location);transition:fill .15s,r .15s}.map-dot:hover .map-dot-fill{fill:var(--location-hover)}.map-dot--active .map-dot-fill{fill:var(--location-active)}.map-dot-ring{fill:var(--location-pulse);transform-origin:50%;transform-box:content-box;animation:.8s ease-out infinite dot-pulse}@keyframes dot-pulse{0%{opacity:1;transform:scale(.6)}to{opacity:.25;transform:scale(1.1)}}.picker-overlay{--ani-duration:.3s;z-index:100;background:var(--surface);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);transition:opacity var(--ani-duration) ease;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.picker-overlay--out{opacity:0;pointer-events:none}.picker-overlay--out .picker-panel{transform:scale(.9)}.picker-panel{background-color:var(--surface-dark);width:min(880px,90vw);transition:transform var(--ani-duration) cubic-bezier(.4, 0, .2, 1);border-radius:1rem;gap:40px;padding:48px 40px 40px;display:flex;position:relative}.picker-list-col{flex-direction:column;flex:0 0 260px;gap:14px;min-height:0;display:flex}.picker-geo{flex-direction:column;flex-shrink:0;gap:6px;display:flex}.picker-geo-title{margin:0 0 .5rem;font-weight:400}.picker-geo-error{color:oklch(75% .15 25);font-size:.72rem;line-height:1.4}.picker-label{text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);flex-shrink:0;margin:0;font-size:.68rem}.picker-list{scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;border:1px solid var(--border-soft);border-radius:.25rem;flex:1;max-height:12rem;margin:0;padding:0;list-style:none;overflow-y:auto}.picker-item{color:var(--text-primary);cursor:pointer;padding:7px 10px;font-size:.95rem;transition:background .1s,color .1s}.picker-item:hover{background:var(--hover)}.picker-item--active{color:oklch(85% .18 75);font-weight:600}.picker-map-col{flex:1;align-items:center;min-width:0;display:flex}.picker-map-col .location-map{aspect-ratio:auto;width:100%;height:100%;max-height:340px;display:block}@media (width<=600px){.picker-panel{flex-direction:column;gap:20px;padding:32px 20px 24px}.picker-list-col{flex:none;max-height:45%}.picker-map-col{flex:1}}*,:before,:after{box-sizing:border-box}:root{--font:"Space Grotesk", sans-serif;--primary:oklch(70% .05 40);--accent:oklch(90% .35 90);--neutral:oklch(95% .02 100);--text-primary:oklch(from var(--neutral) l c h);--text-secondary:oklch(from var(--neutral) calc(l - .2) c h);--surface:oklch(from var(--primary) l calc(c - .1) h / calc(alpha - .8));--surface-dark:oklch(7% .25 200/.8);--border-strong:oklch(from var(--primary) l calc(c - .12) h);--border-soft:oklch(from var(--border-strong) calc(l - .35) c h);--interactive:oklch(from var(--primary) calc(l - .5) calc(c - .1) h);--hover:oklch(from var(--interactive) calc(l + .1) c h);--hover-border:oklch(from var(--hover) calc(l + .1) c h);--active:oklch(from var(--accent) calc(l - .3) c h);--active-border:oklch(from var(--active) calc(l + .1) c h);--font-size-4xl:3rem;--font-size-3xl:2.25rem;--font-size-2xl:1.75rem;--font-size-xl:1.5rem;--font-size-lg:1.25rem;--font-size-md:1rem;--font-size-sm:.8rem;--font-size-xs:.6rem}body{font-family:var(--font);color:var(--text-primary);background:oklch(2.5% .12 240);margin:0;padding:0}.app{height:100dvh;position:relative;overflow:hidden}.btn{font-family:var(--font);font-size:var(--font-size-md);background:var(--interactive);border:1px solid var(--border-soft);color:var(--text-primary);cursor:pointer;border-radius:.25rem;justify-content:center;align-items:center;gap:.5em;height:2em;padding:.25rem .5rem;display:flex}.btn.btn--icon{aspect-ratio:1;padding:0}.btn.btn--active{background-color:var(--active);border-color:var(--active-border)}.btn.btn--outline{border-color:var(--text-primary);background:0 0}.btn:hover{background:var(--hover);border-color:var(--hover-border)}.btn:focus-visible{outline-offset:2px;z-index:99;outline:2px solid oklch(100% 0 0)}.btn.btn--small{font-size:var(--font-size-sm)}.btn-icon{width:1.25em}.app-header{z-index:110;justify-content:center;align-items:center;gap:.5rem;width:100vw;height:48px;display:flex;position:absolute;top:0}@media (width>500px){.app-header{gap:1rem}}.app-title{font-size:var(--font-size-md);letter-spacing:.18em;text-transform:uppercase;color:#0000;background:linear-gradient(to bottom, var(--text-primary) 50%, var(--accent));-webkit-background-clip:text;background-clip:text;order:1;font-weight:500}@media (width>500px){.app-title{font-size:var(--font-size-lg)}}.app-desc{font-size:var(--font-size-sm);color:var(--text-secondary);order:3}.app-icon{order:2;align-self:baseline;width:2.5rem;height:2.75rem;position:relative}.app-icon line,.app-icon path{stroke-width:8px;stroke-linecap:round;fill:none;stroke:var(--text-primary)}@media (width>500px){.app-icon{width:3rem}}.card{background:var(--surface);border:1px solid var(--border-soft);font-family:var(--font);border-radius:14px}.floating-ui{z-index:10;pointer-events:none;align-items:stretch;gap:10px;display:flex;position:absolute;top:56px;left:16px;right:16px}.floating-ui>*{pointer-events:auto}.day-stats{flex:1;justify-content:stretch;min-width:0;display:grid}.stats-cols{grid-template-columns:1fr 1fr;gap:6px 16px;display:grid}@media (width>550px){.stats-cols{grid-template-columns:2fr 1fr}}.stats-left{flex-direction:column;gap:8px;padding:1rem;display:flex}.stats-right{border-left:1px solid var(--border-soft);flex-direction:column;justify-self:stretch;gap:6px;padding:1rem;display:flex}.day-row{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:.5rem;display:flex}@media (width>1000px){.day-row{flex-direction:row;gap:1rem}}.display-day{font-size:var(--font-size-lg);color:var(--text-primary)}@media (width>1000px){.display-day{font-size:var(--font-size-xl)}}.stats-times{flex-direction:column;gap:6px;display:flex}@media (width>800px){.stats-times{flex-direction:row;gap:1rem}}.stat-time{flex-direction:column;gap:1px;display:flex}.stat-label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary)}@media (width>1000px){.stat-label{font-size:var(--font-size-sm)}}.stat-value{font-size:var(--font-size-xl);font-weight:500;line-height:1}@media (width>1000px){.stat-value{font-size:var(--font-size-3xl)}}@media (width>1200px){.stat-value{font-size:var(--font-size-4xl)}}.stat-daylight{font-size:var(--font-size-sm);color:var(--text-secondary)}.empty-hint{color:#ffffff73;padding:6px 0;font-size:.88rem;font-style:italic}.location-header{justify-content:space-between;align-items:center;gap:8px;padding:.5rem 1rem;display:flex}.location-name-text{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:.82rem;font-weight:600;overflow:hidden}.display-year{align-items:center;gap:4px;display:flex}.year-value{font-size:var(--font-size-lg);letter-spacing:.04em;padding:0 2px}.year-mini-stats{flex-direction:column;padding-top:6px;display:flex}.mini-stat-label{font-size:var(--font-size-xs);color:var(--text-secondary);margin-top:3px}.mini-stat-value{font-size:var(--font-size-xs);color:var(--text-primary);font-weight:500}@media (width>1000px){.mini-stat-value{font-size:var(--font-size-sm)}}@media (width<=620px){.floating-ui{flex-direction:column;justify-content:stretch;align-items:stretch;gap:0}.card.location{border-bottom:none;border-bottom-right-radius:0;border-bottom-left-radius:0}.card.location .location-map{display:none}.card.day-stats{border-top-left-radius:0;border-top-right-radius:0}}