.workspace{grid-template-columns:265px minmax(360px,1fr) 385px;gap:18px;max-width:1600px;margin:auto;padding-inline:clamp(18px,3vw,48px)}
.products{display:flex;flex-direction:column;gap:8px;max-height:720px;overflow:auto;padding-right:5px}.product{display:grid;grid-template-columns:68px 1fr;border-radius:3px;min-height:92px;box-shadow:none}.product-image{height:92px;padding:8px;border:0;border-right:1px solid #e4e8e5;background:#fff}.product-body{padding:12px}.product h3{font-size:15px;margin:4px 0}.product p{display:none}.product-footer{margin-top:7px;padding-top:7px}.product-footer strong{font-size:12px}.product-footer span{padding:0;background:none;color:#37784c;font-size:0}.product-footer span:after{content:'Scegli';font-size:12px}.product.selected{border:2px solid #78b82a}.product.selected:after{top:6px;right:6px;width:22px;height:22px;font-size:11px}
.visual-stage{position:relative;min-height:620px;background:linear-gradient(#fbfcfb,#eef1ef);border:1px solid #d9dfda;display:grid;place-items:center;padding:90px 50px 100px;overflow:hidden}.view-toggle{position:absolute;top:18px;left:50%;transform:translateX(-50%);display:flex;border:1px solid #ccd3ce;background:#fff}.view-toggle button{border:0;background:#fff;padding:9px 18px;font-size:12px}.view-toggle .active{background:#263d31;color:#fff}.window-preview{width:min(86%,620px);max-width:calc((100vh - 285px) * var(--preview-ratio,1));max-height:calc(100vh - 285px);aspect-ratio:1.1/1.35;border:18px solid #f6f5ef;box-shadow:0 12px 30px rgba(25,39,31,.17),inset 0 0 0 2px #c8cbc7;display:flex;background:linear-gradient(145deg,#dbe8ef,#f3f8fa 50%,#cbdce4);position:relative}.window-preview:after{content:'';position:absolute;inset:-13px;border:2px solid #d2d2cc}.pane{flex:1;border:4px solid #f4f3ed;position:relative;box-shadow:inset 0 0 0 1px #aeb8b2}.pane i{position:absolute;inset:12%;border-top:1px solid rgba(89,110,99,.22);transform:skewY(-18deg)}.handle{position:absolute;left:49%;top:47%;width:7px;height:34px;border-radius:3px;background:#a7aaa7;box-shadow:1px 2px 3px #777}.dimension{position:absolute;color:#657169;font-size:12px;text-align:center}.dimension-width{top:76px;left:21%;right:21%;border-top:1px solid #9ca69f}.dimension-width span{background:#f4f6f4;padding:3px 10px;position:relative;top:-11px}.dimension-height{top:24%;bottom:24%;left:11%;border-left:1px solid #9ca69f}.dimension-height span{position:absolute;top:50%;left:-40px;transform:rotate(-90deg);background:#f2f4f2;padding:3px 10px;white-space:nowrap}.preview-caption{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);text-align:center;display:grid;gap:4px}.preview-caption strong{font-size:17px}.preview-caption span{font-size:12px;color:#758078}.preview-tools{position:absolute;right:14px;bottom:14px;display:flex}.preview-tools button{width:34px;height:34px;border:1px solid #d2d8d3;background:#fff}
.config-card{top:90px;max-height:calc(100vh - 110px);overflow:auto}.section-marker{display:flex;gap:10px;align-items:center;margin:17px 0 12px;padding-bottom:9px;border-bottom:1px solid #e3e7e4}.section-marker>span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#78b82a;color:#17241d;font-size:12px;font-weight:800}.section-marker div{display:grid}.section-marker b{font-size:13px}.section-marker small{font-size:11px;color:#77827a}.empty-state{padding:150px 34px}.window-icon{display:none}
.window-preview{border-color:var(--frame-color,#f6f5ef);transition:border-color .2s}.window-preview:after{border-color:color-mix(in srgb,var(--frame-color,#d2d2cc) 78%,#555)}.window-preview .pane{border-color:var(--frame-color,#f4f3ed);transition:border-color .2s}.color-config{border:1px solid #d8dfda;background:#f8faf8;padding:11px;margin-bottom:13px}.color-config-title{display:grid;gap:2px;margin-bottom:8px}.color-config-title b{font-size:13px}.color-config-title small{font-size:10px;color:#6d7971}.color-config label{margin-bottom:9px!important;font-size:11px!important}.color-config select{height:38px!important;margin-top:4px!important;font-size:11px}.color-summary{display:grid;grid-template-columns:25px 48px 1fr;gap:5px 7px;align-items:center;border-top:1px solid #dce2dd;padding-top:9px}.color-summary>span{width:23px;height:23px;border:1px solid #aeb7b1}.color-summary small{font-size:10px;color:#68746c}.color-summary b{font-size:10px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1250px){.workspace{grid-template-columns:220px 1fr 350px}.product{grid-template-columns:1fr}.product-image{display:none}}@media(max-width:980px){.workspace{grid-template-columns:220px 1fr}.config-card{grid-column:1/-1;max-height:none;position:relative;top:0}.visual-stage{min-height:520px}}@media(max-width:700px){.workspace{display:flex;flex-direction:column}.products{display:grid;grid-template-columns:repeat(2,1fr);max-height:none;overflow:visible}.product{min-height:105px}.visual-stage{order:2;min-height:440px;padding:70px 30px 80px}.config-card{order:3}.window-preview{width:65%;border-width:13px}.dimension-height{left:6%}.search{display:none}}

/* 1.0.33 — desktop: più spazio alla configurazione */
@media (min-width:1450px){
  .workspace{
    grid-template-columns:300px minmax(380px,1fr) minmax(540px,600px)!important;
    max-width:1760px!important;
    gap:22px!important;
    padding-inline:30px!important;
  }
  .config-card{
    width:100%!important;
    max-width:none!important;
  }
}
@media (min-width:1150px) and (max-width:1449px){
  .workspace{
    grid-template-columns:250px minmax(340px,1fr) minmax(470px,520px)!important;
    max-width:1500px!important;
    gap:18px!important;
    padding-inline:22px!important;
  }
}
@media (min-width:981px) and (max-width:1149px){
  .workspace{
    grid-template-columns:220px minmax(320px,1fr) minmax(420px,470px)!important;
    gap:16px!important;
  }
}