/* מלבישים את חיים v7 — overrides on top of styles.css (.du-*) */
#dressup .du-switch{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px auto 10px;flex-wrap:wrap}
#dressup .du-sw-q{font:800 1rem Rubik,sans-serif;color:var(--navy,#0d2a55)}
#dressup .du-sw{display:inline-flex;align-items:center;gap:6px;border:3px solid #d6e9fd;background:#fff;border-radius:999px;padding:4px 14px 4px 6px;font:800 1rem Rubik,sans-serif;color:var(--navy,#0d2a55);cursor:pointer;transition:transform .15s,background .2s,border-color .2s;-webkit-tap-highlight-color:transparent}
#dressup .du-sw img{width:32px;height:32px;object-fit:cover;object-position:50% 0;border-radius:50%;background:#e8f2fd}
#dressup .du-sw.on{background:#1E64C8;border-color:#1E64C8;color:#fff;box-shadow:0 4px 12px rgba(30,100,200,.35)}
#dressup .du-sw:active{transform:scale(.95)}
#dressup .du-figure{transition:aspect-ratio .2s}
#dressup .du-figure .du-haim{position:relative;z-index:1}
#dressup .du-it.fade{transition:opacity .4s ease}
#dressup .du-it.slot-hair img,#dressup .du-it.slot-bow img{animation:none}
#dressup .du-it.slot-feet img{animation:du-ball 2.4s ease-in-out infinite}
@keyframes du-ball{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4%) rotate(-8deg)}}
#dressup .du-figure.du-hop{animation:du-hop .55s cubic-bezier(.3,1.6,.5,1)}
@keyframes du-hop{0%{transform:translateX(-50%) scale(.85,1.1)}50%{transform:translateX(-50%) translateY(-4%)}100%{transform:translateX(-50%)}}
/* tabs: one scrolling row on phones */
#dressup .du-tabs{flex-wrap:nowrap!important;justify-content:flex-start!important;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:12px 6px 6px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%)}
#dressup .du-tab{scroll-snap-align:center;padding:10px 15px}
@media (min-width:760px){#dressup .du-tabs{flex-wrap:wrap!important;justify-content:center!important;-webkit-mask-image:none;mask-image:none}}
/* tray: two rows that scroll sideways on phones, so items stay just under the stage */
#dressup .du-tray{display:grid!important;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-template-columns:none!important;grid-auto-columns:76px;gap:10px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:8px 6px 12px;margin:6px auto 12px;max-width:560px;justify-content:start}
#dressup .du-tray::-webkit-scrollbar{display:none}
#dressup .du-tray.du-few{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:repeat(4,1fr)!important;grid-auto-columns:auto;overflow:visible}
@media (min-width:560px){#dressup .du-tray{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:repeat(6,1fr)!important;grid-auto-columns:auto;overflow:visible}}
#dressup .du-pick{scroll-snap-align:start;flex-direction:column;padding:6px 4px 4px;gap:2px}
#dressup .du-pick img{max-height:46px;max-width:58px;width:auto;height:46px;object-fit:contain}
#dressup .du-pick.bg-pick img{height:100%;max-height:none;max-width:none}
#dressup .du-lbl{font:700 .66rem/1.1 Rubik,sans-serif;color:var(--navy,#0d2a55);text-align:center;max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;pointer-events:none}
#dressup .du-pick.bg-pick .du-lbl{position:absolute;bottom:3px;left:3px;right:3px;background:rgba(255,255,255,.85);border-radius:8px;padding:1px 2px}
#dressup .du-pick:active{transform:scale(.92)}
html.a11y-motion #dressup .du-figure.du-hop{animation:none}
#dressup .du-stage{max-height:min(55vh,620px)!important}
@media (min-width:760px){#dressup .du-stage{max-height:72vh!important}}

/* v11: items sit ON Haim — explicit layers inside the figure:
   back 0 (hats behind the kippah, back halves of scarves/rings, cape) · Haim 1 · body 2 (shirts, shoes, gloves)
   · under 3 (scarves, chains, ties tucked under the beard) · head+beard overlay 4 · front 5 (glasses, front halves, held items, pets) */
#dressup .du-figure .du-headov{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;user-select:none;-webkit-user-select:none;display:block}
#dressup .du-figure.du-has-under .du-headov{filter:drop-shadow(0 2px 2px rgba(60,30,10,.35))}
#dressup .du-it{z-index:5}
#dressup .du-it.du-front{z-index:5}
#dressup .du-it.du-back{z-index:0}
#dressup .du-it.du-body{z-index:2}
#dressup .du-it.du-under{z-index:3}
/* contact shadows: tight and soft, so things look attached rather than floating */
#dressup .du-it img{filter:drop-shadow(0 2px 2px rgba(0,0,0,.28))}
#dressup .du-it.du-under img{filter:drop-shadow(0 2px 2.5px rgba(0,0,0,.32))}
#dressup .du-it.du-back img{filter:drop-shadow(0 1px 2px rgba(0,0,0,.22))}
#dressup .du-it.du-body img{filter:none}
#dressup .du-it.slot-hand img{filter:drop-shadow(0 3px 2px rgba(0,0,0,.3))}
#dressup .du-it.slot-pet img{filter:drop-shadow(0 5px 3px rgba(0,0,0,.25))}
/* hats rest on the head: no more floating bob */
#dressup .du-it.slot-head img{animation:none!important}
#dressup .du-it.slot-pet::after{content:"";position:absolute;left:14%;right:14%;bottom:-3%;height:7%;border-radius:50%;background:rgba(0,0,0,.2);filter:blur(3px);z-index:-1}
/* v20: captain armband sits on the sleeve with a soft edge; gloves get a light contact shadow */
#dressup .du-it[data-id="armband"] img{filter:drop-shadow(0 1px 1.2px rgba(0,0,0,.3))}
#dressup .du-it[data-id="gk-gloves"] img{filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.25))}