*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;min-height:100%;background:#19282a;color:#eae7d6;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{transition:background .2s}main{position:relative;min-height:100vh;overflow:hidden;padding:4.5vh 5vw 3vh;display:flex;flex-direction:column}header{display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:2px;text-transform:uppercase;position:relative;z-index:1}#room-name{max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.place{font-size:10px;letter-spacing:1px;opacity:.6;max-width:45%;text-align:right}.hero{display:flex;align-items:center;justify-content:space-between;flex:1;padding:7vh 0 6vh;position:relative;z-index:1}.time-panel{width:65%}.eyebrow{font-size:10px;letter-spacing:2px;opacity:.55;margin:0 0 20px}.clock-line{display:flex;align-items:baseline;white-space:nowrap}#clock{font-size:16vw;line-height:1.05;font-weight:250;letter-spacing:-.8vw;font-variant-numeric:tabular-nums}#period{font-size:2vw;margin-left:1.5vw;opacity:.6}#date{font-size:2.2vw;margin:2vh 0 0;font-weight:300}.zone{font-size:10px;opacity:.4;margin-top:14px}#weather-panel{width:29%;text-align:right;border-left:1px solid rgba(200,210,190,.18);padding-left:3vw}.weather-symbol{font-size:4vw;opacity:.8;line-height:1}.temp{font-size:8vw;font-weight:250;letter-spacing:-.3vw;margin:12px 0 0}#unit{font-size:2.4vw;letter-spacing:0;opacity:.6}#condition{font-size:1.7vw;margin:8px 0}.weather-detail{font-size:1.2vw;opacity:.6;margin:12px 0}#forecast-panel{position:relative;z-index:1;border-top:1px solid rgba(200,210,190,.18);padding-top:22px}.forecast-heading{display:flex;justify-content:space-between}.forecast-heading>span:last-child{font-size:10px;opacity:.45}.forecast-heading .eyebrow{margin-bottom:15px}#forecast{display:flex;justify-content:space-between;min-height:70px}.forecast-hour{width:16.66%;border-left:1px solid rgba(200,210,190,.12);text-align:center;padding:4px 0}.forecast-hour:first-child{border-left:0}.forecast-hour span{display:block;font-size:11px;opacity:.55}.forecast-hour strong{display:block;font-weight:400;font-size:25px;margin:9px 0 2px}.forecast-placeholder{font-size:12px;opacity:.5}footer{display:flex;justify-content:space-between;align-items:flex-end;position:relative;z-index:1;font-size:9px;line-height:1.7;padding-top:24px;opacity:.55}footer p{margin:0;max-width:40vw}footer a{color:inherit}button{font:inherit;color:inherit;background:transparent;border:1px solid currentColor;border-radius:5px;padding:5px 10px;cursor:pointer;margin-top:8px}a:focus,button:focus{outline:2px solid currentColor;outline-offset:4px}.landscape{position:absolute;bottom:0;left:0;width:100%;height:22vh;fill:currentColor;opacity:.035;pointer-events:none}.landscape path:last-child{opacity:.5}body[data-view=clock] .time-panel{width:100%;text-align:center}body[data-view=clock] .clock-line{justify-content:center}body[data-view=clock] #clock{font-size:23vw}body[data-view=clock] #weather-panel,body[data-view=clock] #forecast-panel,body[data-view=clock] #weather-credit{display:none}body[data-view=glance] #forecast-panel{display:none}body[data-mode=light]{background:#f0ecdf;color:#445046}body[data-theme=keycap]{background:#24262a;color:#eea26b;font-family:Menlo,Consolas,monospace}body[data-theme=keycap] .time-panel{border-radius:14px;padding:20px;background:rgba(128,128,128,.08)}body[data-theme=keycap] #clock{font-weight:600;font-size:14vw}body[data-theme=keycap][data-view=clock] #clock{font-size:20vw}body[data-theme=keycap][data-mode=light]{background:#e8e9e5;color:#8d481c}body[data-theme=edition]{background:#292421;color:#eee3cf;font-family:Georgia,"Times New Roman",serif}body[data-theme=edition] header{border-bottom:3px double currentColor;padding-bottom:14px}body[data-theme=edition] #clock{font-weight:400}body[data-theme=edition][data-mode=light]{background:#eee5d5;color:#41372e}body[data-theme=terminal]{background:#102219;color:#a4d89b;font-family:Menlo,Consolas,monospace}body[data-theme=terminal] .clock-line{font-weight:400}body[data-theme=terminal] .landscape{display:none}body[data-theme=terminal][data-mode=light]{background:#e1eddb;color:#315f30}body[data-theme=tide]{background:#172f43;color:#c0e2ee}body[data-theme=tide] .hero{border-radius:25px;background:rgba(160,200,220,.04);padding-left:3vw;padding-right:3vw;margin:3vh 0}body[data-theme=tide][data-mode=light]{background:#e0edf2;color:#285a71}.missing{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:35px}.missing h1{font-family:Georgia,serif;font-size:40px;font-weight:400;margin:0 0 15px}.missing p:not(.eyebrow){font-size:14px;line-height:1.7;max-width:450px;opacity:.65}.missing a{color:inherit;font-size:13px;margin:12px;display:inline-block}#room-choices{margin:20px 0}body.preview main{padding:5vh 5vw}body.preview header{font-size:2vw}body.preview .place{font-size:1.5vw}body.preview .eyebrow{font-size:1.6vw;margin-bottom:3vh}body.preview .hero{padding:5vh 0}body.preview .zone{font-size:1.5vw;margin-top:2vh}body.preview footer{font-size:1.3vw;padding-top:3vh}body.preview footer p{max-width:none}body.preview #display-note,body.preview #weather-credit{display:none}body.preview #forecast-panel{padding-top:3vh}body.preview .forecast-heading>span:last-child{font-size:1.3vw}body.preview #forecast{min-height:9vh}body.preview .forecast-placeholder{font-size:1.7vw}body.preview #forecast-panel .eyebrow{margin-bottom:2vh}@media(max-width:600px) and (min-height:600px){.hero{flex-direction:column;align-items:stretch;padding:7vh 0 4vh}.time-panel{width:100%}#clock{font-size:24vw}#period{font-size:4vw}#date{font-size:4vw}#weather-panel{width:100%;border-left:0;border-top:1px solid rgba(200,210,190,.18);padding:25px 0 0;margin-top:25px;text-align:left}.weather-symbol{float:right;font-size:10vw}.temp{font-size:16vw}#unit{font-size:5vw}#condition{font-size:4vw}.weather-detail{font-size:3vw}footer{flex-wrap:wrap}footer>*{margin-top:10px}footer p{max-width:80vw}.forecast-hour strong{font-size:20px}.place{font-size:8px}body[data-view=clock] .hero{justify-content:center}body[data-theme=keycap] #clock{font-size:22vw}body[data-theme=keycap][data-view=clock] #clock{font-size:22vw}}