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)}}

.shirt-cart-add .saved-cart-link{margin-left:auto;align-self:flex-start;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}.shirt-cart-add .saved-cart-link[hidden]{display:none}.saved-cart-link img{width:40px;height:27px;object-fit:contain;flex:none}

.shirt-view-actions{position:absolute;top:10px;right:10px;left:10px;z-index:4;display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}.shirt-view-actions button,.shirt-view-actions #shirt-full-view{position:static;display:inline-flex;align-items:center;gap:6px;background:white;border:1px solid #b8cbd5;color:#21495e;font-size:.8rem;padding:8px;min-height:40px}.shirt-view-actions svg{width:20px;height:22px;fill:none;stroke:currentColor;stroke-width:2;overflow:visible}.lock-shackle{transform:translateY(-3px) rotate(-18deg);transform-origin:17px 11px;transition:transform .25s ease}.locked .lock-shackle{transform:none}.shirt-view-actions button.locked{background:#21495e;color:white}#shirt-side-label{position:absolute;bottom:8px;left:8px;background:#ffffffdf;padding:5px 8px;border-radius:6px;font-size:.8rem;pointer-events:none}.placement-stage.full-shirt .full-only{top:60px}.placement-stage.full-shirt{padding-top:110px!important}

.upload.awaiting-shirt-upload{outline:3px solid #1976a3;outline-offset:5px;box-shadow:0 0 0 9px #efa83c55;animation:upload-attention 1.2s ease-in-out infinite}@keyframes upload-attention{50%{box-shadow:0 0 0 14px #efa83c22}}@media(prefers-reduced-motion:reduce){.upload.awaiting-shirt-upload{animation:none}}
.shirt-composition{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:16px;align-items:start}.shirt-layer-list{background:white;border:1px solid #b8cbd5;border-radius:10px;padding:12px;max-height:70vh;overflow:auto}.shirt-layer-list h3{margin:0 0 12px}.shirt-layer-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px;margin-bottom:8px;padding:5px;border:2px solid transparent;border-radius:8px}.shirt-layer-row.selected{border-color:#1976a3;background:#eaf6fc}.shirt-layer-row button{padding:7px;font-size:.8rem;overflow-wrap:anywhere;min-width:0}.shirt-layer-row button:first-child{text-align:left}@media(max-width:800px){.shirt-composition{grid-template-columns:minmax(0,1fr)}.shirt-layer-list{max-height:240px}}
body.placing .shirt-placement{grid-column:1 / -1}.shirt-layers-full .shirt-layer-list{position:fixed;right:28px;top:130px;width:245px;z-index:1010;max-height:calc(100dvh - 160px)}body.placing.shirt-layers-full .placement-stage.full-shirt{padding-right:285px}@media(max-width:800px){.shirt-layers-full .shirt-layer-list{top:auto;bottom:20px;left:20px;right:20px;width:auto;max-height:150px}body.placing.shirt-layers-full .placement-stage.full-shirt{padding-right:14px;padding-bottom:180px}}

.shirt-placement-loading{padding:12px;margin-top:10px;border:1px solid #b8cbd5;border-radius:8px;background:#eef7fb}.shirt-placement-loading[hidden]{display:none}.shirt-placement-loading span{display:block;margin-bottom:8px}.shirt-placement-loading progress{display:block;width:100%;height:10px;accent-color:#1976a3}
.shirt-preview-zoom{display:none}.placement-stage.full-shirt .shirt-preview-zoom{display:flex;position:absolute;z-index:6;bottom:35px;left:14px;right:285px;align-items:center;gap:8px;padding:8px;background:#fffffff0;border-radius:8px;flex-wrap:wrap}.shirt-preview-zoom label{display:flex;align-items:center;gap:8px;font-size:.85rem}.shirt-preview-zoom input{width:130px}.shirt-preview-zoom button{padding:6px 10px;min-height:34px;font-size:.85rem}.shirt-preview-zoom span{font-size:.75rem}.placement-stage canvas{transform-origin:center;will-change:transform}@media(max-width:800px){.placement-stage.full-shirt .shirt-preview-zoom{right:14px;bottom:185px}.shirt-preview-zoom span{display:none}}
.shirt-placement-loading{position:fixed;inset:0;z-index:12000;margin:0;border:0;border-radius:0;background:#162c3b88;display:grid;place-items:center;backdrop-filter:blur(2px)}.shirt-loading-card{width:min(350px,88vw);padding:24px;background:white;border-radius:16px;text-align:center;box-shadow:0 8px 35px #0003}.shirt-loading-card img{width:180px;height:155px;object-fit:contain}.shirt-loading-card progress{width:100%;height:12px}

/* Shirt preview colour uses its selected colour directly. */
label[for="shirt-intensity"],#shirt-intensity,label:has(#placement-intensity-value),#placement-intensity{display:none!important}

.shirt-cart-add .saved-shirt-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px;flex-basis:100%}.shirt-cart-add .saved-shirt-actions .saved-cart-link{margin-left:0;align-self:stretch;justify-content:center}.saved-shirt-actions [hidden]{display:none!important}