/* طراحیِ مدادیِ سالن (templates/includes/_salon_sketch.html) — رنگ فقط از پالت؛ مخملِ صندلی = رنگِ شخصیت.
   زنده: خط‌ها با ورود «کشیده» می‌شوند، دیوارکوب‌ها نفس می‌کشند، برگ‌ها تاب می‌خورند، صندلیِ جلو آرام می‌چرخد، آینه برق می‌زند. */
.zsk{--ink:color-mix(in srgb,var(--zb-navy,#141A3A) 62%,#8a8290);--au:var(--zb-gold,#C9A46C);
  --velvet:color-mix(in srgb,var(--zb-accent,#7A2E4D) 34%,#f6e3da);--leaf:color-mix(in srgb,#7d8c6a 60%,var(--ink));
  display:block;width:100%;height:auto;overflow:visible}
.zsk path,.zsk ellipse,.zsk rect,.zsk circle{vector-effect:non-scaling-stroke}
.zsk .g,.zsk .au{fill:none;stroke-linecap:round;stroke-linejoin:round}
.zsk .g{stroke:var(--ink)}
.zsk .g.soft{stroke-opacity:.55}
.zsk .g.faint{stroke-opacity:.22}
.zsk .au{stroke:var(--au)}
.zsk .ghost{opacity:.38}
.zsk .pk{fill:var(--velvet);fill-opacity:.9}
.zsk .au-fill{fill:color-mix(in srgb,var(--au) 45%,#fff5e2)}
.zsk .shadow{fill:var(--ink);opacity:.1}
.zsk .glass{fill:color-mix(in srgb,var(--zb-accent,#7A2E4D) 6%,#f4eef3);fill-opacity:.8}
.zsk .sheen{fill:url(#sk-sheen);opacity:0}
.zsk .nichebg{fill:color-mix(in srgb,var(--au) 18%,#fff8ea)}
.zsk .bottle{fill:color-mix(in srgb,var(--ink) 18%,#f7efe6)}
.zsk .glassv{fill:color-mix(in srgb,#cfe3e6 50%,#fff);fill-opacity:.6}
.zsk .bloom{fill:color-mix(in srgb,var(--zb-accent,#7A2E4D) 30%,#fbe2dc);stroke:var(--ink);stroke-opacity:.35;stroke-width:.5}
.zsk .lf{fill:color-mix(in srgb,var(--leaf) 30%,#eef1e6)}
.zsk .olf{fill:color-mix(in srgb,var(--leaf) 55%,#dfe5d2);fill-opacity:.8;stroke:var(--ink);stroke-opacity:.35;stroke-width:.4}
.zsk .potf{fill:color-mix(in srgb,var(--ink) 7%,#fbf8f3)}
.zsk .lamp{fill:#fff4d9}
.zsk .glow{fill:url(#sk-glow);opacity:.55}

/* ── ورود: خط‌ها کشیده می‌شوند (pathLength=1) ── */
.zsk.zsk-draw .g,.zsk.zsk-draw .au{stroke-dasharray:1;stroke-dashoffset:1}
.zsk.zsk-draw.on .g,.zsk.zsk-draw.on .au{animation:zskDraw 2.4s cubic-bezier(.16,1,.3,1) forwards}
.zsk.zsk-draw.on .au{animation-delay:.5s}
.zsk.zsk-draw .pk,.zsk.zsk-draw .olf,.zsk.zsk-draw .lf,.zsk.zsk-draw .bloom,.zsk.zsk-draw .glass,.zsk.zsk-draw .nichebg{opacity:0}
.zsk.zsk-draw.on .pk,.zsk.zsk-draw.on .olf,.zsk.zsk-draw.on .lf,.zsk.zsk-draw.on .bloom,.zsk.zsk-draw.on .glass,.zsk.zsk-draw.on .nichebg{animation:zskWash 1.6s 1.1s ease forwards}
@keyframes zskDraw{to{stroke-dashoffset:0}}
@keyframes zskWash{to{opacity:1}}

/* ── زندگی ── */
.zsk .sc .glow{animation:zskBreath 4.8s ease-in-out infinite}
.zsk .sc1 .glow{animation-delay:-1.2s}.zsk .sc2 .glow{animation-delay:-2.4s}.zsk .sc3 .glow{animation-delay:-3.6s}
@keyframes zskBreath{50%{opacity:.95}}
.zsk .sway{transform-box:fill-box;transform-origin:50% 100%;animation:zskSway 7s ease-in-out infinite}
@keyframes zskSway{50%{transform:rotate(1.4deg)}}
.zsk .skw{animation:zskSway2 6s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
@keyframes zskSway2{50%{rotate:-1deg}}
.zsk .ch3>.chi{transform-box:fill-box;transform-origin:50% 100%;animation:zskSwivel 9s ease-in-out infinite}
@keyframes zskSwivel{0%,100%{transform:scaleX(1)}45%{transform:scaleX(.9)}55%{transform:scaleX(.9)}}
.zsk .sheen{animation:zskSheen 7s ease-in-out infinite}
@keyframes zskSheen{0%,70%,100%{opacity:0}80%{opacity:.8}}

@media(prefers-reduced-motion:reduce){
  .zsk *{animation:none!important}
  .zsk.zsk-draw .g,.zsk.zsk-draw .au{stroke-dashoffset:0}
  .zsk.zsk-draw .pk,.zsk.zsk-draw .olf,.zsk.zsk-draw .lf,.zsk.zsk-draw .bloom,.zsk.zsk-draw .glass,.zsk.zsk-draw .nichebg{opacity:1}
}

/* نسخهٔ تک‌المان برای تزئینِ بخش‌ها/حالت‌های خالی: <svg class="zsk zsk-one" viewBox="..."><use href="#sk-chair"/></svg> */
.zsk-one{width:auto;height:100%}
/* کاغذ: دانهٔ مدادی برای پس‌زمینه‌ها */
.zsk-paper{background-color:color-mix(in srgb,var(--zb-gold,#C9A46C) 7%,var(--bg,#fbf9f7));
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .3 0 0 0 0 .32 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23p)'/%3E%3C/svg%3E")}
[data-theme="dark"] .zsk-paper{background-color:color-mix(in srgb,var(--zb-gold,#C9A46C) 5%,var(--bg))}