/* Surface-only change: retain menu dimensions, layout and existing motion. */
.site-nav .menu-pill {
  background:rgba(24,30,26,.52);
  border-color:rgba(255,255,255,.23);
  -webkit-backdrop-filter:blur(20px) saturate(145%);
  backdrop-filter:blur(20px) saturate(145%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(255,255,255,.04), 0 6px 24px rgba(0,0,0,.12);
}
.menu-panel { background:rgba(4,6,6,.3); -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px); }
.menu-panel .menu-panel__inner {
  background:rgba(21,26,23,.64);
  border-color:rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(28px) saturate(150%);
  backdrop-filter:blur(28px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 22px 64px rgba(0,0,0,.24);
}
.menu-panel .menu-topic-icon--vector {
  display:inline-grid;
  width:18px;
  height:18px;
  place-items:center;
  flex:0 0 18px;
  background:none;
  border:0;
  border-radius:0;
}
.menu-panel .menu-topic-icon--vector::before,
.menu-panel .menu-topic-icon--vector::after { display:none!important; content:none!important; }
.menu-panel .menu-topic-icon--vector svg {
  display:block;
  width:18px;
  height:18px;
  overflow:visible;
  shape-rendering:geometricPrecision;
}
.menu-panel nav a:hover .menu-topic-icon--vector svg,
.menu-panel nav a:focus-visible .menu-topic-icon--vector svg { stroke-width:1.8; }
@supports not (backdrop-filter:blur(1px)) {
  .site-nav .menu-pill { background:rgba(21,26,23,.9); }
  .menu-panel .menu-panel__inner { background:rgba(21,26,23,.96); }
}

