/* One vertical navigation on phones and tablets, including landscape. */
.mobile-nav-heading,.mobile-nav-backdrop{display:none}
@media(max-width:1100px){
  .header{position:sticky;top:0;height:76px;z-index:30}
  .header .nav{height:100%;flex-wrap:nowrap;padding-block:0;gap:12px}
  .header .nav-end{margin-left:auto;gap:10px}
  .header .collection-label,.header .search-launch>span{display:none}
  .header #menuToggle{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:1px solid #d6b57566;border-radius:12px;background:#d6b5750c;color:#e1bf7a;font-size:24px;line-height:1}
  .header #menuToggle[aria-expanded=true]{background:#d6b575;color:#101114}
  .header #menuToggle:focus-visible,.header #mainNav a:focus-visible,.mobile-nav-close:focus-visible{outline:2px solid #ebce94;outline-offset:3px}
  .header .nav #mainNav{display:none;order:initial;width:auto}
  .header .nav #mainNav.open{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;position:absolute;top:calc(100% + 8px);left:12px;right:12px;width:auto;max-width:480px;max-height:calc(100vh - 100px);max-height:calc(100dvh - 100px);margin-left:auto;padding:14px;gap:5px;overflow-y:auto;overscroll-behavior:contain;background:#171a20;border:1px solid #d6b57566;border-radius:20px;box-shadow:0 24px 64px #0009;scrollbar-width:thin;scrollbar-color:#a98a4e #171a20;animation:mobileNavEnter .18s ease-out}
  .mobile-nav-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:3px 4px 12px;margin-bottom:4px;border-bottom:1px solid #ffffff18;color:#d6b575;font:700 11px/1.4 var(--font);letter-spacing:.14em}
  .mobile-nav-close{display:grid;place-items:center;width:40px;height:40px;flex:none;border:1px solid #ffffff24;border-radius:50%;background:transparent;color:#f7f4ec;font:26px/1 var(--font);cursor:pointer}
  .header .nav #mainNav a{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:50px;padding:12px 16px;margin:0;border:1px solid transparent;border-radius:11px;background:#ffffff04;color:#eeeae1;font:500 16px/1.4 var(--font);text-decoration:none;white-space:normal}
  .header .nav #mainNav a::after{content:'↗';color:#c5a466;font-size:20px;flex:none}
  .header .nav #mainNav a:hover,.header .nav #mainNav a[aria-current=location]{background:#d6b57512;border-color:#d6b57540;color:#f3d497}
  .header .nav #mainNav a.quiz-nav{background:#d6b575;color:#171a20;font-weight:700}
  .header .nav #mainNav a.quiz-nav::after{color:inherit}
  .mobile-nav-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:29;border:0;background:#06080bb3;cursor:default}
  html.mobile-nav-open{overflow:hidden}
  .game-app .header #mainNav.open{display:none}
  .ballot-select-field .ballot-select-search{font-size:16px}
  .ballot-select-option{min-height:44px}
}
@media(max-width:380px){.header .nav-end{gap:5px}.header .brand{gap:8px}.header .collection-button{display:none}.header .nav #mainNav.open{left:8px;right:8px;padding:12px}}
@keyframes mobileNavEnter{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.header .nav #mainNav.open{animation:none}}
