.mockup-heading{max-width:70rem}.mockup-heading h1{max-width:14ch}.mockup-app{--mockup-lime:#ccff00;--mockup-violet:#6b3dff;max-width:94rem;margin:0 auto 5rem;padding:0 2rem}.mockup-app button,.mockup-upload{min-height:44px}.mockup-library,.mockup-workspace,.mockup-export{margin-top:2rem;border:2px solid var(--ink);background:var(--surface);box-shadow:.7rem .7rem 0 var(--ink)}.mockup-library,.mockup-export{padding:clamp(1rem,3vw,2rem)}.mockup-section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}.mockup-section-heading>div{display:flex;align-items:center;gap:.8rem}.mockup-section-heading span{display:grid;place-items:center;width:2.4rem;height:2.4rem;background:var(--mockup-lime);border:2px solid var(--ink);border-radius:50%;font-weight:900}.mockup-section-heading h2{margin:0;font-size:clamp(1.5rem,3vw,2.6rem)}.mockup-upload{display:inline-flex;align-items:center;justify-content:center;padding:.6rem 1rem;background:var(--mockup-violet);color:#fff;border:2px solid var(--ink);font-weight:900;cursor:pointer}.mockup-upload input{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0)}.mockup-upload:focus-within{outline:3px solid var(--ink);outline-offset:3px}.mockup-products{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:1rem}.mockup-product{display:grid;grid-template-columns:5rem 1fr;align-items:center;gap:.8rem;padding:.5rem;text-align:left;background:#fff;border:2px solid var(--ink);color:var(--ink)}.mockup-product:hover,.mockup-product.is-selected{transform:translate(-2px,-2px);box-shadow:.3rem .3rem 0 var(--mockup-lime)}.mockup-product img{width:5rem;height:5rem;object-fit:cover;background:#eee}.mockup-product span{display:grid}.mockup-product small{text-transform:uppercase;font-weight:800}.mockup-empty{grid-column:1/-1}.mockup-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,25rem);padding:0;overflow:hidden}.mockup-stage-column{min-width:0;background:#242129}.mockup-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;padding:.75rem;background:#111;color:#fff}.mockup-toolbar button{padding:.45rem .75rem;background:#fff;color:#111}.mockup-toolbar label{display:flex;align-items:center;gap:.5rem;margin-left:auto;font-size:.82rem;font-weight:800}.mockup-stage{position:relative;display:grid;place-items:center;min-height:38rem;max-height:78vh;padding:1rem;overflow:auto;background-color:#28242f;background-image:linear-gradient(45deg,#302b39 25%,transparent 25%),linear-gradient(-45deg,#302b39 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#302b39 75%),linear-gradient(-45deg,transparent 75%,#302b39 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}.mockup-stage:focus{outline:4px solid var(--mockup-lime);outline-offset:-4px}.mockup-start{position:absolute;display:grid;gap:.4rem;text-align:center;color:#fff;pointer-events:none}.mockup-start strong{font-size:1.6rem}.mockup-status{min-height:2.4rem;margin:0;padding:.6rem 1rem;background:#111;color:var(--mockup-lime);font-weight:800}.mockup-controls{padding:1.25rem;background:#fff;border-left:2px solid var(--ink)}.mockup-controls .mockup-section-heading{margin-bottom:.75rem}.layer-tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:1rem}.layer-tabs button{background:#fff;color:var(--ink);border:2px solid var(--ink)}.layer-tabs button+button{border-left:0}.layer-tabs button[aria-selected=true]{background:var(--mockup-lime)}.mockup-design-upload{width:100%;margin-bottom:1rem}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.control-grid label{display:grid;gap:.3rem;font-size:.78rem;font-weight:900;text-transform:uppercase}.control-grid input,.control-grid select{width:100%;min-height:44px}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1rem 0}.button-row button{padding:.5rem;background:#fff;color:var(--ink);border:2px solid var(--ink)}.design-only[hidden]{display:none}.mockup-export{background:var(--mockup-lime)}.export-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem}.export-actions label{display:flex;align-items:center;gap:.5rem;font-weight:900}.quote-export{margin-left:auto;background:var(--mockup-violet)!important;color:#fff!important}.mockup-crop-dialog{width:min(34rem,calc(100% - 2rem));padding:0;border:3px solid var(--ink);box-shadow:.7rem .7rem 0 var(--mockup-lime)}.mockup-crop-dialog::backdrop{background:rgba(17,17,17,.75)}.mockup-crop-dialog form{padding:1.25rem}.mockup-crop-dialog header{display:flex;justify-content:space-between;align-items:center}.mockup-crop-dialog header button{font-size:1.4rem;background:#fff;color:var(--ink)}.mockup-crop-dialog menu{display:flex;justify-content:flex-end;gap:.75rem;padding:1rem 0 0}.mockup-home-cta{max-width:74rem;margin:3rem auto;padding:clamp(1.5rem,5vw,4rem);background:var(--gold);border:3px solid var(--ink);box-shadow:1rem 1rem 0 var(--accent)}.mockup-home-cta h2{font-size:clamp(2rem,6vw,5rem);max-width:12ch}.mockup-handoff{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin:0 auto 1.5rem;padding:1rem;border:3px solid var(--ink);background:var(--gold);box-shadow:.4rem .4rem 0 var(--ink)}.mockup-handoff strong{font-size:1.2rem;text-transform:uppercase}.mockup-handoff-preview{width:7rem;height:7rem;object-fit:cover;border:2px solid var(--ink)}
@media(max-width:900px){.mockup-workspace{grid-template-columns:1fr}.mockup-controls{border-left:0;border-top:2px solid var(--ink)}.mockup-stage{min-height:30rem}.quote-export{margin-left:0}}
@media(max-width:560px){.mockup-app{padding:0 1rem}.mockup-library,.mockup-export{padding:1rem}.mockup-section-heading{align-items:flex-start;flex-direction:column}.mockup-products{grid-template-columns:1fr}.mockup-workspace{box-shadow:.4rem .4rem 0 var(--ink)}.mockup-stage{min-height:22rem;padding:.5rem}.mockup-toolbar label{width:100%;margin-left:0}.control-grid{grid-template-columns:1fr 1fr}.export-actions{align-items:stretch;flex-direction:column}.export-actions>*{width:100%}}
@media(prefers-reduced-motion:reduce){.mockup-product{transition:none}.mockup-product:hover,.mockup-product.is-selected{transform:none}}
.mockup-start[hidden]{display:none}
.remove-layer{width:100%;padding:.65rem;border:2px solid #8f1d16!important;background:#fff!important;color:#8f1d16!important;font-weight:900}.remove-layer:hover,.remove-layer:focus-visible{background:#8f1d16!important;color:#fff!important}
.upload-purpose{max-width:36rem;margin:.25rem 0 0;font-size:.9rem;line-height:1.35}.mockup-section-heading>div>div{min-width:0}.upload-merch{flex:0 0 auto}.design-upload-card{display:grid;gap:.25rem;margin:0 0 1rem;padding:1rem;border:3px solid var(--ink);background:var(--mockup-lime)}.design-upload-card strong{text-transform:uppercase;font-size:1.05rem}.design-upload-card span{font-size:.85rem}.design-upload-card .mockup-design-upload{margin:.6rem 0 0;background:var(--ink);color:#fff}.layer-tabs{margin-top:1.25rem}
.merch-upload-feature{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1.5rem;margin:1.5rem 0;padding:clamp(1.25rem,3vw,2rem);border:4px solid var(--ink);background:var(--mockup-lime);box-shadow:.55rem .55rem 0 var(--mockup-violet)}.merch-upload-feature strong{display:inline-block;padding:.2rem .5rem;background:var(--ink);color:#fff;text-transform:uppercase;font-size:.8rem;letter-spacing:.06em}.merch-upload-feature h3{margin:.45rem 0 .3rem;font-size:clamp(1.5rem,3vw,2.4rem)}.merch-upload-feature p{max-width:42rem;margin:0}.merch-upload-feature .upload-merch{min-width:15rem;padding:1rem 1.25rem;background:var(--mockup-violet);font-size:1rem;text-align:center}.library-divider{display:flex;align-items:center;gap:1rem;margin:2rem 0 1rem;font-weight:900;text-transform:uppercase}.library-divider::before,.library-divider::after{content:"";height:3px;flex:1;background:var(--ink)}.library-divider span{white-space:nowrap}
@media(max-width:700px){.merch-upload-feature{grid-template-columns:1fr}.merch-upload-feature .upload-merch{width:100%;min-width:0}.library-divider span{white-space:normal;text-align:center}}
