/* ── ENGINEER VIEW (results) ── */
.engineer-layout {
  display: flex;
  width: 100%;
  height: 100%;
}
.engineer-sidebar {
  width: 300px;
  min-width: 300px;
  border-right: 1px solid var(--border);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.e-sidebar-section {
  border-bottom: 1px solid var(--border);
  padding: 14px 16px;
}
.e-sidebar-title {
  font-family: 'Syne', sans-serif;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--text-muted);
  margin-bottom: 10px;
}
.engineer-main { flex: 1; overflow: auto; padding: 24px; container-type: inline-size; }

.results-title {
  font-family: 'Syne', sans-serif;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 4px;
  display: flex; align-items: center; gap: 10px;
}
.results-sub { font-size: 10px; color: var(--text-muted); margin-bottom: 14px; }
.tag {
  display: inline-flex;
  padding: 2px 7px;
  border-radius: 8px;
  font-size: 10px;
  background: rgba(232,160,32,0.12);
  color: var(--accent);
  border: 1px solid rgba(232,160,32,0.25);
}

.matrix-container { overflow-x: auto; margin-bottom: 24px; }
.matrix-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: start;
}
.matrix-grid[data-cols="2"] { grid-template-columns: repeat(2, 1fr); }
.matrix-grid[data-cols="1"] { grid-template-columns: 1fr; }
.matrix-table {
  border-collapse: collapse;
  font-size: 11px;
  min-width: max-content;
}
.matrix-table th {
  background: var(--surface2);
  color: var(--text-muted);
  padding: 6px 10px;
  font-weight: 500;
  text-align: center;
  border: 1px solid var(--border);
  white-space: nowrap;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.matrix-table th.col-pour {
  background: var(--surface);
  color: var(--accent);
  border-bottom: 2px solid var(--accent);
  cursor: pointer;
}
.matrix-table th.col-pour:hover { background: rgba(232,160,32,0.05); }
.matrix-table td {
  padding: 5px 10px;
  border: 1px solid var(--border);
  text-align: center;
  min-width: 70px;
  white-space: nowrap;
}
.matrix-table td.row-label {
  background: var(--surface2);
  color: var(--text-muted);
  text-align: left;
  font-size: 10px;
  padding-left: 10px;
}
.cell-wet { background: rgba(0,178,178,0.1); color: var(--wet); font-style: italic; }
.cell-tg { background: rgba(56,201,110,0.1); color: var(--tg); }
.cell-np { background: rgba(240,80,80,0.12); color: var(--np); font-weight: 500; }
.cell-ok { background: rgba(56,201,110,0.06); color: var(--ok); }
.cell-warn { background: rgba(196,122,0,0.1); color: var(--warn); }
.cell-empty { background: var(--bg); color: var(--border); }
.cell-inactive { background: rgba(8,20,20,0.6); color: var(--text-dim); font-size: 9px; }

/* ── BUILDER VIEW ── */
.builder-layout {
  display: flex;
  width: 100%;
  height: 100%;
}
.builder-sidebar {
  width: 260px;
  min-width: 260px;
  border-right: 1px solid var(--border);
  overflow-y: auto;
  padding: 14px;
  flex-shrink: 0;
}
.builder-main { flex: 1; overflow: auto; padding: 24px; }

.pour-list { display: flex; flex-direction: column; gap: 4px; }
.pour-item {
  padding: 7px 12px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text-muted);
  font-size: 11px;
  cursor: pointer;
  transition: all 0.15s;
}
.pour-item:hover { border-color: var(--border2); color: var(--text); }
.pour-item.active { background: var(--surface2); color: var(--text); border-color: var(--accent); }
.pour-item-name { font-weight: 500; font-size: 12px; }
.pour-item-sub { font-size: 10px; color: var(--text-muted); margin-top: 2px; }

.sidebar-pour-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  padding: 5px 6px;
  border-bottom: 1px solid rgba(42,52,71,0.4);
  border-radius: 4px;
  transition: background 0.1s;
}
.sidebar-pour-item:hover {
  background: var(--surface2);
}

.building-vis-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 16px;
}
.vis-level {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 3px;
}
.vis-label { width: 55px; text-align: right; font-size: 11px; color: var(--text-muted); flex-shrink: 0; }
.vis-bar {
  flex: 1;
  height: 30px;
  border-radius: 4px;
  display: flex; align-items: center; padding: 0 10px;
  font-size: 11px; font-weight: 500;
  border: 1px solid transparent;
  min-width: 180px;
  position: relative;
  overflow: hidden;
  transition: all 0.25s;
}
.vis-bar::before {
  content: '';
  position: absolute; left:0; top:0; bottom:0;
  width: 30%;
  background: linear-gradient(90deg, rgba(255,255,255,0.05) 0%, transparent 100%);
  pointer-events: none;
}
.vis-badge { display: none; } /* badges removed — info is now in bar text */

.slab-wet { background: linear-gradient(135deg,#102035,#172d4a); border-color:var(--wet); color:var(--wet); animation: pulse-wet 2s infinite; }
@keyframes pulse-wet { 0%,100%{box-shadow:0 0 0 0 rgba(77,168,255,0.15)} 50%{box-shadow:0 0 0 4px rgba(77,168,255,0.07)} }
.slab-tg { background: linear-gradient(135deg,#0d2419,#122e1e); border-color:var(--tg); color:var(--tg); }
.slab-ok { background: linear-gradient(135deg,#0b1e13,#10271a); border-color:rgba(56,201,110,0.25); color:var(--tg); }
.slab-np { background: linear-gradient(135deg,#2a1010,#381515); border-color:var(--np); color:var(--np); }
.slab-warn { background: linear-gradient(135deg,#271c08,#332410); border-color:var(--warn); color:var(--warn); }
.slab-neutral { background: var(--surface2); border-color:var(--border); color:var(--text-muted); }

.badge-tg { background:rgba(56,201,110,0.12); color:var(--tg); border:1px solid rgba(56,201,110,0.25); }
.badge-ok { background:rgba(56,201,110,0.08); color:var(--tg); border:1px solid rgba(56,201,110,0.15); }
.badge-warn { background:rgba(212,146,26,0.12); color:var(--warn); border:1px solid rgba(212,146,26,0.25); }
.badge-np { background:rgba(240,80,80,0.12); color:var(--np); border:1px solid rgba(240,80,80,0.25); }
.badge-wet { background:rgba(77,168,255,0.1); color:var(--wet); border:1px solid rgba(77,168,255,0.2); }
.badge-neutral { background:var(--surface2); color:var(--text-muted); border:1px solid var(--border); }

.vis-props { display:flex; align-items:flex-end; gap:2px; margin:2px 0 2px 65px; height:12px; }
.vis-prop-line { background:var(--accent); width:2px; border-radius:1px; opacity:0.6; }

.builder-legend { display:flex; gap:14px; flex-wrap:wrap; padding:10px 14px; background:var(--bg); border-radius:6px; margin-bottom:16px; }
.legend-item { display:flex; align-items:center; gap:6px; font-size:10px; color:var(--text-muted); }
.legend-swatch { width:11px; height:11px; border-radius:2px; border:1px solid currentColor; }