/* emote-panel.css — shared Sakurairo-style emote popup for ARTICLE/page comments (the /link/ board
 * has its own copy in message-board.css). Generalized selectors (.ww-fl-emotion) so it works outside
 * the board. Two tabs: bilibili (local sprites) + 颜文字. Blue accent. */
.emotion-box.ww-fl-emotion {
    display: none; margin: 6px 0 14px; padding: 10px; width: 100%; box-sizing: border-box;
    background: #fff; border: 1px solid rgba(0,0,0,.06); border-radius: 16px;
    box-shadow: 0 12px 30px -12px rgba(30,50,80,.28);
}
.ww-fl-emotion .ww-emo-tabs { display: flex; gap: 6px; margin-bottom: 8px; }
.ww-fl-emotion .ww-emo-tab {
    border: none; cursor: pointer; padding: 6px 14px; border-radius: 10px; font-size: 13px; font-weight: 600;
    color: #6b7079; background: rgba(0,0,0,.045); transition: background .15s, color .15s;
}
.ww-fl-emotion .ww-emo-tab:hover { background: rgba(65,131,196,.12); color: #3a72ac; }
.ww-fl-emotion .ww-emo-tab.active { background: #4183c4; color: #fff; box-shadow: 0 4px 12px -4px rgba(65,131,196,.7); }
.ww-fl-emotion .ww-emo-panel { max-height: 172px; overflow-y: auto; overflow-x: hidden; border-radius: 10px; }
.ww-fl-emotion .ww-emo-panel::-webkit-scrollbar { width: 7px; }
.ww-fl-emotion .ww-emo-panel::-webkit-scrollbar-thumb { background: rgba(65,131,196,.35); border-radius: 4px; }
.ww-fl-emotion .ww-emo-panel.bili-container { display: flex; flex-wrap: wrap; align-content: flex-start; padding: 4px 2px; }
.ww-fl-emotion .ww-kao-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; padding: 4px 2px; }
.ww-fl-emotion .ww-kao {
    cursor: pointer; border: 1px solid rgba(0,0,0,.06); background: #fafbfc; border-radius: 9px;
    padding: 7px 4px; text-align: center; font-size: 13px; color: #4a5058; user-select: none;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background .13s, border-color .13s, color .13s;
}
.ww-fl-emotion .ww-kao:hover { background: rgba(65,131,196,.1); border-color: rgba(65,131,196,.4); color: #3a72ac; }
body.dark .emotion-box.ww-fl-emotion { background: #2b2f34; border-color: rgba(255,255,255,.08); }
body.dark .ww-fl-emotion .ww-emo-tab { background: rgba(255,255,255,.06); color: #c2c7ce; }
body.dark .ww-fl-emotion .ww-kao { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.08); color: #c2c7ce; }