:root{color-scheme:dark;color:#efede8;font-synthesis:none;--muted:#8b8985;background:#080808;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{background:#080808;margin:0;overflow-x:hidden}main{flex-direction:column;align-items:center;min-height:100svh;display:flex;overflow:hidden}.intro{text-align:center;padding:calc(20px + env(safe-area-inset-top)) 20px 0;z-index:2;align-items:baseline;gap:15px;display:flex;position:relative}.time-signature{letter-spacing:.03em;color:#8b8985;font:11px/1.2 Courier New,monospace}h1{letter-spacing:-.035em;margin:0;font:24px/1.2 Georgia,Times New Roman,serif}.title-period{color:#8b8985}.intro p{letter-spacing:.025em;color:var(--muted);margin:0;font-size:12px}.wheel{perspective:1100px;touch-action:pan-y;cursor:grab;isolation:isolate;outline:none;width:100%;height:min(68svh,620px);min-height:330px;margin-top:0;position:relative}.wheel:active{cursor:grabbing}.clock{pointer-events:none;opacity:.38;z-index:-1;width:min(76vw,75svh,670px);height:auto;position:absolute;top:50%;left:50%;overflow:visible;transform:translate(-50%,-50%)}.clock-rim{stroke:#74736e;stroke-width:.8px;fill:none}.clock-inner{stroke:#74736e;stroke-width:.3px;fill:none}.tick{stroke:#898882;stroke-width:.7px}.major{stroke-width:1.3px}.clock-numbers{fill:#908e87;text-anchor:middle;font:14px Georgia,serif}.minute-hand{stroke:#b5b2a8;stroke-width:1.5px;stroke-linecap:round}.hour-hand{stroke:#b5b2a8;stroke-width:2.5px;stroke-linecap:round}.pin{fill:#b5b2a8}.track{transform-style:preserve-3d;perspective:1100px;position:absolute;inset:0}.photo-card{will-change:transform,opacity;transform-style:preserve-3d;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:2px;margin:0;padding:0;position:absolute;top:50%;left:50%;box-shadow:0 18px 45px #0009}.photo-card img{object-fit:contain;user-select:none;-webkit-user-drag:none;border-radius:2px;width:100%;height:100%;display:block}.photo-card[data-central=true]:focus-visible{outline-offset:8px;outline:1px solid #efece4}.wheel:focus-visible{outline-offset:-10px;outline:1px solid #686762}.moment{text-align:center;z-index:2;margin-top:0;position:relative}#photo-date{letter-spacing:-.02em;min-height:29px;font:24px/1.2 Georgia,Times New Roman,serif;display:block}#status{letter-spacing:.01em;color:#8b8985;min-height:16px;margin:12px 0 19px;font:10px/1.6 Courier New,monospace}.controls{justify-content:center;align-items:center;gap:4px;margin-top:8px;display:flex}.controls button{color:#9c9993;letter-spacing:.025em;cursor:pointer;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;gap:8px;width:44px;min-height:44px;padding:0;font:11px Arial,sans-serif;transition:background .15s,transform .12s ease-out;display:flex}.controls button span{clip:rect(0,0,0,0);width:1px;height:1px;position:absolute;overflow:hidden}.controls .arrow{color:#9c9993;background:0 0;border-color:#0000;width:44px;padding:0;font-size:20px}.controls button:active{transform:scale(.97)}.controls svg{fill:none;stroke:currentColor;stroke-width:1.3px;stroke-linecap:round;stroke-linejoin:round;width:12px;height:12px}.play-icon{display:none;fill:currentColor!important;stroke:none!important}[data-playing=false] .play-icon{display:block}[data-playing=false] .pause-icon{display:none}button:focus-visible,a:focus-visible{outline-offset:5px;outline:2px solid #ddd9cd}footer{width:min(100%,1100px);padding:14px 24px calc(18px + env(safe-area-inset-bottom));color:#797771;letter-spacing:.03em;justify-content:center;gap:12px;margin-top:auto;font:9px/1.5 Courier New,monospace;display:flex}footer i{color:#464540;margin:0 5px;font-style:normal}footer a{color:#aaa79f;text-decoration:none}footer a span{color:#73716d;margin-left:5px}#viewer{color:#efede8;text-align:center;background:#080808;border:0;width:100vw;max-width:none;height:100svh;max-height:none;padding:65px 24px 30px;overflow:hidden}#viewer::backdrop{background:#080808ed}#full-image{object-fit:contain;max-width:100%;height:calc(100svh - 140px);margin:auto;display:block}#full-date{margin-top:18px;font:18px Georgia,serif;display:block}#close-viewer{color:#b8b5ad;cursor:pointer;background:0 0;border:0;min-height:44px;font:12px Arial,sans-serif;position:absolute;top:18px;right:24px}#close-viewer span{vertical-align:-1px;margin-left:10px;font-size:20px}.viewer-open{overflow:hidden}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.static-photo{object-fit:contain;width:60%;height:90%;position:absolute;top:5%;left:20%}.no-script{text-align:center;width:100%;font-size:12px;position:absolute;bottom:0}@media (hover:hover) and (pointer:fine){.controls button:hover{background:#ffffff0a;border-color:#ffffff38}.controls .arrow:hover,footer a:hover{color:#fff}}@media (width<=600px){.intro{padding-top:calc(18px + env(safe-area-inset-top));gap:12px}h1{font-size:23px}.wheel{perspective:800px;height:min(68svh,98vw + 90px);min-height:295px}.clock{opacity:.32;width:min(125vw,70svh)}.moment{margin-top:0}#photo-date{font-size:22px}footer{padding:12px 20px calc(16px + env(safe-area-inset-bottom));font-size:9px}.track{perspective:800px}}@media (height<=600px) and (width>=601px){.intro{padding-top:16px}.wheel{height:280px;min-height:250px}.moment{margin-top:0}.clock{width:440px}footer{padding-top:18px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.controls button{transition:none}.photo-card{will-change:auto}}