.header-clock{min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.clock-reading{display:grid;grid-template-columns:auto auto;grid-template-areas:"time toggle" "date date";align-items:center;column-gap:7px;row-gap:3px;width:max-content}.clock-reading>time{grid-area:time;color:var(--text);font-size:1.3rem;font-weight:780;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}.clock-date{grid-area:date;display:flex;align-items:center;justify-self:start;gap:4px;color:var(--muted);font-size:.53rem;letter-spacing:.025em;white-space:nowrap}.clock-date b{color:var(--lime);font-size:.5rem;letter-spacing:.08em}.clock-date b:not([hidden])::before{content:"· ";color:var(--muted)}.clock-toggle{grid-area:toggle;display:flex;white-space:nowrap}.clock-toggle button{min-height:24px;border:1px solid var(--accent-border);background:var(--surface-row);color:var(--muted);padding:2px 5px;font:750 .5rem ui-monospace,monospace;cursor:pointer}.clock-toggle button:first-child{border-radius:5px 0 0 5px}.clock-toggle button:last-child{margin-left:-1px;border-radius:0 5px 5px 0}.clock-toggle button.active{position:relative;border-color:var(--lime);background:var(--lime);color:var(--accent-ink)}.clock-toggle button:focus-visible{outline:2px solid var(--mint);outline-offset:2px}@media(max-width:650px){.clock-reading{column-gap:6px;row-gap:2px}.clock-reading>time{font-size:1.17rem}.clock-date{font-size:.46rem}.clock-date b{font-size:.45rem}.clock-toggle button{min-height:24px;padding:2px 3px;font-size:.45rem}}