.sticker-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px}.sticker-heading h1{margin:0}.sticker-heading>span,.sticker-upload>span{font-size:13px;color:var(--muted,#78758a)}.sticker-create{display:flex;align-items:end;gap:12px;margin-bottom:24px}.sticker-create label{flex:1;margin:0}.sticker-pack-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}.sticker-pack-tile{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 10px;border-radius:20px;text-align:center;min-width:0}.sticker-pack-tile img,.sticker-empty-icon{width:88px;height:88px;object-fit:contain}.sticker-empty-icon{display:grid;place-items:center;font-size:42px;color:var(--accent,#7964c8)}.sticker-pack-tile strong{max-width:100%;overflow-wrap:anywhere}.sticker-pack-tile small{font-size:12px;color:var(--muted,#78758a)}.sticker-edit{max-width:620px;display:grid;gap:14px}.sticker-edit label{margin:0}.sticker-edit .sticker-publish{display:flex;align-items:center;gap:10px}.sticker-publish input{width:20px;height:20px;flex:0 0 20px;accent-color:var(--accent,#7964c8)}.sticker-edit button{justify-self:start}.sticker-upload{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:24px 0 10px}.sticker-file-label{position:relative;display:inline-flex;align-items:center;min-height:46px;padding:10px 18px;border:1px solid var(--line,#dedbea);border-radius:14px;cursor:pointer;overflow:hidden;background:var(--surface,#fff)}.sticker-file-label input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;margin:0}.sticker-file-label:focus-within{outline:2px solid var(--accent,#7964c8);outline-offset:3px}.sticker-upload-note{font-size:13px;max-width:620px}.owned-sticker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px;margin:20px 0}.owned-sticker-grid article{display:flex;flex-direction:column;align-items:center;min-width:0;gap:7px}.owned-sticker-grid img{width:116px;height:116px;object-fit:contain}.owned-sticker-grid span{font-size:12px;max-width:100%;overflow-wrap:anywhere}.owned-sticker-grid button{min-height:36px;font-size:12px;padding:5px 12px}.sticker-delete-pack{margin-top:24px}.sticker-pack-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:10px;-webkit-overflow-scrolling:touch}.sticker-pack-tabs button{flex:0 0 auto;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sticker-pack-tabs button[aria-pressed=true]{background:var(--accent,#7964c8);color:white}.sticker-pick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;max-height:300px;overflow:auto;overscroll-behavior:contain}.sticker-pick-grid>p{grid-column:1/-1}.sticker-pick-grid button{display:grid;place-items:center;padding:5px;min-height:72px;border:0;background:transparent}.sticker-pick-grid img{width:100%;max-width:94px;height:86px;object-fit:contain}.chat-sticker{display:inline-block;width:144px;height:144px;max-width:100%;object-fit:contain;vertical-align:middle;margin:5px 4px}.message-body:has(>.chat-sticker){overflow-wrap:anywhere}@media(max-width:560px){.sticker-heading{align-items:flex-start;flex-wrap:wrap}.sticker-create{flex-direction:column;align-items:stretch}.sticker-pack-list{grid-template-columns:repeat(2,minmax(0,1fr))}.sticker-pick-grid img{height:70px}.sticker-pick-grid button{min-height:70px}.chat-sticker{width:128px;height:128px}.owned-sticker-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.owned-sticker-grid img{width:100%;height:92px}}
/* Original 4 x 4 atlas, unchanged artwork. One cached image for the complete pack. */
.app-emotion{display:inline-block;background-image:url('stickers/cyberchat-emotions-v1.png');background-size:400% 400%;background-repeat:no-repeat;aspect-ratio:1;vertical-align:middle}
.sticker-pick-grid .app-emotion{width:100%;max-width:86px;height:auto;margin:0}
.emotion-wave{background-position:0% 0%}
.emotion-laugh{background-position:33.333333% 0%}
.emotion-wink{background-position:66.666667% 0%}
.emotion-cool{background-position:100% 0%}
.emotion-kiss{background-position:0% 33.333333%}
.emotion-hug{background-position:33.333333% 33.333333%}
.emotion-rose{background-position:66.666667% 33.333333%}
.emotion-flirt{background-position:100% 33.333333%}
.emotion-think{background-position:0% 66.666667%}
.emotion-shock{background-position:33.333333% 66.666667%}
.emotion-sideeye{background-position:66.666667% 66.666667%}
.emotion-facepalm{background-position:100% 66.666667%}
.emotion-angry{background-position:0% 100%}
.emotion-sad{background-position:33.333333% 100%}
.emotion-sleep{background-position:66.666667% 100%}
.emotion-party{background-position:100% 100%}
