/* Mi instalación · Phase 1. All selectors are intentionally namespaced. */
.installation-shell{width:100%;max-width:1120px;min-width:0;margin:0 auto}
.installation-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}
.installation-back{white-space:nowrap}
.installation-demo-badge{display:inline-flex;align-items:center;min-height:30px;padding:5px 11px;border:1px solid color-mix(in srgb,var(--rr-brand) 22%,var(--rr-border));border-radius:var(--rr-radius-pill);background:var(--rr-brand-soft);color:var(--rr-brand-strong);font-size:var(--rr-font-size-xs);font-weight:750;letter-spacing:.03em}
.installation-intro{margin-bottom:16px;background:linear-gradient(135deg,var(--rr-surface) 0%,color-mix(in srgb,var(--rr-brand-soft) 38%,var(--rr-surface)) 100%)}
.installation-intro h2{margin:5px 0 7px}
.installation-intro p{max-width:760px;margin:0}
.installation-legend{display:flex;flex-wrap:wrap;gap:7px 14px;margin-top:16px;padding-top:14px;border-top:1px solid var(--rr-border)}
.installation-legend-item,.installation-state-pill{display:inline-flex;align-items:center;gap:7px;color:var(--rr-text-soft);font-size:var(--rr-font-size-sm);font-weight:650}
.installation-legend-item i,.installation-state-pill i{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:var(--installation-status-color)}
.installation-status-green{--installation-status-color:var(--rr-success)}
.installation-status-amber{--installation-status-color:var(--rr-warning)}
.installation-status-red{--installation-status-color:var(--rr-danger)}
.installation-status-gray{--installation-status-color:#87938e}
.installation-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(270px,.75fr);align-items:start;gap:16px;min-width:0}
.installation-rack-card,.installation-selection{min-width:0;margin:0}
.installation-rack-heading,.installation-selection-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.installation-rack-heading h2,.installation-selection-heading h3{margin:4px 0 0}
.installation-rack-heading>span{color:var(--rr-muted);font-size:var(--rr-font-size-sm);white-space:nowrap}
.installation-rack{min-width:0;padding:18px;border:1px solid var(--rr-border-strong);border-radius:var(--rr-radius-md);background:linear-gradient(180deg,var(--rr-surface-2),color-mix(in srgb,var(--rr-bg) 72%,var(--rr-surface)))}
.installation-level{min-width:0;padding:0 0 18px;border-right:4px solid color-mix(in srgb,var(--rr-text-soft) 28%,var(--rr-border));border-left:4px solid color-mix(in srgb,var(--rr-text-soft) 28%,var(--rr-border))}
.installation-level+.installation-level{padding-top:18px;border-top:5px solid color-mix(in srgb,var(--rr-text-soft) 32%,var(--rr-border))}
.installation-level:last-child{padding-bottom:0;border-bottom:5px solid color-mix(in srgb,var(--rr-text-soft) 32%,var(--rr-border))}
.installation-level-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 12px 9px}
.installation-level-heading h3{margin:0;color:var(--rr-text-soft);font-size:var(--rr-font-size-sm)}
.installation-level-heading small{font-size:var(--rr-font-size-xs)}
.installation-level-grid{display:grid;grid-template-columns:repeat(var(--installation-columns),minmax(0,1fr));gap:clamp(5px,1vw,10px);min-width:0;padding:0 12px}
.installation-unit{grid-column:var(--installation-column)/span var(--installation-span);display:flex;position:relative;min-width:0;min-height:76px;aspect-ratio:1.55/1;align-items:center;justify-content:center;flex-direction:column;gap:1px;padding:8px 4px;border:1px solid color-mix(in srgb,var(--installation-status-color) 45%,var(--rr-border));border-radius:9px;background:color-mix(in srgb,var(--installation-status-color) 7%,var(--rr-surface));color:var(--rr-text);box-shadow:0 5px 14px rgba(19,42,32,.035);transition:border-color var(--rr-duration-fast) var(--rr-ease),box-shadow var(--rr-duration-fast) var(--rr-ease),transform var(--rr-duration-fast) var(--rr-ease)}
.installation-unit:hover{border-color:var(--installation-status-color);box-shadow:0 8px 20px rgba(19,42,32,.08);transform:translateY(-1px)}
.installation-unit:focus-visible{outline:3px solid color-mix(in srgb,var(--rr-brand) 28%,transparent);outline-offset:2px}
.installation-unit.is-selected{border-color:var(--rr-brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--rr-brand) 14%,transparent)}
.installation-unit strong{font-size:clamp(14px,1.7vw,18px);line-height:1}
.installation-unit small{font-size:10px;line-height:1.2;color:var(--rr-muted)}
.installation-status-dot{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--installation-status-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--installation-status-color) 12%,transparent)}
.installation-selection{position:sticky;top:20px}
.installation-selection-empty{display:flex;align-items:flex-start;gap:13px}
.installation-selection-empty>span{display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;border-radius:11px;background:var(--rr-brand-soft);color:var(--rr-brand);font-size:20px}
.installation-selection-empty h3{margin:0 0 4px}
.installation-selection-empty p{margin:0;font-size:var(--rr-font-size-sm)}
.installation-state-pill{padding:5px 9px;border-radius:var(--rr-radius-pill);background:color-mix(in srgb,var(--installation-status-color) 9%,var(--rr-surface));white-space:nowrap}
.installation-details{display:grid;gap:0;margin:0;border-top:1px solid var(--rr-border)}
.installation-details>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--rr-border)}
.installation-details dt{color:var(--rr-muted);font-size:var(--rr-font-size-sm)}
.installation-details dd{min-width:0;margin:0;color:var(--rr-text);font-size:var(--rr-font-size-sm);font-weight:650;overflow-wrap:anywhere}
.installation-data-note{margin:14px 0;color:var(--rr-muted);font-size:var(--rr-font-size-sm)}
.installation-clear-selection{width:100%}
.installation-future-note{display:flex;align-items:flex-start;gap:12px;margin-top:16px;padding:14px 16px;border:1px dashed var(--rr-border-strong);border-radius:var(--rr-radius-sm);background:color-mix(in srgb,var(--rr-surface-2) 68%,transparent);color:var(--rr-text-soft)}
.installation-future-note b{flex:0 0 auto;color:var(--rr-brand-strong)}
.installation-future-note span{font-size:var(--rr-font-size-sm)}
.installation-launcher{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;margin:0 0 18px;border-color:color-mix(in srgb,var(--rr-brand) 22%,var(--rr-border));background:linear-gradient(135deg,var(--rr-surface) 0%,var(--rr-brand-soft) 150%)}
.installation-launcher-icon{display:grid;width:46px;height:46px;place-items:center;border-radius:14px;background:var(--rr-brand-soft);color:var(--rr-brand);font-size:24px}
.installation-launcher h2{margin:3px 0 2px}
.installation-launcher p{margin:0;font-size:var(--rr-font-size-sm)}

@media(max-width:900px){
  .installation-layout{grid-template-columns:1fr}
  .installation-selection{position:static}
}

@media(max-width:600px){
  .installation-shell{max-width:100%;overflow:hidden}
  .installation-toolbar{align-items:flex-start}
  .installation-demo-badge{max-width:48%;text-align:center}
  .installation-intro,.installation-rack-card,.installation-selection{padding:16px}
  .installation-legend{gap:8px 12px}
  .installation-legend-item{font-size:12px}
  .installation-rack{padding:12px 7px}
  .installation-level{padding-bottom:14px}
  .installation-level+.installation-level{padding-top:14px}
  .installation-level-heading{margin:0 7px 8px}
  .installation-level-heading small{display:none}
  .installation-level-grid{gap:5px;padding:0 7px}
  .installation-unit{min-height:58px;aspect-ratio:1.22/1;padding:7px 2px;border-radius:8px}
  .installation-unit strong{font-size:14px}
  .installation-status-dot{top:5px;right:5px;width:7px;height:7px}
  .installation-rack-heading{display:block}
  .installation-rack-heading>span{display:block;margin-top:4px;white-space:normal}
  .installation-selection-heading{display:block}
  .installation-state-pill{margin-top:8px}
  .installation-future-note{display:block}
  .installation-future-note b{display:block;margin-bottom:4px}
  .installation-launcher{grid-template-columns:auto minmax(0,1fr);padding:16px}
  .installation-launcher>button{grid-column:1/-1;width:100%}
}

@media(max-width:360px){
  .installation-toolbar{display:grid;grid-template-columns:1fr}
  .installation-demo-badge{max-width:none;justify-self:start}
  .installation-rack{padding-right:5px;padding-left:5px}
  .installation-level-grid{gap:4px;padding-right:5px;padding-left:5px}
  .installation-unit{min-height:54px}
  .installation-unit small{font-size:9px}
  .installation-details>div{grid-template-columns:80px minmax(0,1fr)}
}

@media(prefers-reduced-motion:reduce){
  .installation-unit{transition:none}
}