lithophane-customizer{display:block;margin-bottom:1.5rem}lithophane-customizer[hidden]{display:none}.lithophane-customizer{border:1px solid rgba(var(--color-foreground),.15);border-radius:var(--inputs-radius, 8px);padding:1.5rem;background:rgba(var(--color-foreground),.03)}.lithophane-customizer__heading{font-size:1.6rem;margin:0 0 .5rem}.lithophane-customizer__help{font-size:1.3rem;color:rgba(var(--color-foreground),.75);margin:0 0 1.5rem}.lithophane-customizer__mode{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.lithophane-customizer__mode-option{flex:1 1 auto;min-width:14rem}.lithophane-customizer__mode-option input{position:absolute;opacity:0;pointer-events:none}.lithophane-customizer__mode-label{display:block;text-align:center;padding:.8rem 1.2rem;border:1px solid rgba(var(--color-foreground),.3);border-radius:var(--inputs-radius, 8px);cursor:pointer;font-size:1.3rem;transition:border-color .15s ease,background-color .15s ease}.lithophane-customizer__mode-option input:checked+.lithophane-customizer__mode-label{border-color:rgb(var(--color-foreground));background:rgba(var(--color-foreground),.08);font-weight:600}.lithophane-customizer__mode-option input:focus-visible+.lithophane-customizer__mode-label{outline:2px solid rgb(var(--color-foreground));outline-offset:2px}.lithophane-customizer__slots{display:flex;gap:1rem;flex-wrap:wrap}.lithophane-customizer__slot{flex:1 1 260px;min-width:0}.lithophane-customizer__slot-label{display:block;font-size:1.2rem;color:rgba(var(--color-foreground),.75);margin-bottom:.5rem}.lithophane-customizer__dropzone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;aspect-ratio:16 / 9;border:2px dashed rgba(var(--color-foreground),.3);border-radius:var(--inputs-radius, 8px);cursor:pointer;padding:1rem;text-align:center;background:rgb(var(--color-background))}.lithophane-customizer__slot[data-mode=double] .lithophane-customizer__dropzone{aspect-ratio:8 / 9}.lithophane-customizer__dropzone:hover{border-color:rgba(var(--color-foreground),.6)}.lithophane-customizer__dropzone svg,.lithophane-customizer__dropzone .icon{width:2.4rem;height:2.4rem;opacity:.6}.lithophane-customizer__dropzone-text{font-size:1.2rem;color:rgba(var(--color-foreground),.75)}.lithophane-customizer__slot input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer;width:100%;height:100%}.lithophane-customizer__crop-wrap{position:relative;filter:grayscale(1);background:#111;border-radius:var(--inputs-radius, 8px);overflow:hidden;height:22rem;max-width:100%}@media screen and (max-width:749px){.lithophane-customizer__crop-wrap{height:16rem}}.lithophane-customizer__crop-wrap[hidden]{display:none}.lithophane-customizer__crop-image{display:block;max-width:100%}.lithophane-customizer__slot-actions{display:flex;justify-content:space-between;align-items:center;margin-top:.5rem;gap:.5rem}.lithophane-customizer__slot-actions button{font-size:1.2rem;text-decoration:underline;background:none;border:none;padding:0;cursor:pointer;color:rgba(var(--color-foreground),.75)}.lithophane-customizer__slot-actions button:hover{color:rgb(var(--color-foreground))}.lithophane-customizer__swap{flex:0 0 auto;align-self:center;display:flex;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;border-radius:50%;border:1px solid rgba(var(--color-foreground),.3);background:rgb(var(--color-background));cursor:pointer}.lithophane-customizer__swap svg{width:1.8rem;height:1.8rem}.lithophane-customizer__preview{margin-top:1.5rem;display:none;align-items:center;gap:1rem}.lithophane-customizer__preview[data-ready=true]{display:flex}.lithophane-customizer__preview canvas{width:12rem;height:6.75rem;object-fit:cover;border-radius:var(--inputs-radius, 8px);border:1px solid rgba(var(--color-foreground),.2)}.lithophane-customizer__preview-text{font-size:1.2rem;color:rgba(var(--color-foreground),.75)}.lithophane-customizer__status{margin-top:1rem;font-size:1.2rem}.lithophane-customizer__status[data-state=error]{color:rgb(var(--color-error, 220, 40, 40))}.lithophane-customizer__status[data-state=warning]{color:rgb(var(--color-warning, 180, 120, 0))}.lithophane-customizer__status[data-state=ok]{color:rgba(var(--color-foreground),.75)}.lithophane-customizer__status:empty{display:none}@media screen and (max-width:749px){.lithophane-customizer{padding:1.2rem}.lithophane-customizer__slots{flex-direction:column}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/component-lithophane-customizer.css.map */
