.mm-overlay{
  position:fixed;inset:0;z-index:100;background:rgba(15,23,42,.45);backdrop-filter:blur(6px);
  display:none;align-items:stretch;justify-content:center;padding:0;overscroll-behavior:contain;
}
.mm-overlay.open{display:flex}
.mm-panel{background:var(--paper);width:100%;height:100%;overflow:auto;display:flex;flex-direction:column}
.mm-bar{
  position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;
  padding:12px var(--gutter);background:#0f172a;
  color:#fff;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.08);
}
.mm-bar .mm-title{font-weight:800;font-size:18px;letter-spacing:-.03em;flex-shrink:0;color:#fff}
.mm-bar .mm-count{font-size:13px;color:#94a3b8;flex-shrink:0}

.mm-search-wrap{position:relative;flex:1;min-width:0;z-index:40}
.mm-search{
  display:flex;align-items:center;gap:8px;height:42px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.08);padding:0 12px;width:100%;border-radius:12px;
}
.mm-search:focus-within{background:rgba(255,255,255,.12);border-color:#60a5fa;box-shadow:0 0 0 4px rgba(29,78,216,.28)}
.mm-search svg{width:14px;height:14px;color:#93c5fd;flex-shrink:0}
.mm-search input{flex:1;min-width:0;border:none;background:transparent;color:#fff;font-size:14px;outline:none}
.mm-search input::placeholder{color:#94a3b8}
.mm-close{
  flex-shrink:0;width:42px;height:42px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:#fff;
  cursor:pointer;display:grid;place-items:center;border-radius:12px;
}
.mm-close svg{width:16px;height:16px}
.mm-close:hover{background:var(--blue);border-color:transparent}

.mm-results{
  display:none;position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:50;
  flex-direction:column;max-height:min(52vh,420px);overflow:auto;
  background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);
}
.mm-results.on{display:flex}
.mm-results-empty{padding:14px 12px;font-size:13px;color:var(--ink-faint)}
.mm-hit{display:block;padding:10px 12px;border-bottom:1px solid var(--line-soft);color:inherit}
.mm-hit:last-child{border-bottom:none}
.mm-hit:hover{background:var(--paper)}
.mm-hit-path{font-size:14px;line-height:1.4;display:block}
.mm-hit-path .sep{color:var(--ink-faint);margin:0 6px}
.mm-hit mark{background:#dbeafe;color:var(--ink);font-weight:700}

.mm-grid{columns:4;column-gap:12px;padding:18px var(--gutter) 40px}
.mm-cat{
  display:grid;grid-template-columns:80px minmax(0,1fr);gap:10px 12px;
  background:#fff;padding:14px;min-width:0;border-radius:16px;border:1px solid var(--line);
  break-inside:avoid;margin-bottom:12px;width:100%;
}
.mm-draw{width:80px;height:80px;object-fit:contain;background:var(--sheet-2);padding:6px;border-radius:12px}
.mm-body{min-width:0;display:flex;flex-direction:column;gap:4px}
.mm-l1{font-weight:750;font-size:14px;line-height:1.2;padding:2px 0}
.mm-l1:hover{color:var(--blue)}
.mm-l2{list-style:none;display:flex;flex-direction:column;gap:1px}
.mm-l2-row{display:flex;align-items:center;gap:6px;width:100%;padding:3px 0}
.mm-l2-link{flex:1;font-size:13px;color:var(--ink-soft)}
.mm-l2-row:hover .mm-l2-link{color:var(--ink)}
.mm-l2>li.has-kids>.mm-l2-row .mm-l2-link{color:var(--ink);cursor:default;font-weight:600}
.mm-toggle{
  flex-shrink:0;width:22px;height:22px;border:1px solid var(--line);background:#fff;
  cursor:pointer;font-size:14px;line-height:1;display:grid;place-items:center;border-radius:6px;
}
.mm-l2>li.open .mm-toggle{background:var(--ink);color:#fff;border-color:var(--ink)}
.mm-l3{list-style:none;display:none;flex-direction:column;padding:2px 0 6px 10px;border-left:2px solid var(--blue);margin:2px 0 4px}
.mm-l2>li.open>.mm-l3{display:flex}
.mm-l3 a{font-size:12.5px;color:var(--ink-faint);padding:4px 0;display:block}
.mm-l3 a:hover{color:var(--blue)}

body.mm-lock{overflow:hidden}

@media(max-width:1180px){
  .mm-grid{columns:3}
}
@media(max-width:860px){
  .mm-bar{flex-wrap:wrap}
  .mm-search-wrap{order:3;flex:1 1 100%}
  .mm-close{margin-left:auto}
  .mm-grid{columns:2}
  .mm-cat{grid-template-columns:64px minmax(0,1fr)}
  .mm-draw{width:64px;height:64px}
}
@media(max-width:560px){
  .mm-grid{columns:1}
}