/* Owner-approved public Image guidelines; hidden during editing. */
.design-system:has(>.lw-image-guidelines) .lw-upload .empty-copy h1 { font-size:clamp(48px,5.5vw,88px); }
.lw-image-guidelines { width:100%; padding-block:calc(var(--site-section-space) + var(--space-6)); background:var(--color-bg-control); scroll-margin-top:100px; color:var(--color-ink); }
.design-system:has(>.lw-image-guidelines)>.lw-workflow { padding-block:var(--site-section-space); }
.lw-image-guidelines h2,.lw-image-guidelines h3,.lw-image-guidelines p,.lw-image-guidelines figure { margin:0; }
.lw-image-guidelines h2 { margin-top:var(--space-4); font:500 clamp(32px,3.4vw,54px)/1.08 var(--font-display); letter-spacing:-.045em; }
.lw-image-guidelines svg { width:24px; height:24px; flex:none; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
.ig-required { display:flex; align-items:flex-start; gap:var(--space-3); margin-block:var(--space-8) var(--space-6); font:400 17px/1.6 var(--font-ui); }
.ig-required svg { width:20px; height:20px; margin-top:4px; }
.ig-required strong { font-weight:600; }
.ig-required p { font:inherit; }
.ig-visual-grid { display:grid; grid-template-columns:minmax(0,1fr) clamp(16px,2vw,32px) repeat(4,minmax(0,1fr)); gap:16px; width:80%; max-width:1440px; list-style:none; padding:0; margin:var(--space-8) auto 0; }
.ig-visual-grid li { min-width:0; --ig-status-color:var(--color-opposite); }
.ig-visual-grid li:first-child { --ig-status-color:var(--color-accent); grid-column:1; }
.ig-visual-grid li:nth-child(2) { grid-column:3; }
.ig-visual-grid li:nth-child(3) { grid-column:4; }
.ig-visual-grid li:nth-child(4) { grid-column:5; }
.ig-visual-grid li:nth-child(5) { grid-column:6; }
.ig-visual-grid figure { display:flex; flex-direction:column; height:100%; }
.ig-image-area { width:100%; margin-inline:auto; aspect-ratio:4/5; display:grid; place-items:center; }
.ig-frame { position:relative; flex:none; aspect-ratio:4/5; background:var(--color-bg-control); border:2px solid var(--ig-status-color); border-radius:clamp(24px,4vw,56px); overflow:hidden; display:grid; place-items:center; }
.ig-image-area>.ig-frame { width:92%; }
.ig-visual-grid li:first-child .ig-frame { width:100%; border-width:4px; }
.ig-frame img { width:100%; height:100%; object-fit:contain; min-height:0; display:block; }
.ig-frame[data-image-slot^="flat-"] img { width:92%; height:92%; }
/* Supplied white backgrounds continue into the frame. Source pixels stay intact.
   Uniform scaling aligns the four product-only hoodies to the same 78% height
   and 49% vertical center, using the measured garment bounds in the manifest. */
.ig-frame[data-image-slot^="batch-"]:not([data-image-slot="batch-person"]) img { position:absolute; max-width:none; width:auto; height:var(--ig-image-height); left:var(--ig-image-x); top:var(--ig-image-y); transform:translate(-50%,-50%); }
.ig-frame[data-image-slot="batch-person"] img { object-fit:cover; }
.ig-card-label { display:flex; flex-direction:column; align-items:center; text-align:center; gap:var(--space-2); margin-top:var(--space-4); font:600 18px/1.4 var(--font-ui); flex:1; }
.ig-card-label svg { width:24px; height:24px; color:var(--ig-status-color); stroke-width:2.5; }
.ig-visual-grid li:first-child .ig-card-label svg { width:32px; height:32px; padding:4px; color:var(--color-ink); }
.ig-visual-grid li:not(:first-child) .ig-card-label svg { margin-block:4px; }
.ig-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.design-system:not([data-phase=empty])>.lw-image-guidelines { display:none; }
@media(max-width:760px) {
 .ig-visual-grid { width:100%; grid-template-columns:minmax(0,1fr) 12px repeat(2,minmax(0,1fr)); gap:24px 12px; }
 .ig-visual-grid li:first-child { grid-column:1; grid-row:1 / span 2; align-self:start; }
 .ig-visual-grid li:nth-child(2) { grid-column:3; grid-row:1; }
 .ig-visual-grid li:nth-child(3) { grid-column:4; grid-row:1; }
 .ig-visual-grid li:nth-child(4) { grid-column:3; grid-row:2; }
 .ig-visual-grid li:nth-child(5) { grid-column:4; grid-row:2; }
 .ig-card-label { font-size:14px; overflow-wrap:anywhere; }
}
@media(max-width:699px) { .design-system:has(>.lw-image-guidelines) .lw-upload .empty-copy h1 { font-size:44px; } .lw-image-guidelines h2 { font-size:30px; } }
@media(max-width:480px) { .ig-visual-grid { gap:20px 8px; } .ig-frame { border-radius:20px; } .ig-card-label { font-size:12px; } }
