:root{--builder-grey:#555b60;--builder-dark:#17191b;--builder-line:#d9dde0;--builder-soft:#f6f6f6}
.builder-page{background:#eef0f1}
.builder-workspace{display:grid;grid-template-columns:minmax(620px,47%) minmax(0,53%);min-height:calc(100vh - 240px);background:#fff}
.builder-panel{position:relative;z-index:2;padding:42px clamp(34px,5vw,74px) 55px;background:#fff;box-shadow:10px 0 28px rgba(0,0,0,.08)}
.builder-steps{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 32px;padding:0;overflow:hidden;border:1px solid var(--builder-line);border-radius:22px;list-style:none}
.builder-steps li{position:relative;display:flex;min-width:0;height:88px;align-items:center;gap:14px;padding:0 22px;color:#aab0b4;font-weight:800;text-transform:uppercase}
.builder-steps li:not(:last-child){border-right:1px solid var(--builder-line)}
.builder-steps li:not(:last-child)::after{content:"";position:absolute;right:-17px;width:32px;height:32px;z-index:2;background:#fff;border-top:1px solid var(--builder-line);border-right:1px solid var(--builder-line);transform:rotate(45deg)}
.builder-steps li b{position:relative;z-index:3;display:grid;flex:0 0 46px;height:46px;place-items:center;border:3px solid #cfd4d8;border-radius:50%;font-size:18px}
.builder-steps li span{position:relative;z-index:3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.builder-steps li.is-active{color:#4d5358}.builder-steps li.is-active b{border-color:#5b6267;color:#363b3f}
.builder-steps li.is-complete b{border-color:#596066;background:#596066;color:#fff;font-size:0}.builder-steps li.is-complete b::after{content:"✓";font-size:21px}
.builder-stage[hidden]{display:none}.builder-card{padding:32px;border-radius:22px;background:var(--builder-soft)}
.builder-card h2,.registration-label,.notes-label{display:block;margin:0 0 18px;font-size:20px;font-weight:800}
.registration-input{display:block;width:100%;height:112px;margin-bottom:6px;border:3px solid #666c70;border-radius:12px;background:linear-gradient(135deg,#73797d,#474c50);color:#fff;font:900 clamp(34px,3.4vw,54px)/1 "Roboto Condensed",Arial,sans-serif;text-align:center;text-transform:uppercase;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.registration-input::placeholder{color:rgba(255,255,255,.55)}.registration-input:focus{border-color:#1c1e20}
.field-error{min-height:21px;margin:0 0 12px;color:#b42a2a;font-weight:700}
.option-grid{display:grid;gap:12px}.plate-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.image-option{position:relative;display:flex;min-width:0;overflow:hidden;flex-direction:column;border:2px solid transparent;border-radius:11px;background:#fff;cursor:pointer;text-align:center;transition:border-color .16s,transform .16s}
.image-option:hover{transform:translateY(-2px)}.image-option.is-selected{border-color:#25282a}
.image-option input{position:absolute;opacity:0;pointer-events:none}.image-option img,.fitting-visual{display:block;width:100%;height:150px;object-fit:cover;background:#ddd}
.image-option strong{display:flex;min-height:53px;align-items:center;justify-content:center;padding:10px 8px;font-size:18px;line-height:1.25}
.option-price{padding:0 8px 12px;font-size:18px;font-weight:900}.option-price del{margin-left:4px;color:#555;font-weight:600}
.selected-mark{position:absolute;top:10px;left:10px;display:none;width:34px;height:34px;align-items:center;justify-content:center;border-radius:50%;background:#62686d;color:#fff;font-size:21px;font-weight:900;box-shadow:0 2px 5px rgba(0,0,0,.25)}
.image-option.is-selected .selected-mark{display:flex}
.choice-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:32px}.choice-row label{position:relative;display:flex;min-height:76px;align-items:center;justify-content:center;padding:14px;border:2px solid #ddd;border-radius:10px;background:#fff;cursor:pointer;text-align:center;font-size:17px}.choice-row input{position:absolute;opacity:0}.choice-row label.is-selected{border-color:#222}.choice-row i{display:none;position:absolute;right:15px;width:34px;height:34px;align-items:center;justify-content:center;border-radius:50%;background:#62686d;color:#fff;font-style:normal;font-weight:900}.choice-row label.is-selected i{display:flex}
.size-group{margin-top:26px}.size-grid,.fitting-grid{grid-template-columns:repeat(4,minmax(150px,1fr));overflow-x:auto;padding-bottom:14px}.size-grid .image-option,.fitting-grid .image-option{min-width:160px}.size-grid .image-option img,.fitting-grid .image-option img,.fitting-visual{height:116px}.size-grid .image-option strong,.fitting-grid .image-option strong{min-height:82px;font-size:15px}
.reflective-grid{grid-template-columns:repeat(2,205px);margin-bottom:42px}.reflective-grid .image-option img{height:118px}.reflective-grid .image-option strong{min-height:74px;font-size:15px}
.fitting-visual{display:grid;place-items:center}.no-kit{background:linear-gradient(135deg,#ececec,#b4b4b4);color:#d22222;font-size:100px;font-weight:400;line-height:1}
.notes-label{margin-top:30px}.builder-card textarea{width:100%;resize:vertical;border:1px solid #d1d4d6;border-radius:10px;background:#fff;padding:14px;font:inherit}
.builder-summary{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:34px}.builder-summary>div>span{display:block;margin-bottom:10px;color:#7d8387;font-size:16px}.builder-summary strong{font-size:45px}.builder-summary del{margin-left:10px;color:#888;font-size:20px}.order-quantity>div{display:grid;grid-template-columns:60px 1fr 60px;height:76px;border:1px solid #d9dcde;border-radius:10px}.order-quantity button{border:0;background:none;font-size:27px;cursor:pointer}.order-quantity b{display:grid;place-items:center;font-size:21px}
.builder-navigation{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}.builder-navigation button{min-height:70px;border:0;border-radius:10px;font:900 17px "Roboto Condensed",Arial,sans-serif;text-transform:uppercase;cursor:pointer}.back-button{border:1px solid #ddd!important;background:#fff;color:#111}.next-button,.add-button{background:linear-gradient(135deg,#74797e,#55595d 48%,#35393d);color:#fff}.back-button[disabled]{visibility:hidden}.builder-confirmation{min-height:22px;margin:16px 0 0;color:#19872b;font-weight:800;text-align:center}
.builder-preview{position:sticky;top:0;height:100vh;min-height:720px;overflow:hidden;background:#282b2e}.builder-preview::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.08),transparent 36%);pointer-events:none}.builder-preview>img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.95)}
.preview-registration{position:absolute;z-index:2;right:28px;bottom:28px;padding:12px 17px;background:rgba(8,9,10,.78);color:#fff;text-align:right;backdrop-filter:blur(8px)}.preview-registration small,.preview-registration strong{display:block}.preview-registration small{color:#bfc3c6;font-size:11px;text-transform:uppercase;letter-spacing:1.5px}.preview-registration strong{margin-top:4px;font-size:24px}
@media(max-width:1080px){.builder-workspace{grid-template-columns:minmax(560px,58%) minmax(0,42%)}.builder-panel{padding-inline:30px}.builder-steps li{padding-inline:14px}.builder-steps li b{flex-basis:40px;height:40px}.plate-type-grid{grid-template-columns:repeat(2,1fr)}.builder-preview>img{object-position:center}}
@media(max-width:800px){.builder-workspace{display:block}.builder-panel{padding:28px 16px 45px}.builder-preview{position:relative;display:none}.builder-steps{border-radius:15px}.builder-steps li{height:70px;padding:0 10px;gap:8px;font-size:12px}.builder-steps li b{flex-basis:34px;height:34px;border-width:2px;font-size:14px}.builder-card{padding:22px 15px}.registration-input{height:88px}.plate-type-grid{grid-template-columns:repeat(2,1fr)}.choice-row{grid-template-columns:1fr}.size-grid,.fitting-grid{grid-template-columns:repeat(4,160px)}.builder-summary{gap:14px}.builder-summary strong{font-size:36px}.builder-summary del{display:block;margin:5px 0 0}.builder-navigation{grid-template-columns:1fr}.builder-navigation .back-button{order:2}}
@media(max-width:430px){.builder-steps li span{display:none}.builder-steps li{justify-content:center}.plate-type-grid{grid-template-columns:1fr 1fr}.image-option img{height:120px}.image-option strong,.option-price{font-size:15px}.reflective-grid{grid-template-columns:1fr 1fr}.builder-summary{grid-template-columns:1fr}.builder-navigation button{min-height:58px}}