.xzro-builder{--xb-bg:#071018;--xb-panel:#0b1621;--xb-panel2:#101e2a;--xb-line:#213342;--xb-text:#eef8ff;--xb-muted:#8fa7b8;--xb-accent:#1cc8ff;--xb-good:#4ade80;--xb-warn:#fbbf24;--xb-bad:#fb7185;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--xb-text);background:linear-gradient(180deg,#071018,#09131d);border:1px solid #162a39;border-radius:18px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.22)}
.xzro-builder *{box-sizing:border-box}.xzro-builder button,.xzro-builder input,.xzro-builder select{font:inherit}.xzro-builder button{cursor:pointer}.xzro-builder button:disabled{cursor:not-allowed;opacity:.45}.xzro-builder-hero{display:flex;justify-content:space-between;gap:24px;padding:30px 32px;background:radial-gradient(circle at 85% 0,rgba(28,200,255,.14),transparent 34%),linear-gradient(135deg,#0b1621,#071018);border-bottom:1px solid var(--xb-line)}
.xzro-builder-kicker,.xzro-builder-section-head span,.xzro-builder-browser-head span,.xzro-builder-rail-top span{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--xb-accent)}.xzro-builder-hero h2{font-size:34px;line-height:1.05;margin:7px 0 8px;color:#fff}.xzro-builder-hero p{max-width:720px;margin:0;color:var(--xb-muted)}
.xzro-builder-hero-status{display:grid;grid-template-columns:auto auto;gap:2px 14px;align-content:center;min-width:220px}.xzro-builder-hero-status strong{font-size:18px;text-align:right;color:#fff}.xzro-builder-hero-status span{font-size:12px;color:var(--xb-muted);align-self:center}
.xzro-builder-toolbar{display:flex;justify-content:space-between;align-items:end;gap:16px;padding:14px 20px;background:#08131c;border-bottom:1px solid var(--xb-line)}.xzro-builder-name-wrap label,.xzro-builder-filters label>span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--xb-muted);margin-bottom:5px}.xzro-builder-name-wrap>div{display:flex}.xzro-builder-name-wrap input,.xzro-builder-filters input,.xzro-builder-filters select{background:#0e1c28;border:1px solid #294050;color:#fff;border-radius:8px;padding:9px 11px;min-height:40px}.xzro-builder-name-wrap input{border-radius:8px 0 0 8px;min-width:220px}.xzro-builder-name-wrap button,.xzro-builder-toolbar-actions button,.xzro-builder-rail-actions button,.xzro-builder-pagination button,.xzro-builder-saved button{border:1px solid #2d4657;background:#102330;color:#e8f7ff;border-radius:8px;padding:9px 13px;font-weight:700}.xzro-builder-name-wrap button{border-radius:0 8px 8px 0}.xzro-builder-toolbar-actions{display:flex;gap:8px;flex-wrap:wrap}.xzro-builder .is-danger{border-color:#663040!important;color:#ffafbd!important}
.xzro-builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:650px}.xzro-builder-main{padding:24px;min-width:0}.xzro-builder-view{display:none}.xzro-builder-view.is-active{display:block}.xzro-builder-section+.xzro-builder-section{margin-top:28px}.xzro-builder-section-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:14px}.xzro-builder-section-head h3,.xzro-builder-browser-head h3{margin:4px 0 0;color:#fff;font-size:22px}.xzro-builder-section-head p{margin:0;color:var(--xb-muted);font-size:13px}
.xzro-builder-profiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.xzro-builder-profiles button{min-height:102px;text-align:left;background:linear-gradient(145deg,#10202c,#0a151f);border:1px solid #243b4b;border-radius:12px;padding:16px;color:#fff}.xzro-builder-profiles button:hover{border-color:var(--xb-accent);transform:translateY(-1px)}.xzro-builder-profiles strong,.xzro-builder-profiles span{display:block}.xzro-builder-profiles span{color:var(--xb-muted);font-size:12px;margin-top:7px}
.xzro-builder-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.xzro-builder-category{min-height:126px;background:#0c1924;border:1px solid #203746;border-radius:12px;color:#fff;padding:16px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left}.xzro-builder-category:hover{border-color:var(--xb-accent);background:#102331}.xzro-builder-category-icon{display:inline-flex;min-width:50px;height:34px;align-items:center;justify-content:center;border:1px solid #2d5266;border-radius:7px;color:var(--xb-accent);font-size:11px;font-weight:900;letter-spacing:.05em}.xzro-builder-category strong{font-size:15px}.xzro-builder-category small{color:var(--xb-muted);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xzro-builder-rail{background:#09141d;border-left:1px solid var(--xb-line);min-width:0}.xzro-builder-rail-top{display:flex;justify-content:space-between;gap:10px;padding:18px;border-bottom:1px solid var(--xb-line)}.xzro-builder-rail-top strong{display:block;margin-top:4px}.xzro-builder-compat{align-self:center;color:var(--xb-good)!important;border:1px solid rgba(74,222,128,.35);border-radius:999px;padding:5px 8px;font-size:10px!important}.xzro-builder-compat.is-bad{color:var(--xb-bad)!important;border-color:rgba(251,113,133,.4)}.xzro-builder-rail-summary{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--xb-line)}.xzro-builder-rail-summary div{padding:12px 8px;text-align:center;border-right:1px solid var(--xb-line)}.xzro-builder-rail-summary div:last-child{border-right:0}.xzro-builder-rail-summary span,.xzro-builder-rail-summary strong{display:block}.xzro-builder-rail-summary span{font-size:10px;color:var(--xb-muted);text-transform:uppercase}.xzro-builder-rail-summary strong{margin-top:4px;font-size:14px}.xzro-builder-rail-findings>div{font-size:11px;padding:8px 12px;border-bottom:1px solid var(--xb-line)}.xzro-builder-rail-findings .is-error{color:#ff9aac}.xzro-builder-rail-findings .is-warning{color:#ffd86b}
.xzro-builder-slots{padding:8px 12px}.xzro-builder-slot{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;border:0;border-bottom:1px solid #182a38;background:transparent;color:#dbeaf3;padding:11px 5px;text-align:left}.xzro-builder-slot b{color:var(--xb-accent);font-size:12px}.xzro-builder-slot-group{border-bottom:1px solid #182a38;padding:9px 0}.xzro-builder-slot-title{display:flex;justify-content:space-between;align-items:center;padding:2px 5px 7px;color:var(--xb-muted);font-size:11px;text-transform:uppercase}.xzro-builder-slot-title button{background:none;border:0;color:var(--xb-accent);font-size:11px}.xzro-builder-slot-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:7px 4px}.xzro-builder-slot-item img{width:42px;height:42px;object-fit:contain;border-radius:6px;background:#fff}.xzro-builder-slot-item strong,.xzro-builder-slot-item small{display:block}.xzro-builder-slot-item strong{font-size:11px;line-height:1.25}.xzro-builder-slot-item small{font-size:10px;color:var(--xb-muted);margin-top:3px}.xzro-builder-slot-item input{width:48px;background:#0e1c28;border:1px solid #294050;color:#fff;border-radius:6px;padding:5px}.xzro-builder-remove{background:transparent;border:0;color:#ff8ca0;font-size:20px}.xzro-builder-rail-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:8px;padding:14px;border-top:1px solid var(--xb-line);position:sticky;bottom:0;background:#09141d}
.xzro-builder-browser-head{display:flex;gap:15px;align-items:center;margin-bottom:18px}.xzro-builder-back{border:1px solid #294050;background:#0d1c28;color:#cceeff;border-radius:8px;padding:9px 12px}.xzro-builder-filters{display:grid;grid-template-columns:minmax(180px,1fr) 180px auto auto;gap:10px;align-items:end;margin-bottom:10px}.xzro-builder-check{display:flex!important;align-items:center;gap:7px;min-height:40px;color:#cde0ec;font-size:12px}.xzro-builder-check input{min-height:auto;width:16px;height:16px}.xzro-builder-browser-meta{display:flex;justify-content:space-between;color:var(--xb-muted);font-size:12px;margin:8px 0 14px}.xzro-builder-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.xzro-builder-product{position:relative;background:#0c1924;border:1px solid #203746;border-radius:12px;padding:13px;min-width:0}.xzro-builder-product.is-incompatible{opacity:.67}.xzro-builder-product-img{height:150px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}.xzro-builder-product-img img{max-width:100%;max-height:100%;object-fit:contain}.xzro-builder-product-flags{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 6px}.xzro-builder-product-flags span{font-size:9px;text-transform:uppercase;letter-spacing:.05em;border:1px solid #315269;color:#9bdfff;border-radius:999px;padding:3px 6px}.xzro-builder-product-flags .compat{color:#9af7b8;border-color:#2f6741}.is-incompatible .xzro-builder-product-flags .compat{color:#ff9aac;border-color:#71384a}.xzro-builder-product h4{font-size:13px;line-height:1.35;margin:6px 0;color:#fff;min-height:52px}.xzro-builder-product-meta{font-size:10px;color:var(--xb-muted)}.xzro-builder-product-finding{font-size:10px;line-height:1.35;min-height:27px}.xzro-builder-product-finding.is-error{color:#ff9aac}.xzro-builder-product-finding.is-warning{color:#ffd86b}.xzro-builder-product-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}.xzro-builder-product-foot strong{font-size:16px}.xzro-builder-product-foot button{border:0;border-radius:7px;background:var(--xb-accent);color:#00131d;font-weight:900;padding:8px 12px}.xzro-builder-pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:18px}.xzro-builder-pagination span{color:var(--xb-muted);font-size:12px}
.xzro-builder-accessory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.xzro-builder-accessory-grid button{min-height:110px;background:#0c1924;border:1px solid #203746;color:#fff;border-radius:12px;padding:14px;text-align:left}.xzro-builder-accessory-grid button:hover{border-color:var(--xb-accent)}.xzro-builder-accessory-grid span{display:flex;width:30px;height:30px;border-radius:50%;align-items:center;justify-content:center;background:#102b3a;color:var(--xb-accent);font-size:20px;margin-bottom:16px}.xzro-builder-accessory-grid strong{font-size:13px}.xzro-builder-loading,.xzro-builder-empty{grid-column:1/-1;padding:40px 20px;text-align:center;border:1px dashed #294050;border-radius:12px;color:var(--xb-muted)}
.xzro-builder-saved-list{display:grid;gap:10px}.xzro-builder-saved{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px;border:1px solid #203746;border-radius:10px;background:#0c1924}.xzro-builder-saved strong,.xzro-builder-saved span{display:block}.xzro-builder-saved span{color:var(--xb-muted);font-size:12px;margin-top:4px}.xzro-builder-saved>div:last-child{display:flex;gap:7px;flex-wrap:wrap}.xzro-builder-toast{position:absolute;left:-9999px}.xzro-builder-toast.is-show{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:99999;background:#0c2230;border:1px solid #2f6278;color:#fff;padding:11px 16px;border-radius:9px;box-shadow:0 10px 30px rgba(0,0,0,.35)}.xzro-builder-toast.is-error{border-color:#7b3348;color:#ffbcc8}.xzro-builder-error{padding:16px;border:1px solid #9b3349;background:#2b1118;color:#ffd4dc;border-radius:8px}
@media(max-width:1100px){.xzro-builder-layout{grid-template-columns:minmax(0,1fr) 310px}.xzro-builder-category-grid,.xzro-builder-profiles,.xzro-builder-accessory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xzro-builder-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xzro-builder-filters{grid-template-columns:1fr 160px}.xzro-builder-check{min-height:auto}}
@media(max-width:760px){.xzro-builder{border-radius:10px}.xzro-builder-hero{display:block;padding:22px 18px}.xzro-builder-hero h2{font-size:28px}.xzro-builder-hero-status{margin-top:18px;width:max-content}.xzro-builder-toolbar{display:block}.xzro-builder-toolbar-actions{margin-top:10px}.xzro-builder-name-wrap input{min-width:0;width:100%}.xzro-builder-name-wrap>div{width:100%}.xzro-builder-layout{display:flex;flex-direction:column}.xzro-builder-main{padding:16px}.xzro-builder-rail{order:-1;border-left:0;border-bottom:1px solid var(--xb-line)}.xzro-builder-slots{max-height:310px;overflow:auto}.xzro-builder-section-head{display:block}.xzro-builder-section-head p{margin-top:6px}.xzro-builder-product-grid{grid-template-columns:1fr}.xzro-builder-category-grid,.xzro-builder-profiles,.xzro-builder-accessory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.xzro-builder-category{min-height:105px}.xzro-builder-filters{grid-template-columns:1fr}.xzro-builder-saved{align-items:flex-start;flex-direction:column}.xzro-builder-browser-meta{display:block}.xzro-builder-browser-meta span{display:block;margin:4px 0}}
@media(max-width:420px){.xzro-builder-category-grid,.xzro-builder-profiles,.xzro-builder-accessory-grid{grid-template-columns:1fr}.xzro-builder-rail-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.xzro-builder-toolbar-actions button{flex:1}}
.xzro-builder-assembly{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid rgba(88,208,255,.22);border-radius:8px;background:rgba(8,31,45,.72);font-size:12px;line-height:1.35}.xzro-builder-assembly input{margin:0}.xzro-builder-rail-actions [data-builder-cart]:disabled{opacity:.45;cursor:not-allowed}


/* Let the Builder use the available browser width even when a theme
   places the shortcode inside a narrow content column. This prevents the
   catalog and persistent build rail from colliding on laptops/smaller PCs. */
.xzro-builder{
    width:min(1500px,calc(100vw - 32px));
    max-width:none;
    margin-left:50%;
    transform:translateX(-50%);
}
@media(max-width:1280px){
    .xzro-builder-layout{grid-template-columns:minmax(0,1fr) 300px}
    .xzro-builder-main{padding:20px}
    .xzro-builder-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .xzro-builder-category-grid,.xzro-builder-profiles,.xzro-builder-accessory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){
    .xzro-builder{width:calc(100vw - 20px)}
    .xzro-builder-layout{display:flex;flex-direction:column}
    .xzro-builder-rail{order:-1;border-left:0;border-bottom:1px solid var(--xb-line)}
    .xzro-builder-slots{max-height:300px;overflow:auto}
    .xzro-builder-rail-actions{position:static}
    .xzro-builder-category-grid,.xzro-builder-profiles,.xzro-builder-accessory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
    .xzro-builder{width:calc(100vw - 12px);border-radius:10px}
    .xzro-builder-product-grid{grid-template-columns:1fr}
    .xzro-builder-category-grid,.xzro-builder-profiles,.xzro-builder-accessory-grid{grid-template-columns:1fr}
}