header nav{display:flex;flex-wrap:wrap;gap:8px}header{flex-wrap:wrap}#pick-background{display:none!important}.cart-top{display:flex;justify-content:flex-end;gap:10px;margin-bottom:16px}.cart-top a{display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:#21495e;border:1px solid #b8cbd5;border-radius:9px;padding:9px 12px;background:white;font-weight:700}.cart-top img{width:40px;height:27px;object-fit:contain}.placement-open{width:100%;margin-top:24px}.shirt-placement{background:white;border:1px solid #dbe4e9;border-radius:14px;padding:20px;grid-column:1;position:sticky;top:12px}.shirt-placement h2{font-size:1.2rem}.shirt-size-buttons{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.shirt-size-buttons button,.placement-tools button{background:white;border:1px solid #b8cbd5;color:#21495e;min-width:44px}.shirt-size-buttons button.active,.placement-tools button.active{background:#162c3b;color:white;border-color:#162c3b}.placement-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:14px 0}.placement-tools label{display:flex;align-items:center;gap:8px;font-size:.9rem}.placement-stage{position:relative;height:min(62dvh,640px);min-height:300px;background:#e9eef2;overflow:hidden;border-radius:10px;display:grid;place-items:center}.placement-stage canvas{max-width:100%;max-height:100%;object-fit:contain;touch-action:none;cursor:grab}.placement-stage canvas.resizing{cursor:nwse-resize}.placement-help{font-size:.9rem;color:#617480;line-height:1.5}.placement-colours{margin:18px 0}.placement-colours h3{font-size:1rem}.placement-colours .colour-palette{grid-template-columns:repeat(8,minmax(0,1fr))}.placement-colours .colour-swatch{font-size:.8rem;line-height:1.25;padding:8px 3px}.placement-colours .colour-swatch.active{padding:7px 2px}.placement-done{width:100%;margin-top:15px}.shirt-cart-add{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:20px}.shirt-cart-add input{width:70px}.shirt-cart-add p{margin:0;font-size:.9rem}body.placing .previews,body.placing #original-article,body.placing #artwork-article{display:none!important}body.placing aside{pointer-events:none;opacity:.5}body.placing aside .placement-open{pointer-events:auto}body.placing .workspace{align-items:start}.shirt-export-dialog{width:min(94vw,920px);max-height:90dvh;border:1px solid #b8cbd5;border-radius:14px;padding:24px;color:#162c3b}.shirt-export-dialog::backdrop{background:#162c3b99}.export-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.shirt-export-dialog section{margin-top:20px;border-top:1px solid #dbe4e9;padding:16px 0}.shirt-export-dialog .layer-preview{display:block;width:100%;height:300px;object-fit:contain;background:repeating-conic-gradient(#e8e8e8 0% 25%,white 0% 50%) 0/16px 16px;margin:12px 0;border:1px solid #ccc}.cart-add-status{color:#617480}#placement-colour-controls.setting-inactive{opacity:.5}#dimensions{line-height:1.5}@media(max-width:720px){.shirt-placement{position:static;order:-1;padding:12px}.placement-stage{height:52dvh;min-height:280px}.placement-colours .colour-palette{grid-template-columns:repeat(4,minmax(0,1fr))}.cart-top{justify-content:flex-end}.placement-tools{gap:9px}.placement-tools input{width:90px}body.placing aside{display:none}}

/* Anchor only the display; the placement controls continue scrolling. */
body.placing .shirt-placement{position:static;top:auto;align-self:start;width:100%;min-width:0}
body.placing .placement-stage{position:sticky;top:12px;z-index:20;box-shadow:0 6px 18px #162c3b22;height:min(52dvh,540px);min-height:0}
@media(max-width:720px){body.placing .placement-stage{top:8px;height:42dvh;min-height:0}}

.shirt-mockup-preview{display:block;width:100%;max-height:560px;object-fit:contain;background:#e9eef2;border:1px solid #dbe4e9;border-radius:10px;margin:12px 0}

#shirt-full-view{position:absolute;top:10px;right:10px;z-index:3;background:white;border:1px solid #b8cbd5;color:#21495e;font-size:.875rem;padding:10px 12px;min-height:42px}#shirt-size-limit{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);z-index:3;color:#b32323;background:#fff0ee;border:1px solid #d88e87;border-radius:8px;padding:8px 12px;margin:0;font-weight:700;white-space:nowrap}.full-only{display:none}body.placing .placement-stage.full-shirt{position:fixed!important;inset:12px!important;width:calc(100vw - 24px);height:calc(100dvh - 24px)!important;max-height:none;z-index:1000;border:1px solid #b8cbd5;padding:62px 14px 14px;box-shadow:0 0 0 100vmax #162c3b99}.placement-stage.full-shirt canvas{max-width:100%;max-height:100%;width:auto;height:auto}.placement-stage.full-shirt .full-only{display:block;position:absolute;top:10px;left:10px;z-index:3;background:white;border:1px solid #b8cbd5;color:#21495e;font-size:.875rem;min-height:42px}.placement-stage.full-shirt .full-only.active{background:#162c3b;color:white}@media(max-width:720px){body.placing .placement-stage.full-shirt{inset:6px!important;width:calc(100vw - 12px);height:calc(100dvh - 12px)!important;padding:60px 8px 8px}}

.placement-stage canvas{display:block;flex:none;min-width:0;min-height:0;max-width:none!important;max-height:none!important}.placement-stage{box-sizing:border-box;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}.cart-top img{flex:none;display:block;width:40px!important;height:27px!important;object-fit:contain}.shirt-save-loading{position:fixed;inset:0;z-index:2000;background:#162c3b55;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;backdrop-filter:blur(2px)}.shirt-save-loading[hidden]{display:none}.shirt-save-loading span{background:white;padding:12px 24px;border-radius:10px;font-weight:700}.shirt-save-loading i{width:90px;height:5px;border-radius:5px;background:#efa83c;animation:shirt-loading 1.2s ease-in-out infinite}@keyframes shirt-loading{0%,100%{transform:translateX(-90px)}50%{transform:translateX(90px)}}
/* Keep placement confirmation reachable below the sticky shirt preview. */
body.placing .shirt-placement{padding-bottom:90px}
body.placing #placement-done{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(680px,calc(100vw - 32px));margin:0;z-index:40;min-height:48px;box-shadow:0 0 0 8px #ffffffee,0 6px 20px #162c3b44}
body.placing .shirt-placement:has(.placement-stage.full-shirt) #placement-done{visibility:hidden}