/* extracted from partials/emoji.php */
.emoji-modal{position:fixed!important;inset:0!important;z-index:500000!important;display:flex!important;align-items:center;justify-content:center;padding:12px;box-sizing:border-box}
.emoji-modal[hidden]{display:none!important}
.emoji-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.emoji-modal-card{
  position:relative;z-index:1;width:min(420px,96vw);max-height:min(85vh,580px);
  background:var(--surface,#fff);color:var(--ink,#0f172a);
  border:1px solid var(--line,#e2e8f0);border-radius:16px;padding:14px;
  box-shadow:0 22px 56px rgba(0,0,0,.35);
  display:flex;flex-direction:column;gap:10px;overflow:hidden
}
html[data-theme="dark"] .emoji-modal-card,html.theme-dark .emoji-modal-card{background:#0f172a;color:#e2e8f0;border-color:#334155}
.emoji-modal-head{display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.emoji-modal-head strong{font-size:1rem;font-weight:800}
.emoji-modal-x{width:34px;height:34px;border:0;border-radius:10px;background:var(--surface-2,#f1f5f9);color:inherit;font-size:1.35rem;cursor:pointer;line-height:1}
html[data-theme="dark"] .emoji-modal-x{background:#1e293b}
.emoji-modal-tabs{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0}
.emoji-modal-tab{
  border:1px solid var(--line,#e2e8f0);border-radius:999px;padding:6px 12px;
  font:inherit;font-size:.8rem;font-weight:700;background:var(--surface-2,#f8fafc);
  color:var(--muted,#64748b);cursor:pointer
}
.emoji-modal-tab.on{background:#0f766e;border-color:#0f766e;color:#fff}
html[data-theme="dark"] .emoji-modal-tab{background:#1e293b;border-color:#334155;color:#94a3b8}
html[data-theme="dark"] .emoji-modal-tab.on{background:#0d9488;border-color:#0d9488;color:#fff}
.emoji-modal-grids{flex:1;min-height:0;overflow:auto}
.emoji-modal-grid-pane{
  display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;padding:4px;min-height:120px
}
.emoji-modal-grid-pane[hidden]{display:none!important}
.emoji-modal-item{
  border:0;background:transparent;font-size:1.55rem;cursor:pointer;
  padding:8px 4px;border-radius:10px;line-height:1.2;min-height:42px
}
.emoji-modal-item:hover{background:rgba(15,118,110,.15)}
@media(max-width:480px){
  .emoji-modal-grid-pane{grid-template-columns:repeat(6,minmax(0,1fr))}
  .emoji-modal-item{font-size:1.35rem;min-height:38px}
}
