/* musicmatter.art instrument home. Visual language matches the rest of the site. */
.mm-bar{position:sticky;top:0;z-index:20;background:#fbfaf7;padding:.65rem 0 .55rem;margin:0 -1.2rem;padding-left:1.2rem;padding-right:1.2rem;border-bottom:1px solid #e6e1d8}
.mm-tools{display:flex;gap:.5rem;align-items:center}
.mm-tools input[type=search]{flex:1 1 auto;min-width:0;font:1rem system-ui,sans-serif;padding:.45rem .7rem;border:1px solid #ccc;border-radius:3px;background:#fff;color:#222}
.mm-tools input[type=search]:focus{outline:2px solid #7a4b1f;outline-offset:1px}
#mm-stop{flex:0 0 auto;font:.9rem system-ui,sans-serif;padding:.45rem .8rem;border:1px solid #7a4b1f;border-radius:3px;background:#fff;color:#7a4b1f;cursor:pointer}
#mm-stop:hover{background:#7a4b1f;color:#fff}
.mm-filters{display:flex;flex-wrap:wrap;gap:.35rem .4rem;font:.85rem system-ui,sans-serif;margin:.55rem 0 0;max-width:100%}
.mm-filters button{margin:0;padding:.15rem .6rem;border:1px solid #bbb;background:#fff;border-radius:3px;cursor:pointer;flex:0 1 auto}
.mm-filters button[aria-pressed=true]{background:#7a4b1f;color:#fff;border-color:#7a4b1f}
.mm-lead{margin-top:1.1rem}
.mm-status{font:.85rem system-ui,sans-serif;color:#777}
.mm-inst,.mm-root,.mm-q{border-bottom:1px solid #eee;scroll-margin-top:6.5rem}
.mm-inst>summary,.mm-root>summary,.mm-q>summary{list-style:none;cursor:pointer}
.mm-inst>summary::-webkit-details-marker,.mm-root>summary::-webkit-details-marker,.mm-q>summary::-webkit-details-marker{display:none}
.mm-inst>summary h2,.mm-root>summary h3,.mm-q>summary h3{display:flex;align-items:baseline;gap:.55rem;flex-wrap:wrap}
.mm-inst>summary h2::before,.mm-root>summary h3::before,.mm-q>summary h3::before{content:"▸";color:#7a4b1f;font-size:.8rem;width:.8rem}
.mm-inst[open]>summary h2::before,.mm-root[open]>summary h3::before,.mm-q[open]>summary h3::before{content:"▾"}
.mm-inst>summary h2{font-weight:normal;letter-spacing:.04em;margin:1.3rem 0 .2rem}
.mm-root>summary h3,.mm-q>summary h3{font:600 .85rem system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#333;margin:.7rem 0}
.mm-n{font-weight:normal;letter-spacing:0;text-transform:none;color:#888;font-size:.8rem}
.mm-credit{font:.85rem system-ui,sans-serif;color:#666;margin:.15rem 0 .4rem}
.mm-note{font:.85rem system-ui,sans-serif;color:#777;margin:.2rem 0 .6rem}
.mm-jump{font:.85rem system-ui,sans-serif;margin:.4rem 0 .8rem;line-height:1.9}
.mm-jump p{margin:0}
.mm-jump button{font:inherit;color:#7a4b1f;background:none;border:0;padding:0;margin-right:.7rem;cursor:pointer;text-decoration:underline}
.mm-jump button:hover{color:#3e2610}
.mm-q{margin-left:.4rem}
figure{margin:.7rem 0}
.mm-results h2{font:600 .9rem system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid #ddd;padding-bottom:.3rem}
.mm-archive{margin-top:2.5rem;font:.8rem system-ui,sans-serif;color:#888}
.mm-archive a{color:#888}
@media (max-width:700px){
  #mm-stop{position:fixed;left:0;right:0;bottom:0;z-index:40;margin:0;border-radius:0;border-left:0;border-right:0;border-bottom:0;padding:.75rem;padding-bottom:calc(.75rem + env(safe-area-inset-bottom, 0px));background:#7a4b1f;color:#fff}
  #mm-stop:hover{background:#5e3918;color:#fff}
  /* The bar is taken out of the header (fixed to the viewport). This keeps chips, results, and the footer above it. */
  body{padding-bottom:calc(4.75rem + env(safe-area-inset-bottom, 0px)) !important}
}