:root{color-scheme:dark;--foreground:#fff}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0;overflow:hidden;background:#102026}body{color:var(--foreground);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}.clock-screen{position:relative;display:grid;width:100vw;height:100svh;place-items:center;isolation:isolate;background:radial-gradient(circle at 72% 26%,rgba(196,218,195,.34),transparent 30%),linear-gradient(145deg,#315160,#18333e 48%,#102026)}.background-photo,.background-shade{position:absolute;inset:0;z-index:-2}.background-photo{background-position:center;background-size:cover;opacity:0;transition:opacity 1.8s ease}.background-photo.is-visible{opacity:1}.background-shade{z-index:-1;background:linear-gradient(180deg,rgba(6,13,17,.22),rgba(6,13,17,.34)),radial-gradient(ellipse at center,rgba(8,14,17,.1),rgba(8,14,17,.44))}.clock-panel{--shift-x:0px;--shift-y:0px;width:min(88vw,1020px);padding:clamp(1.5rem,4vw,3.25rem) clamp(2rem,7vw,5rem);text-align:center;border:1px solid rgba(255,255,255,.18);border-radius:clamp(1.5rem,3vw,2.75rem);background:rgba(5,10,13,.48);box-shadow:0 1.5rem 5rem rgba(0,0,0,.25);backdrop-filter:blur(8px);transform:translate3d(var(--shift-x),var(--shift-y),0)}.time-row{display:flex;justify-content:center;align-items:flex-end;gap:clamp(.5rem,1.5vw,1.25rem);line-height:.82}.time{font-size:clamp(8rem,24vw,18rem);font-weight:800;letter-spacing:-.075em;font-variant-numeric:tabular-nums;text-shadow:0 .15em .5em rgba(0,0,0,.32)}.period{margin-bottom:.11em;font-size:clamp(2rem,5vw,4rem);font-weight:800}.date{margin:clamp(1.75rem,4.5vh,3.25rem) 0 0;font-size:clamp(2.15rem,5.2vw,4.5rem);font-weight:700;line-height:1.1;letter-spacing:-.025em;text-wrap:balance}.photo-control{position:absolute;inset-block:0;z-index:2;width:15vw;min-width:72px;padding:0;border:0;opacity:0;cursor:pointer}.previous{left:0}.next{right:0}.photo-control:focus-visible{opacity:1;outline:4px solid #fff;outline-offset:-10px;background:rgba(255,255,255,.08)}.screen-footer{--shift-x:0px;--shift-y:0px;position:absolute;right:clamp(1rem,2.4vw,2rem);bottom:clamp(.75rem,2vh,1.5rem);left:clamp(1rem,2.4vw,2rem);display:flex;align-items:center;justify-content:center;gap:.75rem;min-height:2rem;color:rgba(255,255,255,.72);font-size:clamp(.82rem,1.6vw,1.1rem);font-weight:600;text-shadow:0 1px 5px rgba(0,0,0,.8);opacity:1;transform:translate3d(var(--shift-x),var(--shift-y),0);transition:opacity 2s ease}.screen-footer.is-resting{opacity:0;pointer-events:none}.screen-footer a{color:inherit;text-underline-offset:.18em}.wake-status{width:.5rem;height:.5rem;flex:0 0 auto;border-radius:999px;background:rgba(255,255,255,.35)}.wake-status.is-active{background:#8ed6a0;box-shadow:0 0 .65rem rgba(142,214,160,.55)}@media(orientation:portrait){.clock-panel{width:90vw}.time{font-size:clamp(6rem,25vw,12rem)}.date{font-size:clamp(2.2rem,7vw,4.5rem)}}@media(prefers-reduced-motion:reduce){.background-photo,.screen-footer{transition:none}}