:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#253034;background:#eef2f3;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button{cursor:pointer}.app-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,450px);height:100vh;overflow:hidden;background:#edf2f3}.viewer-pane{position:relative;min-width:0;background:linear-gradient(180deg,#e9eef0,#dfe7e9)}.pergola-canvas{width:100%;height:100%}.canvas-signature{position:absolute;right:18px;bottom:16px;z-index:5;border:1px solid rgba(15,83,102,.12);border-radius:999px;background:#ffffffb8;padding:7px 11px;color:#263237;font-size:.78rem;font-weight:800;box-shadow:0 4px 18px #1e2d321a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.canvas-signature a{color:inherit;text-decoration:none}.canvas-signature a:hover{text-decoration:underline}.config-panel{display:flex;flex-direction:column;gap:22px;height:100vh;overflow-y:auto;border-left:1px solid #dfe5e7;background:#fbfbfa;padding:28px 32px 92px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:18px}.eyebrow{margin:0 0 4px;color:#5bbf9a;font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:1.64rem;line-height:1.15}.icon-action{display:grid;place-items:center;width:42px;height:42px;border:1px solid #dce4e5;border-radius:50%;background:#fff;color:#365158}.panel-section{border:1px solid #e2e8e9;border-radius:8px;background:#fff;padding:18px}.panel-section h2{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:18px;color:#2b3031;font-size:1.05rem}.field-label{margin:14px 0 9px;text-align:center;font-size:.9rem;font-weight:800}.field-label:first-child{margin-top:0}.field-label span{color:#e16363}.model-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.choice-card{display:flex;flex-direction:column;align-items:center;min-width:0;min-height:158px;border:1px solid transparent;border-radius:8px;background:#fff;padding:8px 7px;color:#283335;text-align:center}.choice-card.selected,.icon-choice.selected,.side-option.selected,.service-toggle.selected,.heater-toggle.selected{border-color:#5bc39d;box-shadow:0 0 0 1px #5bc39d66}.model-thumb{position:relative;display:grid;place-items:center;width:100%;height:54px;margin-bottom:8px;border-radius:8px;background:#f4f6f6;overflow:hidden}.model-thumb:before,.model-thumb:after{content:"";position:absolute;bottom:11px;width:5px;height:30px;background:#0f5366}.model-thumb:before{left:19%}.model-thumb:after{right:19%}.model-thumb i{position:absolute;top:14px;width:62%;height:16px;border-top:5px solid #0f5366;border-left:3px solid #0f5366;border-right:3px solid #0f5366;transform:skew(-12deg)}.model-thumb span{position:relative;z-index:1;color:#6b7b80;font-size:.68rem;font-weight:900}.choice-card strong{font-size:.9rem;line-height:1.25}.choice-card small{margin-top:7px;color:#658084;font-size:.71rem;line-height:1.25}.segmented,.preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.segmented button,.preset-grid button,.static-pill{min-height:38px;border:1px solid #dde5e8;border-radius:8px;background:#fff;color:#283335;box-shadow:inset 0 0 0 1px #eef1f2}.segmented button.selected,.preset-grid button.selected,.static-pill{border-color:#5bc39d;box-shadow:0 0 0 1px #5bc39d73}.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.static-pill{display:block;width:116px;margin:0 auto}.dimension-summary{margin:11px 0 0;color:#607177;text-align:center;font-size:.82rem;font-weight:700}.slider-stack{display:grid;gap:14px}.dimension-slider{display:grid;gap:8px}.dimension-slider span{display:flex;align-items:center;justify-content:space-between;gap:14px;color:#2c383c;font-size:.9rem}.dimension-slider output{color:#0f5366;font-weight:800}.dimension-slider input{width:100%;accent-color:#5bc39d}.dimension-slider em{color:#718187;font-size:.72rem;font-style:normal}.icon-choice-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:230px;margin:0 auto}.icon-choice{display:grid;place-items:center;min-height:86px;border:1px solid transparent;border-radius:8px;background:#f7f8f8;color:#0f5366;padding:12px 8px}.icon-choice span{margin-top:7px;color:#273136;font-size:.76rem;line-height:1.2}.swatch-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.swatch{display:grid;place-items:center;gap:8px;border:1px solid transparent;border-radius:8px;background:#fff;padding:8px 4px}.swatch span{display:grid;place-items:center;width:58px;height:58px;border:3px solid #ffffff;border-radius:50%;box-shadow:0 0 0 2px #64bea0}.swatch small{min-height:30px;color:#344044;font-size:.72rem;line-height:1.2}.sides-list{display:grid;gap:28px}.side-title{display:flex;justify-content:center;gap:5px;margin-bottom:12px;text-align:center}.side-title span{color:#57666a}.side-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.side-option{display:grid;justify-items:center;align-content:start;min-height:120px;border:1px solid transparent;border-radius:8px;background:#fff;padding:8px 4px;color:#263237}.side-option span:last-child{margin-top:7px;font-size:.72rem;line-height:1.25}.side-preview{position:relative;display:block;width:70px;height:58px;border-radius:8px;background:#f6f7f7}.side-preview:before,.side-preview:after{content:"";position:absolute;top:18px;bottom:13px;width:4px;background:#0f5366}.side-preview:before{left:12px}.side-preview:after{right:12px}.side-preview i{position:absolute;left:15px;right:15px;height:3px;background:#0f5366}.side-preview i:nth-child(1){top:18px}.side-preview i:nth-child(2){top:25px}.side-preview i:nth-child(3){top:32px}.side-preview i:nth-child(4){top:39px}.side-preview-none i:nth-child(n+2),.side-preview-framelessSliding i:nth-child(2),.side-preview-framedSliding i:nth-child(2),.side-preview-zipScreen i:nth-child(n+3){display:none}.side-preview-framelessSliding:before,.side-preview-framedSliding:before{box-shadow:16px 0 #0f5366,32px 0 #0f5366}.heater-toggle,.service-toggle{display:flex;align-items:center;gap:11px;width:100%;min-height:54px;border:1px solid #dde5e8;border-radius:8px;background:#fff;color:#293337;padding:0 14px;text-align:left}.heater-toggle{justify-content:center;margin-top:12px;color:#0f5366}.service-grid{display:grid;gap:12px}.service-toggle svg{color:#0f5366;flex:0 0 auto}.helper-note{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;border-radius:8px;background:#f1f3f3;padding:14px 16px;color:#59666b;line-height:1.4}.helper-note svg{color:#0f5366}.helper-note a{color:#42ac85}.promo-input{width:100%;height:44px;border:1px solid #dbe4e6;border-radius:8px;padding:0 12px;outline:none}.promo-input:focus{border-color:#5bc39d;box-shadow:0 0 0 3px #5bc39d2e}.sticky-actions{position:fixed;right:0;bottom:0;display:flex;justify-content:flex-end;width:minmax(380px,450px);width:450px;max-width:100vw;border-top:1px solid #dfe5e7;background:#fbfbfaeb;padding:14px 32px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.primary-action{min-width:86px;min-height:42px;border:0;border-radius:999px;background:#61bea0;color:#fff;font-weight:800}.dimension-label{display:inline-flex;white-space:nowrap;border-radius:6px;background:#fff;padding:3px 6px;color:#1a2225;font-size:10px;font-weight:900;box-shadow:0 1px 5px #1e2d3229}@media(max-width:1060px){.app-shell{grid-template-columns:1fr;grid-template-rows:minmax(410px,58vh) auto;height:auto;min-height:100vh;overflow:visible}.config-panel{height:auto;min-height:42vh;border-left:0;border-top:1px solid #dfe5e7}.sticky-actions{width:100%}}@media(max-width:560px){.app-shell{grid-template-rows:minmax(340px,48vh) auto}.config-panel{padding:22px 18px 86px}.model-grid,.side-options{grid-template-columns:repeat(2,minmax(0,1fr))}.segmented,.preset-grid,.swatch-row{grid-template-columns:1fr}.icon-choice-row{max-width:none}.sticky-actions{padding:12px 18px}}