/* A compact native drawer: the header stays visible while every link can scroll. */
#menu-dialog {
  position:fixed;
  inset:8px 8px auto auto;
  width:390px;
  max-width:calc(100vw - 16px);
  max-height:calc(100dvh - 16px);
  margin:0;
  padding:0;
  overflow:hidden;
  border:1px solid #dce5dc;
  border-radius:22px;
  background:#f9faf6;
  color:#173d30;
  box-shadow:0 18px 60px #142a3038;
}
#menu-dialog[open] { display:flex; flex-direction:column; }
#menu-dialog::backdrop { background:#142c2470; }
#menu-dialog .menu-drawer-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex:0 0 auto;
  min-height:76px;
  padding:14px 16px;
  background:#173d30;
  color:#f4f7ed;
}
#menu-dialog .menu-brand { display:inline-flex; align-items:center; gap:10px; min-height:44px; font:700 34px/1 var(--display); letter-spacing:-.7px; }
#menu-dialog .menu-brand img { flex:0 0 40px; width:40px; height:40px; border:1px solid #e3ebd7; border-radius:50%; object-fit:cover; }
#menu-dialog .menu-brand-period { color:#bfceb7; }
#menu-dialog .menu-close { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; padding:0; border:1px solid #f4f7ed38; border-radius:50%; color:#f4f7ed; }
#menu-dialog .menu-close svg { width:19px; height:19px; }
#menu-dialog .menu-close:hover { background:#315241; }
#menu-dialog .menu-drawer-body {
  flex:1 1 auto;
  min-height:0;
  padding:16px;
  padding-bottom:max(16px,env(safe-area-inset-bottom,0px));
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#a7bca9 transparent;
  scroll-padding-block:12px;
}
#menu-dialog .menu-shop-all { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:52px; padding:12px 15px; border-radius:12px; background:#e1e4f1; color:#173d30; font:600 21px/1.1 var(--display); }
#menu-dialog .menu-shop-all:hover { background:#d4dbed; }
#menu-dialog .menu-shop-all svg { width:20px; height:20px; }
#menu-dialog .menu-section { margin-top:20px; }
#menu-dialog .menu-section h2 { margin:0 0 9px; color:#4e6556; font:600 14px/1.2 var(--display); letter-spacing:.8px; }
#menu-dialog .menu-fabric-grid,#menu-dialog .menu-brand-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 8px; }
#menu-dialog .menu-fabric-grid a,#menu-dialog .menu-brand-grid a { display:flex; align-items:center; justify-content:space-between; gap:6px; min-width:0; min-height:44px; padding:9px 10px; font:600 18px/1.2 var(--display); }
#menu-dialog .menu-fabric-grid a { border-radius:9px; background:#edf2e9; }
#menu-dialog .menu-fabric-grid a:hover { background:#dce8d6; }
#menu-dialog .menu-brand-grid { gap:0 14px; }
#menu-dialog .menu-brand-grid a { padding-inline:2px; border-bottom:1px solid #dfe7dc; }
#menu-dialog .menu-brand-grid a:hover { color:#0e703e; background:#edf2e9; }
#menu-dialog .menu-fabric-grid a > span,#menu-dialog .menu-brand-grid a > span { min-width:0; overflow-wrap:anywhere; }
#menu-dialog .menu-fabric-grid svg,#menu-dialog .menu-brand-grid svg { flex:0 0 13px; width:13px; height:13px; }
#menu-dialog .menu-drawer-contact { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:0 12px; margin-top:18px; padding-top:10px; border-top:1px solid #dfe7dc; }
#menu-dialog .menu-drawer-contact a { display:inline-flex; align-items:center; gap:6px; min-height:44px; font:600 15px/1.2 var(--display); }
#menu-dialog .menu-drawer-contact svg { width:18px; height:18px; }
#menu-dialog a:focus-visible,#menu-dialog button:focus-visible { outline:2px solid #547948; outline-offset:2px; }
#menu-dialog .menu-drawer-head a:focus-visible,#menu-dialog .menu-drawer-head button:focus-visible { outline-color:#dbe8ce; }
@media (max-width:430px), (max-height:600px) {
  #menu-dialog .menu-drawer-head { min-height:68px; padding:10px 12px; }
  #menu-dialog .menu-brand { font-size:31px; gap:8px; }
  #menu-dialog .menu-brand img { flex-basis:36px; width:36px; height:36px; }
  #menu-dialog .menu-drawer-body { padding:12px; padding-bottom:max(12px,env(safe-area-inset-bottom,0px)); }
  #menu-dialog .menu-shop-all { min-height:48px; font-size:20px; }
  #menu-dialog .menu-section { margin-top:16px; }
  #menu-dialog .menu-fabric-grid a,#menu-dialog .menu-brand-grid a { font-size:17px; }
}