/* MMFontPicker · 共享字体选择器。色与圆角沿用 Moments Maker 雾光体系。 */
.mmfp { min-width: 0; max-width: 100%; }
.mmfp *, .mmfp *::before, .mmfp *::after { box-sizing: border-box; }
.mmfp-tools { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 10px; align-items: start; }
.mmfp-tools > *, .mmfp-groups, .mmfp-group { min-width: 0; }
.mmfp-search {
  width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 12px;
  background: #fff; color: var(--ink); font: inherit; font-size: 16px; padding: 10px 13px; outline: none;
}
.mmfp-groups { display: grid; gap: 8px; }
.mmfp-group { display: flex; flex-wrap: wrap; gap: 7px; padding: 1px 1px 3px; }
.mmfp-filter, .mmfp-more {
  min-height: 44px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 999px;
  background: #fff; color: var(--ink-dim); padding: 8px 14px; font: inherit; font-size: 12.5px;
  font-weight: 600; cursor: pointer;
}
.mmfp-filter[aria-pressed="true"] { background: var(--fog-lilac); color: var(--ink); border-color: transparent; }
.mmfp-meta { display: flex; justify-content: space-between; gap: 12px; margin: 12px 2px 8px; color: var(--ink-dim); font-size: 12px; }
.mmfp-list {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 96px), 96px));
  gap: 10px; padding: 2px 2px 10px 1px;
}
.mmfp-card {
  position: relative; width: 100%; min-width: 0; min-height: 123px;
  border: 1px solid var(--line); border-radius: 13px; background: #fff; color: var(--ink);
  padding: 4px 4px 8px; font: inherit; line-height: 1.2; cursor: pointer; text-align: left;
}
.mmfp-card:hover { border-color: var(--fog-ice); }
.mmfp-card[aria-pressed="true"] { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.mmfp-card.is-locked { color: var(--ink-dim); }
.mmfp-sample {
  display: grid; place-items: center; width: 100%; height: 86px; overflow: hidden;
  border-radius: 10px; background: var(--card-deep); color: var(--ink); font-size: 18px;
}
.mmfp-sample img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mmfp-name { display: block; margin: 7px 3px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; font-weight: 600; }
.mmfp-lock {
  position: absolute; top: 7px; right: 7px; display: grid; place-items: center; min-width: 19px; height: 19px;
  border-radius: 999px; background: rgba(41,38,49,.88); color: #fff; font-size: 10px; box-shadow: 0 1px 4px rgba(41,38,49,.2);
}
.mmfp-empty { grid-column: 1 / -1; width: 100%; padding: 24px 12px; border: 1px dashed var(--line); border-radius: 12px; color: var(--ink-dim); font-size: 13px; text-align: center; }
.mmfp-more { margin-top: 8px; width: 100%; border-style: dashed; }
.mmfp-more[hidden] { display: none; }

/* 试写间原有 disclosure 是四端唯一折叠语言；放到共享样式后其他工具直接复用。 */
.font-disclosure,
.mm-tool-font.font-disclosure {
  padding: 0;
  overflow: clip;
}
.font-disclosure > summary {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 18px;
  cursor: pointer;
  list-style: none;
  color: var(--ink);
}
.font-disclosure > summary::-webkit-details-marker { display: none; }
.font-disclosure > summary:focus-visible {
  outline: 3px solid rgba(200,222,231,.7);
  outline-offset: -3px;
  border-radius: 13px;
}
.font-disclosure > summary > span:first-child {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.font-disclosure > summary strong { flex: 0 0 auto; font-size: 16px; }
.font-disclosure > summary small {
  min-width: 0;
  overflow: hidden;
  color: var(--ink-dim);
  font-size: 11.5px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.disclosure-cue { flex: 0 0 auto; font-size: 0; color: var(--ink-dim); }
.disclosure-cue::after { content: "展开"; font-size: 11.5px; }
.font-disclosure[open] .disclosure-cue::after { content: "收起"; }
.font-disclosure[open] > summary { border-bottom: 1px solid var(--line); }
.font-disclosure-body { padding: var(--mm-font-disclosure-body-padding, 11px); }

@media (max-width: 620px) {
  .font-disclosure > summary { min-height: 54px; padding-inline: 13px; }
  .font-disclosure > summary > span:first-child { display: grid; gap: 1px; }
}