.ap-studio{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:#e8eddd;border-radius:24px;overflow:clip;margin-bottom:60px;align-items:start}
.studio-preview{position:sticky;top:112px;padding:28px;background:radial-gradient(ellipse at center,#e7ebdc,#d6ddc7);text-align:center;min-width:0}
.studio-preview-top{display:flex;justify-content:space-between;gap:16px;font-size:14px;letter-spacing:1px}.studio-preview-top span:last-child{letter-spacing:0}
#studioCanvas{display:block;width:100%;height:auto;max-height:620px;object-fit:contain;touch-action:pan-y;cursor:default}
#studioCanvas.has-logo{touch-action:none;cursor:grab}#studioCanvas.is-dragging{cursor:grabbing}
.studio-drag-hint,.studio-disclaimer{font-size:14px;margin:12px 0;color:#52644c}.studio-preview-actions{display:flex;justify-content:center;gap:20px;align-items:center;flex-wrap:wrap}.studio-disclaimer{max-width:360px;margin:18px auto 0}
.studio-controls{padding:36px 40px;min-width:0}.studio-controls h2{font-size:40px;margin-bottom:12px}.studio-controls>p{font-size:15px}.studio-controls fieldset{border:0;border-bottom:1px solid #cad4be;margin:24px 0;padding:0 0 22px;min-width:0}.studio-controls legend{font-size:15px;font-weight:700;margin-bottom:16px}.studio-controls label{font-size:14px}.studio-swatches{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}.studio-swatches button{width:30px;height:30px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #adbba0}.studio-swatches button[aria-pressed=true]{box-shadow:0 0 0 3px #355f39}.studio-color-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}.studio-controls input[type=color]{width:42px;height:36px;padding:3px;cursor:pointer}.studio-controls input[type=text],#studioHex{width:100%;padding:12px;border:1px solid #a9b99e;background:#ffffff70;color:#244630;font-size:16px}.studio-controls #studioHex{width:108px}.studio-controls input:focus-visible,.studio-controls button:focus-visible{outline:2px solid #355f39;outline-offset:3px;box-shadow:none}.studio-controls input[type=range]{display:block;width:100%;accent-color:#355f39;margin:10px 0;min-height:28px}.studio-color-row input[type=range]{width:110px}.studio-upload{display:block;border:1px dashed #879d79;padding:14px;border-radius:10px;cursor:pointer;background:#ffffff45}.studio-upload span{display:block;font-size:14px;color:#61725a;margin:4px 0 8px}.studio-upload input{display:block;width:100%;font-size:14px;max-width:100%}.studio-file-name{font-size:14px;overflow-wrap:anywhere;margin:8px 0 14px}.studio-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.studio-text-button{padding:8px 0;background:none;text-decoration:underline;font-size:14px}.studio-patterns{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.studio-patterns button{background:transparent;border:1px solid #a7b69a;padding:9px 12px;border-radius:6px;font-size:14px}.studio-patterns button[aria-pressed=true]{background:#355f39;color:#fff}.studio-controls [hidden]{display:none!important}.studio-local-note{font-size:14px!important;line-height:1.6;margin-top:14px}#studioStatus{font-size:14px;color:#744624;margin-bottom:12px}#studioStatus:empty{display:none}
@media(max-width:960px){.studio-controls{padding:28px 24px}.studio-preview{padding:20px;top:88px}.studio-controls h2{font-size:32px}}
@media(max-width:700px){.ap-studio{grid-template-columns:1fr}.studio-preview{position:relative;top:auto;padding:20px 16px}#studioCanvas{max-height:400px}.studio-controls{padding:28px 20px}.studio-preview-top{font-size:14px}.studio-preview-actions .button{padding:12px 18px}.studio-controls h2{font-size:32px}}
.ap-studio button:focus-visible{outline:2px solid #355f39;outline-offset:3px}
.studio-upload{position:relative;min-height:76px}.studio-upload input[type=file]{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.studio-upload:focus-within{outline:2px solid #355f39;outline-offset:3px}
@media(min-width:701px){#studioCanvas{max-height:clamp(280px,calc(100dvh - 360px),580px)}}
/* Interactive 3D viewer */
.studio-viewer{position:relative;min-width:0}#studioCanvas{width:100%;height:clamp(300px,45vh,520px);max-height:none;object-fit:fill;touch-action:none;cursor:grab}#studioCanvas:focus-visible{outline:2px solid #355f39;outline-offset:2px}.studio-view-tools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:8px 0}.studio-view-tools button{background:#fff9;border:1px solid #a9b99e;border-radius:8px;padding:8px 12px;font-size:14px;color:#244630}.studio-view-tools [hidden]{display:none}.studio-mode{justify-content:center}.studio-controls select{width:100%;padding:12px;margin:8px 0 16px;border:1px solid #a9b99e;background:#f5f6ec;color:#244630;border-radius:8px;font-size:14px}.studio-controls select:focus-visible{outline:2px solid #355f39}.studio-modal-open{overflow:hidden!important}.studio-viewer.is-expanded{position:fixed;inset:0;z-index:999999;background:radial-gradient(ellipse at center,#edf0e5,#d2dcc5);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px}.studio-viewer.is-expanded #studioCanvas{width:100%;height:calc(100dvh - 120px);max-height:none}.studio-viewer.is-expanded .studio-view-tools{flex-shrink:0}.studio-viewer.is-expanded #studioExpand{display:none}.studio-viewer.is-expanded #studioClose{display:block;background:#355f39;color:white}.studio-viewer.is-expanded button:focus-visible{outline:2px solid #355f39;outline-offset:3px}@media(max-width:700px){#studioCanvas{height:340px;max-height:none}.studio-viewer.is-expanded{padding:12px}.studio-viewer.is-expanded #studioCanvas{height:calc(100dvh - 110px)}}

/* Stable preview column and immediate first paint */
.ap-studio .studio-preview{position:relative;top:auto}.studio-initial-cup{position:absolute;inset:0 0 auto;width:100%;height:clamp(300px,45vh,520px);pointer-events:none}.studio-viewer:not(.is-ready) #studioCanvas{visibility:hidden}.studio-viewer.is-ready .studio-initial-cup{display:none}@media(max-width:700px){.studio-initial-cup{height:340px}}
/* Equal-height desktop studio with a larger model stage. */
@media(min-width:701px){.ap-studio{align-items:stretch}.ap-studio .studio-preview{display:flex;flex-direction:column;align-self:stretch}.studio-preview>.studio-viewer{flex:1;min-height:540px;display:flex;flex-direction:column}.studio-preview .studio-viewer #studioCanvas{position:absolute;top:0;left:0;width:100%;height:calc(100% - 60px);max-height:none}.studio-preview .studio-viewer .studio-initial-cup{height:calc(100% - 60px)}.studio-preview .studio-view-tools{margin-top:auto;padding-top:10px;min-height:50px}.studio-preview .studio-disclaimer{margin-bottom:8px}.studio-preview .studio-preview-top{margin-bottom:16px}}

/* Reveal the complete studio only after its first correctly sized 3D frame. */
.ap-studio{position:relative}.studio-loading-message{display:none}.studio-loading>.studio-preview,.studio-loading>.studio-controls{visibility:hidden}.studio-loading>.studio-loading-message{display:flex;position:absolute;inset:0;align-items:flex-start;justify-content:center;padding:100px 24px;color:#355f39;font-size:15px;z-index:2}.studio-loading .studio-initial-cup{display:none}

.studio-preview-top{font-size:14px;line-height:1.5;flex-wrap:wrap;letter-spacing:.6px}.studio-controls label,.studio-patterns button,.studio-text-button,.studio-view-tools button{font-size:16px;line-height:1.5}.studio-upload span,.studio-file-name,.studio-drag-hint,.studio-disclaimer{font-size:14px;line-height:1.65}.studio-local-note{font-size:14px!important}.studio-controls legend{font-size:17px}.studio-disclaimer{max-width:440px}.studio-view-tools{min-height:56px;align-items:center}@media(max-width:700px){.studio-preview-top{gap:6px 12px}.studio-view-tools{gap:6px}.studio-view-tools button{padding:8px 10px;font-size:14px}}