.shop-countdown{position:sticky;top:var(--shop-header-height,96px);z-index:49;background:#080a09;color:#ffb52c;text-align:center;padding:13px 16px 11px;border-bottom:1px solid #b67b233d;box-shadow:0 5px 16px #0002}
.shop-countdown-title{margin:0;color:#f5f4ef;font:700 12px/1.4 system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.shop-countdown-clock{display:flex;align-items:flex-start;justify-content:center;gap:14px;margin:9px auto 0;width:fit-content;max-width:100%}
.shop-countdown-clock[hidden]{display:none}
.shop-clock-group{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0}
.shop-clock-digits{display:flex;gap:6px;filter:drop-shadow(0 0 4px #ff9e1680)}
.shop-clock-digit{position:relative;display:block;width:24px;height:43px;flex-shrink:0;transform:skew(-5deg)}
.seg{position:absolute;display:block;background:#ffb32b;opacity:.045}
.seg-a,.seg-g,.seg-d{width:20px;height:5px;left:2px;clip-path:polygon(14% 0,86% 0,100% 50%,86% 100%,14% 100%,0 50%)}
.seg-a{top:0}.seg-g{top:19px}.seg-d{bottom:0}
.seg-b,.seg-c,.seg-e,.seg-f{width:5px;height:19px;clip-path:polygon(50% 0,100% 13%,100% 87%,50% 100%,0 87%,0 13%)}
.seg-b{top:2px;right:0}.seg-c{bottom:2px;right:0}.seg-e{bottom:2px;left:0}.seg-f{top:2px;left:0}
[data-digit="0"] :is(.seg-a,.seg-b,.seg-c,.seg-d,.seg-e,.seg-f),[data-digit="1"] :is(.seg-b,.seg-c),[data-digit="2"] :is(.seg-a,.seg-b,.seg-g,.seg-e,.seg-d),[data-digit="3"] :is(.seg-a,.seg-b,.seg-c,.seg-d,.seg-g),[data-digit="4"] :is(.seg-f,.seg-g,.seg-b,.seg-c),[data-digit="5"] :is(.seg-a,.seg-f,.seg-g,.seg-c,.seg-d),[data-digit="6"] :is(.seg-a,.seg-f,.seg-g,.seg-e,.seg-c,.seg-d),[data-digit="7"] :is(.seg-a,.seg-b,.seg-c),[data-digit="8"] .seg,[data-digit="9"] :is(.seg-a,.seg-b,.seg-c,.seg-d,.seg-f,.seg-g){opacity:1}
.shop-clock-colon{color:#ffb32b;font:600 35px/40px ui-monospace,monospace;text-shadow:0 0 7px #ff9e1660}
.shop-clock-unit{color:#babcb9;font:600 9px/1.3 system-ui,sans-serif;letter-spacing:.14em}
html{scroll-padding-top:calc(var(--shop-header-height,96px) + 125px)}
@media(max-width:480px){.shop-countdown{padding:11px 10px 10px}.shop-countdown-title{font-size:10px;letter-spacing:.16em}.shop-countdown-clock{gap:9px;margin-top:8px}.shop-clock-digits{gap:4px}.shop-clock-digit{width:21px;height:38px}.seg-a,.seg-g,.seg-d{width:17px;height:4px}.seg-g{top:17px}.seg-b,.seg-c,.seg-e,.seg-f{width:4px;height:17px}.shop-clock-colon{font-size:29px;line-height:35px}.shop-clock-unit{font-size:8px;letter-spacing:.1em}}
@media(max-width:350px){.shop-countdown-clock{gap:6px}.shop-clock-digits{gap:3px}}

/* Single-line clock on mobile */
@media(max-width:640px){
 .shop-countdown{display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 10px;min-height:38px}
 .shop-countdown-title{font-size:9px;letter-spacing:.04em}
 .shop-countdown-clock{margin:0;gap:5px;align-items:center}
 .shop-clock-group{flex-direction:row;gap:2px;align-items:baseline}
 .shop-clock-digits{display:block;filter:none;font:700 15px/1.3 ui-monospace,monospace}
 .shop-clock-digits:after{content:attr(data-value)}
 .shop-clock-digit{display:none}
 .shop-clock-unit{font-size:7px;letter-spacing:0}
 .shop-clock-colon{font-size:14px;line-height:1}
 html{scroll-padding-top:calc(var(--shop-header-height,96px) + 46px)}
}