.detail-head-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.management-takeoff-modal {
  z-index: 2147483600;
  isolation: isolate;
  padding: 14px;
  background: rgba(2, 6, 23, .9);
  backdrop-filter: blur(5px);
}
.management-takeoff-modal-card {
  display: flex;
  flex-direction: column;
  width: min(1600px, calc(100vw - 28px));
  height: min(96dvh, 1040px);
  max-height: calc(100dvh - 28px);
  overflow: hidden;
  padding: 18px;
  border-color: rgba(56, 189, 248, .38);
  box-shadow: 0 30px 100px rgba(0, 0, 0, .72), 0 0 0 1px rgba(56, 189, 248, .1);
}
.management-takeoff-modal-head {
  flex: 0 0 auto;
  gap: 18px;
  margin-bottom: 12px;
}
.management-takeoff-modal-head h3 { margin: 0; }
.management-takeoff-modal-head p { margin: 6px 0 0; color: #8ca2bc; font-size: 12px; }
.management-takeoff-title-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.management-takeoff-badge {
  flex: 0 0 auto;
  padding: 5px 9px;
  border: 1px solid rgba(56, 189, 248, .34);
  border-radius: 999px;
  background: rgba(14, 116, 144, .15);
  color: #7dd3fc;
  font-size: 11px;
}
html.management-takeoff-modal-open,
html.management-takeoff-modal-open body { overflow: hidden; }
.takeoff-heatmap-panel { min-width: 0; }
.management-takeoff-modal .takeoff-heatmap-panel {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}
.takeoff-panel-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.takeoff-panel-switch {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid #334155;
  border-radius: 9px;
  background: #111827;
}
.takeoff-panel-switch button {
  min-width: 92px;
  padding: 7px 13px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #94a3b8;
  cursor: pointer;
  font-weight: 650;
}
.takeoff-panel-switch button.active {
  background: linear-gradient(135deg, #1266ff, #00a9ff);
  color: #fff;
  box-shadow: 0 4px 14px rgba(18, 102, 255, .25);
}
.takeoff-panel-status { color: #7f93ad; font-size: 12px; text-align: right; }
.takeoff-panel-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 9px;
  margin-bottom: 11px;
}
.takeoff-panel-meta span {
  padding: 5px 9px;
  border: 1px solid rgba(51, 65, 85, .72);
  border-radius: 999px;
  background: rgba(15, 23, 42, .7);
  color: #cbd5e1;
  font-size: 12px;
}
.takeoff-panel-view[hidden] { display: none; }
.takeoff-panel-map-shell { position: relative; min-height: 430px; }
.takeoff-panel-map {
  width: 100%;
  min-height: 430px;
  overflow: hidden;
  border: 1px solid #374151;
  border-radius: 10px;
  background: #07101f;
}
.management-takeoff-modal .takeoff-panel-map-shell,
.management-takeoff-modal .takeoff-panel-map {
  min-height: clamp(500px, 72vh, 780px);
}
.takeoff-panel-scale {
  position: absolute;
  z-index: 450;
  left: 12px;
  bottom: 14px;
  min-width: 178px;
  padding: 10px 11px;
  border: 1px solid rgba(96, 165, 250, .35);
  border-radius: 9px;
  background: rgba(4, 12, 26, .9);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
  color: #dbeafe;
  pointer-events: none;
  backdrop-filter: blur(8px);
}
.takeoff-panel-scale strong { display: block; margin-bottom: 7px; color: #fff; }
.takeoff-panel-scale-bar {
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(90deg, #071f9c, #1266ff, #00b7ff, #00e6c3, #74e600, #ffe600, #ff7a00, #ff1b12);
}
.takeoff-panel-scale-labels { display: flex; justify-content: space-between; margin-top: 4px; color: #9fb1c8; font-size: 11px; }
.takeoff-panel-scale-meta { margin-top: 7px; color: #cbd5e1; font-size: 11px; }
.takeoff-panel-list-wrap {
  max-height: 520px;
  overflow: auto;
  border: 1px solid #334155;
  border-radius: 10px;
  background: #0b1220;
}
.takeoff-panel-table { min-width: 920px; }
.takeoff-panel-table thead { position: sticky; z-index: 2; top: 0; background: #111827; }
.takeoff-panel-table td { font-variant-numeric: tabular-nums; white-space: nowrap; }
.takeoff-panel-popup {
  min-width: 244px;
  padding: 10px 12px;
  border: 1px solid #374151;
  border-radius: 9px;
  background: #111827;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
  color: #e5e7eb;
}
.takeoff-panel-popup strong { display: block; margin-bottom: 7px; color: #fff; }
.takeoff-panel-popup span { display: block; margin-top: 4px; color: #cbd5e1; }
@media (max-width: 760px) {
  .detail-head-actions, .takeoff-panel-toolbar { align-items: stretch; flex-direction: column; }
  .detail-head-actions .btn { width: 100%; }
  .management-takeoff-modal { padding: 6px; }
  .management-takeoff-modal-card {
    width: calc(100vw - 12px);
    height: calc(100dvh - 12px);
    max-height: calc(100dvh - 12px);
    padding: 12px;
  }
  .management-takeoff-modal-head { align-items: flex-start; }
  .takeoff-panel-status { text-align: left; }
  .takeoff-panel-map-shell, .takeoff-panel-map,
  .management-takeoff-modal .takeoff-panel-map-shell,
  .management-takeoff-modal .takeoff-panel-map { min-height: 62vh; }
}
