#inputArea { position: relative; }
#stickerToggle { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; line-height: 1.5; color: #806354; padding: 3px 7px; border: 0; border-radius: 6px; background: transparent; cursor: pointer; }
#stickerToggle:hover, #stickerToggle[aria-expanded=true] { background: #f4e9de; }
.sticker-panel { position: absolute; z-index: 60; bottom: calc(100% + 6px); left: 8px; width: min(370px, calc(100% - 16px)); max-height: min(430px, 65vh); display: flex; flex-direction: column; border: 1px solid #e4dbd4; border-radius: 16px; background: #fffdf9; color: #43372f; box-shadow: 0 8px 30px #3e2b2426; overflow: hidden; font-size: 13px; }
.sticker-panel[hidden], .sticker-panel [hidden], .character-sticker[hidden], .sticker-fallback[hidden] { display: none !important; }
.sticker-panel-header { display: flex; align-items: center; padding: 12px 14px 6px; gap: 8px; }
.sticker-panel-header strong { flex: 1; font-size: 14px; }
.sticker-panel button { font: inherit; cursor: pointer; }
.sticker-panel button:focus-visible { outline: 2px solid #865b40; outline-offset: -2px; }
.sticker-panel button:disabled { opacity: .55; cursor: wait; }
.sticker-panel-header button { border: 0; background: transparent; font-size: 21px; width: 30px; height: 30px; }
.sticker-tabs { display: flex; gap: 6px; padding: 0 12px 8px; border-bottom: 1px solid #eee5de; }
.sticker-tabs button { padding: 6px 12px; border: 0; border-radius: 20px; color: #766a62; background: transparent; }
.sticker-tabs button[aria-pressed=true] { color: #fff; background: #80533c; }
.sticker-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 3px; padding: 10px; overflow-y: auto; min-height: 95px; overscroll-behavior: contain; }
.sticker-choice { border: 1px solid transparent; border-radius: 10px; background: transparent; padding: 2px; aspect-ratio: 1; }
.sticker-choice:hover { border-color: #d1ad91; background: #f8efe4; }
.character-sticker { object-fit: contain; display: block; width: 100%; height: 100%; }
.sticker-preview { overflow-y: auto; padding: 8px 14px 12px; text-align: center; }
#stickerPreviewImage { width: min(174px,30vh); aspect-ratio: 1; margin: 0 auto; }
#stickerPreviewLabel { margin: 2px 0 8px; font-weight: 600; }
.sticker-preview-actions { display: flex; justify-content: center; gap: 8px; }
.sticker-preview-actions button { border: 1px solid #ddcfc4; border-radius: 9px; padding: 7px 18px; background: white; color: #594438; }
.sticker-preview-actions #stickerSend { background: #80533c; color: white; border-color: #80533c; }
.sticker-error { margin: 0; padding: 0 14px; color: #b33232; flex-shrink: 0; }
.sticker-error:not(:empty) { padding: 8px 14px; }
.sticker-empty { grid-column: 1/-1; padding: 16px 4px; text-align: center; color: #8b7d72; }
.sticker-picture { display: inline-flex; align-items: center; justify-content: center; width: 174px; height: 174px; max-width: 100%; vertical-align: top; }
.message-row .content:has(.sticker-picture) { background: transparent !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; white-space: normal; }
.sticker-fallback { font-size: 14px; padding: 12px; }
@media (max-height: 560px) { .sticker-panel { max-height: 55vh; } #stickerPreviewImage { width: 100px; } }