/* iwara-sidebar-v1: navigation opens only when requested. */
.header { z-index: 700; }
.header__menu {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
}
.header__menu:hover,
.header__menu[aria-expanded="true"] { background: var(--body); }
.header__menu:focus-visible,
.menu a:focus-visible { outline: 2px solid var(--primary); outline-offset: -3px; }
.header__menu .ico { width: 24px; height: 24px; }
.menu[hidden], .sidebar-backdrop[hidden] { display: none !important; }
.menu {
  z-index: 600;
  width: 248px;
  max-width: calc(100vw - 32px);
  padding: 12px;
  overscroll-behavior: contain;
  box-shadow: 8px 0 24px rgba(0,0,0,.25);
}
.menu:not([hidden]) { animation: sidebar-enter .18s ease-out; }
.menu a { padding: 14px 16px; font-size: 16px; }
.menu a .ico { width: 24px; height: 24px; flex-shrink: 0; }
.menu a span { display: inline; }
.sidebar-backdrop {
  position: fixed;
  z-index: 550;
  inset: 64px 0 0;
  background: rgba(0,0,0,.48);
  touch-action: none;
}
body.sidebar-open { overflow: hidden; }
.content, .footer { padding-left: 15px; }
@keyframes sidebar-enter {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}
@media (prefers-reduced-motion: reduce) {
  .menu:not([hidden]) { animation: none; }
}
