/* ============================================================
   Sticker — קומפוננט אחד, מקור-אמת יחיד.
   גדלים תואמים פיקסל-פרפקט ל-Figma StickerOption (Qw3YeURNIL8V1wdGubxIWQ · 2745:11432).
   2 סוגים: icon (אייקון 3D על רקע צבע) · image (תמונה ממלאת).
   4 גדלים: lg 104 · md 80 · sm 44 · sm-x 24  (radius מתכווץ פרופורציונלית).
   שימוש:
     <div class="sticker sticker--md sticker--icon" style="background:#a6dd68"><img src="stickers/star.png" alt=""></div>
     <div class="sticker sticker--lg sticker--image"><img src="cover.jpg" alt=""></div>
   ============================================================ */
.sticker{
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; overflow:hidden; box-sizing:border-box;
}
.sticker img{ display:block; }

/* --- סוגים --- */
/* תמונה — ממלאת את כל הריבוע */
.sticker--image img{ width:100%; height:100%; object-fit:cover; }
/* אייקון — נכס ה-3D ממלא את כל הריבוע (כמו ב-DS, האייקון = גודל הקונטיינר).
   המרווח סביב האייקון מגיע מהשקיפות של ה-PNG עצמו, לא מ-padding.
   translateY(4%) — נדנוד קל כלפי מטה לאיזון אופטי (פרופורציונלי לגודל). */
.sticker--icon img{ width:100%; height:100%; object-fit:contain; transform:translateY(4%); }

/* --- גדלים (container + radius מהפיגמה, בלי גודל אייקון נפרד) --- */
.sticker--lg  { width:104px; height:104px; border-radius:8px; }
.sticker--md  { width:80px;  height:80px;  border-radius:5.33px; }
.sticker--sm  { width:44px;  height:44px;  border-radius:2.93px; }
.sticker--sm-x{ width:24px;  height:24px;  border-radius:1.6px; }