.deck-studio{scroll-margin-top:100px}.studio-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);gap:24px;align-items:start}.studio-view{background:#e4eadb;border-radius:24px;overflow:hidden;position:sticky;top:100px;border:1px solid #164e501c}.studio-toolbar,.studio-view-bottom{display:flex;align-items:center;justify-content:space-between;padding:20px;gap:10px;flex-wrap:wrap}.studio-toolbar button,.studio-view-buttons button{border:1px solid #164e5033;background:#f9faf0;color:#164e50;border-radius:30px;padding:9px 12px;font:inherit;font-size:12px;cursor:pointer}.studio-toolbar button[aria-pressed=true],.studio-view-buttons button[aria-pressed=true]{background:#164e50;color:white}.studio-tag{font-weight:700;font-size:14px}.studio-view-bottom{padding-top:0;font-size:12px}.studio-view-buttons{display:flex;gap:5px}#deck-canvas{width:100%;height:auto;display:block;aspect-ratio:1.25;cursor:grab;touch-action:pan-y}#deck-canvas:active{cursor:grabbing}.studio-caption{font-size:12px;line-height:1.5;margin:0;padding:0 20px 20px;color:#45615b}.studio-panel{background:white;border:1px solid #164e501c;padding:28px;border-radius:24px}.studio-panel h3{font-size:25px;margin:0 0 5px;letter-spacing:-.6px}.studio-hint{font-size:13px;color:#526560;line-height:1.5}.studio-panel fieldset{border:0;padding:0;margin:24px 0;min-width:0}.studio-panel legend{font-size:14px;font-weight:700;margin-bottom:10px}.studio-slider{display:block;margin:23px 0}.studio-slider span{display:flex;justify-content:space-between;font-size:14px;font-weight:700}.studio-slider output{font-weight:400}.studio-slider input{display:block;width:100%;margin:12px 0 0;accent-color:#164e50}.studio-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.studio-choices label,.studio-materials label{position:relative;cursor:pointer;text-align:center;font-size:12px;border:1px solid #dce2dc;border-radius:10px;padding:12px 5px;color:#39534c}.studio-choices label:has(:checked),.studio-materials label:has(:checked){border-color:#164e50;box-shadow:inset 0 0 0 1px #164e50;background:#eaf0e9;color:#164e50}.studio-choices input,.studio-materials input{position:absolute;opacity:0;width:1px;height:1px}.studio-choices label:has(:focus-visible),.studio-materials label:has(:focus-visible){outline:3px solid #ed8067;outline-offset:3px}.studio-choices span{display:block;font-size:11px;margin-top:4px}.studio-materials{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.studio-wood{display:block;height:36px;margin:0 2px 9px;border-radius:5px;background:repeating-linear-gradient(0deg,#b57a4e 0px,#b57a4e 7px,#92613d 8px,#dca571 9px)}.studio-wood.pine{filter:brightness(1.3) saturate(.7)}.studio-wood.composite{filter:grayscale(.95) brightness(.85)}.studio-wood.larch{filter:brightness(1.15)}.studio-panel small{display:block;font-size:11px;color:#526560;margin-top:8px}.studio-rail{grid-template-columns:repeat(4,1fr)}.studio-addons{display:flex;flex-wrap:wrap;gap:12px;font-size:13px}.studio-addons input{accent-color:#164e50;vertical-align:middle;margin-right:5px}.studio-estimate{padding:20px;background:#f4f4eb;border-radius:14px;margin:20px 0}.studio-estimate>span{font-size:12px}.studio-estimate strong{display:block;font-size:38px;letter-spacing:-1px;margin:5px 0}.studio-estimate p,.studio-estimate summary{font-size:12px;line-height:1.6}.studio-estimate summary{cursor:pointer;text-decoration:underline}.studio-rates{display:grid;gap:10px;margin-top:14px}.studio-rates label{font-size:12px}.studio-rates input{width:100%;padding:10px;margin-top:4px;border:1px solid #a7b8ae;border-radius:6px;background:white}.studio-panel>.button{width:100%;justify-content:center}.studio-panel>.text-button{display:block;margin:16px auto}.studio-status{min-height:32px}@media(max-width:900px){.studio-layout{grid-template-columns:1fr}.studio-view{position:relative;top:0}.studio-panel{padding:22px}.studio-toolbar{padding:14px}.studio-toolbar button{font-size:11px;padding:8px}.studio-tag{font-size:12px}}@media(prefers-reduced-motion:reduce){.deck-studio *{scroll-behavior:auto}}@media print{.deck-studio{display:none}}
#deck-canvas{background:linear-gradient(#e4eadb,#d1dfc3)}
.studio-layout>*{min-width:0}.studio-materials{grid-template-columns:repeat(4,minmax(0,1fr))}.studio-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.studio-rail{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:900px){.studio-layout{grid-template-columns:minmax(0,1fr)}}
/* The large scene scrolls away; only the terrace follows the controls. */
.studio-view{position:relative;top:auto}.studio-scene-slot{aspect-ratio:1.25}.studio-floating{position:fixed;z-index:35;width:360px;max-width:calc(100vw - 24px);background:#f8f6ee;border:1px solid #164e5029;border-radius:16px;box-shadow:0 12px 36px #163f3524;overflow:hidden}.studio-floating[hidden]{display:none}.studio-floating-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 15px 0;font-size:12px;color:#164e50;font-weight:700}.studio-floating-head output{display:block;font-size:11px;color:#62766d;font-weight:400;margin-top:3px}.studio-floating-head button{border:1px solid #164e5029;border-radius:50%;background:transparent;color:#164e50;width:32px;height:32px;cursor:pointer}.studio-floating #deck-canvas{background:transparent}.studio-view{scroll-margin-top:100px}@media(max-width:900px){.studio-floating{border-radius:12px}.studio-floating-head{padding:9px 10px 0;gap:4px;font-size:11px}.studio-floating-head button{width:28px;height:28px;flex-shrink:0}}@media print{.studio-floating{display:none!important}}
@media(min-width:901px){.studio-view{grid-column:1 / -1}.studio-scene-slot{aspect-ratio:2}.studio-scene-slot #deck-canvas{height:100%;aspect-ratio:auto}.studio-panel{grid-column:2}}
.studio-slider[hidden]{display:none}.studio-slider input:disabled{opacity:.55;cursor:not-allowed}
