:root{color-scheme:light;--ink:#173d36;--muted:#737b72;--paper:#f7f7ef;--line:#dfe3d6}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.page{max-width:1080px;margin:auto;padding:0 36px}
header{height:104px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{font-size:20px;font-weight:650;text-decoration:none;color:inherit;display:flex;align-items:center;gap:12px}
.brand span{font-size:32px;line-height:1}.timezone{font-size:13px;color:var(--muted)}
.intro{padding:48px 0 29px}.eyebrow{font-size:11px;font-weight:650;letter-spacing:2px}
.intro .eyebrow{color:#7a8364}.intro h1{font-family:Georgia,serif;font-size:46px;font-weight:400;letter-spacing:-1.5px;margin:13px 0}
.intro>p:last-child{font-size:15px;color:var(--muted);margin-bottom:0}
.hero{background:#123c35;color:#f4f5e8;border-radius:22px;padding:36px 40px 0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;box-shadow:0 12px 30px #163a3510}
.hero .eyebrow{color:#b6c6a2}.status h2{font-family:Georgia,serif;font-size:42px;font-weight:400;margin:13px 0 10px}.status p{color:#d0dacb;font-size:14px;margin:0}
.countdown{justify-self:end;text-align:center}#remaining{font-variant-numeric:tabular-nums;font-size:clamp(36px,5.4vw,64px);letter-spacing:1px;font-weight:300;white-space:nowrap}
.units{display:flex;justify-content:space-around;color:#afc2b5;font-size:9px;letter-spacing:1.5px;margin-top:8px}
.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;border-top:1px solid #ffffff24;padding:18px 0;color:#b6cbbb;font-size:11px;letter-spacing:1px;margin-top:9px}
#clock{font-variant-numeric:tabular-nums}.daily{padding:35px 0 44px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:19px}.section-heading h2{font-size:17px;font-weight:600;margin:0}.section-heading>span{font-size:12px;color:var(--muted)}
.times{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.time-card{position:relative;border:1px solid var(--line);border-radius:13px;padding:22px 12px 17px;text-align:center;background:#ffffff70}
.time-card h3{font-size:13px;color:var(--muted);font-weight:500;margin:0 0 13px}.time-card time{font-size:25px;font-variant-numeric:tabular-nums;font-weight:500}.time-card .tag{display:block;font-size:10px;height:14px;margin-top:12px;color:var(--muted)}
.time-card.is-active{background:#e9edda;border-color:#91a278}.time-card.is-active h3,.time-card.is-active .tag{color:#36583b}.time-card.is-next{border-color:#8eaa9c}
#message{background:#fff0d9;border:1px solid #e5c58d;color:#734c16;padding:15px 18px;border-radius:12px;font-size:14px;line-height:1.6}
footer{border-top:1px solid var(--line);padding:23px 0;display:flex;justify-content:space-between;gap:14px;color:var(--muted);font-size:11px;line-height:1.6}
@media(max-width:700px){.page{padding:0 22px}header{height:80px}.intro{padding-top:34px}.intro h1{font-size:38px}.hero{padding:29px 26px 0;grid-template-columns:1fr;gap:25px}.status h2{font-size:36px}.countdown{justify-self:start}#remaining{font-size:56px}.hero-bottom{margin-top:0}.times{grid-template-columns:repeat(3,1fr)}footer{flex-direction:column;gap:4px}}
@media(max-width:360px){.page{padding:0 16px}.timezone{font-size:11px}#remaining{font-size:46px}.section-heading{align-items:start;flex-direction:column}.time-card time{font-size:22px}}