/* MKB Product Engine - Garage Layout Planner (plugin 0.24.0: realistic drawings).
   Site rules: square corners everywhere, dark charcoal buttons, sage + terracotta accents,
   Inter / Plus Jakarta Sans, compact spacing, no horizontal scroll at phone width. */
.mkbpe-garage{--gp-ink:#16211D;--gp-text:#4A5753;--gp-mute:#6B7772;--gp-sage:#2F6F5E;--gp-terra:#C2603F;--gp-line:#E3E9E6;--gp-soft:#F3F6F4;--gp-field:#C9D3CF;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.5;color:var(--gp-text);max-width:100%;overflow-wrap:anywhere}
.mkbpe-garage,.mkbpe-garage *,.mkbpe-garage *::before,.mkbpe-garage *::after{border-radius:0!important;box-sizing:border-box}
.mkbpe-garage [hidden]{display:none!important}
.mkbpe-garage .mkbpe-title,.mkbpe-garage .gp-h,.mkbpe-garage .gp-quick summary,.mkbpe-garage .gp-shop__item{font-family:"Plus Jakarta Sans",Inter,system-ui,sans-serif;color:var(--gp-ink);font-weight:700}
.mkbpe-garage .mkbpe-title{margin:0 0 6px}
.gp-intro{margin:0 0 12px}
.gp-loading{margin:0;padding:24px;background:var(--gp-soft);text-align:center;font-size:14px}
.mkbpe-garage .gp-h{font-size:15px;line-height:1.3;margin:0 0 8px}
.mkbpe-garage .gp-h--big{font-size:20px;margin-bottom:4px}
.gp-muted{color:var(--gp-mute);font-size:13px;margin:0 0 8px}
.gp-l{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gp-ink);line-height:1.3}
.gp-u{font-size:12px;color:var(--gp-mute)}

/* Form controls */
.mkbpe-garage input[type=number],.mkbpe-garage select{height:34px;margin:0;padding:4px 6px;border:1px solid var(--gp-field);background:#fff;color:var(--gp-ink);font:inherit;font-size:14px;line-height:1.2;min-width:0;box-shadow:none}
.mkbpe-garage input[type=number]:focus,.mkbpe-garage select:focus{outline:2px solid var(--gp-sage);outline-offset:0;border-color:var(--gp-sage)}
.mkbpe-garage input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:16px;height:16px;margin:0;border:1.5px solid var(--gp-ink);background:#fff;cursor:pointer;vertical-align:middle}
.mkbpe-garage input[type=checkbox]:checked{background:var(--gp-sage);border-color:var(--gp-sage);box-shadow:inset 0 0 0 3px #fff}
.mkbpe-garage input[type=checkbox]:focus-visible{outline:2px solid var(--gp-sage);outline-offset:1px}
.gp-check{display:inline-flex;align-items:center;gap:7px;font-size:14px;color:var(--gp-ink);cursor:pointer;line-height:1.3}

/* Buttons: dark charcoal, square */
.mkbpe-garage button{font-family:inherit;text-transform:none;letter-spacing:normal}
.mkbpe-garage .gp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;margin:0;padding:6px 12px;background:var(--gp-ink);color:#fff;border:1px solid var(--gp-ink);font-size:13px;font-weight:600;line-height:1.2;cursor:pointer;box-shadow:none;text-decoration:none}
.mkbpe-garage .gp-btn:hover{background:#2B3934;border-color:#2B3934;color:#fff}
.mkbpe-garage .gp-btn--ghost{background:#fff;color:var(--gp-ink)}
.mkbpe-garage .gp-btn--ghost:hover{background:var(--gp-soft);color:var(--gp-ink);border-color:var(--gp-ink)}
.mkbpe-garage .gp-btn:disabled{opacity:.38;cursor:default;background:#fff;color:var(--gp-ink)}
.mkbpe-garage .gp-btn:focus-visible,.mkbpe-garage .gp-chip:focus-visible,.mkbpe-garage .gp-seg button:focus-visible,.mkbpe-garage .gp-tabs button:focus-visible{outline:2px solid var(--gp-sage);outline-offset:2px}
.mkbpe-garage .gp-link{display:inline;margin:0;padding:0;background:none;border:0;color:var(--gp-sage);font-size:13px;text-align:left;text-decoration:underline;text-underline-offset:3px;cursor:pointer;line-height:1.4}
.mkbpe-garage .gp-link:hover{color:var(--gp-ink);background:none}

/* Step 1: garage */
.gp-setup{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end;padding:12px;background:var(--gp-soft);border:1px solid var(--gp-line)}
.gp-f{display:flex;flex-direction:column;gap:3px;margin:0;min-width:0}
.gp-in{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.gp-len input[type=number]{width:54px}
.gp-len input[data-part=cm]{width:74px}
.gp-f--preset select{min-width:170px;max-width:100%}
.gp-seg{display:inline-flex;border:1px solid var(--gp-ink);background:#fff}
.mkbpe-garage .gp-seg button{margin:0;min-height:32px;padding:5px 10px;background:#fff;color:var(--gp-ink);border:0;font-size:13px;font-weight:600;cursor:pointer;line-height:1.2}
.mkbpe-garage .gp-seg button+button{border-left:1px solid var(--gp-ink)}
.mkbpe-garage .gp-seg button.is-on{background:var(--gp-ink);color:#fff}

/* Step 2: quick start */
.gp-quick{margin-top:10px;padding:10px 12px;border:1px solid var(--gp-line);background:#fff}
.gp-quick summary{cursor:pointer;font-size:15px;list-style-position:inside}
.gp-quick[open] summary{margin-bottom:6px}
.gp-quick__opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:8px 14px;margin:4px 0 12px}
.gp-quick p{margin:0 0 8px}

/* Plan + side panel */
.gp-main{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:14px}
.gp-wide .gp-main{grid-template-columns:minmax(0,1fr) 300px;align-items:start}
.gp-stage{min-width:0}
.gp-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.gp-panel{border:1px solid var(--gp-line);padding:12px;background:#fff;min-width:0}
.gp-tabs{display:flex;border-bottom:2px solid var(--gp-ink)}
.mkbpe-garage .gp-tabs button{margin:0;padding:8px 14px;background:#fff;color:var(--gp-ink);border:0;font-size:14px;font-weight:600;cursor:pointer;line-height:1.2}
.mkbpe-garage .gp-tabs button.is-on{background:var(--gp-ink);color:#fff}
.gp-walltabs{display:flex;flex-wrap:wrap;gap:0 4px;margin-top:6px}
.mkbpe-garage .gp-walltabs button{margin:0;padding:5px 10px;background:none;border:0;border-bottom:2px solid transparent;color:var(--gp-text);font-size:13px;font-weight:600;cursor:pointer}
.mkbpe-garage .gp-walltabs button.is-on{color:var(--gp-sage);border-bottom-color:var(--gp-sage)}
.gp-canvas{margin-top:8px;border:1px solid var(--gp-line);background:#F4F5F2;line-height:0}
.gp-svg{display:block;width:100%;height:auto;max-height:78vh;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.gp-svg:focus{outline:none}
.gp-svg:focus-visible{outline:2px solid var(--gp-sage);outline-offset:2px}
.gp-svg.has-sel,.gp-svg .gp-it{touch-action:none}
.gp-svg .gp-it{cursor:grab}
.gp-svg .gp-lbl{font-family:Inter,Arial,sans-serif;fill:#16211D;font-weight:600;pointer-events:none;paint-order:stroke;stroke:rgba(255,255,255,.85);stroke-width:.22em;stroke-linejoin:round}
.gp-svg .gp-lbl--muted{fill:var(--gp-mute);font-weight:500;stroke:none}
.gp-svg .gp-lbl--warn{fill:var(--gp-terra)}
.gp-svg .gp-zone{fill:rgba(47,111,94,.08);stroke:rgba(47,111,94,.6);stroke-width:1px;stroke-dasharray:5 4;vector-effect:non-scaling-stroke;pointer-events:none}
.gp-svg .gp-zone.is-bad{fill:rgba(180,35,24,.13);stroke:rgba(180,35,24,.85)}
.gp-svg .gp-warnbox{fill:rgba(180,35,24,.12);stroke:#b42318;stroke-width:2px;vector-effect:non-scaling-stroke;pointer-events:none}
.gp-svg .gp-warnbox--warn{fill:rgba(214,133,0,.12);stroke:#C27A00}
.gp-svg .gp-track{stroke:rgba(194,96,63,.55);stroke-width:1px;stroke-dasharray:5 4;vector-effect:non-scaling-stroke;pointer-events:none}
.gp-svg .gp-opener{fill:rgba(194,96,63,.13);stroke:none;pointer-events:none}
.gp-svg .gp-swing{fill:none;stroke:#5E6865;stroke-width:1px;stroke-dasharray:3 3;opacity:.75;vector-effect:non-scaling-stroke}
.gp-svg .gp-swings{pointer-events:none}
.gp-svg .gp-faded{opacity:.24;pointer-events:none}
.gp-svg .gp-above{pointer-events:none}
.gp-svg .gp-far{opacity:.62}
.gp-svg .gp-selhalo{fill:rgba(47,111,94,.08);stroke:rgba(47,111,94,.45);stroke-width:7px;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none}
.gp-svg .gp-selbox{fill:none;stroke:#16211D;stroke-width:2px;stroke-dasharray:6 3;vector-effect:non-scaling-stroke;pointer-events:none}
.gp-hint{margin:6px 0 0}
.gp-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.gp-toggles{display:flex;flex-wrap:wrap;gap:6px 14px;margin-left:auto}
.gp-toggles .gp-check{font-size:13px}

/* Inspector */
.gp-est{margin:-4px 0 8px;font-size:12px;color:var(--gp-terra)}
.gp-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:8px}
.gp-inspect .gp-f{margin-bottom:8px}
.gp-inspect .gp-grid3 .gp-f{margin-bottom:0}
.gp-inspect input[type=number]{width:100%}
.gp-inspect .gp-angle input[type=number]{width:62px}
.gp-inspect .gp-angle .gp-btn{min-height:34px;padding:4px 8px}
.gp-nudge{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin:6px 0 8px}
.gp-nudge .gp-l{margin-right:4px}
.mkbpe-garage .gp-nudge .gp-btn{min-width:40px;padding:6px;font-size:15px}
.gp-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.gp-inspect .gp-row{margin-bottom:8px}

/* Library */
.gp-lib__group{border-top:1px solid var(--gp-line)}
.gp-lib__group summary{cursor:pointer;padding:7px 0;font-size:14px;font-weight:700;color:var(--gp-ink)}
.gp-lib__items{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0 10px}
.mkbpe-garage .gp-chip{display:flex;flex-direction:column;align-items:flex-start;gap:1px;margin:0;padding:6px 8px;background:#fff;color:var(--gp-ink);border:1px solid var(--gp-field);font-size:13px;font-weight:600;line-height:1.25;text-align:left;cursor:pointer}
.mkbpe-garage .gp-chip:hover{border-color:var(--gp-ink);background:var(--gp-soft);color:var(--gp-ink)}
.gp-chip small{font-size:11px;font-weight:500;color:var(--gp-mute)}
.gp-status{margin:6px 0 0;min-height:1em}

/* Results */
.gp-results{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:14px}
.gp-wide .gp-results{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);align-items:start}
.gp-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.gp-checks li{margin:0}
.mkbpe-garage .gp-checks button{display:block;width:100%;margin:0;padding:5px 8px;background:#fff;border:0;border-left:3px solid var(--gp-line);color:var(--gp-ink);font-size:13px;font-weight:500;line-height:1.4;text-align:left;cursor:pointer}
.mkbpe-garage .gp-sev--bad button{border-left-color:#b42318;background:#FDF0EE}
.mkbpe-garage .gp-sev--warn button{border-left-color:var(--gp-terra);background:#FBF3EC}
.mkbpe-garage .gp-sev--info button{border-left-color:var(--gp-sage);background:#EEF4F1}
.gp-ok{padding:6px 8px;border-left:3px solid var(--gp-sage);background:#EEF4F1;color:var(--gp-ink);font-size:13px}
.gp-count{display:inline-block;min-width:22px;margin-left:4px;padding:0 6px;background:#b42318;color:#fff;font-family:Inter,sans-serif;font-size:12px;line-height:20px;text-align:center;vertical-align:1px}
.gp-count.is-ok{display:none}
.gp-cap{width:100%;margin:0 0 8px;border-collapse:collapse;font-size:13px}
.gp-cap th,.gp-cap td{padding:4px 4px;border:0;border-bottom:1px solid var(--gp-line);text-align:left;vertical-align:top;background:none}
.gp-cap th{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--gp-ink)}
.gp-cap tr.is-bad td{color:#b42318}
.gp-cap .gp-total td{font-weight:700;color:var(--gp-ink)}
.gp-legend{list-style:none;margin:0;padding:0;font-size:13px}
.gp-legend li{margin:0 0 3px}
.mkbpe-garage .gp-legend .gp-link{color:var(--gp-ink);text-decoration:none}
.mkbpe-garage .gp-legend .gp-link.is-on{text-decoration:underline}
.gp-legend b{display:inline-block;min-width:20px;margin-right:4px;background:var(--gp-ink);color:#fff;font-size:11px;line-height:18px;text-align:center}

/* Shopping list (compact product boxes) */
.gp-shop{margin-top:18px;padding-top:14px;border-top:2px solid var(--gp-ink)}
.gp-shop__list{margin-top:10px}
.gp-shop__group{margin:0 0 18px}
.mkbpe-garage .gp-shop__item{margin:0 0 10px;font-size:15px;line-height:1.3}
.gp-shop__count{color:var(--gp-terra)}
.mkbpe-garage .gp-shop__grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px 14px}
.mkbpe-garage .mkbpe-card--compact .mkbpe-card__img{border-radius:0}
.mkbpe-garage .mkbpe-badge{padding:0;background:none;color:var(--gp-terra);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.gp-shop__fallback,.gp-shop__more{margin:8px 0 0}
.mkbpe-garage a.gp-amazon{display:inline-flex;align-items:center;min-height:36px;padding:7px 14px;background:var(--gp-ink);color:#fff;border:1px solid var(--gp-ink);font-size:14px;font-weight:600;line-height:1.3;text-decoration:none}
.mkbpe-garage a.gp-amazon:hover{background:#2B3934;color:#fff}
.mkbpe-garage .gp-shop__more a.gp-amazon{background:#fff;color:var(--gp-ink);font-size:13px;min-height:32px;padding:5px 12px}
.mkbpe-garage .gp-shop__more a.gp-amazon:hover{background:var(--gp-soft)}
.gp-shop__empty{margin:0}
.gp-shop__linksbox{margin-top:4px}
.gp-shop__links{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px 12px}
.mkbpe-garage .gp-shop__group--link{display:flex;flex-direction:column;justify-content:space-between;gap:8px;margin:0;padding:10px;border:1px solid var(--gp-line);background:#fff}
.mkbpe-garage .gp-shop__group--link .gp-shop__item{margin:0;font-size:14px}
.mkbpe-garage .gp-shop__group--link .gp-shop__fallback{margin:0}
.mkbpe-garage .gp-shop__group--link a.gp-amazon{width:100%;justify-content:center;text-align:center;min-height:32px;padding:5px 10px;font-size:13px}
.gp-disclosure{margin:10px 0 0;font-size:12px}

/* Save */
.gp-save{margin-top:16px;padding:12px;background:var(--gp-soft);border:1px solid var(--gp-line)}

@media (max-width:600px){
	.mkbpe-garage.mkbpe-tool{padding:12px}
	.gp-setup{padding:10px;gap:8px 12px}
	.gp-f--preset{flex:1 1 100%}
	.gp-f--preset select{width:100%}
	.mkbpe-garage .gp-tabs button{flex:1 1 0;padding:8px 4px;font-size:13px}
	.gp-tools .gp-btn{flex:1 1 auto;padding:6px 8px}
	.gp-toggles{margin-left:0;flex:1 1 100%}
	.gp-save .gp-btn{flex:1 1 40%}
}
.mkbpe-garage .gp-pop{margin-top:28px}
.mkbpe-garage .gp-pop [data-pid][hidden]{display:none!important}