#app .showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}#app .showcase-card{aspect-ratio:3/4;display:flex;flex-direction:column;min-width:0;overflow:hidden;background:#fff;border:2px solid #17151c;box-shadow:5px 5px 0 #17151c;border-radius:0}#app .showcase-image{display:grid;place-items:center;width:100%;aspect-ratio:1;flex:none;overflow:hidden;background:#f5f2ea}#app .showcase-image img{width:100%;height:100%;object-fit:contain}#app .showcase-image>span{font-size:60px}#app .showcase-body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:space-between;padding:10px 14px;gap:4px}#app .showcase-body h3{margin:0;font-size:clamp(14px,1.4vw,20px);line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#app .showcase-bottom{display:flex;justify-content:space-between;align-items:center;font-weight:800;gap:8px}#app .showcase-bottom .mini{min-width:36px;min-height:36px}#app .showcase-placeholder{aspect-ratio:3/4;background:#f6f3e8;border:2px dashed #b6ada0;display:grid;place-items:center;padding:24px;text-align:center;color:#625b53}.shop-highlight,.shop-assortment{margin-top:36px}.shop-highlight .section-head{align-items:center;flex-wrap:wrap;gap:12px}.assortment-filter{display:grid;gap:8px;max-width:400px;margin:20px 0;font-weight:800}.assortment-filter select{width:100%;min-width:0}.showcase-card a:focus-visible{outline:3px solid #7442bf;outline-offset:-4px}@media(max-width:1000px){#app .showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){#app .showcase-grid{grid-template-columns:1fr}#app .showcase-body h3{font-size:20px}#app .showcase-body{padding:12px 16px}}
#app .showcase-reel{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:0 6px 12px 0;scrollbar-width:thin}#app .showcase-reel>*{scroll-snap-align:start;min-width:0}.showreel-controls{display:flex;align-items:center;gap:10px}.showreel-controls .mini{min-width:44px;min-height:44px}#app .showcase-reel:focus-visible{outline:3px solid #7442bf;outline-offset:4px}@media(max-width:1000px){#app .showcase-reel{grid-template-columns:none;grid-auto-columns:calc((100% - 24px)/2)}}@media(max-width:650px){#app .showcase-reel{grid-template-columns:none;grid-auto-columns:85%}#app .showcase-body{padding:8px 12px}#app .showcase-body h3{font-size:16px}} 
#app .shop-highlight{--highlight-color:#ce1833;--highlight-bg:#ffe9ec;--highlight-ink:#fff;box-sizing:border-box;padding:24px;border:2px solid #17151c;box-shadow:6px 6px 0 #17151c;background:var(--highlight-bg);color:#17151c}
#app .highlight-fast-deal{--highlight-color:#ffe02b;--highlight-bg:#fff9d6;--highlight-ink:#17151c}
#app .highlight-fanshop{--highlight-color:#f19bbb;--highlight-bg:#fff0f5;--highlight-ink:#17151c}
#app .shop-highlight .section-head{background:var(--highlight-color);color:var(--highlight-ink);padding:18px;margin:0 0 24px;border:2px solid #17151c}
#app .shop-highlight .section-head h2,#app .shop-highlight .showreel-controls>span{color:var(--highlight-ink)}
#app .shop-highlight .showcase-body{background:var(--highlight-bg);border-top:4px solid var(--highlight-color);color:#17151c}
#app .shop-highlight .showcase-body a{color:#17151c}
#app .shop-highlight .mini{background:var(--highlight-color);color:var(--highlight-ink);border:2px solid #17151c}
#app .shop-highlight .section-head .mini{background:#fff;color:#17151c}
@media(max-width:650px){#app .shop-highlight{padding:12px}#app .shop-highlight .section-head{padding:12px}#app .shop-highlight .showreel-controls{flex-wrap:wrap}}
#app .shop-highlight{padding:32px 0;border-left:0;border-right:0;box-shadow:0 0 0 100vmax var(--highlight-bg);clip-path:inset(0 -100vmax)}
#app .shop-highlight .section-head h2{font-size:clamp(36px,5.5vw,76px)!important;line-height:1.05!important;margin:0;overflow-wrap:anywhere;letter-spacing:-.02em}
@media(max-width:650px){#app .shop-highlight{padding:24px 0}#app .shop-highlight .section-head h2{font-size:clamp(30px,8.5vw,46px)!important}.shop-highlight .section-head{align-items:flex-start}}
#app .assortment-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:24px 0;flex-wrap:wrap}#app .assortment-toolbar .pills{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin:0}#app .more-categories{position:relative}#app .more-categories summary{cursor:pointer;list-style:none}#app .more-categories summary::after{content:' ▾'}#app .more-categories summary::-webkit-details-marker{display:none}#app .category-options{position:absolute;top:calc(100% + 10px);left:0;z-index:20;display:grid;gap:8px;min-width:230px;max-width:min(320px,80vw);max-height:340px;overflow:auto;overscroll-behavior:contain;padding:14px;border:2px solid #17151c;background:#fffaf2;box-shadow:4px 4px #17151c}#app .category-options .pill{text-align:left;white-space:normal}#app .assortment-sort{display:grid;gap:6px;font-weight:800;min-width:230px}#app .assortment-sort select{width:100%;border:2px solid #17151c;background:#fffaf2;color:#17151c;padding:12px;box-shadow:3px 3px #17151c}@media(max-width:600px){#app .assortment-sort{width:100%}#app .assortment-toolbar{gap:16px}}
#app .showcase-card:has(.highlight-countdown){aspect-ratio:auto;min-height:0}#app .showcase-card:has(.highlight-countdown) .showcase-body{min-height:145px;flex-shrink:0}.highlight-countdown{font-size:14px;line-height:1.4;overflow-wrap:anywhere}
/* CSS viewport width is the reliable proxy; physical display inches are unavailable. */
@media (min-width:380px) and (max-width:650px){
  #app .showcase-grid:not(.showcase-reel){grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  #app .showcase-grid:not(.showcase-reel) .showcase-card{aspect-ratio:auto}
  #app .showcase-grid:not(.showcase-reel) .showcase-body{min-height:112px;padding:10px;gap:10px}
  #app .showcase-grid:not(.showcase-reel) .showcase-body h3{font-size:16px;overflow-wrap:anywhere}
  #app .showcase-grid:not(.showcase-reel) .showcase-bottom{flex-wrap:wrap}
}
#app .highlight-fast-deal .section-head{flex-wrap:wrap}
#app .highlight-fast-deal .section-head>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;flex:1 0 100%;flex-wrap:wrap}
#app .highlight-fast-deal .section-head .highlight-countdown{margin:0 0 0 auto!important;padding:12px 18px;background:#17151c;color:#fff;text-align:right;border:2px solid #17151c;box-shadow:4px 4px 0 #fff;font-size:14px;line-height:1.4;max-width:100%;box-sizing:border-box}
#app .highlight-fast-deal .section-head .highlight-countdown span{display:block;font-size:clamp(24px,3vw,40px);font-weight:900;white-space:nowrap}
#app .highlight-fast-deal .section-head .showreel-controls{margin-left:auto}
@media(max-width:650px){#app .highlight-fast-deal .section-head>div:first-child{gap:12px}#app .highlight-fast-deal .section-head .highlight-countdown{padding:8px 12px}}

/* Desktop catalogue: two initial rows, four cards per row; reels and mobile unchanged. */
@media(min-width:1001px){#app .shop-assortment .showcase-grid:not(.showcase-reel),.sanu-skeleton-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Equal desktop card widths, readable content; mobile rules remain untouched. */
@media(min-width:1001px){
 #app .highlight-fast-deal .showcase-reel{grid-auto-columns:calc((100% - 72px)/4);padding-left:0;padding-right:0}
 #app .highlight-showstopper .showcase-reel{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(3,calc((100% - 72px)/4));justify-content:center;padding-left:0;padding-right:0}
 #app .highlight-showstopper .showreel-controls button{display:none}
 #app .showcase-card{aspect-ratio:auto;height:100%;align-self:stretch}
 #app .showcase-body{min-height:136px;padding:14px;gap:12px;flex-shrink:0}
 #app .showcase-body h3{font-size:18px;line-height:1.3;display:block;-webkit-line-clamp:unset;overflow:visible;overflow-wrap:anywhere;min-height:2.6em;letter-spacing:normal}
 #app .showcase-bottom{font-size:18px;line-height:1.3;flex-wrap:wrap;gap:10px}
 #app .showcase-bottom>span{min-width:0;overflow-wrap:anywhere}
 #app .showcase-bottom .mini{flex:none;min-width:40px;min-height:40px;margin-left:auto}
}