/* One control size on the homepage and both reading pages. */
:root { --control-height:52px; --control-top:22px; --control-left:22px; }
.theme-toggle,body.reading-page .theme-toggle {
  top:var(--control-top); left:var(--control-left);
  width:104px; height:var(--control-height); min-height:var(--control-height);
}
.theme-toggle:is(:hover,:focus-visible) { transform:none; }
.theme-toggle { isolation:isolate; }
.theme-toggle::before {
  transform:translate3d(0,0,0); backface-visibility:hidden; will-change:transform;
  transition:transform 340ms cubic-bezier(.2,.8,.2,1),background-color 320ms ease,box-shadow 320ms ease;
}
html[data-theme="dark"] .theme-toggle::before { transform:translate3d(52px,0,0); }
.theme-choice { transition:color 320ms ease; }
.time-zones,.reading-page .time-zones { top:var(--control-top); }
.time-zone-toggle {
  box-sizing:border-box; height:var(--control-height); min-height:var(--control-height);
  padding-block:0; align-items:center;
}
@media(prefers-reduced-motion:reduce) {
  .theme-toggle,.theme-toggle::before,.theme-choice { transition:none !important; }
}
@media(max-width:700px) {
  :root { --control-top:max(16px,env(safe-area-inset-top)); --control-left:18px; }
  .time-zones,.reading-page .time-zones { right:18px; }
}