.sticker-surface { pointer-events: none; }
.surface-sticker { --placement-rotation: var(--sticker-turn); position: absolute; display: block; width: var(--sticker-width); height: var(--sticker-height); aspect-ratio: 1; transform: translate(-50%, -50%) rotate(var(--sticker-turn)); }
.surface-sticker img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(1px 2px 1px #0007); pointer-events: none; }
.sticker-surface .surface-sticker > button { display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; transform: none; touch-action: none; pointer-events: auto; cursor: grab; }
.sticker-surface.is-editing .surface-sticker.is-active { z-index: 1; }
.sticker-surface.is-editing .surface-sticker.is-active > [data-sticker-move], .surface-sticker > [data-sticker-move]:focus-visible { outline: 2px dashed #b77ae8; outline-offset: 4px; }
.sticker-surface [hidden], .sticker-editor [hidden] { display: none !important; }
.sticker-editor { padding-top: 20px; margin-top: 20px; border-top: 1px solid #dacfe3; min-width: 0; }
.sticker-editor > header { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.sticker-editor header strong { font-size: 1.12rem; }
.sticker-editor header p { font-size: .83rem; color: #85738f; margin: 7px 0; }
.sticker-editor button { font: inherit; }
.sticker-tools { display: flex; flex-direction: column; gap: 10px; padding: 16px 0; border-bottom: 1px solid #e4dce9; }
.sticker-tools > span { font-size: .85rem; color: #776380; font-weight: 700; }
.sticker-tools > div { display: flex; align-items: center; gap: 10px; }
.sticker-tools output { min-width: 3.6em; padding: 6px 0; color: #704794; font: 750 .82rem ui-monospace, monospace; }
.sticker-tools button { padding: 6px 10px; font-size: .75rem; }
.sticker-tools small { color: #887395; font-size: .72rem; }
.sticker-editor [data-sticker-browser] .card-browser { padding: 14px 0; margin: 0; background: transparent; border: 0; }
.sticker-editor .card-browser > label, .sticker-editor .card-browser > button { display: none; }
.sticker-editor .card-browser-search { flex: 1 1 100%; }
.sticker-editor .card-browser-search label { margin: 0; font-size: .76rem; }
.sticker-palette { display: grid; grid-template-columns: repeat(auto-fill, minmax(105px, 1fr)); gap: 10px; max-height: 350px; overflow-y: auto; padding: 10px; border-radius: 12px; background: #eee6f7; scrollbar-width: thin; }
.sticker-palette button { display: flex; flex-direction: column; align-items: stretch; position: relative; min-width: 0; padding: 10px; border: 1px solid transparent; background: #ffffffc9; border-radius: 9px; box-shadow: none; touch-action: none; cursor: grab; transition: transform .16s, background .16s; }
.sticker-palette button:hover { transform: rotate(-3deg); background: #fff; }
.sticker-palette button.is-placed { border-color: #aa80d7; background: #f9f2ff; }
.sticker-palette img { display: block; width: 100%; height: 85px; object-fit: contain; filter: drop-shadow(0 3px 2px #0002); }
.sticker-palette span { display: block; margin-top: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .7rem; }
.sticker-palette b { position: absolute; top: 3px; right: 5px; font-size: 14px; color: #9762cb; }
.sticker-editor footer { display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-top: 18px; font-size: .8rem; }
.sticker-editor footer > div { display: flex; gap: 8px; }
.sticker-editor [data-sticker-save] { background: #ffd166; }
.sticker-editor [data-sticker-status] { color: #a43766; font-size: .8rem; }
.sticker-editor [data-sticker-status]:empty { display: none; }
@media (max-width: 760px) {
    .sticker-palette { max-height: 170px; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
    .sticker-palette img { height: 65px; }
    .sticker-tools { padding: 9px 0; gap: 8px; }
    .sticker-editor footer { margin-top: 12px; }
}
@media (pointer: coarse) { .sticker-palette button { touch-action: pan-y; cursor: pointer; } }
.motion-reduced .sticker-palette button { transition: none; }
