/* Cotton -> yarn -> fabric -> garment scroll story. Small, fixed at the side. */
#ss{position:fixed;right:16px;top:50%;transform:translateY(-50%);width:140px;z-index:20;pointer-events:none;text-align:center;font-family:Inter,system-ui,sans-serif}
#ss svg{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 4px 8px rgba(18,37,74,.12))}
#ss .ss-st{opacity:0;transition:opacity .25s linear}
#ss .ss-lab{margin-top:6px;font-size:12px;font-weight:700;letter-spacing:.08em;color:#12254A;text-transform:uppercase;line-height:1.2}
#ss .ss-lab b{display:block;font-family:"Noto Nastaliq Urdu","Jameel Noori Nastaleeq","Noto Naskh Arabic",serif;font-size:15px;letter-spacing:0;color:#B5521F;text-transform:none;font-weight:700;margin-top:2px}
#ss .ss-bar{margin:8px auto 0;width:3px;height:52px;background:rgba(18,37,74,.14);border-radius:3px;overflow:hidden}
#ss .ss-bar i{display:block;width:100%;height:0;background:#B5521F;border-radius:3px}
#ss.off{display:none}
/* Narrower desktops: compact so it stays in the page margin */
@media (max-width:1379px){#ss{width:78px;right:4px;opacity:.94}#ss .ss-lab b{display:none}#ss .ss-lab{font-size:9px}#ss .ss-bar{height:26px}}
/* Phones: small badge bottom-left, clear of the chat and call buttons on the right */
@media (max-width:699px){#ss{width:46px;left:4px;right:auto;top:auto;bottom:calc(90px + env(safe-area-inset-bottom,0px));transform:none;opacity:.9}#ss .ss-lab,#ss .ss-bar{display:none}}
@media (max-height:620px){#ss .ss-lab,#ss .ss-bar{display:none}}
@media (prefers-reduced-motion:reduce){#ss .ss-st{transition:none}}
@media print{#ss{display:none}}
