/* Customer visualizer: progressive, mobile-responsive homeowner flow. */
.customer-home{max-width:1500px;margin:auto;display:grid;gap:18px}
.customer-steps{display:flex;gap:10px;flex-wrap:wrap}.customer-steps span{border:1px solid var(--line,#d5dfe5);border-radius:30px;padding:8px 12px;font-size:13px}
.customer-layout{display:grid;grid-template-columns:minmax(280px,350px) minmax(0,1fr);gap:18px;align-items:start}
.customer-controls{display:grid;gap:14px}.customer-controls h3{margin:6px 0 0}.customer-controls select{width:100%;min-height:43px}
.customer-tabs{display:flex;gap:7px;flex-wrap:wrap}
.customer-tabs button{padding:9px 12px;border:1px solid #c2cfd7;border-radius:12px;background:transparent;cursor:pointer}
.customer-tabs button.active,.customer-swatches button.active{border:2px solid #318b86;box-shadow:0 0 0 1px #318b86}
.customer-swatches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.customer-swatches button{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #c8d1d8;border-radius:13px;background:transparent;min-height:56px;padding:8px;cursor:pointer}
.customer-color{width:31px;height:31px;min-width:31px;border-radius:10px;border:1px solid rgba(0,0,0,.13)}
.customer-stage{display:grid;gap:16px;min-width:0}.customer-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.customer-toolbar small{display:block}
.customer-canvas-wrap{position:relative;background:linear-gradient(#dcebf2,#f2f0e9);height:clamp(320px,44vw,560px);border-radius:16px;overflow:hidden}
.customer-canvas-wrap canvas{width:100%;height:100%;display:block}.customer-canvas-wrap>span{position:absolute;bottom:12px;left:12px;padding:6px 9px;background:rgba(255,255,255,.85);border-radius:7px;color:#263949;font-size:12px;pointer-events:none}
.customer-actions{display:flex;gap:9px;flex-wrap:wrap}.customer-saved-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.customer-saved-grid article{padding:14px;border:1px solid #cad5db;border-radius:12px;display:grid;gap:9px}.customer-saved-grid small{display:block}
.customer-palette{display:flex;gap:4px}.customer-palette span{flex:1;height:35px;border-radius:5px;border:1px solid rgba(0,0,0,.1)}
.customer-compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.customer-advanced{margin-top:0}
@media(max-width:850px){.customer-layout{grid-template-columns:1fr}.customer-swatches{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.customer-canvas-wrap{height:390px}}
@media(max-width:480px){.customer-canvas-wrap{height:310px}.customer-toolbar .switcher{display:flex;flex-wrap:wrap}.customer-actions button{width:100%}}