:root{--font-heading-scale: 1.2;--font-body-scale: 1;--design-studio-border-radius: 1.2rem;--design-studio-border-radius-small: .8rem;--design-studio-spacing: 2rem;--design-studio-spacing-small: 1rem;--shadow-subtle: 0 .1rem .2rem rgba(0, 0, 0, .05);--shadow-moderate: 0 .4rem 1.2rem rgba(0, 0, 0, .08);--shadow-strong: 0 1rem 2rem rgba(0, 0, 0, .12)}.design-studio-container{max-width:var(--page-width, 144rem);margin:0 auto;padding:0 1.5rem;background:rgb(var(--color-background));min-height:100vh}@media screen and (min-width: 750px){.design-studio-container{padding:0 5rem}}.design-studio-main{display:grid;grid-template-columns:1fr;gap:var(--design-studio-spacing);margin-bottom:var(--design-studio-spacing)}@media screen and (min-width: 990px){.design-studio-main{grid-template-columns:1fr 1fr;gap:4rem}}.design-panel{background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.08);border-radius:var(--design-studio-border-radius);padding:var(--design-studio-spacing-small);box-shadow:var(--shadow-moderate)}@media screen and (min-width: 750px){.design-panel{padding:var(--design-studio-spacing)}}.design-panel__title{font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:calc(var(--font-heading-scale) * 2.4rem);line-height:calc(1 + .3 / var(--font-heading-scale));margin-bottom:1.5rem;color:rgb(var(--color-foreground));letter-spacing:calc(var(--font-heading-scale) * .06rem)}@media screen and (min-width: 750px){.design-panel__title{font-size:calc(var(--font-heading-scale) * 2.8rem)}}@media screen and (min-width: 990px){.design-panel__title{font-size:calc(var(--font-heading-scale) * 3.2rem)}}.design-canvas{width:100%;aspect-ratio:4/3;border:.2rem dashed rgba(var(--color-foreground),.2);border-radius:var(--design-studio-border-radius-small);display:flex;align-items:center;justify-content:center;background:rgb(var(--color-background));position:relative;margin-bottom:var(--design-studio-spacing-small);transition:border-color var(--duration-short) ease}.design-canvas.has-design{border-color:rgb(var(--color-button));background:rgb(var(--color-base-background-1))}.canvas-placeholder{text-align:center;color:rgba(var(--color-foreground),.55);font-family:var(--font-body-family);font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .8 / var(--font-body-scale))}@media screen and (min-width: 750px){.canvas-placeholder{font-size:calc(var(--font-body-scale) * 1.6rem)}}.canvas-placeholder__icon{font-size:4rem;margin-bottom:1rem;display:block}@media screen and (min-width: 750px){.canvas-placeholder__icon{font-size:5rem}}.uploaded-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--design-studio-border-radius-small)}.design-tools{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:var(--design-studio-spacing-small)}@media screen and (min-width: 750px){.design-tools{grid-template-columns:repeat(4,1fr);gap:1.5rem}}.tool-btn{background:rgb(var(--color-button));color:rgb(var(--color-button-text));border:0;padding:1.2rem 1rem;border-radius:var(--design-studio-border-radius-small);cursor:pointer;font-family:var(--font-body-family);font-weight:var(--font-body-weight);font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .2 / var(--font-body-scale));transition:background var(--duration-short) ease,transform var(--duration-short) ease,box-shadow var(--duration-short) ease;display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none;min-height:8rem;justify-content:center}@media screen and (min-width: 750px){.tool-btn{font-size:calc(var(--font-body-scale) * 1.5rem);padding:1.5rem 1rem}}.tool-btn:hover{background:rgba(var(--color-button),.85);transform:translateY(-.2rem);box-shadow:var(--shadow-moderate)}.tool-btn:focus-visible{outline:.2rem solid rgba(var(--color-button),.5);outline-offset:.3rem}.tool-btn.active{background:rgb(var(--color-button-text));color:rgb(var(--color-button))}.tool-btn--clear:hover{background:rgb(var(--color-base-accent-2))}.design-controls{display:grid;grid-template-columns:1fr;gap:var(--design-studio-spacing-small);margin-bottom:var(--design-studio-spacing-small)}@media screen and (min-width: 750px){.design-controls{grid-template-columns:repeat(2,1fr);gap:1.5rem}}@media screen and (min-width: 990px){.design-controls{grid-template-columns:repeat(4,1fr)}}.control-group{display:flex;flex-direction:column;gap:.8rem}.control-group label{font-family:var(--font-body-family);font-weight:500;color:rgb(var(--color-foreground));font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .4 / var(--font-body-scale))}@media screen and (min-width: 750px){.control-group label{font-size:calc(var(--font-body-scale) * 1.5rem)}}.control-group__select,.control-group__range{padding:1rem 1.5rem;border:.1rem solid rgba(var(--color-foreground),.2);border-radius:var(--design-studio-border-radius-small);font-family:var(--font-body-family);font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .2 / var(--font-body-scale));background:rgb(var(--color-background));color:rgb(var(--color-foreground));transition:border-color var(--duration-short) ease}@media screen and (min-width: 750px){.control-group__select,.control-group__range{font-size:calc(var(--font-body-scale) * 1.5rem)}}.control-group__select:focus,.control-group__range:focus{outline:none;border-color:rgb(var(--color-button));box-shadow:0 0 0 .3rem rgba(var(--color-button),.15)}.products-panel{background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.08);border-radius:var(--design-studio-border-radius);padding:var(--design-studio-spacing-small);box-shadow:var(--shadow-moderate)}@media screen and (min-width: 750px){.products-panel{padding:var(--design-studio-spacing)}}.products-header{text-align:center;margin-bottom:var(--design-studio-spacing)}.products-header__title{font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:calc(var(--font-heading-scale) * 2.4rem);line-height:calc(1 + .3 / var(--font-heading-scale));margin-bottom:1rem;color:rgb(var(--color-foreground))}@media screen and (min-width: 750px){.products-header__title{font-size:calc(var(--font-heading-scale) * 2.8rem)}}@media screen and (min-width: 990px){.products-header__title{font-size:calc(var(--font-heading-scale) * 3.2rem)}}.products-header__description{color:rgba(var(--color-foreground),.7);font-family:var(--font-body-family);font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .6 / var(--font-body-scale))}@media screen and (min-width: 750px){.products-header__description{font-size:calc(var(--font-body-scale) * 1.6rem)}}.products-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}@media screen and (min-width: 750px){.products-grid{grid-template-columns:repeat(2,1fr);gap:2rem}}@media screen and (min-width: 990px){.products-grid{grid-template-columns:repeat(3,1fr)}}.product-card{background:rgb(var(--color-base-background-1));border:.1rem solid rgba(var(--color-foreground),.08);border-radius:var(--design-studio-border-radius);padding:1.5rem;text-align:center;cursor:pointer;transition:all var(--duration-short) ease;position:relative}.product-card:hover{transform:translateY(-.3rem);border-color:rgb(var(--color-button));box-shadow:var(--shadow-strong)}.product-card.selected{border-color:rgb(var(--color-base-accent-1));background:rgba(var(--color-base-accent-1),.05)}.product-card__icon{font-size:4rem;margin-bottom:1rem;display:block;line-height:1}@media screen and (min-width: 750px){.product-card__icon{font-size:4.8rem}}.product-card__name{font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:calc(var(--font-heading-scale) * 1.6rem);line-height:calc(1 + .4 / var(--font-heading-scale));margin-bottom:.5rem;color:rgb(var(--color-foreground))}@media screen and (min-width: 750px){.product-card__name{font-size:calc(var(--font-heading-scale) * 1.8rem)}}.product-card__price{color:rgb(var(--color-button));font-family:var(--font-body-family);font-weight:500;font-size:calc(var(--font-body-scale) * 1.6rem);line-height:calc(1 + .2 / var(--font-body-scale));margin-bottom:1.5rem}@media screen and (min-width: 750px){.product-card__price{font-size:calc(var(--font-body-scale) * 1.8rem)}}.design-preview{position:relative;width:100%;height:12rem;background:rgb(var(--color-base-background-2));border-radius:var(--design-studio-border-radius-small);overflow:hidden;margin-bottom:1.5rem}@media screen and (min-width: 750px){.design-preview{height:15rem}}.product-mockup{width:100%;height:100%;object-fit:contain;opacity:.3}.design-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:8rem;max-height:8rem;pointer-events:none}.add-to-cart-btn{background:rgb(var(--color-button));color:rgb(var(--color-button-text));border:0;padding:1.2rem 2rem;border-radius:var(--design-studio-border-radius-small);font-family:var(--font-body-family);font-weight:var(--font-body-weight);font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .2 / var(--font-body-scale));cursor:pointer;width:100%;transition:all var(--duration-short) ease;opacity:.6;pointer-events:none}@media screen and (min-width: 750px){.add-to-cart-btn{font-size:calc(var(--font-body-scale) * 1.5rem);padding:1.5rem 2rem}}.add-to-cart-btn.enabled{opacity:1;pointer-events:auto}.add-to-cart-btn:hover.enabled{background:rgba(var(--color-button),.85);transform:translateY(-.1rem)}.add-to-cart-btn:focus-visible{outline:.2rem solid rgba(var(--color-button),.5);outline-offset:.3rem}.add-to-cart-btn:disabled{opacity:.4;cursor:not-allowed}.workflow-steps{background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.08);border-radius:var(--design-studio-border-radius);padding:var(--design-studio-spacing-small);margin-bottom:var(--design-studio-spacing);box-shadow:var(--shadow-subtle)}@media screen and (min-width: 750px){.workflow-steps{padding:var(--design-studio-spacing)}}.steps-container{display:grid;grid-template-columns:1fr;gap:2rem}@media screen and (min-width: 750px){.steps-container{grid-template-columns:repeat(3,1fr);gap:3rem}}.step{text-align:center;position:relative}.step:after{content:"";position:absolute;top:3rem;right:-50%;width:100%;height:.2rem;background:rgba(var(--color-foreground),.1);z-index:0;display:none}@media screen and (min-width: 750px){.step:after{display:block}}.step:last-child:after{display:none}.step.active .step-number{background:rgb(var(--color-button));color:rgb(var(--color-button-text));border-color:rgb(var(--color-button))}.step.completed .step-number{background:rgb(var(--color-base-accent-1));color:rgb(var(--color-base-background-1));border-color:rgb(var(--color-base-accent-1))}.step.completed:after{background:rgb(var(--color-base-accent-1))}.step-number{width:6rem;height:6rem;border-radius:50%;background:rgb(var(--color-base-background-1));border:.3rem solid rgba(var(--color-foreground),.1);display:flex;align-items:center;justify-content:center;font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:calc(var(--font-heading-scale) * 2.4rem);margin:0 auto 1rem;transition:all var(--duration-short) ease;position:relative;z-index:1}@media screen and (min-width: 750px){.step-number{width:7rem;height:7rem;font-size:calc(var(--font-heading-scale) * 2.8rem)}}.step-title{font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:calc(var(--font-heading-scale) * 1.6rem);line-height:calc(1 + .4 / var(--font-heading-scale));margin-bottom:.5rem;color:rgb(var(--color-foreground))}@media screen and (min-width: 750px){.step-title{font-size:calc(var(--font-heading-scale) * 1.8rem)}}.step-description{color:rgba(var(--color-foreground),.7);font-family:var(--font-body-family);font-size:calc(var(--font-body-scale) * 1.3rem);line-height:calc(1 + .6 / var(--font-body-scale))}@media screen and (min-width: 750px){.step-description{font-size:calc(var(--font-body-scale) * 1.4rem)}}.toast{position:fixed;top:2rem;right:2rem;background:rgb(var(--color-base-accent-1));color:rgb(var(--color-base-background-1));padding:1.5rem 2rem;border-radius:var(--design-studio-border-radius-small);box-shadow:var(--shadow-strong);transform:translate(40rem);transition:transform var(--duration-default) ease;z-index:1000;font-family:var(--font-body-family);font-size:calc(var(--font-body-scale) * 1.4rem);line-height:calc(1 + .2 / var(--font-body-scale));max-width:30rem}@media screen and (min-width: 750px){.toast{font-size:calc(var(--font-body-scale) * 1.5rem)}}.toast.show{transform:translate(0)}.visually-hidden{position:absolute!important;overflow:hidden;width:.1rem;height:.1rem;margin:-.1rem;padding:0;border:0;clip:rect(0 0 0 0);word-wrap:normal!important}.file-upload{position:relative;display:inline-block;cursor:pointer;width:100%}.file-upload input[type=file]{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer}.file-upload:focus-within .tool-btn{outline:.2rem solid rgba(var(--color-button),.5);outline-offset:.3rem}@media (prefers-contrast: high){.design-canvas{border-width:.3rem}.tool-btn,.add-to-cart-btn{border:.1rem solid currentColor}}@media (prefers-reduced-motion: reduce){.tool-btn,.product-card,.add-to-cart-btn,.step-number,.toast{transition:none}.tool-btn:hover,.product-card:hover,.add-to-cart-btn:hover.enabled{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/1/assets/design-editor.css.map */