.pack-workspace{max-width:1400px;margin:auto;padding:28px 24px 32px}.pack-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px;gap:20px}.pack-heading h1{font-size:clamp(32px,4vw,50px);margin-top:14px}.pack-heading p{font-size:13px;color:var(--muted)}.pack-inputs{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.pack-upload{position:relative;cursor:pointer;display:flex;flex-direction:column;gap:7px;min-width:220px;flex:1;border:1px solid #346073;border-radius:8px;padding:17px 20px;margin:0;background:transparent;overflow:hidden}.pack-upload span{font-size:15px}.pack-upload small{font-size:11px;font-weight:400;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pack-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.pack-upload:focus-within{outline:2px solid var(--mint);outline-offset:3px}.pack-canvases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}.pack-product{min-width:0;border:1px solid #244452;border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#123443,transparent 70%)}.pack-product.excluded{opacity:.5}.pack-product-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;gap:10px}.pack-product-head h2{font-size:25px}.pack-product-head label{display:flex;align-items:center;gap:7px;margin:0;min-height:44px;font-size:11px;font-weight:400}.pack-product-head input{accent-color:var(--mint);width:17px;height:17px}.product-edit{display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;background:none;color:white;width:100%;padding:0 20px 20px;min-height:420px;cursor:pointer}.product-edit>svg{width:100%;height:350px;filter:drop-shadow(5px 12px 8px #0006)}.product-edit>span{font-size:12px;min-height:44px;display:flex;align-items:center;color:var(--muted)}.product-edit:hover>span{color:var(--mint)}.pack-footnote{font-size:11px;color:var(--muted);text-align:center;margin:15px 0}.pack-summary{position:sticky;bottom:0;background:#00141ef5;backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--line);z-index:3}.pack-summary strong{font-size:27px}.pack-summary del{font-size:12px;color:var(--muted);margin-left:10px}.pack-summary small{display:block;font-size:11px;color:var(--mint);margin-top:5px}#paste-panel{max-width:700px;margin:12px 0}#paste-panel button{margin-top:10px}dialog{border:1px solid #365764;border-radius:12px;background:#00141e;color:white;padding:0}dialog::backdrop{background:#000b}#native-editor{width:min(1500px,96vw);height:94dvh;max-width:96vw;max-height:94dvh}#native-frame{border:0;width:100%;height:calc(100% - 108px);background:#00141e}.native-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}.native-bar h2{font-size:26px;margin-right:auto}.native-bar button{white-space:nowrap}.native-bar .primary{min-height:44px}.native-bar .quiet{min-height:44px}#native-status{padding:0 16px;min-height:18px;margin:6px 0}#pack-review{width:min(620px,94vw);padding-bottom:20px}#pack-review-content,#pack-review>.fine{padding:10px 22px}#pack-review dl>div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:15px 0;gap:16px}#pack-review dd{margin:0}#pack-review h3{font-size:30px;margin-top:20px}
@media(max-width:760px){.pack-workspace{padding:20px 12px}.pack-heading{display:block;margin-bottom:18px}.pack-heading p{margin-top:10px}.pack-inputs{gap:8px}.pack-upload{min-width:calc(50% - 8px);padding:14px 12px}.pack-inputs>.quiet{border:0;padding:4px 0;min-height:44px}.pack-canvases{grid-template-columns:1fr;gap:12px}.pack-product-head h2{font-size:26px}.product-edit{min-height:0;padding:0 20px 10px}.product-edit>svg{height:300px}.pack-summary{padding:14px 0 max(14px,env(safe-area-inset-bottom))}.pack-summary strong{font-size:24px}.pack-summary .primary{padding:12px 16px}.native-bar{padding:8px;gap:6px}.native-bar h2{font-size:20px}.native-bar button{padding:10px;font-size:11px}#native-editor{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.pack-upload small{max-width:140px}}
@media(max-width:760px){.pack-canvases{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.pack-product:first-child{grid-row:span 2;display:flex;flex-direction:column}.pack-product-head{padding:8px 10px;flex-wrap:wrap;gap:0}.pack-product-head h2{font-size:21px;width:100%}.pack-product-head label{min-height:32px;font-size:10px}.product-edit{padding:0 6px 2px}.product-edit>svg{height:133px}.product-edit>span{min-height:36px;font-size:10px}.pack-product:first-child .product-edit{flex:1;justify-content:space-between}.pack-product:first-child .product-edit>svg{height:335px;max-height:100%}.pack-heading h1{font-size:34px}.pack-heading p{font-size:12px}.pack-workspace>#pack-status{min-height:32px}.pack-product-head input{margin-left:0}}
.product-edit{padding:0 12px 10px;min-height:480px}.product-render{width:100%;height:425px;position:relative;display:block}.product-render canvas{display:block;width:100%;height:100%;pointer-events:none}.product-render[data-render-state="loading"]:empty::after{content:"Rendering your design…";position:absolute;inset:0;display:grid;place-items:center;font-size:12px;color:var(--muted)}.product-render[data-render-state="error"]{display:grid;place-items:center;font-size:13px;color:var(--muted)}.product-edit:focus-visible{outline:2px solid var(--mint);outline-offset:-4px}.product-edit>span{flex-shrink:0}.pack-product-head input{flex-shrink:0}
@media(max-width:760px){.product-edit{min-height:0;padding:0 2px 4px}.product-render{height:178px}.pack-product:first-child .product-render{height:415px;flex:1}.pack-product-head h2{font-size:22px}.pack-product-head label{min-height:38px}.product-edit>span{font-size:10px;min-height:38px}.pack-product:first-child .product-edit{justify-content:center}.pack-canvases{gap:8px}}
.product-render{min-height:0;overflow:hidden}.product-render canvas{position:absolute;inset:0}