/* Beta 0.3.16 — dense Apple-first emoji presentation. */
.emoji-picker-pop{
  position:fixed!important;
  z-index:3300!important;
  display:flex!important;
  flex-direction:column!important;
  width:min(374px,calc(100vw - 12px))!important;
  max-width:374px!important;
  max-height:min(438px,calc(var(--visible-vh,100vh) - 18px))!important;
  padding:6px 5px 5px!important;
  overflow:hidden!important;
  border-radius:20px!important;
}

/* Main emoji field: dense rows without cards, matching the visual density of
   Telegram/iOS emoji panels. Apple devices render the actual Apple glyphs. */
.emoji-picker-grid{
  order:1;
  display:grid;
  grid-template-columns:repeat(10,minmax(0,1fr));
  grid-auto-rows:37px;
  align-items:center;
  gap:0;
  max-height:372px;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:3px 1px 4px;
  scrollbar-width:none;
}
.emoji-picker-grid::-webkit-scrollbar{display:none}

.emoji-picker-item{
  min-width:0;
  width:100%;
  height:37px;
  padding:0;
  margin:0;
  border:0;
  border-radius:8px;
  display:grid;
  place-items:center;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
  font-size:29px!important;
  font-weight:400!important;
  font-style:normal!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-rendering:auto;
  transform:translateZ(0);
}
.emoji-picker-item:hover,
.emoji-picker-item:active{
  background:rgba(255,255,255,.05)!important;
  transform:scale(.91);
}

/* Categories are a thin bottom rail, leaving the emoji field dominant. */
.emoji-picker-tabs{
  order:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0;
  overflow-x:auto;
  flex:0 0 auto;
  scrollbar-width:none;
  padding:5px 2px 0;
  margin-top:2px;
  border-top:1px solid var(--line);
  border-bottom:0;
}
.emoji-picker-tabs::-webkit-scrollbar{display:none}
.emoji-picker-tab{
  flex:0 0 auto;
  width:32px;
  height:30px;
  border-radius:9px;
  display:grid;
  place-items:center;
  padding:0;
  background:transparent;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
  font-size:17px;
  font-weight:400;
  line-height:1;
}
.emoji-picker-tab.active{
  background:color-mix(in srgb,var(--accent) 16%,transparent);
}

.emoji-picker-empty{
  grid-column:1/-1;
  min-height:110px;
  display:grid;
  place-items:center;
  padding:18px 8px;
  color:var(--muted);
  text-align:center;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:13px;
}

html.mobile-performance .emoji-picker-pop{
  backdrop-filter:blur(9px) saturate(118%)!important;
  -webkit-backdrop-filter:blur(9px) saturate(118%)!important;
}

@media(max-width:390px){
  .emoji-picker-pop{
    width:min(348px,calc(100vw - 10px))!important;
    max-width:348px!important;
    padding:5px 4px 4px!important;
  }
  .emoji-picker-grid{
    grid-template-columns:repeat(9,minmax(0,1fr));
    grid-auto-rows:36px;
    max-height:350px;
  }
  .emoji-picker-item{height:36px;font-size:28px!important}
  .emoji-picker-tab{width:30px;height:29px;font-size:16px}
}

@media(max-width:330px){
  .emoji-picker-grid{grid-template-columns:repeat(8,minmax(0,1fr))}
  .emoji-picker-item{font-size:27px!important}
}