/* Only active sessions occupy the shared header. */
:root { --site-header-height: 76px; --gadget-controls-height: 0px; }
.topbar { z-index: 50; }
.gadget-dock { display: flex; align-items: center; gap: 16px; margin-left: auto; flex-shrink: 0; font: 12px/1.4 var(--sans); color: var(--green); }
.gadget-dock-timer, .gadget-dock-sound { display: flex; align-items: center; gap: 3px; }
.gadget-dock a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; text-decoration: none; color: var(--green); }
.gadget-time { font-variant-numeric: tabular-nums; font-family: var(--mono); white-space: nowrap; }
.gadget-dock .gadget-time { min-width: 5ch; }
.gadget-dock button, .gadget-controls button { min-width: 44px; min-height: 44px; padding: 8px; border: 0; border-radius: 5px; background: transparent; color: var(--green); font: inherit; cursor: pointer; }
.gadget-dock button { display: inline-grid; place-items: center; }
.gadget-dock button:hover, .gadget-controls button:hover { background: var(--tint); }
.gadget-dock .icon { width: 17px; height: 17px; }
.gadget-dock a[data-paused='true'] { color: var(--muted); }
.gadget-controls { position: sticky; top: var(--site-header-height); z-index: 39; flex-shrink: 0; max-height: calc(100dvh - var(--site-header-height)); overflow-y: auto; padding: 16px 42px; border-bottom: 1px solid var(--line); background: var(--side, #f3f4ef); font: 13px/1.5 var(--sans); }
.gadget-controls-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-weight: 500; }
.gadget-controls-heading button { font-weight: 400; }
.gadget-control-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 6px; }
.gadget-control-row a { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; text-decoration: none; color: var(--green); }
.gadget-volume { display: flex; align-items: center; gap: 14px; min-height: 44px; color: var(--muted); }
.gadget-volume input { accent-color: var(--green); max-width: 180px; min-width: 60px; }
.gadget-awake-status, .gadget-message { color: var(--muted); font: 12px/1.6 var(--sans); }
.gadget-message:empty, .gadget-awake-status:empty { display: none; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
:target { scroll-margin-top: calc(var(--site-header-height) + var(--gadget-controls-height) + 16px); }
.puzzle-page .sidebar, .puzzle-page .sidebar-backdrop, .puzzle-page .site-footer { display: none; }
.puzzle-page .site-body { margin-left: 0; }
.puzzle-page .menu-toggle { display: none; }
.puzzle-page .topbar-home { display: grid; }
.puzzle-page .topbar { z-index: 40; }
@media (max-width: 1100px) {
  .gadget-dock-sound a span, .gadget-dock-timer [data-dock-label] { display: none; }
  .gadget-dock:has(.gadget-dock-timer:not([hidden])) .gadget-dock-sound { display: none; }
  .topbar:has(.gadget-dock:not([hidden])) .search-link span, .topbar:has(.gadget-dock:not([hidden])) .search-link kbd { display: none; }
  .topbar:has(.gadget-dock:not([hidden])) { gap: 12px; }
  .gadget-dock { gap: 6px; }
  .topbar:has(.gadget-dock:not([hidden])) .topbar-title { max-width: 110px; }
}
@media (max-width: 800px) {
  :root { --site-header-height: 67px; }
  .gadget-dock { gap: 6px; }
  .gadget-dock-timer [data-dock-label], .gadget-dock-timer [data-dock-pause], .gadget-dock-sound [data-dock-sound-pause] { display: none; }
  .gadget-dock:has(.gadget-dock-timer:not([hidden])) .gadget-dock-sound { display: none; }
  .topbar:has(.gadget-dock:not([hidden])) .topbar-title { max-width: 110px; }
  .topbar:has(.gadget-dock:not([hidden])) .search-link span { display: none; }
  .gadget-controls { padding: 12px 24px; }
  .gadget-control-row { gap: 8px 12px; }
  .gadget-control-row .gadget-volume { flex-basis: 100%; }
  .js.sidebar-open .gadget-dock { visibility: hidden; }
}
@media (max-width: 430px) {
  .topbar:has(.gadget-dock:not([hidden])) { gap: 8px; padding-inline: 16px; }
  .topbar:has(.gadget-dock:not([hidden])) .topbar-title { display: none; }
  .gadget-controls { padding-inline: 16px; }
}