/* Compact navigation; the menu overlays the page without moving the configurator. */
.brand[data-brand-compact]{width:44px;min-width:44px}
.brand[data-brand-compact] .vp-brand-mark{animation:none!important;transform:none!important}
.brand[data-brand-compact][data-brand-static] .vp-brand-mark{opacity:1}
.vp-menu-trigger{height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--card);color:var(--ink);font-size:14px;font-weight:600;white-space:nowrap}
.vp-menu-trigger svg,.vp-menu svg{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vp-menu-trigger:hover,.vp-menu-trigger[aria-expanded="true"]{background:#edf5fd;color:var(--blue);border-color:#bad8f5}
.vp-menu-trigger:focus-visible,.vp-menu button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.vp-menu{position:fixed;inset:auto;margin:0;width:min(390px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 72px);padding:16px;border:1px solid #d2d2d780;border-radius:20px;background:#fff;color:var(--ink);box-shadow:0 16px 60px #0003;overflow:auto;overscroll-behavior:contain}
.vp-menu:not([open]){display:none}
.vp-menu::backdrop{background:#0002}
.vp-menu-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.vp-menu-head h2{margin:0;font-size:19px;letter-spacing:-.025em}
.vp-menu-close{width:32px;height:32px;padding:6px;display:grid;place-items:center;border:0;border-radius:50%;background:#f5f5f7;color:var(--muted)}
.vp-menu-group+.vp-menu-group{margin-top:12px;padding-top:12px;border-top:1px solid #ebebef}
.vp-menu-group h3{margin:0 0 7px;font-size:13px;font-weight:600;color:var(--muted)}
.vp-menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.vp-menu .vp-menu-item{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:8px;min-width:0;width:100%;height:auto;min-height:44px;margin:0;padding:8px;border:1px solid transparent;border-radius:10px;background:#f5f5f7;color:var(--ink);font-size:14px;font-weight:500;line-height:1.25;text-align:left;box-shadow:none;white-space:normal}
.vp-menu .vp-menu-item svg{color:var(--muted)}
.vp-menu .vp-menu-item:hover:not(:disabled){background:#edf5fd}
.vp-menu .vp-menu-item.active{background:#edf5fd;color:var(--blue);border-color:#bad8f5;box-shadow:none}
.vp-menu .vp-menu-item.active svg{color:var(--blue)}
.vp-menu .vp-menu-label{min-width:0;overflow-wrap:anywhere}
.vp-menu .vp-menu-item:disabled{opacity:.5;cursor:wait}
.vp-menu .compare-count,.vp-menu .favorite-count{position:static;order:1;flex-shrink:0;margin-left:auto}
.vp-menu [hidden]{display:none!important}
@media(max-width:680px){
  .brand[data-brand-compact]{width:40px;min-width:40px}
  .topbar{justify-content:space-between;gap:12px}
  .topbar .mobile-view-toolbar{margin:0;flex:0 0 auto}
  .vp-menu-trigger{height:36px;padding:0 12px}
  .vp-menu{padding:13px;border-radius:16px}
}
