.designer-page{padding:40px 0 80px}.designer-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:28px}.designer-heading .eyebrow{margin-bottom:10px}.designer-heading h1{font-size:3.7rem;margin:0}.designer-heading p{margin:0}.designer-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,.85fr);gap:30px;align-items:start}.designer-stage{background:#fff;border:1px solid #e1e3e7;border-radius:16px;padding:24px;position:sticky;top:115px;min-width:0}.stage-label{display:flex;justify-content:space-between;font-size:.68rem;letter-spacing:.1em;color:#66748a}#canvas-wrap{width:100%;max-width:600px;margin:auto;touch-action:none}.view-picker{display:flex;justify-content:center;gap:10px}.view-picker button{background:white;border:1px solid #dbe0e7;border-radius:8px;padding:5px 15px 8px;font-size:.75rem}.view-picker img{width:60px;height:60px;object-fit:cover}.view-picker button[aria-pressed=true]{border-color:#386de0;box-shadow:0 0 0 1px #386de0}.studio-note{font-size:.74rem;line-height:1.65;color:#657187;margin:15px 0}.designer-stage>.studio-note{text-align:center}.designer-panel{background:#fff;border:1px solid #e1e3e7;border-radius:16px;padding:28px}.studio-product{display:flex;gap:18px;align-items:center;margin-bottom:22px}.studio-product>img{width:72px;height:82px;object-fit:cover;border-radius:8px}.studio-product .eyebrow{font-size:.65rem;margin:0 0 4px}.studio-product h2{font-family:'DM Sans',sans-serif;font-size:1.2rem;font-weight:600;margin:0 0 3px;letter-spacing:0}.studio-product p{font-size:.8rem;margin:0}.studio-add,.studio-two,.studio-export{display:grid;grid-template-columns:1fr 1fr;gap:10px}.studio-button,.upload-button{border:1px solid #cbd3df;background:#f6f7f9;border-radius:6px;padding:12px 10px;color:#172237;font-size:.85rem;text-align:center;cursor:pointer;display:block}.upload-button{position:relative}.upload-button input{position:absolute;opacity:0;width:100%;height:100%;inset:0;cursor:pointer}.upload-button:focus-within{outline:3px solid #83aeff;outline-offset:3px}.designer-panel select,.designer-panel input:not([type=range]):not([type=file]){width:100%;border:1px solid #ccd3de;border-radius:5px;padding:9px;background:white;color:#172237}.designer-panel input[type=color]{height:43px;padding:4px!important}.designer-panel label,.studio-label{font-size:.78rem;display:block;margin:9px 0 5px}.designer-panel fieldset{border:0;border-top:1px solid #e0e4ea;margin:22px 0 8px;padding:15px 0 0;min-width:0}.designer-panel legend{font-size:.7rem;padding-right:12px;color:#66748a}.designer-panel input[type=range]{width:100%;accent-color:#386de0}.designer-panel fieldset:disabled{opacity:.5}.nudge{display:flex;gap:6px;margin:12px 0}.nudge button{border:1px solid #d1d8e2;border-radius:5px;background:white;padding:8px;min-width:38px}.nudge button:last-child{flex:1;font-size:.8rem}.studio-link{background:none;border:0;padding:8px 0;color:#475a77;font-size:.78rem;text-decoration:underline;text-underline-offset:4px}button:disabled{cursor:default;opacity:.45}#design-status{font-size:.78rem;min-height:42px;margin:14px 0;color:#315283}.studio-export{border-top:1px solid #e0e4ea;padding-top:20px}.studio-export .button{font-size:.84rem;padding:12px}
@media(max-width:900px){.designer-layout{grid-template-columns:1fr;max-width:650px;margin:auto}.designer-stage{position:relative;top:auto}.designer-heading{display:block}.designer-heading h1{font-size:3rem}.designer-heading p{margin-top:10px}.designer-panel{padding:22px}.designer-stage{padding:18px}.designer-page{padding-top:30px}}
.embedded-designer .site-header,.embedded-designer .premium-footer,.embedded-designer .skip{display:none!important}.embedded-designer .designer-page{padding-top:26px}.embedded-designer .designer-heading{margin-bottom:16px}.embedded-designer .designer-heading h1{font-size:2.4rem}.embedded-designer .designer-stage{top:20px}
@media(max-width:650px){.embedded-designer .designer-heading h1{font-size:2rem}}

/* Product-view dock: the labels stay visible and the selected view stays clear. */
.view-picker{width:max-content;max-width:100%;margin:10px auto 0;padding:8px 10px 10px;gap:5px;align-items:end;border:1px solid #e0e5eb;border-radius:18px;background:linear-gradient(180deg,#fffffff2,#edf2f9ed);box-shadow:0 15px 36px #152b4b18,0 2px 5px #152b4b0c;isolation:isolate}
.view-picker button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:88px;min-height:87px;padding:5px 8px 7px;border:1px solid transparent;border-radius:12px;background:transparent;color:#44526a;transform:translateY(var(--dock-y,0px)) scale(var(--dock-scale,1));transition:transform .18s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease;z-index:1;cursor:pointer}
.view-picker button:hover,.view-picker button:focus-visible{background:#fff;box-shadow:0 7px 18px #2239591c;z-index:2}
.view-picker button[aria-pressed=true]{background:#e7effc;border-color:#a9c2ed;box-shadow:inset 0 0 0 1px #c6d8f5,0 3px 9px #1a3b6d13;color:#183665}
.view-picker button:focus-visible{outline:2px solid #3b72d3;outline-offset:3px}
.view-picker img{width:58px;height:57px;object-fit:cover;mix-blend-mode:multiply}
@media(max-width:450px){.view-picker{padding:6px;gap:2px}.view-picker button{width:77px;min-height:79px}.view-picker img{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.view-picker button{transition:none;transform:none}}