:root {
  /*
   * Tema «soft professional»: fondos pastel, texto oscuro, botones tipo p\u00edldora.
   */
  --bg: #e2e9f2;
  --panel: #f4f7fb;
  --panel-elev: #ffffff;
  --border: #b9c9dc;
  --text: #0f172a;
  --muted: #5c6b7d;
  --accent: #0284c7;
  --accent-dim: #0369a1;
  --accent-glow: rgba(2, 132, 199, 0.2);

  --btn-default: #e0e8f2;
  --btn-default-hover: #d2dde9;
  --btn-default-border: #8fa1b8;
  --btn-persist: #cdeee8;
  --btn-persist-hover: #bde6dd;
  --btn-persist-border: #3a9d8f;
  --btn-ingest: #e4dff5;
  --btn-ingest-hover: #d8d0ef;
  --btn-ingest-border: #8b7ec4;
  --btn-cta-sky: #c5ebfa;
  --btn-cta-sky-hover: #b0e3f7;
  --btn-cta-sky-border: #0ea5e9;
  --btn-on-cta: #0f172a;
  --btn-warn: #ebe2f2;
  --btn-warn-hover: #dfd3ec;
  --btn-warn-border: #8b7e9b;
  --btn-geo: #d6e4fc;
  --btn-geo-hover: #c4d8f9;
  --btn-geo-border: #4a7ede;
  --btn-measure: #e6eaf0;
  --btn-measure-hover: #d9dfe8;
  --btn-measure-border: #8b96a8;
  --btn-nav-back: #e2e6ec;
  --btn-nav-back-hover: #d4dae4;
  --btn-nav-back-border: #7b8494;
  --btn-draw: #cfeaf1;
  --btn-draw-hover: #bce2ed;
  --btn-draw-border: #3d8fa5;
  --btn-danger: #fadbe5;
  --btn-danger-hover: #f7c8d8;
  --btn-danger-border: #d43d60;
  --btn-olive: #cceee9;
  --btn-olive-hover: #b8e6df;
  --btn-olive-border: #349e92;
  --btn-aubergine: #e8e0f4;
  --btn-aubergine-hover: #dcd0ee;
  --btn-aubergine-border: #7d6ba8;
  --btn-ink: #0f172a;
  --btn-ivory: var(--text);

  --budget-subrow-teal: #9fd9d0;
  --budget-subrow-teal-hover: #8ad0c5;
  --budget-subrow-blue: #b6ccf9;
  --budget-subrow-blue-hover: #a3bff7;
  --budget-subrow-cyan: #9bd8ea;
  --budget-subrow-cyan-hover: #86cfe5;
  --budget-recal-orange: #ffd4b8;
  --budget-recal-orange-hover: #ffc49e;

  --header-action-btn-min-h: 32px;
  --header-action-btn-font: 12px;
  --header-action-gap: 8px;

  --visor-sheet-header-top: #1e3a52;
  --visor-sheet-header-bot: #152a3d;
  --visor-sheet-header-text: #f1f5f9;
  --visor-sheet-grid: #c9d8e8;
  --visor-font-ui: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  height: 100%;
  min-height: 100%;
  font-family: var(--visor-font-ui);
  -webkit-font-smoothing: antialiased;
  background: var(--bg);
  color: var(--text);
}

/* Izquierda: General (propiedades, tabla IFC, capas) | Vista 3D */
#app {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
}

/* Títulos de pantalla / modales (numeración romana, centrado). */
.visor-screen-title {
  margin: 0;
  font-weight: 700;
  color: var(--text);
  text-align: center;
  letter-spacing: 0.02em;
  line-height: 1.25;
}

.visor-screen-title--modal {
  font-size: 1.1rem;
  margin-bottom: 0.35rem;
}

/* Unifica tipografía/tamaño en títulos de pantallas modales. */
#planning-5d-title,
#simulation-window-title,
#plan-sheet-title,
#budget-concepts-title,
#ifc-table-title {
  margin: 0;
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  text-align: center;
  color: var(--text);
}

.app-screen-title-bar {
  flex-shrink: 0;
  width: 100%;
  position: relative;
  padding-top: max(24px, calc(16px + env(safe-area-inset-top, 0px)));
  padding-right: 14px;
  padding-bottom: 6px;
  padding-left: 14px;
  text-align: center;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #f6f8fc 0%, #e8eef6 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.75);
}

.app-screen-title-bar-actions {
  position: absolute;
  top: max(24px, calc(16px + env(safe-area-inset-top, 0px)));
  right: 14px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 8px;
}

#app .btn.btn-observaciones,
.toolbar-top-actions .btn.btn-observaciones {
  flex: 1 1 0;
  min-height: var(--header-action-btn-min-h);
  padding: 7px 10px;
  font-size: var(--header-action-btn-font, 12px);
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #1a1200 !important;
  border: 1.5px solid #ff9800 !important;
  border-radius: 999px;
  background: linear-gradient(180deg, #ffe066 0%, #ffb300 42%, #ff6f00 100%) !important;
  box-shadow:
    0 0 8px rgba(255, 179, 0, 0.95),
    0 0 18px rgba(255, 111, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
  cursor: pointer;
  white-space: nowrap;
  text-shadow: none;
}

#app .btn.btn-observaciones:hover,
.toolbar-top-actions .btn.btn-observaciones:hover {
  background: linear-gradient(180deg, #fff176 0%, #ffc107 42%, #ff8f00 100%) !important;
  border-color: #ff9800 !important;
  color: #1a1200 !important;
  filter: brightness(1.05);
  box-shadow:
    0 0 10px rgba(255, 179, 0, 1),
    0 0 22px rgba(255, 111, 0, 0.65),
    inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

#app .btn.btn-observaciones:active,
.toolbar-top-actions .btn.btn-observaciones:active {
  transform: translateY(1px);
  background: linear-gradient(180deg, #ffb300 0%, #ff8f00 55%, #ef6c00 100%) !important;
}

.observaciones-modal-dialog {
  width: 100%;
  max-width: none;
  max-height: none;
  display: flex;
  flex-direction: column;
}

/* Panel Observations: overlay global (même rendu sur Visor / Devis / Planning / Fiche) */
#observaciones-modal.trazabilidad-assign-modal {
  padding: 24px 16px !important;
  z-index: 21000 !important;
  box-sizing: border-box;
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}

#observaciones-modal.trazabilidad-assign-modal.hidden {
  display: none !important;
}

#observaciones-modal > .trazabilidad-assign-modal-backdrop {
  position: absolute;
  inset: 0;
}

#observaciones-modal .trazabilidad-assign-modal-dialog.observaciones-modal-dialog {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  flex: 1 1 auto;
  align-self: stretch;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0;
  box-sizing: border-box;
}

#observaciones-modal .observaciones-modal-head {
  flex-wrap: wrap;
  flex-shrink: 0;
}

#observaciones-modal .observaciones-modal-head h2 {
  flex: 0 0 auto;
}

#observaciones-modal .observaciones-modal-head .trazabilidad-assign-modal-hint,
#observaciones-modal .observaciones-obra-meta {
  flex: 1 1 220px;
  max-width: none;
  text-align: left;
  padding: 2px 12px 0;
  font-size: 13px;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#observaciones-modal .observaciones-obra-clave {
  font-weight: 700;
  letter-spacing: 0.02em;
}

#observaciones-modal .observaciones-obra-nom {
  font-weight: 500;
  color: var(--muted);
}

#observaciones-modal .observaciones-close-btn,
#observaciones-modal #btn-observaciones-close.btn.small {
  flex: 0 0 auto;
  align-self: flex-start;
  width: auto !important;
  min-width: 0;
  margin: 0;
  white-space: nowrap;
}

#observaciones-modal .observaciones-toolbar {
  flex-shrink: 0;
}

#observaciones-modal .observaciones-status {
  flex-shrink: 0;
}

#observaciones-modal .observaciones-table-wrap {
  flex: 1 1 auto !important;
  min-height: 160px !important;
  max-height: none !important;
  height: auto !important;
  overflow: auto;
}

#observaciones-modal .trazabilidad-assign-modal-foot {
  flex-shrink: 0;
}

.observaciones-toolbar {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  padding: 0 16px 8px;
}

.observaciones-toolbar .btn.small.observaciones-toolbar-btn {
  width: auto;
  min-width: 44px;
  margin: 0;
  flex: 0 0 auto;
}

.observaciones-toolbar #btn-observaciones-edit {
  min-width: 88px;
}

.observaciones-toolbar-btn {
  min-width: 36px;
  font-weight: 700;
}

.observaciones-status {
  margin: 0 16px 8px;
  min-height: 1.2em;
  font-size: 13px;
  color: var(--muted);
}

.observaciones-status--err {
  color: #b42318;
}

.observaciones-status--ok {
  color: #067647;
}

.observaciones-table-wrap {
  flex: 1 1 auto;
  min-height: 180px;
  max-height: 52vh;
  margin: 0 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  overflow: auto;
}

.observaciones-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}

.observaciones-table col.obs-col-no {
  width: 52px;
}

.observaciones-table col.obs-col-desc {
  width: 42%;
}

.observaciones-table col.obs-col-fecha {
  width: 108px;
}

.observaciones-table col.obs-col-responsable {
  width: 17%;
}

.observaciones-table col.obs-col-firma {
  width: 132px;
}

.observaciones-table th,
.observaciones-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #dce3ed;
  text-align: left;
  vertical-align: middle;
  line-height: 1.35;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}

.observaciones-table th:not(:last-child),
.observaciones-table td:not(:last-child) {
  border-right: 1px solid #e8edf4;
}

.observaciones-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #e8eef6;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.02em;
  color: #1e293b;
  box-shadow: inset 0 -1px 0 #dce3ed;
}

.observaciones-table .obs-th-no,
.observaciones-table td:nth-child(1) {
  padding-left: 14px;
  padding-right: 10px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.observaciones-table .obs-th-desc,
.observaciones-table td:nth-child(2) {
  padding-left: 16px;
  padding-right: 16px;
}

.observaciones-table .obs-th-fecha,
.observaciones-table td:nth-child(3) {
  padding-left: 14px;
  padding-right: 14px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.observaciones-table .obs-th-responsable,
.observaciones-table td:nth-child(4) {
  padding-left: 16px;
  padding-right: 16px;
}

.observaciones-table .obs-th-firma,
.observaciones-table td:nth-child(5) {
  padding-left: 12px;
  padding-right: 14px;
  text-align: center;
}

.observaciones-table tbody tr {
  cursor: pointer;
}

.observaciones-table tbody tr:nth-child(odd):not(.observaciones-empty-row) {
  background: #f3f5f8;
}

.observaciones-table tbody tr:nth-child(even):not(.observaciones-empty-row) {
  background: #fff;
}

.observaciones-table tbody tr.is-selected {
  background: rgba(255, 179, 0, 0.28) !important;
}

.observaciones-table tbody tr:hover:not(.observaciones-empty-row) {
  background: rgba(255, 179, 0, 0.14) !important;
}

.observaciones-empty-row td {
  text-align: center;
  color: var(--muted);
  font-style: italic;
  cursor: default;
  padding: 18px 16px;
  background: #fff !important;
}

.observaciones-pw-dialog {
  width: min(420px, calc(100vw - 24px));
}

.observaciones-edit-dialog {
  width: min(920px, calc(100vw - 24px));
}

#observaciones-pw-modal.trazabilidad-assign-modal {
  align-items: center;
  justify-content: center;
  padding: 24px 12px;
}

#observaciones-pw-modal .trazabilidad-assign-modal-dialog.observaciones-pw-dialog {
  width: min(420px, calc(100vw - 24px));
  height: auto !important;
  max-height: min(88vh, 520px);
  flex: 0 0 auto;
  align-self: center;
  margin: 0 auto;
}

.observaciones-edit-dialog {
  height: auto;
  max-height: min(88vh, 520px);
  align-self: center;
  margin: auto;
}

.observaciones-pw-body,
.observaciones-edit-body {
  padding: 0 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.observaciones-edit-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
}

.observaciones-edit-field textarea,
.observaciones-edit-field input {
  font-weight: 400;
  width: 100%;
  box-sizing: border-box;
}

.observaciones-edit-meta-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-end;
  gap: 10px;
  width: 100%;
}

.observaciones-edit-field--date {
  flex: 0 0 152px;
  min-width: 152px;
}

.observaciones-edit-field--responsable {
  flex: 1 1 30%;
  min-width: 0;
}

.observaciones-edit-field--firma {
  flex: 1 1 42%;
  min-width: 0;
}

.observaciones-edit-field--firma .observaciones-firma-bar {
  width: 100%;
}

.observaciones-edit-body .observaciones-firma-preview {
  margin-top: 0;
}

.observaciones-pw-body label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 600;
}

.observaciones-pw-body input {
  width: 100%;
}

.observaciones-pw-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px;
  padding-top: 4px;
}

.observaciones-pw-actions .btn {
  min-width: 120px;
  margin: 0;
}

#observaciones-modal .trazabilidad-assign-modal-foot,
#observaciones-edit-modal .trazabilidad-assign-modal-foot {
  padding: 12px 16px 16px;
}

#observaciones-pw-modal,
#observaciones-edit-modal {
  z-index: 21100;
}

#observaciones-signature-modal {
  z-index: 21150;
}

.observaciones-firma-bar {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 8px;
}

.observaciones-firma-bar .budget-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}

#observaciones-edit-modal .observaciones-firma-bar {
  width: 100%;
}

#app .btn.btn-observaciones-firma-digital,
.observaciones-firma-bar .btn.btn-observaciones-firma-digital {
  flex: 0 0 auto;
  width: auto !important;
  min-width: 132px;
  margin: 0;
  padding: 8px 10px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1.1;
  color: #0a1f00 !important;
  border: 1.5px solid #39ff14 !important;
  border-radius: 8px;
  white-space: nowrap;
  background: linear-gradient(180deg, #ccff00 0%, #39ff14 45%, #00e676 100%) !important;
  box-shadow:
    0 0 8px rgba(57, 255, 20, 0.85),
    0 0 16px rgba(57, 255, 20, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
  cursor: pointer;
}

#app .btn.btn-observaciones-firma-digital:hover,
.observaciones-firma-bar .btn.btn-observaciones-firma-digital:hover {
  filter: brightness(1.05);
  background: linear-gradient(180deg, #d4ff33 0%, #4dff28 45%, #00f080 100%) !important;
  border-color: #39ff14 !important;
  color: #0a1f00 !important;
}

.observaciones-edit-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 4px 16px 18px;
}

.observaciones-edit-actions .btn {
  width: auto !important;
  min-width: 120px;
  margin: 0;
}

#observaciones-edit-modal.trazabilidad-assign-modal {
  align-items: center;
  justify-content: center;
  padding: 24px 12px;
}

#observaciones-edit-modal .trazabilidad-assign-modal-dialog.observaciones-edit-dialog {
  width: min(920px, calc(100vw - 24px));
  height: auto !important;
  max-height: min(88vh, 720px);
  flex: 0 0 auto;
  align-self: center;
  margin: 0 auto;
}

.observaciones-firma-preview {
  margin-top: 8px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  min-height: 56px;
}

.observaciones-firma-preview img {
  display: block;
  max-width: 100%;
  max-height: 80px;
  object-fit: contain;
}

.observaciones-signature-dialog {
  width: min(720px, calc(100vw - 24px));
}

.observaciones-signature-canvas-wrap {
  position: relative;
  margin: 0 16px 12px;
  border: 2px dashed #94a3b8;
  border-radius: 10px;
  background: #fff;
  min-height: 220px;
  height: min(42vh, 320px);
  touch-action: none;
  overflow: hidden;
}

#observaciones-signature-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  cursor: crosshair;
  touch-action: none;
}

.observaciones-signature-foot {
  justify-content: flex-end;
  gap: 8px;
}

.observaciones-table-signature-thumb {
  display: block;
  max-width: 100%;
  max-height: 44px;
  margin: 0 auto;
  object-fit: contain;
  background: #fff;
  border-radius: 4px;
}

.app-screen-title-bar .visor-screen-title {
  font-size: 1.15rem;
  margin-top: 2px;
  margin-bottom: 0;
}

.app-screen-title-bar .toolbar-projet-ref {
  display: block;
  width: 100%;
  margin: 8px 0 0;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.15px;
  line-height: 1.3;
}

body.simulation-active #app > .app-screen-title-bar {
  display: none !important;
}

.modal-screen-title-bar {
  flex-shrink: 0;
  padding: 16px 14px 12px;
  border-bottom: 1px solid var(--border);
  text-align: center;
  background: var(--panel);
}

/* Misma línea visual que la barra «BIMTRAZA» + ref proyecto. */
.modal-screen-title-bar--visor-catalog {
  padding-top: max(20px, calc(12px + env(safe-area-inset-top, 0px)));
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #f6f8fc 0%, #e8eef6 100%);
}

.modal-screen-title-bar--visor-catalog .modal-catalog-main-title {
  margin: 0;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  text-align: center;
  color: var(--text);
}

.modal-screen-title-bar--visor-catalog .modal-catalog-projet-ref {
  margin-top: 8px;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: var(--muted);
  letter-spacing: 0.15px;
  line-height: 1.3;
}

.modal-screen-title-bar .budget-sheet-projet-ref {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  text-align: center;
}

#app > .toolbar {
  flex-shrink: 0;
  position: relative;
  z-index: 200;
  pointer-events: auto !important;
}

.toolbar-top-actions,
.toolbar-top-actions .btn {
  position: relative;
  z-index: 201;
  pointer-events: auto !important;
  cursor: pointer;
}

.app-body {
  display: flex;
  flex-direction: row;
  flex: 1;
  min-height: 0;
  align-items: stretch;
  --panel-general-width: 360px;
}

.app-body > .panel-general {
  flex: 0 0 var(--panel-general-width);
  width: var(--panel-general-width);
  max-width: var(--panel-general-width);
  min-width: 260px;
  min-height: 0;
  border-right: none;
  display: flex;
  flex-direction: column;
}

.panel-resizer {
  flex: 0 0 6px;
  width: 6px;
  min-width: 6px;
  margin: 0 -3px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: col-resize;
  touch-action: none;
  position: relative;
  z-index: 3;
  align-self: stretch;
}

.panel-resizer::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  background: var(--border);
  border-radius: 1px;
  transition: background 0.15s ease, width 0.15s ease;
}

.panel-resizer:hover::after,
.panel-resizer:focus-visible::after,
body.is-panel-resizing .panel-resizer::after {
  width: 3px;
  background: #4a7fc4;
}

body.is-panel-resizing {
  cursor: col-resize;
  user-select: none;
}

body.is-panel-resizing .panel-resizer,
body.is-panel-resizing .app-body > .panel-general,
body.is-panel-resizing .app-body > .viewport-wrap {
  pointer-events: none;
}

body.is-panel-resizing .panel-resizer {
  pointer-events: auto;
}

.panel-general-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-shrink: 0;
  margin-bottom: 8px;
}

.panel-general-heading h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}

.panel-general-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: min(70vh, 680px);
  transition: max-height 0.28s ease, opacity 0.22s ease, padding 0.2s ease;
}

.panel-general.is-general-collapsed .panel-general-body {
  max-height: 0 !important;
  min-height: 0 !important;
  flex: 0 0 0;
  opacity: 0;
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  overflow: hidden;
  pointer-events: none;
}

.panel-general.is-general-collapsed .panel-general-heading {
  margin-bottom: 0;
}

.panel-general-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
  margin-bottom: 6px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

.panel-general-actions .btn.small {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  margin: 0;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.panel-general-actions .btn-general-guardar-capas {
  flex: 1 1 100%;
  font-weight: 700;
  background: linear-gradient(180deg, #bfdbfe 0%, #3b82f6 45%, #2563eb 100%);
  color: #fff;
  border: 1.5px solid #1d4ed8;
}

.panel-general-actions .btn-general-guardar-capas:hover {
  background: linear-gradient(180deg, #dbeafe 0%, #2563eb 45%, #1d4ed8 100%);
  color: #fff;
  border-color: #1e40af;
}

.panel-general-actions .btn-general-guardar-capas,
.panel-general-actions .btn-general-guardar-capas.hidden,
.panel-general-actions .btn-general-compartir-enlace,
.panel-general-actions .btn-general-compartir-enlace.hidden {
  display: none !important;
}

.panel-general-actions .btn-general-activar-seleccion {
  flex: 1 1 100%;
  font-weight: 700;
  background: linear-gradient(180deg, #bbf7d0 0%, #22c55e 45%, #16a34a 100%);
  color: #fff;
  border: 1.5px solid #16a34a;
}

.panel-general-actions .btn-general-activar-seleccion.is-active {
  background: linear-gradient(180deg, #ff69b4 0%, #ff1493 45%, #ff007f 100%);
  color: #fff;
  border: 1.5px solid #ff1493;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
  box-shadow:
    0 0 8px rgba(255, 20, 147, 0.95),
    0 0 18px rgba(255, 20, 147, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.panel-general-actions .btn-general-activar-seleccion.is-active:hover {
  background: linear-gradient(180deg, #ff85c1 0%, #ff1493 50%, #e6007a 100%);
  border-color: #ff69b4;
  color: #fff;
}

.panel-general-actions .general-select-by-wrap {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  display: flex;
  align-items: stretch;
  margin: 0;
}

.panel-general-actions .btn-general-select-by {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  margin: 0;
  box-sizing: border-box;
  /* même gabarit que « Tout sélectionner » (.btn.small du panneau) */
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  border-radius: 999px;
  border: 1px solid var(--btn-default-border);
  background: var(--btn-default);
  color: var(--text);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.panel-general-actions .btn-general-select-by:hover {
  background: var(--btn-default-hover);
  border-color: var(--accent);
  color: var(--text);
}

.panel-general-actions .btn-general-select-by.is-open,
.panel-general-actions .btn-general-select-by[aria-expanded="true"] {
  background: linear-gradient(180deg, #cbd5e1 0%, #64748b 100%);
  color: #fff;
  border-color: #475569;
}

.panel-general-actions .btn-general-select-by.is-open:hover,
.panel-general-actions .btn-general-select-by[aria-expanded="true"]:hover {
  background: linear-gradient(180deg, #94a3b8 0%, #475569 100%);
  color: #fff;
  border-color: #334155;
}

.general-select-by-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 40;
  max-height: min(280px, 42vh);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #64748b;
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.28);
}

.general-select-by-panel.hidden {
  display: none !important;
}

.general-select-by-panel-head {
  flex-shrink: 0;
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #334155;
  background: #f1f5f9;
  border-bottom: 1px solid #cbd5e1;
}

.general-select-by-list {
  overflow-y: auto;
  max-height: min(240px, 36vh);
  padding: 4px 0;
}

.general-select-by-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  background: transparent;
  color: #0f172a;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
}

.general-select-by-item:hover,
.general-select-by-item:focus-visible {
  background: #e0f2fe;
  outline: none;
}

.general-select-by-item-count {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 700;
  color: #475569;
  background: #e2e8f0;
  border-radius: 999px;
  padding: 2px 7px;
}

.general-select-by-empty {
  margin: 0;
  padding: 12px 10px;
  font-size: 12px;
  color: #64748b;
}

.general-select-by-empty.hidden {
  display: none !important;
}

.panel-general-actions .btn-general-compartir-enlace {
  flex: 1 1 100%;
  font-weight: 700;
  background: linear-gradient(180deg, #bae6fd 0%, #38bdf8 100%);
  color: #0c4a6e;
  border: 1px solid rgba(14, 165, 233, 0.45);
}

.panel-general-actions .btn-general-compartir-enlace:hover {
  background: linear-gradient(180deg, #7dd3fc 0%, #0ea5e9 100%);
}

.viewer-share-modal-dialog {
  max-width: min(560px, 96vw);
}

.viewer-share-modal-note {
  margin: 0 0 10px;
  font-size: 12px;
  color: var(--muted);
}

.viewer-share-links {
  margin: 0;
  padding: 0;
  list-style: none;
}

.viewer-share-links li {
  margin: 0 0 8px;
}

.viewer-share-links a,
.viewer-share-link-btn {
  display: block;
  width: 100%;
  padding: 8px 10px;
  font-size: 12px;
  word-break: break-all;
  text-align: left;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #f8fafc;
  color: #0369a1;
  text-decoration: none;
  cursor: pointer;
}

.viewer-share-links a:hover,
.viewer-share-link-btn:hover {
  background: #e0f2fe;
}

.viewer-share-modal-foot {
  flex-wrap: wrap;
  gap: 8px;
}

.viewer-share-modal-footnote {
  margin: 12px 0 0;
  font-size: 11px;
  color: var(--muted);
}

.viewer-share-modal-footnote code {
  font-size: 10px;
}

.general-props {
  display: none !important;
}

.general-props:empty {
  display: none;
}

.general-hint,
.general-empty {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.general-row {
  margin-bottom: 10px;
}

.general-row .g-label {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  margin-bottom: 2px;
}

.general-row .g-val {
  display: block;
  word-break: break-word;
  color: var(--text);
}

.app-body > .viewport-wrap {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}

.toolbar {
  position: relative;
  z-index: 50;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 8px 14px 12px;
  padding-top: calc(8px + env(safe-area-inset-top, 0px));
  padding-left: max(14px, calc(env(safe-area-inset-left, 0px) + 10px));
  padding-right: max(14px, calc(env(safe-area-inset-right, 0px) + 10px));
  background: linear-gradient(180deg, #f7f9fc 0%, #eef3f9 100%);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

.toolbar-leading {
  order: 3;
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.toolbar-projet-ref {
  font-size: 16px;
  font-weight: 600;
  color: #334155;
  letter-spacing: 0.2px;
  line-height: 1.25;
}

.btn-toolbar-plain {
  padding: 6px 12px;
  font-size: 12px;
  width: auto;
  margin: 0;
  border-radius: 999px;
  background: var(--btn-default);
  color: var(--text);
  border: 1px solid var(--btn-default-border);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.btn-toolbar-plain:hover {
  border-color: var(--accent);
  color: var(--text);
  background: var(--btn-default-hover);
}

/* Debe ir tras .btn o usar .btn.btn-cut: .btn aplicaba turquesa y tapaba .btn-cut */
.btn.btn-cad-nuevo {
  background: #0d9488;
  color: #f0fdfa;
  border: 1px solid #0f766e;
  text-shadow: none;
  font-weight: 700;
}

.btn.btn-cad-nuevo:hover {
  background: #14b8a6;
  border-color: #0d9488;
  color: #ffffff;
}

.btn.btn-cad-file {
  background: #0f766e;
  color: #ecfdf5;
  border: 1px solid #115e59;
  text-shadow: none;
  font-weight: 700;
}

.btn.btn-cad-file:hover {
  background: #14b8a6;
  border-color: #0d9488;
  color: #ffffff;
}

.btn.btn-cut {
  background: var(--btn-geo);
  color: var(--text);
  border: 1px solid var(--btn-geo-border);
  text-shadow: none;
}

.btn.btn-cut:hover {
  background: var(--btn-geo-hover);
  border-color: var(--accent);
  color: var(--text);
}

.btn.btn-measure {
  background: var(--btn-measure);
  color: var(--text);
  border: 1px solid var(--btn-measure-border);
  text-shadow: none;
}

.btn.btn-measure:hover {
  background: var(--btn-measure-hover);
  border-color: var(--accent);
  color: var(--text);
}

.toolbar-check {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}

.toolbar-check input {
  accent-color: var(--accent);
  cursor: pointer;
}

.measure-panel {
  /* même ancrage droit que coupe ; un peu plus haut si les deux sont ouverts */
  top: calc(88px + env(safe-area-inset-top, 0px));
}

#cut-panel.cut-panel,
#measure-panel.cut-panel {
  position: fixed !important;
  z-index: 12020 !important;
  top: calc(96px + env(safe-area-inset-top, 0px));
  left: auto !important;
  right: max(16px, env(safe-area-inset-right, 0px)) !important;
  width: min(360px, calc(100vw - 32px)) !important;
  max-width: min(360px, calc(100vw - 32px)) !important;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

#cut-panel.cut-panel.hidden,
#measure-panel.cut-panel.hidden {
  display: none !important;
}

#cut-panel .cut-panel-inner,
#measure-panel .cut-panel-inner {
  pointer-events: auto;
  background: #ffffff !important;
  border: 1px solid #64748b;
  border-radius: 12px;
  padding: 14px 16px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.35);
  font-size: 12px;
  line-height: 1.4;
  color: #0f172a;
  max-height: min(78vh, 640px);
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  opacity: 1 !important;
}

#cut-panel .cut-panel-inner .hint,
#cut-panel .cut-panel-inner .cut-hint,
#cut-panel .cut-panel-inner .cut-subhint,
#measure-panel .cut-panel-inner .hint,
#measure-panel .cut-panel-inner .cut-hint {
  color: #334155;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.cut-panel {
  position: fixed;
  z-index: 12020;
  top: calc(96px + env(safe-area-inset-top, 0px));
  left: auto;
  right: max(16px, env(safe-area-inset-right, 0px));
  width: min(360px, calc(100vw - 32px));
  max-width: min(360px, calc(100vw - 32px));
  box-sizing: border-box;
}

.cut-panel.hidden {
  display: none !important;
}

.cut-panel-inner {
  background: #ffffff;
  border: 1px solid #64748b;
  border-radius: 12px;
  padding: 14px 16px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.35);
  font-size: 12px;
  line-height: 1.4;
  color: #0f172a;
  max-height: min(78vh, 640px);
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
}

.cut-panel-inner .hint,
.cut-panel-inner .cut-hint,
.cut-panel-inner .cut-subhint {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.cut-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.cut-panel-head strong {
  font-size: 14px;
}

.cut-panel-x {
  width: 32px;
  height: 32px;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: var(--bg);
  color: var(--muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.cut-panel-x:hover {
  color: var(--text);
  background: var(--border);
}

.cut-hint {
  margin: 0 0 10px;
}

.cut-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}

.cut-row .btn.small {
  flex: 1;
  min-width: 72px;
  margin: 0;
}

.cut-pick-btn {
  width: 100%;
  margin-bottom: 6px;
}

.cut-status {
  min-height: 1.2em;
  margin: 0 0 8px;
  color: var(--accent);
}

.cut-slide {
  display: block;
  font-size: 11px;
  margin-bottom: 8px;
}

.cut-slide input[type="range"] {
  width: 100%;
  margin-top: 4px;
}

.cut-slide-normal-wrap .cut-slide-normal-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-top: 4px;
  box-sizing: border-box;
}

.cut-slide-normal-wrap .cut-slide-normal-row input[type="range"] {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  margin-top: 0;
}

.cut-plane-slide-m {
  width: 4.75rem;
  flex: 0 0 auto;
  padding: 4px 6px;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  font-size: 12px;
  text-align: right;
  box-sizing: border-box;
}

.cut-plane-slide-unit {
  flex: 0 0 auto;
  font-size: 11px;
  color: var(--muted);
  min-width: 1.25em;
}

.viewer-cut-float-stack {
  position: absolute;
  top: max(8px, env(safe-area-inset-top, 0px));
  right: max(8px, env(safe-area-inset-right, 0px));
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  max-width: min(280px, 92vw);
  pointer-events: none;
}

.viewer-cut-float-stack #cut-remove-float {
  pointer-events: auto;
}

.viewer-cut-active-toast {
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  text-align: right;
  color: #e0f4ff;
  background: rgba(15, 23, 42, 0.88);
  border: 1px solid rgba(56, 189, 250, 0.55);
  border-radius: 8px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.viewer-cut-active-toast.hidden {
  display: none;
}

#cut-remove-float.btn.hidden {
  display: none;
}

.cut-subhint {
  margin: 0 0 6px;
  font-size: 11px;
}

.cut-offset-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 10px;
}

.cut-mini {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  width: 100%;
}

.cut-mini input[type="range"] {
  flex: 1;
  min-width: 0;
}

.cut-panel .check {
  margin-bottom: 6px;
}

.cut-actions {
  margin-bottom: 0;
  margin-top: 4px;
}

.toolbar-group {
  order: 2;
  flex: 1 1 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  margin-left: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.toolbar-top-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 6px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding-bottom: 4px;
  margin-bottom: 2px;
  border-bottom: 1px solid rgba(42, 51, 68, 0.85);
  box-sizing: border-box;
}

/* Los botones pasan a ser hijos flex directos de .toolbar-top-actions (mismo ancho, fila completa). */
.toolbar-top-actions-middle,
.toolbar-top-actions-trail,
.toolbar-top-actions-near {
  display: contents;
}

.toolbar-top-actions .btn {
  flex: 1 1 0;
  min-width: 0;
  min-height: var(--header-action-btn-min-h);
  font-size: var(--header-action-btn-font);
  text-transform: uppercase;
  box-sizing: border-box;
  justify-content: center;
  text-align: center;
  padding-left: 4px;
  padding-right: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.toolbar-group-main {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(4px, 1vw, 10px);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-self: stretch;
  box-sizing: border-box;
}

.toolbar-group-main > .label {
  flex: 0 0 auto;
  white-space: nowrap;
}

.toolbar-group-main > select {
  flex: 0 0 auto;
  field-sizing: fixed;
  box-sizing: border-box;
}

/* Ancho fijo: no cambia al elegir otra opción. */
#view-mode {
  width: 168px;
  min-width: 168px;
  max-width: 168px;
}

#camera-mode {
  width: 148px;
  min-width: 148px;
  max-width: 148px;
}

#view-preset {
  width: 248px;
  min-width: 248px;
  max-width: 248px;
}

#view-background {
  width: 118px;
  min-width: 118px;
  max-width: 118px;
}

.toolbar-group-below-views {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px 12px;
  padding-top: 4px;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  align-self: stretch;
  box-sizing: border-box;
  overflow-x: auto;
}

.toolbar-floor-row,
.toolbar-scene-tools {
  display: contents;
}

.toolbar-group-below-views .toolbar-check {
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 12px;
}

.toolbar-rotate-group {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  white-space: nowrap;
}

.toolbar-rotate-speed {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 12px;
}

.toolbar-rotate-speed input[type="range"] {
  width: clamp(64px, 8vw, 100px);
  vertical-align: middle;
}

.toolbar-pointcloud-size {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 12px;
}

.toolbar-pointcloud-size input[type="range"] {
  width: clamp(72px, 10vw, 120px);
  vertical-align: middle;
}

.toolbar-viewport-end-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  white-space: nowrap;
  margin-left: 0;
}

.btn-viewport-video-record-mini {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding: 6px 12px;
  line-height: 1.25;
  border-radius: 999px;
  border: 1px solid #7dd3fc;
  background: #e0f2fe;
  color: var(--btn-on-cta, #0f172a);
  cursor: pointer;
  white-space: nowrap;
}

.btn-viewport-video-record-mini:hover {
  background: var(--surface-hover, #e8eef6);
}

.btn-pointcloud-ia-mini {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding: 6px 12px;
  line-height: 1.25;
  border-radius: 999px;
  border: 1px solid #a78bfa;
  background: #ede9fe;
  color: var(--btn-on-cta, #0f172a);
  cursor: pointer;
  white-space: nowrap;
}

.btn-pointcloud-ia-mini:hover {
  background: linear-gradient(180deg, #ebe0ff 0%, #ddd0f5 100%);
}

.pointcloud-ia-dialog {
  width: min(540px, calc(100vw - 24px));
}

/* Enregistrement vidéo / nuage IA : boîte centrée (pas plein écran) */
#viewport-video-record-modal.trazabilidad-assign-modal,
#pointcloud-ia-modal.trazabilidad-assign-modal {
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  z-index: 12500;
}

#viewport-video-record-modal .trazabilidad-assign-modal-dialog,
#pointcloud-ia-modal .trazabilidad-assign-modal-dialog {
  width: min(580px, calc(100vw - 32px));
  height: auto !important;
  max-height: min(88vh, 720px);
  flex: 0 0 auto;
  align-self: center;
  margin: 0 auto;
  overflow: hidden;
}

#viewport-video-record-modal .trazabilidad-assign-modal-head,
#pointcloud-ia-modal .trazabilidad-assign-modal-head {
  padding: 16px 18px 12px;
}

#viewport-video-record-modal .trazabilidad-assign-modal-hint,
#pointcloud-ia-modal .trazabilidad-assign-modal-hint {
  max-width: none;
  line-height: 1.4;
}

.viewport-video-record-dialog {
  width: min(580px, calc(100vw - 32px));
}

.viewport-video-record-body {
  padding: 14px 18px 10px;
  max-height: min(58vh, 520px);
  flex: 0 1 auto;
  overflow: auto;
}

.viewport-video-record-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}

.viewport-video-record-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 13px;
  min-width: 0;
}

.viewport-video-record-field--wide,
.viewport-video-record-field--full {
  grid-column: 1 / -1;
}

.viewport-video-record-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}

.viewport-video-record-field input,
.viewport-video-record-field select {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--border, #b9c9dc);
  background: #fff;
  color: var(--text, #0f172a);
  font-size: 14px;
  line-height: 1.35;
}

.viewport-video-record-field input:focus,
.viewport-video-record-field select:focus {
  outline: none;
  border-color: #3b82c4;
  box-shadow: 0 0 0 2px rgba(59, 130, 196, 0.22);
}

.viewport-video-record-check {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  line-height: 1.35;
  padding: 2px 0;
}

.viewport-video-record-check input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 2px;
}

.viewport-video-record-note {
  margin: 14px 0 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}

.viewport-video-record-preview {
  margin: 12px 0 0;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text, #1a2332);
  background: rgba(59, 130, 196, 0.08);
  border: 1px solid rgba(59, 130, 196, 0.18);
  border-radius: 8px;
  line-height: 1.4;
}

.viewport-video-record-progress {
  padding: 8px 0 4px;
}

.viewport-video-record-status {
  margin: 0 0 6px;
  font-size: 13px;
}

.viewport-video-record-progress-text {
  margin: 0 0 8px;
  font-size: 12px;
  color: var(--muted);
}

.viewport-video-record-progress-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(127, 127, 127, 0.25);
  overflow: hidden;
}

.viewport-video-record-progress-bar {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #2a7bdc, #1f9a55);
  transition: width 0.15s linear;
}

.viewport-video-record-foot {
  gap: 10px;
  padding: 12px 18px 16px;
}

.viewport-video-record-foot .btn {
  width: auto;
  min-width: 100px;
  margin: 0;
  white-space: nowrap;
}

#btn-viewport-video-start {
  min-width: 180px;
}

.toolbar-floor-dims {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 6px 14px;
  min-width: 0;
  flex: 0 0 auto;
  box-sizing: border-box;
}

.toolbar-floor-axis {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.toolbar-floor-dim {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 12px;
  color: var(--muted);
}

.toolbar-floor-dim-label {
  min-width: 1.15em;
  color: var(--text);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.toolbar-floor-sign {
  color: var(--text);
  font-weight: 700;
  min-width: 0.75em;
  text-align: center;
}

.toolbar-floor-dim input {
  width: 4.2rem;
  min-width: 3.6rem;
  max-width: 4.6rem;
  padding: 3px 4px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  font-size: 12px;
  text-align: center;
  box-sizing: border-box;
}

.toolbar-floor-dim input:focus {
  outline: 2px solid rgba(96, 165, 250, 0.55);
  outline-offset: 1px;
}

.status {
  order: 4;
  flex: 1 1 100%;
}

.toolbar .label {
  color: var(--muted);
  font-size: 12px;
}

.status {
  font-size: 13px;
  color: var(--muted);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  background: var(--btn-default);
  color: var(--text);
  border: 1px solid var(--btn-default-border);
  border-radius: 999px;
  font-size: 14px;
  cursor: pointer;
  font-weight: 600;
  text-shadow: none;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.btn:hover {
  background: var(--btn-default-hover);
  border-color: var(--accent);
}

/* Navegación: marino intermedio */
.btn.btn-back {
  background: var(--btn-nav-back);
  color: var(--text);
  border: 1px solid var(--btn-nav-back-border);
  font-weight: 600;
  text-shadow: none;
}

.btn.btn-back:hover {
  background: var(--btn-nav-back-hover);
  border-color: var(--accent);
  color: var(--text);
}

.btn.small {
  padding: 6px 10px;
  font-size: 12px;
  width: 100%;
  margin-bottom: 6px;
}

/* Píldora cielo: CREAR PROYECTO, GUARDAR, I)–IV), barra superior visor, simulación, etc. */
.btn.btn-header-pill,
.btn-header-pill.btn.small {
  width: auto;
  margin: 0;
  min-height: var(--header-action-btn-min-h);
  padding: 0 10px;
  font-family: var(--visor-font-ui);
  font-size: var(--header-action-btn-font);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  border-radius: 999px;
  background: var(--btn-cta-sky);
  color: var(--btn-on-cta);
  border: 1px solid var(--btn-cta-sky-border);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  text-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
}

.btn.btn-header-pill:hover:not(:disabled),
.btn-header-pill.btn.small:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  border-color: var(--accent);
  color: var(--btn-on-cta);
  filter: none;
}

.btn-header-pill-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  box-sizing: border-box;
}

.btn-header-pill-row > .btn-header-pill {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

select {
  background: var(--panel-elev);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 6px 12px;
}

.panel {
  background: var(--panel);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 12px;
}

.panel h2 {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 600;
}

.btn-ver-seleccion {
  display: none;
  flex-shrink: 0;
  padding: 5px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  cursor: pointer;
  touch-action: manipulation;
}

.panel-general:not(.is-general-collapsed) .btn-ver-seleccion {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-ver-seleccion:hover:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent);
}

.btn-ver-seleccion:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.btn-eliminar-seleccion {
  display: none;
  flex-shrink: 0;
  padding: 5px 10px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
  border-radius: 999px;
  border: 1px solid var(--btn-danger-border);
  background: var(--btn-danger);
  color: var(--text);
  cursor: pointer;
  touch-action: manipulation;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.panel-general:not(.is-general-collapsed) .btn-eliminar-seleccion {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-eliminar-seleccion:hover:not(:disabled) {
  background: var(--btn-danger-hover);
  border-color: var(--accent);
}

.btn-eliminar-seleccion:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: none;
}

.btn-agregar-similar {
  display: none;
  flex-shrink: 0;
  padding: 5px 8px;
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--accent);
  cursor: pointer;
  touch-action: manipulation;
}

.panel-general:not(.is-general-collapsed) .btn-agregar-similar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-agregar-similar:hover:not(:disabled) {
  border-color: var(--accent);
  color: #e8ecf4;
}

.btn-agregar-similar:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.tree-item-wrap {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin-left: calc(var(--depth, 0) * 10px);
}

.tree-item-wrap .tree-item {
  margin-left: 0;
  flex: 1;
  min-width: 0;
}

.tree-item-check {
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  margin-top: 2px;
  cursor: pointer;
  accent-color: var(--accent);
}

.ifc-structure-inline {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  gap: 10px;
  margin-top: 4px;
}

.ifc-structure-inline-status {
  padding: 6px 2px 4px;
}

.ifc-structure-inline-wrap {
  flex: 0 1 auto;
  min-height: 120px;
  max-height: min(28vh, 280px);
  margin-bottom: 2px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.22);
  padding: 4px 4px 6px;
  box-sizing: border-box;
}

.ifc-structure-inline-wrap.scroll {
  flex: 0 1 auto;
  min-height: 120px;
}

.ifc-element-info {
  flex: 1 1 auto;
  min-height: 140px;
  max-height: min(32vh, 320px);
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  box-sizing: border-box;
}

.ifc-element-info-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 3px;
  flex-shrink: 0;
}

.ifc-element-info-tab {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  padding: 5px 3px;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  color: #1e293b;
  background: #e8eef5;
  border: 1px solid #c5d3e3;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ifc-element-info-tab.is-active {
  color: #0f172a;
  background: #ffffff;
  border-bottom-color: #ffffff;
  box-shadow: 0 -1px 0 rgba(15, 23, 42, 0.06);
}

.ifc-element-info-panel {
  flex: 1 1 auto;
  min-height: 0;
  display: none;
  overflow: auto;
  border: 1px solid #c5d3e3;
  border-radius: 0 0 6px 6px;
  background: #ffffff;
}

.ifc-element-info-panel.is-active {
  display: block;
}

.ifc-info-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 10px;
  line-height: 1.3;
  color: #1e293b;
}

.ifc-info-table th,
.ifc-info-table td {
  padding: 4px 6px;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
  vertical-align: top;
}

.ifc-info-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  font-weight: 700;
  color: #f8fafc;
  background: linear-gradient(180deg, #4a6fa5 0%, #3d5f8f 100%);
  white-space: nowrap;
}

.ifc-info-table tbody tr:nth-child(even):not(.ifc-info-group-row) {
  background: #f8fafc;
}

.ifc-info-table tbody tr:hover:not(.ifc-info-group-row) {
  background: #eef6ff;
}

.ifc-info-group-row td {
  font-weight: 700;
  color: #0f172a;
  background: #edf2f7;
  border-bottom: 1px solid #cbd5e1;
}

.ifc-info-table--trazabilidad {
  min-width: 920px;
}

.ifc-info-table--trazabilidad-gamme {
  min-width: 1180px;
  border-collapse: collapse;
  table-layout: fixed;
}

.ifc-info-table--trazabilidad-gamme th,
.ifc-info-table--trazabilidad-gamme td {
  border: 1px solid #0f172a;
  font-size: 8px;
  line-height: 1.2;
  padding: 2px 3px;
  vertical-align: middle;
}

.ifc-info-table--trazabilidad-gamme thead th {
  background: #fff;
  color: #0f172a;
  font-weight: 700;
  text-align: center;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-num {
  width: 28px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-phase {
  width: 118px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-op {
  width: 150px;
  vertical-align: middle;
  text-align: center;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-doc {
  width: 168px;
  min-width: 168px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-ind {
  width: 36px;
  min-width: 36px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-comment {
  width: 88px;
  white-space: normal;
  font-size: 7px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-comment-sub {
  font-weight: 500;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-vert {
  width: 22px;
  padding: 4px 2px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-vert > span {
  display: inline-block;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  white-space: nowrap;
  font-size: 7px;
  letter-spacing: 0.02em;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-mod-log {
  width: 24px;
  min-width: 24px;
  max-width: 24px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-mod-log > span {
  font-size: 6px;
  line-height: 1.05;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-cell-mod-log {
  width: 24px;
  min-width: 24px;
  max-width: 24px;
  text-align: center;
  vertical-align: middle;
  padding: 2px 1px;
  position: relative;
  overflow: visible;
}

.ifc-traza-mod-log-wrap {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.ifc-traza-mod-log-btn {
  position: relative;
  background: #e2e8f0;
  color: #334155;
}

.ifc-traza-mod-log-btn:hover:not(:disabled) {
  background: #cbd5e1;
}

.ifc-traza-mod-log-count {
  position: absolute;
  top: -3px;
  right: -3px;
  min-width: 12px;
  height: 12px;
  padding: 0 2px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 8px;
  line-height: 12px;
  font-weight: 700;
}

.ifc-traza-mod-log-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 320;
  width: min(720px, 78vw);
  min-width: 520px;
  max-height: 360px;
  overflow: auto;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
  padding: 8px 10px 10px;
}

.ifc-traza-mod-log-menu.hidden {
  display: none;
}

.ifc-traza-mod-log-menu-title {
  font-size: 11px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 6px;
}

.ifc-traza-mod-log-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}

.ifc-traza-mod-log-toolbar .btn.small {
  width: auto;
  margin: 0;
  padding: 3px 10px;
  font-size: 11px;
  line-height: 1.2;
}

.ifc-traza-mod-log-btn-close {
  margin-left: auto;
  background: #f87171 !important;
  color: #000 !important;
  border-color: #ef4444 !important;
}

.ifc-traza-mod-log-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 10px;
}

.ifc-traza-mod-log-table th,
.ifc-traza-mod-log-table td {
  border: 1px solid #dbe3ee;
  padding: 3px 4px;
  vertical-align: middle;
}

.ifc-traza-mod-log-table th {
  background: #f8fafc;
  font-weight: 700;
  text-align: center;
  font-size: 9px;
}

.ifc-traza-mod-log-row {
  cursor: pointer;
}

.ifc-traza-mod-log-row.is-selected {
  background: rgba(20, 184, 166, 0.12);
  outline: 1px solid rgba(20, 184, 166, 0.45);
}

.ifc-traza-mod-log-input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid transparent;
  background: transparent;
  font-size: 10px;
  padding: 2px 3px;
  color: #0f172a;
}

.ifc-traza-mod-log-input--narrow {
  text-align: center;
}

.ifc-traza-mod-log-input:not([readonly]) {
  border-color: #cbd5e1;
  background: #fff;
}

.ifc-traza-mod-log-input[readonly] {
  cursor: default;
}

.ifc-traza-mod-log-empty {
  text-align: center;
  color: #64748b;
  font-size: 10px;
  padding: 10px 6px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-group {
  background: #f8fafc;
  padding: 2px 3px;
  vertical-align: middle;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  min-width: 0;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-label {
  display: block;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
  color: #334155;
  text-align: center;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  font-size: 8px;
  font-weight: 600;
  line-height: 1.2;
  padding: 1px 3px;
  border: 1px solid #cbd5e1;
  border-radius: 3px;
  background: #fff;
  color: #0f172a;
  text-align: center;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-input:focus {
  outline: 1px solid #38bdf8;
  border-color: #38bdf8;
  background: #f8fcff;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-sub {
  font-weight: 600;
  font-size: 7px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-cell-num {
  text-align: center;
  font-weight: 700;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-cell-op {
  white-space: normal;
  font-size: 7px;
  font-weight: 600;
  text-align: left;
}

.ifc-info-table--trazabilidad th,
.ifc-info-table--trazabilidad td {
  font-size: 9px;
  padding: 3px 4px;
  white-space: nowrap;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-readonly {
  background: #f8fafc;
  color: #0f172a;
  font-weight: 600;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  font-size: 8px;
  padding: 1px 2px;
  border: none;
  border-radius: 0;
  background: #fff;
  color: #0f172a;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input:focus {
  outline: 1px solid #4a6fa5;
  outline-offset: -1px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input--operacion {
  min-width: 140px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input--documento {
  min-width: 0;
}

.ifc-traza-doc-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  flex-wrap: nowrap;
  overflow: visible;
}

.ifc-traza-doc-wrap .ifc-traza-input--documento {
  flex: 1 1 auto;
  min-width: 0;
}

.ifc-traza-doc-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  font-size: 11px;
  line-height: 1.35;
  padding: 3px 4px;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
  cursor: pointer;
}

.ifc-traza-doc-name--empty {
  color: #94a3b8;
  font-style: italic;
  font-weight: 400;
}

.ifc-traza-doc-name--pdf {
  background: #fff7ed;
  border-color: #fdba74;
  color: #9a3412;
  font-weight: 700;
}

.ifc-traza-doc-name--iso {
  background: #f0fdf4;
  border-color: #86efac;
  color: #166534;
  font-weight: 600;
}

.ifc-traza-doc-name--word {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
  font-weight: 700;
}

.ifc-traza-doc-name--excel {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
  font-weight: 700;
}

.ifc-traza-doc-wrap--has-word .ifc-traza-doc-name {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
  font-weight: 700;
}

.ifc-traza-doc-wrap--has-excel .ifc-traza-doc-name {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
  font-weight: 700;
}

.ifc-traza-doc-btn--attach {
  background: #475569;
  color: #fff;
}

.ifc-traza-doc-wrap--has-attach .ifc-traza-doc-btn--attach {
  background: #16a34a;
  box-shadow: 0 0 0 2px #bbf7d0;
}

.ifc-traza-doc-wrap--loading .ifc-traza-doc-name {
  background: #fef9c3;
  border-color: #facc15;
  color: #854d0e;
  font-weight: 600;
}

.ifc-traza-doc-wrap--pdf-error .ifc-traza-doc-name {
  background: #fef2f2;
  border-color: #f87171;
  color: #b91c1c;
  font-weight: 600;
}

.ifc-traza-doc-wrap--has-pdf .ifc-traza-doc-name {
  background: #fff7ed;
  border-color: #fdba74;
  color: #9a3412;
  font-weight: 700;
}

.ifc-traza-doc-wrap--loading .ifc-traza-doc-btn--attach {
  animation: ifc-traza-pdf-pulse 0.9s ease-in-out infinite;
}

.ifc-traza-doc-wrap--has-pdf .ifc-traza-doc-btn--pdf {
  background: #16a34a;
  box-shadow: 0 0 0 2px #bbf7d0;
}

.ifc-traza-doc-wrap--has-iso .ifc-traza-doc-btn--iso {
  background: #16a34a;
  box-shadow: 0 0 0 2px #bbf7d0;
}

@keyframes ifc-traza-pdf-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.55;
  }
}

.ifc-traza-ind-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
}

.ifc-traza-ind-wrap .ifc-traza-input--indice {
  width: 100%;
  max-width: 36px;
  text-align: center;
  padding: 1px 2px;
}

.ifc-traza-doc-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  padding: 0;
  border: none;
  border-radius: 4px;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  font-weight: 700;
  flex-shrink: 0;
}

.ifc-traza-doc-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.ifc-traza-doc-wrap--has-iso .ifc-traza-doc-name {
  background: #f0fdf4;
  border-color: #86efac;
  color: #166534;
  font-weight: 600;
}

.ifc-traza-doc-btn--iso {
  background: #22c55e;
  color: #fff;
}

.ifc-traza-doc-btn--pdf {
  background: #f97316;
  color: #fff;
  font-size: 11px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-cell-doc {
  min-width: 168px;
  max-width: 168px;
  overflow: hidden;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-cell-ind {
  min-width: 36px;
  max-width: 36px;
  overflow: hidden;
  text-align: center;
}

#trazabilidad-assign-modal .ifc-traza-doc-btn {
  width: calc(22px * var(--traza-assign-scale));
  height: calc(22px * var(--traza-assign-scale));
  min-width: calc(22px * var(--traza-assign-scale));
  min-height: calc(22px * var(--traza-assign-scale));
  font-size: calc(12px * var(--traza-assign-scale));
  border-radius: calc(4px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-doc-btn--pdf {
  font-size: calc(11px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-doc-wrap {
  gap: calc(4px * var(--traza-assign-scale));
  min-width: 0;
  overflow: visible;
}

#trazabilidad-assign-modal .ifc-traza-doc-name {
  flex: 1 1 0;
  min-width: calc(72px * var(--traza-assign-scale));
  max-width: 100%;
  font-size: calc(11px * var(--traza-assign-scale));
  line-height: 1.35;
  padding: calc(3px * var(--traza-assign-scale)) calc(4px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-ind-wrap .ifc-traza-input--indice {
  max-width: calc(36px * var(--traza-assign-scale));
  font-size: calc(8px * var(--traza-assign-scale));
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input--commentaire {
  min-width: 72px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input--indice,
.ifc-info-table--trazabilidad-editable .ifc-traza-input--code {
  text-align: center;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  font-size: 7px;
  padding: 1px 2px;
  border: none;
  border-radius: 0;
  background: #fff;
  color: #0f172a;
  cursor: pointer;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-select--phase {
  min-width: 108px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-select--operacion {
  min-width: 140px;
  font-size: 7px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-date,
.ifc-info-table--trazabilidad-gamme .ifc-traza-cell-date {
  width: 62px;
  min-width: 62px;
  max-width: 62px;
  overflow: hidden;
  padding: 1px;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-th-nom,
.ifc-info-table--trazabilidad-gamme .ifc-traza-cell-nom {
  width: 54px;
  min-width: 54px;
  max-width: 54px;
  overflow: hidden;
  padding: 1px 2px;
}

.ifc-traza-date-field {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-cell-date .ifc-traza-input--date {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  padding: 0;
  cursor: pointer;
  text-align: left;
  font-size: 7px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-cell-date .ifc-traza-input--date::-webkit-calendar-picker-indicator {
  cursor: pointer;
  margin: 0;
  padding: 0;
  opacity: 0.95;
}

.ifc-info-table--trazabilidad-gamme .ifc-traza-cell-op {
  padding: 0;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-select:focus {
  outline: 1px solid #4a6fa5;
  outline-offset: -1px;
}

.ifc-info-table--trazabilidad-editable .ifc-traza-input--nom {
  min-width: 48px;
}

.ifc-info-table--trazabilidad-editable td {
  padding: 1px 2px;
  vertical-align: middle;
}

.ifc-info-empty-cell {
  text-align: center;
  color: #64748b;
  font-style: italic;
  padding: 12px 8px !important;
}

.ifc-info-empty {
  margin: 0;
  padding: 18px 8px;
  text-align: center;
  color: #64748b;
  font-size: 11px;
}

.ifc-info-hint {
  margin: 0 0 6px;
  padding: 4px 6px;
  font-size: 10px;
  color: #475569;
  background: #f1f5f9;
  border-radius: 4px;
}

.ifc-elements-table--inline {
  font-size: 10px;
}

.layer-block {
  flex: 0 1 auto;
  max-height: min(20vh, 170px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--border);
  padding-top: 8px;
  margin-top: 2px;
}

.layer-block-title {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}

.layer-list-status {
  margin: 0 0 6px;
  font-size: 10px;
  color: var(--muted);
  line-height: 1.35;
  flex-shrink: 0;
}

.layer-list {
  font-size: 11px;
  line-height: 1.45;
  flex: 1 1 auto;
  min-height: 40px;
  overflow: auto;
  padding-right: 2px;
}

.layer-row {
  padding: 5px 7px;
  margin-bottom: 4px;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid var(--border);
}

.layer-row-name {
  font-weight: 600;
  color: var(--text);
  word-break: break-word;
}

.layer-row-meta {
  font-size: 10px;
  color: var(--muted);
  margin-top: 3px;
}

.layer-row--selected {
  border-color: #38bdf8;
  background: rgba(56, 189, 248, 0.14);
  box-shadow: inset 0 0 0 1px rgba(56, 189, 248, 0.35);
}

.layer-row--clickable {
  cursor: pointer;
}

.layer-row--clickable:hover {
  border-color: #7dd3fc;
  background: rgba(56, 189, 248, 0.1);
}

.ifc-layers-status,
.ifc-layers-sel-hint {
  margin: 0 0 6px;
  font-size: 10px;
  line-height: 1.35;
  color: var(--muted);
}

.ifc-layers-sel-hint {
  color: #0369a1;
  font-weight: 600;
}

.ifc-layers-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}

.ifc-layers-list .layer-row-name {
  font-size: 0.7em;
  font-weight: 600;
  line-height: 1.2;
}

.ifc-layers-list .layer-row-meta {
  font-size: 0.833em;
}

.panel h3 {
  margin: 12px 0 8px;
  font-size: 13px;
  color: var(--muted);
}

.viewport-wrap {
  position: relative;
  z-index: 0;
  min-height: 200px;
  min-height: clamp(220px, 42vh, 800px);
  overflow: hidden;
}

#c {
  display: block;
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  min-height: 240px;
  touch-action: none;
  background: var(--bg);
  /* Evita que el buffer WebGL se estire si el CSS y setSize se desincronizan */
  object-fit: fill;
}

#c.has-cad-crosshair {
  cursor: none !important;
}

/* Traits CAD en SVG (écran) — 1 px constant quel que soit le zoom */
.viewer-cad-stroke-overlay {
  position: absolute;
  inset: 0;
  z-index: 7;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden;
}

.viewer-cad-stroke-overlay path {
  vector-effect: non-scaling-stroke;
}

.viewer-cad-stroke-overlay.is-hidden {
  display: none !important;
}

/* Puntero CAD (AutoCAD): 2D cruz blanca · 3D ejes RGB + pickbox magenta.
   bottom lo fija JS según altura de barra COMMANDE + OSNAP (límite inferior). */
.viewer-cad-crosshair {
  --cx: 50%;
  --cy: 50%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 56px;
  z-index: 8;
  pointer-events: none;
  overflow: hidden;
}

.viewer-cad-crosshair.is-hidden {
  display: none !important;
}

.viewer-cad-crosshair-2d {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.viewer-cad-crosshair.is-3d .viewer-cad-crosshair-2d {
  display: none;
}

.viewer-cad-crosshair-3d {
  display: none;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden;
}

.viewer-cad-crosshair.is-3d .viewer-cad-crosshair-3d {
  display: block;
}

.viewer-cad-crosshair-h,
.viewer-cad-crosshair-v {
  position: absolute;
  background: #e2e8f0;
  box-shadow: none;
}

.viewer-cad-crosshair-h {
  left: 0;
  right: 0;
  top: var(--cy);
  height: 1px;
  transform: translateY(-0.5px);
  box-shadow: 0 0.5px 0 rgba(15, 23, 42, 0.45);
}

.viewer-cad-crosshair-v {
  top: 0;
  bottom: 0;
  left: var(--cx);
  width: 1px;
  transform: translateX(-0.5px);
  box-shadow: 0.5px 0 0 rgba(15, 23, 42, 0.45);
}

.viewer-cad-crosshair-box--2d {
  position: absolute;
  left: var(--cx);
  top: var(--cy);
  width: 8px;
  height: 8px;
  box-sizing: border-box;
  border: 1px solid #e2e8f0;
  box-shadow: 0 0 0 0.5px rgba(15, 23, 42, 0.45);
  transform: translate(-50%, -50%);
  background: transparent;
  margin: 0;
}

.viewer-cad-axis {
  vector-effect: non-scaling-stroke;
  stroke-width: 1;
}

.viewer-cad-crosshair-box--3d {
  vector-effect: non-scaling-stroke;
  stroke-width: 1;
}

#app.walkthrough-active .viewer-cad-crosshair {
  display: none !important;
}

.loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 21, 37, 0.88);
  font-size: 16px;
}

.loading.hidden {
  display: none;
}

/* Barre OSNAP (bas du viewport) — type AutoCAD */
.viewer-osnap-bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 55;
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 3px 8px 3px 10px;
  box-sizing: border-box;
  background: linear-gradient(180deg, #f8fafc, #e2e8f0);
  border-top: 2px solid #dc2626;
  box-shadow: 0 -1px 0 rgba(15, 23, 42, 0.06);
  pointer-events: auto;
  user-select: none;
  /* visible: el menú OSNAP se abre hacia arriba (overflow-x:auto lo recortaba). */
  overflow: visible;
  flex-wrap: nowrap;
}

.viewer-coords-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #1e3a5f;
  background: #fff;
  border: 1.5px solid #2563eb;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-coords-btn:hover {
  background: #eff6ff;
}

.viewer-coords-btn.is-on {
  color: #fff;
  background: #2563eb;
  border-color: #1d4ed8;
}

.viewer-coords-btn.is-on:hover {
  background: #1d4ed8;
}

.viewer-cad-workspace-btn {
  appearance: none;
  margin: 0;
  padding: 2px 8px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  color: #334155;
  background: #fff;
  border: 1.5px solid #64748b;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
}

.viewer-cad-workspace-btn:hover {
  background: #f8fafc;
}

.viewer-cad-workspace-btn.is-on,
.viewer-cad-workspace-btn[aria-expanded="true"] {
  color: #fff;
  background: #475569;
  border-color: #334155;
}

.viewer-cad-workspace-menu {
  position: absolute;
  left: 8px;
  bottom: calc(100% + 4px);
  z-index: 8;
  min-width: 200px;
  max-width: min(280px, 92vw);
  padding: 8px 8px 10px;
  background: #fff;
  border: 1.5px solid #64748b;
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
}

.viewer-cad-workspace-menu.hidden {
  display: none !important;
}

.viewer-cad-workspace-menu-title {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #334155;
  margin: 0 4px 8px;
  text-transform: uppercase;
}

.viewer-cad-workspace-opt {
  appearance: none;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  margin: 0 0 4px;
  padding: 7px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  background: #f8fafc;
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-cad-workspace-opt:hover {
  background: #e2e8f0;
  border-color: #94a3b8;
}

.viewer-cad-workspace-opt.is-active {
  background: #334155;
  border-color: #1e293b;
  color: #fff;
}

.viewer-cad-workspace-opt-sub {
  font-size: 10px;
  font-weight: 500;
  color: #64748b;
}

.viewer-cad-workspace-opt.is-active .viewer-cad-workspace-opt-sub {
  color: #cbd5e1;
}

.viewer-cad-btn {
  appearance: none;
  margin: 0;
  padding: 2px 12px;
  min-height: 22px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #166534;
  background: #fff;
  border: 1.5px solid #16a34a;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-cad-btn:hover {
  background: #f0fdf4;
}

.viewer-cad-btn.is-on {
  color: #fff;
  background: #16a34a;
  border-color: #15803d;
  cursor: default;
}

.viewer-cad-btn.is-on:hover {
  background: #15803d;
}

.viewer-cad-dyn-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #6b21a8;
  background: #fff;
  border: 1.5px solid #9333ea;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-cad-dyn-btn:hover:not(:disabled) {
  background: #faf5ff;
}

.viewer-cad-dyn-btn.is-on {
  color: #fff;
  background: #9333ea;
  border-color: #7e22ce;
}

.viewer-cad-dyn-btn.is-on:hover:not(:disabled) {
  background: #7e22ce;
}

.viewer-cad-dyn-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.viewer-cad-sel-btn {
  appearance: none;
  margin: 0;
  padding: 2px 8px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #9a3412;
  background: #fff;
  border: 1.5px solid #ea580c;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  text-align: center;
}

.viewer-cad-sel-btn:hover {
  background: #fff7ed;
}

.viewer-cad-sel-btn.is-on {
  color: #fff;
  background: #ea580c;
  border-color: #c2410c;
}

.viewer-cad-sel-btn.is-on:hover {
  background: #c2410c;
}

/* Herramientas estructurales + conexiones (derecha de la barra CAD) */
.viewer-cad-struct-tools {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  flex-shrink: 0;
  z-index: 22;
  pointer-events: auto;
  position: relative;
}

/* ANOTACIONES — textos / cotas / formatos */
.viewer-cad-anotaciones-wrap {
  position: relative;
  flex: 0 0 auto;
  flex-shrink: 0;
  z-index: 24;
  pointer-events: auto;
}

.viewer-cad-d5-wrap,
.viewer-cad-d5-btn,
#btn-cad-d5 {
  display: none !important;
}

.viewer-cad-d5-wrap {
  display: none !important;
  align-items: center;
  pointer-events: none !important;
  position: relative;
  z-index: 40;
}

.viewer-cad-d5-btn {
  display: none !important;
  appearance: none;
  margin: 0;
  padding: 2px 8px;
  min-height: 22px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #fff;
  background: linear-gradient(180deg, #ff7a18, #e85d04);
  border: 1.5px solid #c2410c;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: none !important;
  position: relative;
  z-index: 40;
}

.viewer-cad-d5-btn:hover {
  background: linear-gradient(180deg, #ff8c33, #f97316);
}

.viewer-cad-d5-btn.is-busy,
.viewer-cad-d5-btn:disabled {
  opacity: 0.65;
  cursor: wait;
}

.viewer-cad-anotaciones-btn {
  appearance: none;
  margin: 0;
  padding: 2px 8px;
  min-height: 22px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1;
  color: #1e3a5f;
  background: #eff6ff;
  border: 1.5px solid #2563eb;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: auto;
  position: relative;
  z-index: 23;
}

.viewer-cad-anotaciones-btn:hover {
  background: #dbeafe;
}

.viewer-cad-anotaciones-btn.is-on,
.viewer-cad-anotaciones-btn[aria-expanded="true"] {
  color: #fff;
  background: #2563eb;
  border-color: #1d4ed8;
}

.viewer-cad-anotaciones-panel {
  position: fixed;
  z-index: 6000;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1.5px solid #2563eb;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
  overflow: hidden;
  pointer-events: auto;
}

.viewer-cad-anotaciones-panel.hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.viewer-cad-anotaciones-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(180deg, #dbeafe, #bfdbfe);
  border-bottom: 1px solid #93c5fd;
}

.viewer-cad-anotaciones-head strong {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #1e3a5f;
  text-transform: uppercase;
}

.viewer-cad-anotaciones-close {
  appearance: none;
  margin: 0;
  padding: 0 8px;
  min-height: 26px;
  font-size: 18px;
  line-height: 1;
  color: #1e3a5f;
  background: transparent;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.viewer-cad-anotaciones-close:hover {
  background: rgba(37, 99, 235, 0.15);
}

.viewer-cad-annot-body {
  overflow: auto;
  padding: 0 0 10px;
  max-height: min(500px, calc(70vh - 40px));
}

.viewer-cad-annot-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px 10px;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}

.viewer-cad-annot-tab {
  appearance: none;
  margin: 0;
  padding: 5px 10px;
  font-size: 10px;
  font-weight: 700;
  color: #334155;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  cursor: pointer;
}

.viewer-cad-annot-tab.is-active {
  color: #fff;
  background: #2563eb;
  border-color: #1d4ed8;
}

.viewer-cad-annot-section {
  padding: 10px 12px;
}

.viewer-cad-annot-section h3 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 800;
  color: #0f172a;
}

.viewer-cad-annot-lead {
  margin: 0 0 10px;
  font-size: 11px;
  line-height: 1.45;
  color: #475569;
}

.viewer-cad-annot-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 10px;
  margin-bottom: 10px;
}

@media (max-width: 640px) {
  .viewer-cad-annot-grid {
    grid-template-columns: 1fr;
  }
}

.viewer-cad-annot-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 10px;
  font-weight: 700;
  color: #334155;
}

.viewer-cad-annot-hint {
  font-weight: 500;
  color: #64748b;
  font-size: 9px;
}

.viewer-cad-annot-num,
.viewer-cad-annot-select,
.viewer-cad-annot-text {
  width: 100%;
  box-sizing: border-box;
  min-height: 28px;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
  background: #f8fafc;
  border: 1px solid #94a3b8;
  border-radius: 4px;
}

.viewer-cad-annot-color {
  width: 100%;
  min-height: 28px;
  padding: 2px;
  border: 1px solid #94a3b8;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
}

.viewer-cad-annot-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-bottom: 10px;
}

.viewer-cad-annot-check {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  cursor: pointer;
}

.viewer-cad-annot-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.viewer-cad-annot-actions-row--wrap {
  margin-bottom: 12px;
}

.viewer-cad-annot-primary,
.viewer-cad-annot-accent,
.viewer-cad-annot-secondary,
.viewer-cad-annot-mini {
  appearance: none;
  margin: 0;
  padding: 6px 12px;
  min-height: 28px;
  font-size: 11px;
  font-weight: 800;
  border-radius: 4px;
  cursor: pointer;
  border: 1px solid transparent;
}

.viewer-cad-annot-primary {
  color: #fff;
  background: #2563eb;
  border-color: #1d4ed8;
}

.viewer-cad-annot-accent {
  color: #fff;
  background: #0d9488;
  border-color: #0f766e;
}

.viewer-cad-annot-secondary {
  color: #1e3a5f;
  background: #eff6ff;
  border-color: #93c5fd;
}

.viewer-cad-annot-mini {
  padding: 2px 8px;
  min-height: 22px;
  color: #1d4ed8;
  background: #eff6ff;
  border-color: #93c5fd;
}

.viewer-cad-annot-preview {
  margin: 8px 0;
  padding: 10px 12px;
  font-size: 14px;
  border: 1px dashed #94a3b8;
  border-radius: 6px;
  background: #f8fafc;
}

.viewer-cad-annot-table-wrap {
  overflow: auto;
  max-height: 320px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.viewer-cad-annot-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.viewer-cad-annot-table th,
.viewer-cad-annot-table td {
  padding: 6px 8px;
  text-align: left;
  border-bottom: 1px solid #e2e8f0;
  vertical-align: top;
}

.viewer-cad-annot-table th {
  background: #f1f5f9;
  font-weight: 800;
  color: #0f172a;
  position: sticky;
  top: 0;
}

.viewer-cad-annot-table code {
  font-weight: 800;
  color: #1d4ed8;
}

/* PLASMA — plantillas de corte (izquierda de IMP DXF) */
.viewer-cad-plasma-wrap {
  position: relative;
  flex: 0 0 auto;
  flex-shrink: 0;
  z-index: 24;
  pointer-events: auto;
}

.viewer-cad-plasma-btn {
  appearance: none;
  margin: 0;
  padding: 2px 8px;
  min-height: 22px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #7c2d12;
  background: #fff7ed;
  border: 1.5px solid #ea580c;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: auto;
  position: relative;
  z-index: 25;
}

.viewer-cad-plasma-btn:hover {
  background: #ffedd5;
}

.viewer-cad-plasma-btn.is-on,
.viewer-cad-plasma-btn[aria-expanded="true"] {
  color: #fff;
  background: #ea580c;
  border-color: #c2410c;
}

.viewer-cad-plasma-panel {
  position: fixed;
  z-index: 6000;
  width: min(740px, calc(100vw - 24px));
  max-height: min(640px, calc(88vh - 48px));
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1.5px solid #ea580c;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
  overflow: hidden;
  pointer-events: auto;
}

.viewer-cad-plasma-panel.hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.viewer-cad-plasma-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(180deg, #ffedd5, #fed7aa);
  border-bottom: 1px solid #fdba74;
}

.viewer-cad-plasma-head strong {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #7c2d12;
  text-transform: uppercase;
}

.viewer-cad-plasma-close {
  appearance: none;
  margin: 0;
  padding: 0;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: #7c2d12;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.viewer-cad-plasma-close:hover {
  background: rgba(234, 88, 12, 0.2);
}

.viewer-cad-plasma-hint {
  margin: 0;
  padding: 6px 10px;
  font-size: 10px;
  line-height: 1.4;
  color: #334155;
  background: #fffbeb;
  border-bottom: 1px solid #fde68a;
}

.viewer-cad-plasma-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: end;
  padding: 6px 10px;
  background: #fff7ed;
  border-bottom: 1px solid #fed7aa;
}

.viewer-cad-plasma-mode,
.viewer-cad-plasma-sheet {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 9px;
  font-weight: 700;
  color: #9a3412;
}

.viewer-cad-plasma-num,
.viewer-cad-plasma-select {
  appearance: none;
  margin: 0;
  padding: 3px 6px;
  font-size: 11px;
  border: 1px solid #fdba74;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-width: 64px;
  max-width: 110px;
}

.viewer-cad-plasma-unit-btn {
  appearance: none;
  margin: 0 0 1px;
  padding: 4px 10px;
  min-width: 44px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  border: 1px solid #c2410c;
  border-radius: 4px;
  background: #ea580c;
  color: #fff;
  cursor: pointer;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  align-self: end;
}

.viewer-cad-plasma-unit-btn:hover {
  background: #c2410c;
}

.viewer-cad-plasma-unit-btn.is-mm {
  background: #0f766e;
  border-color: #0f766e;
}

.viewer-cad-plasma-unit-btn.is-mm:hover {
  background: #115e59;
}

.viewer-cad-plasma-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px 8px;
  border-bottom: 1px solid #e2e8f0;
  background: #ffedd5;
}

.viewer-cad-plasma-cat {
  appearance: none;
  margin: 0;
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 700;
  border: 1px solid #fdba74;
  border-radius: 4px;
  background: #fff;
  color: #9a3412;
  cursor: pointer;
}

.viewer-cad-plasma-cat.is-active {
  background: #ea580c;
  color: #fff;
  border-color: #c2410c;
}

.viewer-cad-plasma-body {
  display: grid;
  grid-template-columns: minmax(140px, 180px) 1fr;
  gap: 0;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.viewer-cad-plasma-list {
  overflow: auto;
  border-right: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 4px;
}

.viewer-cad-plasma-item {
  appearance: none;
  display: block;
  width: 100%;
  margin: 0 0 3px;
  padding: 6px 7px;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  cursor: pointer;
}

.viewer-cad-plasma-item:hover {
  background: #ffedd5;
}

.viewer-cad-plasma-item.is-active {
  background: #fff7ed;
  border-color: #fb923c;
}

.viewer-cad-plasma-item-label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  color: #9a3412;
}

.viewer-cad-plasma-item-sub {
  display: block;
  font-size: 9px;
  line-height: 1.3;
  color: #64748b;
  margin-top: 2px;
}

.viewer-cad-plasma-editor {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  min-height: 0;
  overflow: auto;
}

.viewer-cad-plasma-title {
  font-size: 13px;
  font-weight: 800;
  color: #7c2d12;
}

.viewer-cad-plasma-spec {
  font-size: 10px;
  line-height: 1.45;
  white-space: pre-wrap;
  color: #334155;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 4px;
  padding: 6px 8px;
}

.viewer-cad-plasma-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 8px;
}

.viewer-cad-plasma-field {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.viewer-cad-plasma-field label {
  font-size: 9px;
  font-weight: 700;
  color: #475569;
}

.viewer-cad-plasma-field .viewer-cad-plasma-num,
.viewer-cad-plasma-field .viewer-cad-plasma-select {
  max-width: none;
  width: 100%;
  box-sizing: border-box;
}

.viewer-cad-plasma-preview-wrap,
.viewer-cad-plasma-nest-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.viewer-cad-plasma-preview-label {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #9a3412;
}

.viewer-cad-plasma-preview,
.viewer-cad-plasma-nest {
  width: 100%;
  height: auto;
  max-height: 200px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #f8fafc;
}

.viewer-cad-plasma-nest-info {
  font-size: 10px;
  color: #475569;
  line-height: 1.35;
}

.viewer-cad-plasma-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid #e2e8f0;
}

.viewer-cad-plasma-secondary,
.viewer-cad-plasma-accent,
.viewer-cad-plasma-primary {
  appearance: none;
  margin: 0;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 4px;
  cursor: pointer;
  border: 1px solid transparent;
}

.viewer-cad-plasma-secondary {
  background: #f1f5f9;
  border-color: #cbd5e1;
  color: #334155;
}

.viewer-cad-plasma-accent {
  background: #fff7ed;
  border-color: #fb923c;
  color: #9a3412;
}

.viewer-cad-plasma-primary {
  margin-left: auto;
  background: #ea580c;
  border-color: #c2410c;
  color: #fff;
}

.viewer-cad-plasma-primary:hover {
  background: #c2410c;
}

/* Import / Export DXF (izquierda de PARAMETRICOS) — siempre visibles */
.viewer-cad-dxf-wrap {
  position: relative;
  flex: 0 0 auto;
  flex-shrink: 0;
  z-index: 24;
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.viewer-cad-dxf-btn {
  appearance: none;
  margin: 0;
  padding: 2px 7px;
  min-height: 22px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  background: #fff;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: auto;
  position: relative;
  z-index: 25;
  flex-shrink: 0;
}

.viewer-cad-dxf-btn--import {
  color: #1d4ed8;
  border: 1.5px solid #3b82f6;
  background: #eff6ff;
}

.viewer-cad-dxf-btn--import:hover {
  background: #dbeafe;
}

.viewer-cad-dxf-btn--export {
  color: #9a3412;
  border: 1.5px solid #f97316;
  background: #fff7ed;
}

.viewer-cad-dxf-btn--export:hover {
  background: #ffedd5;
}

/* Biblioteca estructural */
.viewer-cad-estructura-wrap {
  margin-left: 0;
  position: relative;
  flex: 0 0 auto;
  z-index: 22;
  pointer-events: auto;
}

/* PARAMETRICOS (izquierda de ESTRUCTURA) */
.viewer-cad-parametricos-wrap {
  position: relative;
  flex: 0 0 auto;
  z-index: 22;
  pointer-events: auto;
}

.viewer-cad-parametricos-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #065f46;
  background: #fff;
  border: 1.5px solid #059669;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: auto;
  position: relative;
  z-index: 23;
}

.viewer-cad-parametricos-btn:hover {
  background: #ecfdf5;
}

.viewer-cad-parametricos-btn.is-on,
.viewer-cad-parametricos-btn[aria-expanded="true"] {
  color: #fff;
  background: #059669;
  border-color: #047857;
}

.viewer-cad-parametricos-panel {
  position: fixed;
  right: 12px;
  /* Más arriba: deja margen sobre barra CAD / taskbar para ver acciones */
  bottom: max(108px, calc(72px + env(safe-area-inset-bottom, 0px)));
  z-index: 6000;
  width: min(640px, calc(100vw - 24px));
  max-height: min(560px, calc(78vh - 108px));
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1.5px solid #059669;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
  overflow: hidden;
  pointer-events: auto;
}

.viewer-cad-parametricos-panel.hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.viewer-cad-parametricos-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(180deg, #d1fae5, #a7f3d0);
  border-bottom: 1px solid #6ee7b7;
}

.viewer-cad-parametricos-head strong {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #064e3b;
  text-transform: uppercase;
}

.viewer-cad-parametricos-close {
  appearance: none;
  margin: 0;
  padding: 0;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: #064e3b;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.viewer-cad-parametricos-close:hover {
  background: rgba(5, 150, 105, 0.2);
}

.viewer-cad-parametricos-hint {
  margin: 0;
  padding: 6px 10px;
  font-size: 10px;
  line-height: 1.4;
  color: #334155;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.viewer-cad-parametricos-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px 8px;
  border-bottom: 1px solid #e2e8f0;
  background: #ecfdf5;
}

.viewer-cad-parametricos-cat {
  appearance: none;
  margin: 0;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #475569;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  cursor: pointer;
}

.viewer-cad-parametricos-cat:hover {
  border-color: #059669;
  color: #047857;
}

.viewer-cad-parametricos-cat.is-active {
  color: #fff;
  background: #047857;
  border-color: #047857;
}

.viewer-cad-parametricos-body {
  display: grid;
  grid-template-columns: minmax(150px, 36%) 1fr;
  gap: 0;
  min-height: 0;
  flex: 1;
  overflow: hidden;
}

.viewer-cad-parametricos-list {
  overflow: auto;
  border-right: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 4px;
}

.viewer-cad-parametricos-item {
  appearance: none;
  display: block;
  width: 100%;
  text-align: left;
  margin: 0 0 2px;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-cad-parametricos-item:hover {
  background: #d1fae5;
  border-color: #6ee7b7;
}

.viewer-cad-parametricos-item.is-active {
  background: #a7f3d0;
  border-color: #059669;
}

.viewer-cad-parametricos-item-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: #0f172a;
}

.viewer-cad-parametricos-item-sub {
  display: block;
  margin-top: 2px;
  font-size: 9px;
  line-height: 1.3;
  color: #64748b;
}

.viewer-cad-parametricos-editor {
  overflow: hidden;
  padding: 8px 10px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
}

.viewer-cad-parametricos-title {
  font-size: 13px;
  font-weight: 800;
  color: #064e3b;
}

.viewer-cad-parametricos-spec {
  font-size: 10px;
  line-height: 1.45;
  white-space: pre-wrap;
  color: #334155;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  border-radius: 4px;
  padding: 6px 8px;
  max-height: 88px;
  overflow: auto;
}

.viewer-cad-parametricos-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 8px;
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding-right: 2px;
}

.viewer-cad-parametricos-field {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.viewer-cad-parametricos-field label {
  font-size: 9px;
  font-weight: 700;
  color: #475569;
  letter-spacing: 0.02em;
}

.viewer-cad-parametricos-field input,
.viewer-cad-parametricos-select {
  appearance: none;
  margin: 0;
  padding: 4px 6px;
  font-size: 11px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

.viewer-cad-parametricos-field input:focus,
.viewer-cad-parametricos-select:focus {
  outline: 2px solid rgba(5, 150, 105, 0.35);
  border-color: #059669;
}

.viewer-cad-parametricos-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 0 0 auto;
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid #e2e8f0;
  background: #fff;
}

.viewer-cad-parametricos-primary {
  appearance: none;
  margin: 0;
  margin-left: auto;
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  background: #059669;
  border: 1px solid #047857;
  border-radius: 4px;
  cursor: pointer;
}

.viewer-cad-parametricos-primary:hover {
  background: #047857;
}

.viewer-cad-parametricos-secondary {
  appearance: none;
  margin: 0;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  cursor: pointer;
}

.viewer-cad-parametricos-secondary:hover {
  background: #e2e8f0;
}

@media (max-width: 640px) {
  .viewer-cad-parametricos-body {
    grid-template-columns: 1fr;
  }
  .viewer-cad-parametricos-list {
    max-height: 120px;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
  }
}

.viewer-cad-estructura-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #7f1d1d;
  background: #fff;
  border: 1.5px solid #dc2626;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: auto;
  position: relative;
  z-index: 23;
}

.viewer-cad-estructura-btn:hover {
  background: #fef2f2;
}

.viewer-cad-estructura-btn.is-on,
.viewer-cad-estructura-btn[aria-expanded="true"] {
  color: #fff;
  background: #dc2626;
  border-color: #b91c1c;
}

.viewer-cad-estructura-panel {
  position: fixed;
  right: 12px;
  bottom: 48px;
  z-index: 6000;
  width: min(680px, calc(100vw - 24px));
  max-height: min(620px, calc(82vh - 48px));
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1.5px solid #dc2626;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
  overflow: hidden;
  pointer-events: auto;
}

.viewer-cad-estructura-panel.hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.viewer-cad-estructura-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(180deg, #fee2e2, #fecaca);
  border-bottom: 1px solid #fca5a5;
}

.viewer-cad-estructura-head strong {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #7f1d1d;
  text-transform: uppercase;
}

.viewer-cad-estructura-close {
  appearance: none;
  margin: 0;
  padding: 0;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: #7f1d1d;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.viewer-cad-estructura-close:hover {
  background: rgba(127, 29, 29, 0.12);
}

.viewer-cad-estructura-hint {
  margin: 0;
  padding: 6px 10px;
  font-size: 11px;
  line-height: 1.35;
  color: #64748b;
  border-bottom: 1px solid #e2e8f0;
}

.viewer-cad-estructura-body {
  display: grid;
  grid-template-columns: 168px 1fr;
  min-height: 280px;
  flex: 1 1 auto;
  overflow: hidden;
}

.viewer-cad-estructura-list {
  overflow: auto;
  padding: 8px;
  border-right: 1px solid #e2e8f0;
  background: #f8fafc;
  min-height: 240px;
}

.viewer-cad-estructura-item {
  appearance: none;
  display: block;
  width: 100%;
  margin: 0 0 4px;
  padding: 7px 8px;
  text-align: left;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  cursor: pointer;
}

.viewer-cad-estructura-item:hover {
  border-color: #fca5a5;
  background: #fef2f2;
}

.viewer-cad-estructura-item.is-active {
  border-color: #dc2626;
  background: #fee2e2;
  color: #7f1d1d;
}

.viewer-cad-estructura-editor {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  overflow: auto;
}

.viewer-cad-estructura-title {
  font-size: 13px;
  font-weight: 800;
  color: #0f172a;
}

.viewer-cad-estructura-fields {
  display: grid;
  gap: 6px;
}

.viewer-cad-estructura-field {
  display: grid;
  grid-template-columns: minmax(130px, 0.85fr) minmax(220px, 1.35fr);
  align-items: center;
  gap: 10px;
}

.viewer-cad-estructura-field label {
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  line-height: 1.3;
}

.viewer-cad-estructura-field input,
.viewer-cad-estructura-select {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 5px 8px;
  border: 1px solid #94a3b8;
  border-radius: 3px;
  font-size: 12px;
  font-family: ui-monospace, Consolas, monospace;
  font-variant-numeric: tabular-nums;
  background: #fff;
  color: #0f172a;
  box-sizing: border-box;
}

.viewer-cad-estructura-select {
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: 12px;
  line-height: 1.35;
  cursor: pointer;
  /* Espacio para la flecha nativa; evita que el texto se monte encima. */
  padding-right: 1.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.viewer-cad-estructura-field input:focus,
.viewer-cad-estructura-select:focus {
  outline: none;
  border-color: #dc2626;
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.15);
}

.viewer-cad-estructura-meta {
  margin: 0 0 6px;
  padding: 7px 9px;
  font-size: 11px;
  line-height: 1.45;
  color: #7f1d1d;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 4px;
  min-height: 1.2em;
}

.viewer-cad-estructura-meta:empty {
  display: none;
}

.viewer-cad-estructura-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  margin-top: auto;
  padding-top: 4px;
}

.viewer-cad-estructura-primary,
.viewer-cad-estructura-secondary,
.viewer-cad-estructura-apply {
  appearance: none;
  margin: 0;
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

.viewer-cad-estructura-primary {
  color: #fff;
  background: #dc2626;
  border: 1px solid #b91c1c;
}

.viewer-cad-estructura-primary:hover {
  background: #b91c1c;
}

.viewer-cad-estructura-apply {
  color: #fff;
  background: #1d4ed8;
  border: 1px solid #1e40af;
}

.viewer-cad-estructura-apply:hover {
  background: #1e40af;
}

.viewer-cad-estructura-apply-wrap {
  position: relative;
  display: inline-flex;
}

.viewer-cad-estructura-apply-menu {
  position: absolute;
  right: 0;
  bottom: calc(100% + 4px);
  z-index: 40;
  min-width: 168px;
  padding: 4px;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.viewer-cad-estructura-apply-menu.hidden {
  display: none;
}

.viewer-cad-estructura-apply-opt {
  appearance: none;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #0f172a;
  font-size: 11px;
  font-weight: 650;
  text-align: left;
  cursor: pointer;
}

.viewer-cad-estructura-apply-opt:hover {
  background: #eff6ff;
  color: #1d4ed8;
}

.viewer-cad-estructura-secondary {
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
}

.viewer-cad-estructura-secondary:hover {
  background: #e2e8f0;
}

/* CONEXIONES estructurales (derecha de ESTRUCTURA) */
.viewer-cad-conexiones-wrap {
  position: relative;
  flex: 0 0 auto;
  z-index: 22;
  pointer-events: auto;
}

.viewer-cad-conexiones-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #0c4a6e;
  background: #fff;
  border: 1.5px solid #0284c7;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: auto;
  position: relative;
  z-index: 23;
}

.viewer-cad-conexiones-btn:hover {
  background: #e0f2fe;
}

.viewer-cad-conexiones-btn.is-on,
.viewer-cad-conexiones-btn[aria-expanded="true"] {
  color: #fff;
  background: #0284c7;
  border-color: #0369a1;
}

.viewer-cad-conexiones-panel {
  position: fixed;
  right: 12px;
  bottom: 48px;
  z-index: 6000;
  width: min(560px, calc(100vw - 24px));
  max-height: min(520px, calc(75vh - 48px));
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1.5px solid #0284c7;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
  overflow: hidden;
  pointer-events: auto;
}

.viewer-cad-conexiones-panel.hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.viewer-cad-conexiones-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(180deg, #e0f2fe, #bae6fd);
  border-bottom: 1px solid #7dd3fc;
}

.viewer-cad-conexiones-head strong {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #0c4a6e;
  text-transform: uppercase;
}

.viewer-cad-conexiones-close {
  appearance: none;
  margin: 0;
  padding: 0;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: #0c4a6e;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.viewer-cad-conexiones-close:hover {
  background: rgba(14, 165, 233, 0.2);
}

.viewer-cad-conexiones-hint {
  margin: 0;
  padding: 6px 10px;
  font-size: 10px;
  line-height: 1.4;
  color: #334155;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.viewer-cad-conexiones-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px 8px;
  border-bottom: 1px solid #e2e8f0;
  background: #f1f5f9;
}

.viewer-cad-conexiones-cat {
  appearance: none;
  margin: 0;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #475569;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  cursor: pointer;
}

.viewer-cad-conexiones-cat:hover {
  border-color: #0284c7;
  color: #0369a1;
}

.viewer-cad-conexiones-cat.is-active {
  color: #fff;
  background: #0369a1;
  border-color: #0369a1;
}

.viewer-cad-conexiones-body {
  display: grid;
  grid-template-columns: minmax(140px, 38%) 1fr;
  min-height: 0;
  flex: 1;
  overflow: hidden;
}

.viewer-cad-conexiones-list {
  overflow: auto;
  border-right: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 4px;
}

.viewer-cad-conexiones-item {
  display: block;
  width: 100%;
  text-align: left;
  appearance: none;
  margin: 0 0 2px;
  padding: 7px 8px;
  font-size: 11px;
  font-weight: 600;
  color: #0f172a;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  line-height: 1.25;
}

.viewer-cad-conexiones-item small {
  display: block;
  margin-top: 2px;
  font-size: 9px;
  font-weight: 500;
  color: #64748b;
}

.viewer-cad-conexiones-item:hover {
  background: #e0f2fe;
}

.viewer-cad-conexiones-item.is-active {
  background: #0284c7;
  color: #fff;
  border-color: #0369a1;
}

.viewer-cad-conexiones-item.is-active small {
  color: #e0f2fe;
}

.viewer-cad-conexiones-editor {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: auto;
  padding: 8px 10px 10px;
}

.viewer-cad-conexiones-title {
  font-size: 13px;
  font-weight: 800;
  color: #0c4a6e;
  margin-bottom: 4px;
}

.viewer-cad-conexiones-spec {
  font-size: 10px;
  line-height: 1.45;
  color: #334155;
  background: #f0f9ff;
  border: 1px solid #bae6fd;
  border-radius: 4px;
  padding: 6px 8px;
  margin-bottom: 8px;
  white-space: pre-wrap;
}

.viewer-cad-conexiones-spec:empty {
  display: none;
}

.viewer-cad-conexiones-fields {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.viewer-cad-conexiones-field {
  display: grid;
  grid-template-columns: 1fr minmax(72px, 42%);
  gap: 6px;
  align-items: center;
}

.viewer-cad-conexiones-field label {
  font-size: 10px;
  font-weight: 600;
  color: #475569;
}

.viewer-cad-conexiones-field input,
.viewer-cad-conexiones-select {
  width: 100%;
  box-sizing: border-box;
  padding: 4px 6px;
  font-size: 11px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
}

.viewer-cad-conexiones-field input:focus,
.viewer-cad-conexiones-select:focus {
  outline: none;
  border-color: #0284c7;
  box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.2);
}

.viewer-cad-conexiones-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #e2e8f0;
}

.viewer-cad-conexiones-primary,
.viewer-cad-conexiones-secondary {
  appearance: none;
  margin: 0;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 4px;
  cursor: pointer;
}

.viewer-cad-conexiones-primary {
  color: #fff;
  background: #0284c7;
  border: 1px solid #0369a1;
}

.viewer-cad-conexiones-primary:hover {
  background: #0369a1;
}

.viewer-cad-conexiones-secondary {
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
}

.viewer-cad-conexiones-secondary:hover {
  background: #e2e8f0;
}

.viewer-cad-conexiones-steps {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 10px;
  padding: 10px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
}

.viewer-cad-conexiones-steps.hidden {
  display: none;
}

.viewer-cad-conexiones-steps-title {
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #1d4ed8;
}

.viewer-cad-conexiones-step {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.viewer-cad-conexiones-step-num {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2563eb;
  color: #fff;
  font-size: 12px;
}

.viewer-cad-conexiones-step.is-done .viewer-cad-conexiones-step-num {
  background: #16a34a;
}

.viewer-cad-conexiones-step.is-wait {
  opacity: 0.55;
}

.viewer-cad-conn-pick-hud {
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 40;
  min-width: min(420px, calc(100% - 24px));
  max-width: 520px;
  padding: 12px 16px;
  border-radius: 10px;
  border: 2px solid #2563eb;
  background: rgba(15, 23, 42, 0.92);
  color: #f8fafc;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.35);
  pointer-events: none;
  text-align: center;
}

.viewer-cad-conn-pick-hud.hidden {
  display: none;
}

.viewer-cad-conn-pick-badge {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #93c5fd;
  margin-bottom: 4px;
}

.viewer-cad-conn-pick-step {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
}

.viewer-cad-conn-pick-hint {
  margin-top: 4px;
  font-size: 13px;
  color: #cbd5e1;
}

@media (max-width: 640px) {
  .viewer-cad-conexiones-body {
    grid-template-columns: 1fr;
  }
  .viewer-cad-conexiones-list {
    max-height: 120px;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
  }
}

/* Fenêtre de sélection CAD : bleu = contenu · vert = croisement */
.viewer-cad-sel-box {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 13;
  box-sizing: border-box;
  pointer-events: none;
  border-width: 1.5px;
  border-style: solid;
  min-width: 1px;
  min-height: 1px;
}

.viewer-cad-sel-box.hidden {
  display: none !important;
}

.viewer-cad-sel-box.is-window {
  border-color: rgba(59, 130, 246, 0.95);
  background: rgba(59, 130, 246, 0.18);
}

.viewer-cad-sel-box.is-crossing {
  border-color: rgba(34, 197, 94, 0.95);
  border-style: dashed;
  background: rgba(34, 197, 94, 0.16);
}

.viewer-cad-sel-actions {
  display: none !important;
}

.viewer-cad-sel-actions.hidden {
  display: none !important;
}

.viewer-cad-act-btn {
  appearance: none;
  margin: 0;
  padding: 2px 8px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 700;
  color: #0f172a;
  background: #fff;
  border: 1px solid #94a3b8;
  border-radius: 3px;
  cursor: pointer;
}

.viewer-cad-act-btn:hover {
  background: #f1f5f9;
}

.viewer-cad-act-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.viewer-cad-act-btn.is-on {
  color: #fff;
  background: #ea580c;
  border-color: #c2410c;
}

.viewer-cad-act-btn.is-on:hover {
  background: #c2410c;
}

.viewer-cad-dyn {
  position: absolute;
  z-index: 12;
  left: 0;
  top: 0;
  min-width: 200px;
  max-width: min(320px, 70vw);
  padding: 0;
  /* Ne jamais voler les clics du canvas (placement L/PL) — saisie clavier / barre COMMANDE. */
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.35));
}

.viewer-cad-dyn.hidden {
  display: none !important;
}

.viewer-cad-dyn-msg {
  margin: 0;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.3;
  color: #0f172a;
  background: #e2e8f0;
  border: 1px solid #94a3b8;
  border-bottom: none;
  border-radius: 3px 3px 0 0;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-cad-dyn-fields {
  display: flex;
  gap: 0;
  background: #cbd5e1;
  border: 1px solid #94a3b8;
  border-radius: 0 0 3px 3px;
  overflow: hidden;
}

.viewer-cad-dyn-fields.hidden,
#viewer-cad-dyn-coords.hidden,
#viewer-cad-dyn-polar.hidden {
  display: none !important;
}

.viewer-cad-dyn-polar {
  border-radius: 0 0 3px 3px;
}

.viewer-cad-dyn-axis-ang {
  background: #b45309 !important;
}

.viewer-cad-dyn-axis-dist {
  background: #0f766e !important;
}

.viewer-cad-dyn-form {
  margin: 0;
  padding: 0;
  border: none;
  display: block;
  width: 100%;
}

.viewer-cad-dyn-field {
  flex: 1 1 50%;
  min-width: 0;
  display: flex;
  align-items: stretch;
  margin: 0;
  border-right: 1px solid #94a3b8;
}

.viewer-cad-dyn.is-point-xyz .viewer-cad-dyn-field {
  flex: 1 1 33.33%;
}

.viewer-cad-dyn-field:last-child {
  border-right: none;
}

.viewer-cad-dyn-field-z.hidden,
.viewer-cad-dyn-field.hidden {
  display: none;
}

.viewer-cad-dyn-ok {
  flex: 0 0 auto;
  margin: 0;
  padding: 0 12px;
  border: none;
  border-left: 1px solid #94a3b8;
  background: #16a34a;
  color: #f8fafc;
  font-size: 12px;
  font-weight: 700;
  font-family: ui-monospace, Consolas, monospace;
  letter-spacing: 0.04em;
  cursor: pointer;
  align-self: stretch;
}

.viewer-cad-dyn-ok:hover:not(:disabled) {
  background: #15803d;
}

.viewer-cad-dyn-ok.hidden,
.viewer-cad-dyn-ok:disabled {
  display: none;
}

.viewer-cad-dyn-axis {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1.4em;
  padding: 0 6px;
  background: #94a3b8;
  color: #0f172a;
  font-size: 11px;
  font-weight: 700;
  font-family: ui-monospace, Consolas, monospace;
  letter-spacing: 0.02em;
}

.viewer-cad-dyn-input {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 5px 8px;
  border: none;
  background: #e2e8f0;
  color: #0f172a;
  font-size: 13px;
  font-family: ui-monospace, Consolas, monospace;
  font-variant-numeric: tabular-nums;
}

.viewer-cad-dyn-input.is-active,
.viewer-cad-dyn-input:focus {
  background: #2563eb;
  color: #fff;
  outline: none;
}

/* RECTANGLE : cotas sobre las aristas, como la entrada dinámica de AutoCAD. */
.viewer-cad-dyn.is-rect-drag {
  left: 0 !important;
  top: 0 !important;
  width: 0;
  height: 0;
  min-width: 0;
  max-width: none;
  overflow: visible;
  filter: none;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-msg {
  position: absolute;
  width: max-content;
  max-width: 280px;
  border-bottom: 1px solid #94a3b8;
  border-radius: 2px;
  white-space: nowrap;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-fields {
  display: block;
  height: 0;
  overflow: visible;
  background: transparent;
  border: none;
  border-radius: 0;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-field {
  position: absolute;
  z-index: 2;
  width: 112px;
  flex: none;
  border: 1px solid #475569;
  border-radius: 2px;
  background: #f8fafc;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
  overflow: hidden;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-axis {
  background: #e2e8f0;
  color: #0f172a;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-input {
  background: #f8fafc;
  color: #0f172a;
  text-align: right;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-input.is-active,
.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-input:focus {
  background: #1d4ed8;
  color: #fff;
}

.viewer-cad-dyn.is-rect-drag .viewer-cad-dyn-field:focus-within .viewer-cad-dyn-axis {
  background: #1e3a8a;
  color: #fff;
}

.viewer-cad-dyn-field:focus-within .viewer-cad-dyn-axis {
  background: #1d4ed8;
  color: #fff;
}

.viewer-cad-dyn.is-cmd-mode {
  min-width: 200px;
  pointer-events: none;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.35));
}

/* Champs DYN / commande : pas de hit-test souris (sinon bloquent L/PL). */
.viewer-cad-dyn.is-cmd-mode .viewer-cad-dyn-cmd,
.viewer-cad-dyn.is-coord-mode .viewer-cad-dyn-input {
  pointer-events: none;
}

/* EX : H reçoit clic / Entrée (le panneau reste pointer-events:none ailleurs). */
.viewer-cad-dyn.is-extrude-h .viewer-cad-dyn-input {
  pointer-events: auto;
}

/* DIV : champ N (nº de partes) — même comportement. */
.viewer-cad-dyn.is-divide-n .viewer-cad-dyn-input {
  pointer-events: auto;
}

.viewer-cad-dyn.is-cmd-mode .viewer-cad-dyn-msg {
  background: #e2e8f0;
  color: #0f172a;
  border-color: #94a3b8;
}

.viewer-cad-dyn-cmd-wrap {
  display: flex;
  background: #cbd5e1;
  border: 1px solid #94a3b8;
  border-radius: 0 0 3px 3px;
  overflow: hidden;
}

.viewer-cad-dyn-cmd-wrap.hidden {
  display: none !important;
}

.viewer-cad-dyn.is-cmd-mode #viewer-cad-dyn-coords {
  display: none !important;
}

.viewer-cad-dyn.is-coord-mode #viewer-cad-dyn-cmd-wrap {
  display: none !important;
}

.viewer-cad-dyn-cmd {
  flex: 1 1 auto;
  min-width: 140px;
  margin: 0;
  padding: 5px 8px;
  border: none;
  background: #e2e8f0;
  color: #0f172a;
  font-size: 13px;
  font-family: ui-monospace, Consolas, monospace;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}

.viewer-cad-dyn-cmd::placeholder {
  color: #64748b;
  font-weight: 500;
  text-transform: none;
}

.viewer-cad-dyn-cmd:focus {
  outline: none;
  background: #2563eb;
  color: #fff;
}

#app.walkthrough-active .viewer-cad-dyn {
  display: none !important;
}

.viewer-cad-cmd-bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 28px;
  z-index: 56;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  padding: 3px 10px;
  box-sizing: border-box;
  /* Opaco: los ejes del puntero CAD no deben verse a través ni por encima. */
  background: #0f172a;
  border-top: 1px solid rgba(34, 197, 94, 0.55);
  color: #e2e8f0;
  pointer-events: auto;
}

.viewer-cad-cmd-bar.hidden {
  display: none !important;
}

.viewer-cad-cmd-prompt {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #4ade80;
  text-transform: uppercase;
}

.viewer-cad-cmd-input {
  flex: 1 1 140px;
  min-width: 80px;
  max-width: 220px;
  height: 22px;
  margin: 0;
  padding: 2px 8px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 3px;
  background: #0f172a;
  color: #f8fafc;
  font-size: 12px;
  font-family: ui-monospace, Consolas, monospace;
}

.viewer-cad-cmd-input:focus {
  outline: 1px solid #22c55e;
  border-color: #22c55e;
}

.viewer-cad-cmd-hint {
  flex: 1 1 auto;
  font-size: 10px;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.viewer-cad-cmd-hint[hidden],
.viewer-cad-cmd-hint:empty {
  display: none !important;
}

/* Coordonnées actives → masquer l'aide commande dans le même emplacement */
.viewer-cad-cmd-bar:has(#viewer-coords-readout:not(.hidden)) .viewer-cad-cmd-hint {
  display: none !important;
}

.viewer-cad-cmd-bar.is-coords-only .viewer-cad-cmd-prompt,
.viewer-cad-cmd-bar.is-coords-only .viewer-cad-cmd-input {
  display: none !important;
}

#app.walkthrough-active .viewer-cad-cmd-bar {
  display: none !important;
}

/* Coordonnées dans la barre COMMANDE (emplacement de l'ancien texte d'aide) */
.viewer-coords-readout {
  position: static;
  flex: 0 1 auto;
  z-index: auto;
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  max-width: min(340px, 42vw);
  margin-left: 4px;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 1.25;
  color: #f8fafc;
  background: rgba(30, 41, 59, 0.95);
  border: 1px solid rgba(96, 165, 250, 0.55);
  border-radius: 3px;
  pointer-events: none;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, monospace;
  box-shadow: none;
}

.viewer-coords-readout.hidden {
  display: none !important;
}

/* Propiedades CAD (longitud / área / volumen) — espacio libre a la derecha de XYZ */
.viewer-cad-props-readout {
  flex: 1 1 auto;
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 14px;
  min-width: 0;
  margin-left: 6px;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 1.25;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 3px;
  pointer-events: none;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, monospace;
  overflow: hidden;
}

.viewer-cad-props-readout.is-empty {
  opacity: 0.55;
}

.viewer-cad-history {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  margin-left: 8px;
  margin-right: 4px;
}

.viewer-cad-history-btn {
  appearance: none;
  margin: 0;
  width: 28px;
  height: 26px;
  padding: 0;
  border-radius: 4px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(30, 41, 59, 0.92);
  color: #f8fafc;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.viewer-cad-history-btn:hover:not(:disabled) {
  background: rgba(51, 65, 85, 0.98);
  border-color: rgba(226, 232, 240, 0.55);
}

.viewer-cad-history-btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.viewer-cad-props-item {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}

.viewer-cad-props-label {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fbbf24;
}

.viewer-cad-props-value {
  font-weight: 600;
  color: #f8fafc;
}

#app.walkthrough-active .viewer-cad-props-readout {
  display: none !important;
}

.viewer-osnap-glyph {
  position: absolute;
  z-index: 14;
  left: 0;
  top: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  filter: drop-shadow(0 0 2px #000) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.7));
}

.viewer-osnap-glyph.hidden {
  display: none !important;
}

.viewer-osnap-track {
  position: absolute;
  inset: 0;
  z-index: 13;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
}

.viewer-osnap-track.hidden {
  display: none !important;
}

.viewer-osnap-track-line {
  stroke: #fbbf24;
  stroke-width: 1;
  stroke-dasharray: 6 4;
  fill: none;
  opacity: 0.9;
}

.viewer-osnap-glyph-shape {
  width: 14px;
  height: 14px;
  box-sizing: border-box;
  border: 2px solid #fbbf24;
  background: transparent;
}

.viewer-osnap-glyph[data-kind="endpoint"] .viewer-osnap-glyph-shape {
  border-radius: 0;
}

.viewer-osnap-glyph[data-kind="midpoint"] .viewer-osnap-glyph-shape {
  width: 0;
  height: 0;
  border: none;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 14px solid #fbbf24;
  background: transparent;
}

.viewer-osnap-glyph[data-kind="center"] .viewer-osnap-glyph-shape,
.viewer-osnap-glyph[data-kind="geometricCenter"] .viewer-osnap-glyph-shape {
  border-radius: 50%;
}

.viewer-osnap-glyph[data-kind="geometricCenter"] .viewer-osnap-glyph-shape {
  background:
    radial-gradient(circle at center, #fbbf24 1.5px, transparent 1.6px);
}

.viewer-osnap-glyph[data-kind="intersection"] .viewer-osnap-glyph-shape {
  width: 12px;
  height: 12px;
  border: none;
  background:
    linear-gradient(#fbbf24, #fbbf24) center/100% 2px no-repeat,
    linear-gradient(#fbbf24, #fbbf24) center/2px 100% no-repeat;
  transform: rotate(45deg);
}

.viewer-osnap-glyph[data-kind="apparentIntersection"] .viewer-osnap-glyph-shape {
  width: 12px;
  height: 12px;
  border: 2px solid #fbbf24;
  background:
    linear-gradient(#fbbf24, #fbbf24) center/100% 2px no-repeat,
    linear-gradient(#fbbf24, #fbbf24) center/2px 100% no-repeat;
  transform: rotate(45deg);
}

.viewer-osnap-glyph[data-kind="nearest"] .viewer-osnap-glyph-shape {
  width: 0;
  height: 0;
  border: none;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 10px solid #fbbf24;
  position: relative;
  background: transparent;
  box-shadow: 0 10px 0 -2px #fbbf24;
  transform: translateY(-2px);
}

.viewer-osnap-glyph[data-kind="perpendicular"] .viewer-osnap-glyph-shape {
  width: 12px;
  height: 12px;
  border: none;
  border-left: 2px solid #fbbf24;
  border-bottom: 2px solid #fbbf24;
  border-radius: 0;
  background:
    radial-gradient(circle at 2px 10px, #fbbf24 2px, transparent 2.2px);
}

.viewer-osnap-glyph[data-kind="node"] .viewer-osnap-glyph-shape {
  border-radius: 50%;
  background:
    linear-gradient(#fbbf24, #fbbf24) center/100% 2px no-repeat,
    linear-gradient(#fbbf24, #fbbf24) center/2px 100% no-repeat;
  transform: rotate(45deg);
}

.viewer-osnap-glyph[data-kind="quadrant"] .viewer-osnap-glyph-shape {
  width: 12px;
  height: 12px;
  border: 2px solid #fbbf24;
  transform: rotate(45deg);
  border-radius: 1px;
}

.viewer-osnap-glyph[data-kind="extension"] .viewer-osnap-glyph-shape {
  width: 16px;
  height: 3px;
  border: none;
  background: #fbbf24;
  border-radius: 1px;
}

.viewer-osnap-glyph[data-kind="insertion"] .viewer-osnap-glyph-shape {
  width: 12px;
  height: 12px;
  border: 2px solid #fbbf24;
  box-shadow: 3px 3px 0 0 #fbbf24;
}

.viewer-osnap-glyph[data-kind="tangent"] .viewer-osnap-glyph-shape {
  border-radius: 50%;
  border-bottom-color: transparent;
  position: relative;
}

.viewer-osnap-glyph[data-kind="parallel"] .viewer-osnap-glyph-shape {
  width: 14px;
  height: 10px;
  border: none;
  background:
    linear-gradient(115deg, transparent 35%, #fbbf24 35%, #fbbf24 45%, transparent 45%),
    linear-gradient(115deg, transparent 55%, #fbbf24 55%, #fbbf24 65%, transparent 65%);
}

.viewer-osnap-glyph[data-kind="tracking"] .viewer-osnap-glyph-shape {
  width: 10px;
  height: 10px;
  border: none;
  background:
    linear-gradient(#fbbf24, #fbbf24) center/100% 2px no-repeat,
    linear-gradient(#fbbf24, #fbbf24) center/2px 100% no-repeat;
}

.viewer-osnap-glyph-label {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: #fbbf24;
  font-family: ui-sans-serif, system-ui, sans-serif;
  line-height: 1;
  text-shadow: 0 0 3px #000, 0 1px 2px #000;
}

.viewer-coords-readout-label {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: #93c5fd;
}

.viewer-coords-readout-values {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#app.walkthrough-active .viewer-coords-readout {
  display: none !important;
}

.viewer-osnap-btn {
  appearance: none;
  margin: 0;
  padding: 2px 12px;
  min-height: 22px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #991b1b;
  background: #fff;
  border: 1.5px solid #dc2626;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-osnap-btn:hover {
  background: #fef2f2;
}

.viewer-osnap-btn.is-on {
  color: #fff;
  background: #dc2626;
  border-color: #b91c1c;
}

.viewer-osnap-btn.is-on:hover {
  background: #b91c1c;
}

.viewer-osnap-3d-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #9a3412;
  background: #fff;
  border: 1.5px solid #ea580c;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-osnap-3d-btn:hover {
  background: #fff7ed;
}

.viewer-osnap-3d-btn.is-on {
  color: #fff;
  background: #ea580c;
  border-color: #c2410c;
}

.viewer-osnap-3d-btn.is-on:hover {
  background: #c2410c;
}

.viewer-cad-ortho-btn {
  appearance: none;
  margin: 0;
  padding: 2px 10px;
  min-height: 22px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #0f766e;
  background: #fff;
  border: 1.5px solid #0d9488;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-cad-ortho-btn:hover {
  background: #f0fdfa;
}

.viewer-cad-ortho-btn.is-on {
  color: #fff;
  background: #0d9488;
  border-color: #0f766e;
}

.viewer-cad-ortho-btn.is-on:hover {
  background: #0f766e;
}

.viewer-osnap-menu {
  position: fixed;
  left: 8px;
  bottom: auto;
  top: auto;
  z-index: 130000;
  min-width: 380px;
  max-width: min(460px, 96vw);
  max-height: min(78vh, 560px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 10px 12px 12px;
  background: #fff;
  border: 1.5px solid #dc2626;
  border-radius: 6px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.28);
  pointer-events: auto;
  box-sizing: border-box;
}

.viewer-osnap-menu.hidden {
  display: none !important;
}

.viewer-osnap-menu-title {
  font-size: 12px;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 8px;
}

.viewer-osnap-menu-masters {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 8px;
}

.viewer-osnap-modes-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 4px 0 6px;
  padding-top: 6px;
  border-top: 1px solid #e2e8f0;
}

.viewer-osnap-modes-title {
  font-size: 11px;
  font-weight: 800;
  color: #334155;
}

.viewer-osnap-modes-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

.viewer-osnap-mini-btn {
  appearance: none;
  margin: 0;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 700;
  color: #991b1b;
  background: #fff;
  border: 1px solid #fca5a5;
  border-radius: 3px;
  cursor: pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.viewer-osnap-mini-btn:hover {
  background: #fef2f2;
}

.viewer-osnap-modes-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px 10px;
}

.viewer-osnap-menu-note {
  margin: 10px 0 0;
  font-size: 10px;
  line-height: 1.35;
  color: #64748b;
}

.viewer-osnap-opt {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 3px 2px;
  font-size: 12px;
  color: #1e293b;
  cursor: pointer;
  min-width: 0;
}

.viewer-osnap-opt--master {
  font-weight: 700;
}

.viewer-osnap-opt input {
  margin: 0;
  accent-color: #dc2626;
  flex-shrink: 0;
}

.viewer-osnap-opt input:disabled + span {
  color: #94a3b8;
}

.viewer-osnap-ico {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  box-sizing: border-box;
  border: 1.5px solid #dc2626;
  display: inline-block;
}

.viewer-osnap-ico--endpoint {
  border-radius: 0;
}
.viewer-osnap-ico--midpoint {
  width: 0;
  height: 0;
  border: none;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 12px solid #dc2626;
}
.viewer-osnap-ico--center {
  border-radius: 50%;
}
.viewer-osnap-ico--geometricCenter {
  border-radius: 50%;
  background: radial-gradient(circle at center, #dc2626 1.5px, transparent 1.6px);
}
.viewer-osnap-ico--node {
  border-radius: 50%;
  background:
    linear-gradient(#dc2626, #dc2626) center/100% 1.5px no-repeat,
    linear-gradient(#dc2626, #dc2626) center/1.5px 100% no-repeat;
  transform: rotate(45deg);
}
.viewer-osnap-ico--quadrant {
  transform: rotate(45deg);
}
.viewer-osnap-ico--intersection {
  border: none;
  background:
    linear-gradient(#dc2626, #dc2626) center/100% 1.5px no-repeat,
    linear-gradient(#dc2626, #dc2626) center/1.5px 100% no-repeat;
  transform: rotate(45deg);
}
.viewer-osnap-ico--extension {
  height: 2px;
  border: none;
  background: #dc2626;
  align-self: center;
}
.viewer-osnap-ico--insertion {
  box-shadow: 2px 2px 0 0 #dc2626;
}
.viewer-osnap-ico--perpendicular {
  border: none;
  border-left: 1.5px solid #dc2626;
  border-bottom: 1.5px solid #dc2626;
}
.viewer-osnap-ico--tangent {
  border-radius: 50%;
  border-bottom-color: transparent;
}
.viewer-osnap-ico--nearest {
  width: 0;
  height: 0;
  border: none;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 8px solid #dc2626;
  box-shadow: 0 8px 0 -1px #dc2626;
}
.viewer-osnap-ico--apparentIntersection {
  background:
    linear-gradient(#dc2626, #dc2626) center/100% 1.5px no-repeat,
    linear-gradient(#dc2626, #dc2626) center/1.5px 100% no-repeat;
  transform: rotate(45deg);
}
.viewer-osnap-ico--parallel {
  border: none;
  background:
    linear-gradient(115deg, transparent 35%, #dc2626 35%, #dc2626 45%, transparent 45%),
    linear-gradient(115deg, transparent 55%, #dc2626 55%, #dc2626 65%, transparent 65%);
}

.viewer-osnap-sep {
  border: none;
  border-top: 1px solid #e2e8f0;
  margin: 6px 0;
}

#app.walkthrough-active .viewer-osnap-bar {
  display: none !important;
}

.viewer-view-cube {
  position: absolute;
  left: max(10px, env(safe-area-inset-left, 0px));
  bottom: max(38px, calc(28px + env(safe-area-inset-bottom, 0px)));
  z-index: 5;
  pointer-events: auto;
  user-select: none;
  -webkit-user-select: none;
}

.viewer-view-cube.hidden {
  display: none;
}

.viewer-view-cube-canvas {
  display: block;
  width: 108px;
  height: 121px;
  cursor: grab;
  touch-action: none;
  filter: drop-shadow(0 2px 6px rgba(15, 23, 42, 0.18));
}

.viewer-view-cube.is-dragging .viewer-view-cube-canvas {
  cursor: grabbing;
}

#app.walkthrough-active .viewer-view-cube {
  display: none !important;
}

.viewer-quick-pick-badge,
.viewer-quick-pick-badge.hidden {
  display: none !important;
}

.viewer-quick-actions {
  position: absolute;
  top: max(8px, env(safe-area-inset-top, 0px));
  left: max(8px, env(safe-area-inset-left, 0px));
  z-index: 4;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  max-width: calc(100% - 16px);
  pointer-events: none;
}

.viewer-quick-actions > .btn,
.viewer-quick-actions > .viewer-datos-wrap {
  pointer-events: auto;
  position: static;
}

.viewer-quick-similar-btn {
  max-width: min(280px, 56vw);
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: #dbeafe;
  background: linear-gradient(180deg, #1d4ed8 0%, #1e3a8a 100%);
  border: 1px solid rgba(147, 197, 253, 0.62);
  border-radius: 8px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.viewer-quick-similar-btn:hover {
  filter: brightness(1.08);
}

.viewer-quick-similar-btn.hidden {
  display: none;
}

.viewer-traza-assign-btn {
  max-width: min(280px, 56vw);
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: #431407;
  background: linear-gradient(180deg, #fdba74 0%, #f97316 100%);
  border: 1px solid rgba(251, 146, 60, 0.85);
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.panel-general-actions .viewer-traza-assign-btn {
  flex: 1 1 100%;
  max-width: none;
  width: 100%;
  box-sizing: border-box;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  border-radius: 999px;
}

/* Un ton plus soutenu que GAMME / Traçabilité (#fdba74 → #f97316). */
.viewer-traza-report-btn {
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: #fff7ed;
  background: linear-gradient(180deg, #f97316 0%, #c2410c 100%);
  border: 1px solid rgba(194, 65, 12, 0.95);
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.1);
}

.panel-general-actions .viewer-traza-report-btn {
  flex: 1 1 100%;
  width: 100%;
  box-sizing: border-box;
  border-radius: 999px;
}

.viewer-traza-report-btn:hover:not(:disabled) {
  filter: brightness(1.06);
}

.viewer-traza-report-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* Régénérer / Rapport / Traçabilité : une ligne chacun (pas côte à côte). */
.panel-general-actions #btn-general-regenerar-ifc,
.panel-general-actions #btn-asignar-trazabilidad,
.panel-general-actions #btn-general-traza-report {
  flex: 1 1 100%;
  width: 100%;
}

.viewer-traza-assign-btn:hover:not(:disabled) {
  filter: brightness(1.06);
}

.viewer-traza-assign-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.viewer-traza-assign-btn.hidden {
  display: none;
}

.viewer-capa-bimtraza-assign-btn {
  max-width: min(300px, 58vw);
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  color: #0c4a6e;
  background: linear-gradient(180deg, #7dd3fc 0%, #0ea5e9 100%);
  border: 1px solid rgba(14, 165, 233, 0.85);
  border-radius: 8px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.viewer-capa-bimtraza-assign-btn:hover:not(:disabled) {
  filter: brightness(1.06);
}

.viewer-capa-bimtraza-assign-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.viewer-capa-bimtraza-assign-btn.hidden {
  display: none;
}

.bimtraza-capas-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.bimtraza-capas-hint {
  margin: 0 0 10px;
  font-size: 12px;
  color: var(--muted, #64748b);
}

.bimtraza-capas-selection {
  margin: 10px 0 0;
  font-size: 12px;
}

.ifc-info-table--capas-bimtraza th,
.ifc-info-table--capas-bimtraza td {
  vertical-align: middle;
}

.ifc-info-table--capas-bimtraza-grid {
  border: 1px solid #a6a6a6;
  background: #fff;
  table-layout: fixed;
  width: 100%;
  font-size: 11px;
  line-height: 1.2;
}

.ifc-info-table--capas-bimtraza-grid th,
.ifc-info-table--capas-bimtraza-grid td {
  padding: 0;
  border: 1px solid #c8c8c8;
  height: 1.5rem;
  vertical-align: middle;
}

.ifc-info-table--capas-bimtraza-grid th {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 4px;
  color: #fff;
  background: #4472c4;
  border-color: #8eaadb;
  white-space: nowrap;
}

.ifc-info-table--capas-bimtraza-grid tbody tr:nth-child(even) {
  background: #f2f2f2;
}

.ifc-info-table--capas-bimtraza-grid tbody tr:hover {
  background: #ddebf7;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-col-check {
  width: 2.4rem;
  max-width: 2.4rem;
  text-align: center;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-col-color {
  width: 2rem;
  max-width: 2rem;
  padding: 0;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-col-del {
  width: 1.6rem;
  max-width: 1.6rem;
  padding: 0;
  text-align: center;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-col-nombre {
  width: 22%;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-col-desc {
  width: auto;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-check {
  width: 0.85rem;
  height: 0.85rem;
  margin: 0;
  vertical-align: middle;
  cursor: pointer;
  accent-color: #2563eb;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-color-cell {
  position: relative;
  min-width: 0;
  padding: 0;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-color-swatch {
  width: 100%;
  height: 100%;
  min-height: 1.5rem;
  padding: 0;
  border: none;
  border-radius: 0;
  display: block;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);
  cursor: pointer;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-color-swatch:hover,
.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-color-swatch:focus {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-text-input {
  display: block;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 1.5rem;
  box-sizing: border-box;
  font-size: 11px;
  line-height: 1.2;
  padding: 2px 4px;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #1e293b;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-text-input:hover {
  background: rgba(255, 255, 255, 0.55);
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-text-input:focus {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
  background: #fff;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-del-btn {
  min-width: 0;
  width: 100%;
  height: 100%;
  min-height: 1.5rem;
  padding: 0;
  font-size: 11px;
  line-height: 1;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #64748b;
  cursor: pointer;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-del-btn:hover {
  background: #fee2e2;
  color: #b91c1c;
}

.ifc-info-table--capas-bimtraza-grid .ifc-info-empty-cell {
  padding: 6px 8px;
  font-size: 11px;
  font-style: italic;
  text-align: center;
  color: #64748b;
  background: #fff;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-new-row td {
  padding: 0;
  height: auto;
  background: #f8fafc;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-new-cell {
  border-top: 1px solid #94a3b8;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-new-btn {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 3px 6px;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #2563eb;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-new-btn:hover {
  background: #eff6ff;
  color: #1d4ed8;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-new-btn:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
  background: #eff6ff;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-check:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.bimtraza-capas-panel-head {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 6px;
  flex-shrink: 0;
}

.bimtraza-capas-panel-head .btn-bimtraza-capa-add {
  padding: 3px 8px;
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}

#ifc-info-panel-capas-bimtraza .bimtraza-capas-toolbar {
  margin-top: 0;
  margin-bottom: 8px;
  padding: 0 2px;
}

.ifc-info-table--capas-bimtraza:not(.ifc-info-table--capas-bimtraza-grid) .bimtraza-capa-col-check {
  width: 3.25rem;
  text-align: center;
  white-space: nowrap;
}

.ifc-info-table--capas-bimtraza:not(.ifc-info-table--capas-bimtraza-grid) .bimtraza-capa-check {
  width: 1rem;
  height: 1rem;
  cursor: pointer;
  accent-color: #0ea5e9;
}

.ifc-info-table--capas-bimtraza:not(.ifc-info-table--capas-bimtraza-grid) .bimtraza-capa-color-cell {
  position: relative;
  min-width: 3.5rem;
}

.ifc-info-table--capas-bimtraza:not(.ifc-info-table--capas-bimtraza-grid) .bimtraza-capa-color-swatch {
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 2px solid var(--border, #94a3b8);
  border-radius: 4px;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.ifc-info-table--capas-bimtraza:not(.ifc-info-table--capas-bimtraza-grid) .bimtraza-capa-color-swatch:hover {
  border-color: #0ea5e9;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-color-grid {
  position: absolute;
  z-index: 40;
  left: 0;
  top: calc(100% + 4px);
  display: grid;
  grid-template-columns: repeat(6, 1.35rem);
  gap: 4px;
  padding: 8px;
  background: #fff;
  border: 1px solid var(--border, #cbd5e1);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.2);
  pointer-events: auto;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-color-grid[style*="position: fixed"] {
  position: fixed;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-color-grid.hidden {
  display: none;
}

/* Siempre ocultar: el portal (--portal/--ral) usa display:flex/grid con más
   especificidad y, si queda hidden+portal en body, tapa la casilla de color. */
.bimtraza-capa-color-grid.hidden {
  display: none !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

/* Paleta flotante (portal en body): estilos autónomos, sin depender de la tabla. */
.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal {
  position: fixed;
  display: grid;
  grid-template-columns: repeat(6, 1.35rem);
  gap: 4px;
  padding: 8px;
  box-sizing: border-box;
  width: max-content;
  max-width: min(300px, calc(100vw - 16px));
  background: #fff;
  border: 1px solid var(--border, #cbd5e1);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.2);
  z-index: 20050;
  pointer-events: auto;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--ral {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: min(360px, calc(100vw - 16px));
  max-width: min(360px, calc(100vw - 16px));
  max-height: min(460px, calc(100vh - 24px));
  padding: 8px;
  grid-template-columns: unset;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--ral.bimtraza-capa-color-grid--compact {
  width: min(300px, calc(100vw - 16px));
  max-width: min(300px, calc(100vw - 16px));
  max-height: min(400px, calc(100vh - 24px));
  padding: 6px;
}

.bimtraza-capa-ral-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.bimtraza-capa-ral-head strong {
  font-size: 11px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: 0.02em;
}

.bimtraza-capa-ral-count {
  font-size: 10px;
  color: #64748b;
  font-weight: 600;
}

.bimtraza-capa-ral-filter {
  flex: 1 1 120px;
  min-width: 0;
  height: 26px;
  box-sizing: border-box;
  padding: 2px 8px;
  font-size: 11px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #f8fafc;
  color: #0f172a;
}

.bimtraza-capa-ral-filter:focus {
  outline: 2px solid #2563eb;
  outline-offset: 0;
  background: #fff;
}

.bimtraza-capa-ral-swatches {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 3px;
  overflow-x: hidden;
  overflow-y: auto;
  min-height: 120px;
  flex: 1 1 auto;
  padding: 2px;
  -webkit-overflow-scrolling: touch;
}

.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--ral.bimtraza-capa-color-grid--compact .bimtraza-capa-ral-swatches {
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: 2px;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--ral .bimtraza-capa-color-pick {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  min-height: 16px;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.18);
  border-radius: 3px;
  cursor: pointer;
  box-sizing: border-box;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--ral .bimtraza-capa-color-pick[hidden] {
  display: none !important;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--compact {
  grid-template-columns: repeat(6, 1rem);
  gap: 2px;
  padding: 4px;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal .bimtraza-capa-color-pick {
  width: 1.35rem;
  height: 1.35rem;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.2);
  border-radius: 3px;
  cursor: pointer;
  box-sizing: border-box;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal.bimtraza-capa-color-grid--compact:not(.bimtraza-capa-color-grid--ral) .bimtraza-capa-color-pick {
  width: 1rem;
  height: 1rem;
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal .bimtraza-capa-color-pick:hover {
  transform: scale(1.08);
}

.bimtraza-capa-color-grid.bimtraza-capa-color-grid--portal .bimtraza-capa-color-pick.is-active {
  outline: 2px solid #0ea5e9;
  outline-offset: 1px;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-color-pick {
  width: 1.35rem;
  height: 1.35rem;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.2);
  border-radius: 3px;
  cursor: pointer;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-color-pick:hover {
  transform: scale(1.08);
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-color-pick.is-active {
  outline: 2px solid #0ea5e9;
  outline-offset: 1px;
}

.ifc-info-table--capas-bimtraza-grid .bimtraza-capa-col-material {
  width: 2.35rem;
  max-width: 2.35rem;
  padding: 0;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-cell {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0;
  overflow: visible;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-cell:focus-within {
  z-index: 3;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 100%;
  min-height: 1.5rem;
  box-sizing: border-box;
  padding: 1px;
  background: #f8fafc;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-preview {
  flex-shrink: 0;
  width: 0.85rem;
  height: 0.85rem;
  border: 1px solid rgba(15, 23, 42, 0.2);
  border-radius: 2px;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-preview--empty {
  display: none;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-trigger {
  flex-shrink: 0;
  min-width: 1.35rem;
  height: 1.35rem;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 2px;
  background: transparent;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  position: relative;
  z-index: 2;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-trigger:hover,
.ifc-info-table--capas-bimtraza .bimtraza-capa-material-trigger:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: -1px;
  background: #eff6ff;
}

.bimtraza-capa-material-menu {
  position: fixed;
  z-index: 20050;
  min-width: 9.5rem;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.22);
}

.bimtraza-capa-material-menu.hidden {
  display: none;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-pick,
.bimtraza-capa-material-menu .bimtraza-capa-material-pick {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 4px 6px;
  border: none;
  border-radius: 4px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-pick:hover,
.bimtraza-capa-material-menu .bimtraza-capa-material-pick:hover {
  background: #eff6ff;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-pick.is-active,
.bimtraza-capa-material-menu .bimtraza-capa-material-pick.is-active {
  background: #dbeafe;
  box-shadow: inset 0 0 0 1px #2563eb;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-swatch,
.bimtraza-capa-material-menu .bimtraza-capa-material-swatch {
  flex-shrink: 0;
  width: 1.1rem;
  height: 1.1rem;
  border: 1px solid rgba(15, 23, 42, 0.18);
  border-radius: 2px;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-pick-text,
.bimtraza-capa-material-menu .bimtraza-capa-material-pick-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-pick-label {
  font-size: 11px;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.15;
}

.ifc-info-table--capas-bimtraza .bimtraza-capa-material-pick-dens {
  font-size: 9px;
  color: #64748b;
  line-height: 1.1;
}

.bimtraza-mat-acero {
  background:
    repeating-linear-gradient(0deg, rgba(120, 130, 145, 0.2) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, #d8dce2 0%, #b0b8c2 100%);
}

.bimtraza-mat-inox {
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 1) 0 1px, transparent 1px 6px),
    repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.95) 0 3px, transparent 3px 12px),
    linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
  box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.9);
}

.bimtraza-mat-soldadura {
  background:
    repeating-linear-gradient(0deg, rgba(184, 115, 51, 0.28) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, #e8c56a 0%, #d4a04a 55%, #b87333 100%);
}

.bimtraza-mat-concreto {
  background:
    radial-gradient(circle at 20% 30%, #cbd5e1 0 1px, transparent 1px 100%),
    radial-gradient(circle at 70% 60%, #94a3b8 0 1px, transparent 1px 100%),
    #d1d5db;
}

.bimtraza-mat-plastico {
  background: linear-gradient(135deg, #93c5fd 0%, #3b82f6 55%, #1d4ed8 100%);
}

.bimtraza-mat-suelo {
  background:
    repeating-linear-gradient(0deg, rgba(69, 26, 3, 0.15) 0 2px, transparent 2px 4px),
    linear-gradient(180deg, #a16207 0%, #78350f 100%);
}

.bimtraza-mat-madera {
  background:
    repeating-linear-gradient(90deg, #d97706 0 3px, #b45309 3px 6px, #fbbf24 6px 9px),
    linear-gradient(180deg, #fde68a 0%, #d97706 100%);
}

.bimtraza-mat-vidrio {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.85) 0%, rgba(186, 230, 253, 0.55) 45%, rgba(147, 197, 253, 0.35) 100%);
  box-shadow: inset 0 0 0 1px rgba(59, 130, 246, 0.35);
}

.ifc-info-table--capas-bimtraza:not(.ifc-info-table--capas-bimtraza-grid) .bimtraza-capa-text-input {
  width: 100%;
  min-width: 4rem;
  box-sizing: border-box;
  padding: 4px 6px;
  font-size: 12px;
  border: 1px solid var(--border, #cbd5e1);
  border-radius: 4px;
}

.bimtraza-capa-assign-label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 600;
}

.bimtraza-capa-assign-select {
  width: 100%;
  padding: 8px 10px;
  font-size: 13px;
  border-radius: 6px;
  border: 1px solid var(--border, #cbd5e1);
  box-sizing: border-box;
}

#bimtraza-capa-assign-modal .bimtraza-capa-assign-modal-dialog {
  width: min(96vw, 820px);
  max-width: 96vw;
}

.bimtraza-capa-assign-modal-head {
  flex-shrink: 0;
  padding: 12px 14px 8px;
}

.bimtraza-capa-assign-modal-head h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.bimtraza-capa-assign-toolbar {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 8px;
  flex-shrink: 0;
  padding: 0 14px 12px;
  border-bottom: 1px solid var(--border);
}

.bimtraza-capa-assign-toolbar-btn {
  flex: 1 1 0;
  min-width: 0;
  justify-content: center;
  text-align: center;
}

.bimtraza-capa-assign-toolbar .btn-trazabilidad-assign-confirm {
  min-width: 0;
}

#bimtraza-capa-assign-modal .trazabilidad-assign-modal-body {
  padding: 10px 12px;
}

.bimtraza-capa-assign-table-wrap {
  overflow-x: auto;
  margin-bottom: 8px;
}

.bimtraza-capa-assign-table-wrap .ifc-info-table--capas-bimtraza {
  min-width: 580px;
}

.bimtraza-capa-assign-pick-row {
  background: rgba(14, 165, 233, 0.12);
  box-shadow: inset 0 0 0 2px #0ea5e9;
}

.bimtraza-capa-assign-pick-row td {
  background: transparent;
}

tr[data-bimtraza-capa-row].is-cad-drawing-layer {
  background: rgba(13, 148, 136, 0.16);
  box-shadow: inset 0 0 0 2px #0d9488;
}

tr[data-bimtraza-capa-row].is-cad-drawing-layer td {
  background: transparent;
}

.viewer-capas-bimtraza-float {
  position: absolute;
  top: 0;
  right: 0;
  /* Altura del viewport 3D (como el panel izquierdo), sin tapar COMMANDE/OSNAP. */
  bottom: var(--viewer-bottom-chrome-h, 56px);
  z-index: 45;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: auto;
  min-width: 0;
  max-width: min(320px, 36vw);
  max-height: none;
  /* Acoplado al borde: sin margen ni “tarjeta flotante” separada. */
  background: #ffffff;
  border: none;
  border-left: 2px solid #2563eb;
  border-radius: 0;
  box-shadow: -4px 0 14px rgba(15, 23, 42, 0.12);
  pointer-events: auto;
  overflow: hidden;
  isolation: isolate;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  box-sizing: border-box;
}

.viewer-capas-bimtraza-float.hidden {
  display: none;
}

.viewer-capas-bimtraza-float-toggle {
  flex: 0 0 auto;
  align-self: stretch;
  width: 1.35rem;
  min-width: 1.35rem;
  margin: 0;
  padding: 0;
  border: none;
  border-right: 1px solid #bfdbfe;
  border-radius: 0;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  color: #1e3a8a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.viewer-capas-bimtraza-float-toggle:hover,
.viewer-capas-bimtraza-float-toggle:focus-visible {
  background: #bfdbfe;
  outline: none;
}

.viewer-capas-bimtraza-float-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: min(286px, 33vw);
  max-width: min(286px, 33vw);
  min-height: 0;
}

.viewer-capas-bimtraza-float.is-collapsed {
  max-width: none;
  width: auto;
  box-shadow: -2px 0 8px rgba(15, 23, 42, 0.1);
}

.viewer-capas-bimtraza-float.is-collapsed .viewer-capas-bimtraza-float-panel {
  display: none;
}

.viewer-capas-bimtraza-float.is-collapsed .viewer-capas-bimtraza-float-toggle {
  border-right: none;
  width: 1.5rem;
  min-width: 1.5rem;
}

.viewer-capas-bimtraza-float-head {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  flex-shrink: 0;
  padding: 5px 6px;
  border-bottom: 1px solid #bfdbfe;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border-radius: 0;
}

.viewer-capas-bimtraza-float-head strong {
  font-size: 11px;
  font-weight: 700;
  color: #1e3a8a;
  white-space: nowrap;
}

.viewer-capas-bimtraza-float-head .btn-bimtraza-capa-add {
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  color: #2563eb;
  background: #fff;
  border: 1px solid #93c5fd;
}

.viewer-capas-bimtraza-float-head .btn-bimtraza-capa-add:hover {
  background: #eff6ff;
  border-color: #2563eb;
}

.viewer-capas-bimtraza-float-toolbar {
  flex-shrink: 0;
  padding: 5px 6px;
  border-bottom: 1px solid #bfdbfe;
  background: #f8fafc;
}

.bimtraza-capas-render-mode {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 4px;
}

.bimtraza-capas-render-mode-btn {
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  box-sizing: border-box;
  padding: 5px 6px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  color: #1e40af;
  background: #fff;
  border: 1px solid #93c5fd;
  border-radius: 4px;
  cursor: pointer;
}

.bimtraza-capas-render-mode-btn:hover,
.bimtraza-capas-render-mode-btn:focus-visible {
  background: #eff6ff;
  border-color: #3b82f6;
  outline: none;
}

.bimtraza-capas-render-mode-btn.is-active {
  color: #fff;
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  border-color: #1d4ed8;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.viewer-capas-bimtraza-float-head .btn {
  padding: 2px 6px;
  font-size: 10px;
  line-height: 1.2;
  white-space: nowrap;
}

.viewer-capas-bimtraza-float-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 3px 4px;
  overflow: auto;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-grid {
  overflow: visible;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-grid {
  font-size: 10px;
  line-height: 1.1;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact th,
.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact td {
  height: 1.35rem;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact th {
  font-size: 9px;
  padding: 1px 2px;
  text-align: center;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-col-check {
  width: 1.45rem;
  max-width: 1.45rem;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-col-color {
  width: 1.75rem;
  max-width: 1.75rem;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-color-swatch {
  min-height: 1.35rem;
  min-width: 1.35rem;
  position: relative;
  z-index: 1;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-col-material {
  width: 2rem;
  max-width: 2rem;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-material-wrap {
  min-height: 1.35rem;
  padding: 0 1px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-material-trigger {
  min-width: 1.2rem;
  height: 1.2rem;
  font-size: 11px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-material-pick-label {
  font-size: 10px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-material-pick-dens {
  font-size: 8px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-col-del {
  width: 1.35rem;
  max-width: 1.35rem;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-col-nombre {
  width: 28%;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-check {
  width: 0.78rem;
  height: 0.78rem;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-text-input {
  min-height: 1.35rem;
  font-size: 10px;
  padding: 1px 3px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-del-btn {
  min-height: 1.35rem;
  font-size: 10px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .ifc-info-empty-cell {
  font-size: 10px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-color-grid {
  grid-template-columns: repeat(6, 1rem);
  gap: 2px;
  padding: 4px;
  left: auto;
  right: 0;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-new-btn {
  font-size: 10px;
  padding: 2px 5px;
}

.viewer-capas-bimtraza-float-body .ifc-info-table--capas-bimtraza-compact .bimtraza-capa-color-pick {
  width: 1rem;
  height: 1rem;
}

.viewer-datos-wrap {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  max-width: min(720px, 92vw);
  pointer-events: auto;
}

.viewer-datos-wrap.hidden {
  display: none;
}

.viewer-datos-label {
  display: inline-flex;
  align-items: center;
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  color: #0f172a;
  background: linear-gradient(180deg, #e0f2fe 0%, #bae6fd 100%);
  border: 1px solid rgba(56, 189, 248, 0.75);
  border-radius: 8px 0 0 8px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  white-space: nowrap;
  user-select: none;
}

.viewer-datos-select {
  min-width: 118px;
  max-width: min(150px, 36vw);
  padding: 8px 28px 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  color: #0f172a;
  background: linear-gradient(180deg, #f0f9ff 0%, #dbeafe 100%);
  border: 1px solid rgba(56, 189, 248, 0.75);
  border-left: none;
  border-radius: 0 8px 8px 0;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  appearance: auto;
}

.viewer-datos-face-select {
  min-width: 132px;
  max-width: min(200px, 42vw);
  border-left: 1px solid rgba(56, 189, 248, 0.75);
  border-radius: 8px;
  margin-left: 2px;
}

.viewer-datos-face-select.hidden {
  display: none;
}

.viewer-datos-select:hover:not(:disabled) {
  filter: brightness(1.03);
}

.viewer-datos-select:focus {
  outline: none;
  border-color: #0284c7;
  box-shadow: 0 0 0 2px rgba(14, 165, 233, 0.35);
}

.viewer-datos-select:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.viewer-datos-value {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
  background: transparent;
  text-shadow:
    0 0 6px rgba(255, 255, 255, 0.95),
    0 1px 2px rgba(255, 255, 255, 0.9),
    0 0 1px #fff;
  white-space: nowrap;
  pointer-events: none;
}

.viewer-datos-value.hidden {
  display: none;
}

.trazabilidad-assign-modal {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  padding: 68px 8px 178px 8px;
}

.trazabilidad-assign-modal.hidden {
  display: none;
}

.trazabilidad-assign-modal-backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.72);
  cursor: pointer;
}

.trazabilidad-assign-modal-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
  min-height: 0;
}

.trazabilidad-assign-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
  padding: 14px 14px 10px;
  border-bottom: 1px solid var(--border);
}

.trazabilidad-assign-modal-head h2 {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 700;
}

.trazabilidad-assign-modal-hint {
  margin: 0;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.35;
  max-width: 64ch;
}

.trazabilidad-assign-modal-body {
  flex: 1 1 auto;
  min-height: 120px;
  padding: 8px 10px;
  overflow: auto;
}

.trazabilidad-assign-modal-foot {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 10px 14px 14px;
  border-top: 1px solid var(--border);
}

.trazabilidad-assign-modal-feedback {
  margin: 0;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  color: #0f172a;
  background: #f1f5f9;
  border-top: 1px solid var(--border);
}

.trazabilidad-assign-modal-feedback[hidden] {
  display: none !important;
}

.trazabilidad-assign-modal-feedback.is-error {
  color: #991b1b;
  background: #fef2f2;
}

.trazabilidad-assign-modal-feedback.is-ok {
  color: #14532d;
  background: #ecfdf5;
}

/* Misma altura y tipografía que .btn.small (Annuler). */
.trazabilidad-assign-modal-foot > .btn {
  box-sizing: border-box;
  height: 30px;
  min-height: 30px;
  max-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.2;
}

.trazabilidad-assign-modal-foot .btn.small {
  width: auto;
  margin: 0;
}

#btn-trazabilidad-assign-delete {
  margin-right: 0;
  white-space: nowrap;
}

/* ——— Reconnaissance faciale (bas du modal GAMME) ——— */
.face-auth-panel {
  flex-shrink: 0;
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  padding: 10px 14px 12px;
}

.face-auth-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 14px;
  margin-bottom: 8px;
}

.face-auth-panel-head strong {
  font-size: 13px;
  color: #0f172a;
}

.face-auth-panel-hint {
  font-size: 11px;
  color: #64748b;
}

.face-auth-panel-body {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: flex-start;
}

.face-auth-preview-wrap {
  position: relative;
  width: 160px;
  height: 120px;
  border-radius: 10px;
  overflow: hidden;
  background: #0f172a;
  border: 1px solid #334155;
  flex: 0 0 auto;
  isolation: isolate;
  contain: paint;
}

.face-auth-preview-wrap.is-scanning {
  border-color: #1e293b;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.35);
}

.face-auth-preview-wrap.is-detecting {
  border-color: #475569;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.45);
}

.face-auth-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scaleX(-1);
  background: #020617;
}

.face-auth-oval {
  display: none !important;
}

.face-auth-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}

.face-auth-detect-badge {
  position: absolute;
  left: 6px;
  bottom: 6px;
  z-index: 3;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #e2e8f0;
  background: rgba(15, 23, 42, 0.78);
  padding: 2px 7px;
  border-radius: 4px;
  max-width: calc(100% - 12px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.face-auth-detect-badge.is-on {
  color: #a5f3fc;
  background: rgba(8, 47, 73, 0.88);
}

.face-auth-actions {
  flex: 1 1 220px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.face-auth-name-label {
  flex: 1 1 100%;
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  margin: 0;
}

.face-auth-name-input {
  flex: 1 1 160px;
  min-width: 120px;
  max-width: 100%;
  height: 30px;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  padding: 0 8px;
  font-size: 12px;
}

.face-auth-list {
  flex: 1 1 100%;
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 110px;
  overflow: auto;
}

.face-auth-list-empty {
  font-size: 11px;
  color: #64748b;
  padding: 4px 0;
}

.face-auth-list-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 12px;
}

.face-auth-list-name {
  font-weight: 700;
  color: #0f172a;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.face-auth-list-meta {
  font-size: 10px;
  color: #64748b;
  flex: 0 0 auto;
}

.face-auth-list-del {
  flex: 0 0 auto;
  min-width: 28px;
  padding: 0 6px !important;
  line-height: 1.2;
}

.face-auth-btn-enroll {
  background: linear-gradient(180deg, #bfdbfe 0%, #3b82f6 100%) !important;
  color: #fff !important;
  border-color: #1d4ed8 !important;
}

.face-auth-btn-verify {
  background: linear-gradient(180deg, #bbf7d0 0%, #22c55e 100%) !important;
  color: #fff !important;
  border-color: #16a34a !important;
}

.face-auth-panel.face-auth--unlocked .face-auth-btn-verify {
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.35);
}

.face-auth-status {
  flex: 1 1 100%;
  margin: 4px 0 0;
  font-size: 11px;
  font-weight: 600;
  color: #475569;
  line-height: 1.35;
}

.face-auth-status.is-ok {
  color: #15803d;
}

.face-auth-status.is-err {
  color: #b91c1c;
}

.face-auth-panel.face-auth-panel--verify {
  border-top: none;
  background: transparent;
  padding: 8px 14px 14px;
}

.face-auth-verify-dialog {
  width: min(420px, calc(100vw - 24px)) !important;
  height: auto !important;
  max-height: min(88vh, 520px) !important;
  flex: 0 0 auto !important;
  align-self: center !important;
  margin: auto !important;
}

#btn-trazabilidad-generar-formulario-ia,
.btn-trazabilidad-formulario-ia {
  margin-right: auto;
  white-space: nowrap;
  color: #0f172a !important;
  background: linear-gradient(180deg, #a5f3fc 0%, #22d3ee 55%, #06b6d4 100%) !important;
  border: 1px solid #0891b2 !important;
  box-shadow: 0 1px 2px rgba(8, 145, 178, 0.25);
}

#btn-trazabilidad-generar-formulario-ia:hover:not(:disabled),
.btn-trazabilidad-formulario-ia:hover:not(:disabled) {
  background: linear-gradient(180deg, #67e8f9 0%, #06b6d4 100%) !important;
  border-color: #0e7490 !important;
}

.traza-formulario-ia-modal {
  position: fixed;
  inset: 0;
  z-index: 1250;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

.traza-formulario-ia-modal.hidden {
  display: none;
}

.traza-formulario-ia-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(15, 23, 42, 0.55);
  cursor: pointer;
}

.traza-formulario-ia-dialog {
  position: relative;
  z-index: 1;
  width: min(980px, 96vw);
  max-height: min(88vh, 920px);
  display: flex;
  flex-direction: column;
  background: #f8fafc;
  color: #0f172a;
  border: 1px solid #94a3b8;
  border-radius: 10px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}

.traza-formulario-ia-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid #cbd5e1;
  background: linear-gradient(180deg, #ecfeff 0%, #f8fafc 100%);
}

.traza-formulario-ia-head h2 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.traza-formulario-ia-hint {
  margin: 4px 0 0;
  font-size: 0.82rem;
  color: #475569;
  max-width: 62ch;
}

.traza-formulario-ia-summary {
  padding: 8px 16px;
  font-size: 0.8rem;
  color: #334155;
  background: #f1f5f9;
  border-bottom: 1px solid #e2e8f0;
}

.traza-formulario-ia-body {
  flex: 1 1 auto;
  min-height: 160px;
  padding: 10px 14px 14px;
  overflow: auto;
}

.traza-formulario-ia-foot {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 10px 14px 14px;
  border-top: 1px solid #cbd5e1;
  background: #fff;
}

#btn-traza-formulario-ia-exhaustive,
.btn-traza-formulario-ia-exhaustive {
  white-space: nowrap;
  color: #0f172a !important;
  background: linear-gradient(180deg, #fdba74 0%, #f97316 55%, #ea580c 100%) !important;
  border: 1px solid #c2410c !important;
  box-shadow: 0 1px 2px rgba(194, 65, 12, 0.25);
}

#btn-traza-formulario-ia-exhaustive:hover:not(:disabled),
.btn-traza-formulario-ia-exhaustive:hover:not(:disabled) {
  background: linear-gradient(180deg, #fb923c 0%, #ea580c 100%) !important;
  border-color: #9a3412 !important;
}

#btn-traza-formulario-ia-exhaustive:disabled,
.btn-traza-formulario-ia-exhaustive:disabled {
  opacity: 0.65;
  cursor: wait;
}

.traza-fia-card {
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  margin-bottom: 10px;
  overflow: hidden;
}

.traza-fia-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.traza-fia-card-head label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 0.88rem;
  cursor: pointer;
  flex: 1;
  min-width: 0;
}

.traza-fia-badge {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 999px;
  background: #cffafe;
  color: #155e75;
  border: 1px solid #67e8f9;
}

.traza-fia-card-body {
  padding: 8px 10px 10px;
  display: grid;
  gap: 8px;
}

.traza-fia-field {
  display: grid;
  grid-template-columns: minmax(120px, 180px) 1fr;
  gap: 6px 10px;
  align-items: start;
}

.traza-fia-field-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: #475569;
  padding-top: 6px;
}

.traza-fia-field-controls {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.traza-fia-field-controls input,
.traza-fia-field-controls select,
.traza-fia-field-controls textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  padding: 5px 8px;
  font: inherit;
  font-size: 0.82rem;
  background: #fff;
}

.traza-fia-alts {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.traza-fia-alt-btn {
  border: 1px solid #94a3b8;
  background: #f1f5f9;
  color: #0f172a;
  border-radius: 8px;
  padding: 4px 9px;
  font-size: 0.72rem;
  line-height: 1.35;
  cursor: pointer;
  max-width: 100%;
  white-space: normal;
  text-align: left;
}

.traza-fia-tip {
  margin: 0 0 6px;
  padding: 6px 8px;
  font-size: 0.75rem;
  color: #0e7490;
  background: #ecfeff;
  border: 1px solid #a5f3fc;
  border-radius: 6px;
}

.traza-fia-alt-btn:hover {
  background: #e0f2fe;
  border-color: #38bdf8;
}

.traza-fia-alt-btn.is-active {
  background: #22d3ee;
  border-color: #0891b2;
  font-weight: 700;
}

.traza-fia-empty {
  padding: 24px 12px;
  text-align: center;
  color: #64748b;
  font-size: 0.9rem;
}

@media (max-width: 720px) {
  .traza-fia-field {
    grid-template-columns: 1fr;
  }
  .traza-fia-field-label {
    padding-top: 0;
  }
}

#btn-trazabilidad-assign-close,
.btn-trazabilidad-assign-close {
  margin-left: 2px;
  white-space: nowrap;
  color: #000 !important;
  background: #f87171 !important;
  border: 1px solid #ef4444 !important;
  box-shadow: 0 1px 2px rgba(127, 29, 29, 0.12);
}

#btn-trazabilidad-assign-close:hover:not(:disabled),
.btn-trazabilidad-assign-close:hover:not(:disabled) {
  color: #000 !important;
  background: #ef4444 !important;
  border-color: #dc2626 !important;
}

#btn-trazabilidad-assign-by-project,
.btn-trazabilidad-assign-project {
  min-width: 120px;
  color: #1d4ed8 !important;
  background: var(--btn-cta-sky) !important;
  border: 1px solid var(--btn-cta-sky-border) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

#btn-trazabilidad-assign-by-project:hover:not(:disabled),
.btn-trazabilidad-assign-project:hover:not(:disabled) {
  color: #1e40af !important;
  background: var(--btn-cta-sky-hover) !important;
  border-color: var(--accent) !important;
}

.btn-trazabilidad-assign-confirm {
  min-width: 120px;
  color: #431407 !important;
  background: linear-gradient(180deg, #fdba74 0%, #f97316 100%) !important;
  border-color: rgba(251, 146, 60, 0.85) !important;
}

/* Modal documento ISO (formato según operación) */
.traza-iso-doc-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}

.traza-iso-doc-modal.hidden {
  display: none;
}

.traza-iso-doc-backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.78);
  cursor: pointer;
}

.traza-iso-doc-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(1180px, 96vw);
  max-height: min(92vh, 900px);
  margin: 0;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 20px 56px rgba(0, 0, 0, 0.5);
  min-height: 0;
}

.traza-iso-doc-modal--wide {
  padding: 4px;
  align-items: stretch;
  justify-content: stretch;
}

.traza-iso-doc-modal--wide .traza-iso-doc-dialog {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.traza-iso-doc-modal--wide .traza-iso-doc-head {
  flex-shrink: 0;
  padding: 6px 12px;
}

.traza-iso-doc-modal--wide .traza-iso-doc-head h2 {
  font-size: 14px;
}

.traza-iso-doc-modal--wide .traza-iso-doc-tabs,
.traza-iso-doc-modal--wide .traza-iso-doc-foot {
  flex-shrink: 0;
}

/* Pane Modifier : scroll VERTICAL à droite (toute la fiche) */
.traza-iso-doc-modal--wide #traza-iso-doc-edit-pane {
  display: block;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #64748b #e2e8f0;
  background: #fff;
}

.traza-iso-doc-modal--wide #traza-iso-doc-edit-pane::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

.traza-iso-doc-modal--wide #traza-iso-doc-edit-pane::-webkit-scrollbar-thumb {
  background: #64748b;
  border-radius: 6px;
  border: 2px solid #e2e8f0;
}

.traza-iso-doc-modal--wide #traza-iso-doc-edit-pane::-webkit-scrollbar-track {
  background: #e2e8f0;
}

.traza-iso-doc-modal--wide .traza-iso-doc-body-inner {
  display: block;
  height: auto;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
  padding: 4px 8px 12px;
  background: #fff;
  box-sizing: border-box;
}

/* Aperçu : garde le flex + scroll interne */
.traza-iso-doc-modal--wide #traza-iso-doc-preview-pane {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  max-width: 100%;
}

.traza-iso-doc-modal--wide #traza-iso-doc-preview-pane.hidden {
  display: none;
}

/* Section tableau : largeur bornée → scroll HORIZONTAL en bas du tableau */
.traza-iso-doc-modal--wide .traza-iso-section:has(.traza-tss-doc) {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: visible;
}

.traza-iso-doc-modal--wide .traza-iso-section:has(.traza-tss-doc) .traza-iso-section-body {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: visible;
  padding: 6px 8px 8px;
}

.traza-iso-section-body:has(.traza-tss-doc) {
  padding: 6px 8px 8px;
}

.traza-iso-section-body .traza-tss-doc {
  height: auto;
  min-height: 280px;
  min-width: 0;
  max-width: 100%;
  width: 100%;
}

.traza-iso-section-body .traza-tss-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 280px;
  max-height: min(58vh, 680px);
  height: min(58vh, 680px);
}

.traza-tss-doc {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: #fff;
  color: #000;
  overflow: hidden;
}

.traza-tss-scroll {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #fff;
  border: 1px solid #000;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #64748b #e2e8f0;
}

.traza-tss-scroll::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

.traza-tss-scroll::-webkit-scrollbar-thumb {
  background: #64748b;
  border-radius: 6px;
  border: 2px solid #e2e8f0;
}

.traza-tss-scroll::-webkit-scrollbar-track {
  background: #e2e8f0;
}

.traza-tss-sheet {
  display: block;
  width: 2200px;
  min-width: 2200px;
  max-width: none;
  box-sizing: border-box;
  padding: 6px;
}

.traza-tss-topbar {
  display: grid;
  grid-template-columns: minmax(260px, 1.1fr) minmax(420px, 1.4fr);
  grid-template-rows: auto auto;
  gap: 0;
  border: 1.5px solid #000;
  margin-bottom: 8px;
  background: #fff;
  width: 100%;
}

.traza-tss-topbar-title {
  grid-row: 1 / 3;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  border-right: 1.5px solid #000;
  font-size: 18px;
  font-weight: 800;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.2;
}

.traza-tss-topbar-meta {
  display: grid;
  grid-template-columns: 1.2fr 1.5fr 0.7fr;
  border-bottom: 1.5px solid #000;
}

.traza-tss-topbar-field,
.traza-tss-topbar-designation {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 8px;
  min-width: 0;
  border-right: 1.5px solid #000;
}

.traza-tss-topbar-field:last-child,
.traza-tss-topbar-designation {
  border-right: none;
}

.traza-tss-topbar-designation {
  grid-column: 2;
}

.traza-tss-topbar-field > span,
.traza-tss-topbar-designation > span {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: #111;
}

.traza-tss-topbar .traza-tss-input,
.traza-tss-topbar .traza-iso-doc-input.traza-tss-input {
  min-height: 28px;
  font-size: 14px !important;
  font-weight: 700;
  text-align: left;
  padding: 2px 4px;
  border: 0 !important;
  background: transparent !important;
}

.traza-tss-table--excel {
  width: 2200px;
  min-width: 2200px;
  max-width: none;
  border-collapse: collapse;
  table-layout: fixed;
  font-family: "Segoe UI", "Aptos Narrow", Arial, sans-serif;
  font-size: 12px;
  color: #000;
  background: #fff;
}

.traza-tss-table--excel th,
.traza-tss-table--excel td {
  border: 1px solid #000;
  padding: 0;
  text-align: center;
  vertical-align: middle;
  background: #fff;
  overflow: visible;
}

.traza-tss-data-row td {
  height: auto;
  min-height: 32px;
}

.traza-tss-table--excel .traza-tss-input,
.traza-tss-table--excel .traza-iso-doc-input.traza-tss-input {
  width: 100%;
  min-width: 0;
  min-height: 30px;
  height: auto;
  box-sizing: border-box;
  margin: 0;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: inherit;
  font-size: 12px !important;
  font-weight: 600;
  text-align: center;
  padding: 4px 3px;
  color: #000;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
  line-height: 1.25;
}

.traza-tss-table--excel select.traza-tss-select {
  cursor: pointer;
  appearance: auto;
  -webkit-appearance: menulist;
  text-align-last: center;
  padding-left: 1px;
  padding-right: 1px;
  white-space: normal;
  height: auto;
  min-height: 30px;
}

.traza-tss-group-row .traza-tss-group {
  font-size: 13px !important;
  font-weight: 800 !important;
  background: #f3f4f6 !important;
  padding: 7px 4px !important;
}

.traza-tss-sub {
  font-size: 12px !important;
  font-weight: 800 !important;
  background: #eef2ff !important;
  padding: 4px !important;
}

.traza-tss-col {
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.15;
  text-transform: uppercase;
  background: #fff !important;
  padding: 5px 2px !important;
  /* Nunca partir palabras (TYPE ASSEM-BLAGE, etc.) — solo saltar en espacios. */
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  -webkit-hyphens: none;
}

.traza-tss-spacer-row td {
  border-left: none !important;
  border-right: none !important;
  height: 14px;
  background: #fff !important;
}

.traza-tss-table--excel input[type="date"].traza-tss-date {
  cursor: pointer;
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0 !important;
  box-sizing: border-box;
  overflow: hidden;
  font-size: 10px !important;
  font-weight: 600;
  padding: 0 2px;
  line-height: 1.2;
  color-scheme: light;
}

.traza-tss-table--excel input[type="date"].traza-tss-date::-webkit-datetime-edit {
  padding: 0;
  min-width: 0;
}

.traza-tss-table--excel input[type="date"].traza-tss-date::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}

.traza-tss-table--excel input[type="date"].traza-tss-date::-webkit-calendar-picker-indicator {
  cursor: pointer;
  width: 12px;
  height: 12px;
  padding: 0;
  margin: 0 0 0 1px;
  opacity: 0.9;
  flex-shrink: 0;
}

.traza-tss-table--excel .traza-tss-input:focus,
.traza-tss-table--excel .traza-iso-doc-input.traza-tss-input:focus {
  outline: 2px solid #0d9488;
  outline-offset: -2px;
  background: #ecfeff !important;
  position: relative;
  z-index: 1;
}

/* Más espacio útil: cabecera ISO compacta en modo carnet */
.traza-iso-doc-modal--wide .traza-iso-doc-head {
  padding: 4px 10px !important;
}

.traza-iso-doc-modal--wide .traza-iso-doc-norma,
.traza-iso-doc-modal--wide .traza-iso-doc-context {
  display: none;
}

.traza-iso-doc-modal--wide .traza-iso-doc-head h2 {
  font-size: 13px !important;
  margin: 0 !important;
}

.traza-iso-doc-modal--wide .traza-iso-doc-tabs {
  display: flex;
  padding: 0 10px;
}

.traza-iso-doc-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(59, 130, 246, 0.08) 0%, transparent 100%);
}

.traza-iso-doc-head h2 {
  margin: 0 0 4px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.traza-iso-doc-norma,
.traza-iso-doc-context {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}

.traza-iso-doc-context {
  margin-top: 2px;
}

.traza-iso-doc-body {
  flex: 1 1 auto;
  min-height: 200px;
  padding: 12px 16px 16px;
  overflow: auto;
  background: rgba(0, 0, 0, 0.12);
}

.traza-iso-doc-body-inner {
  min-height: 0;
}

.traza-iso-doc-tabs {
  display: flex;
  gap: 0;
  flex-shrink: 0;
  padding: 0 16px;
  border-bottom: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.02);
}

.traza-iso-doc-tab {
  appearance: none;
  border: none;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  padding: 10px 16px;
  cursor: pointer;
  margin-bottom: -1px;
}

.traza-iso-doc-tab:hover {
  color: var(--text);
}

.traza-iso-doc-tab.is-active {
  color: #1d4ed8;
  border-bottom-color: #1d4ed8;
}

.traza-iso-doc-pane {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

.traza-iso-doc-preview-pane {
  display: flex;
  flex-direction: column;
  background: #e8ecf1;
}

.traza-iso-doc-preview-pane.hidden {
  display: none;
}

.traza-iso-preview-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
  padding: 8px 16px;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
}

.traza-iso-preview-hint {
  font-size: 12px;
  color: var(--muted);
}

.traza-iso-preview-frame-wrap {
  flex: 1 1 auto;
  min-height: 320px;
  padding: 16px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.traza-iso-preview-frame {
  width: min(794px, 100%);
  height: min(1123px, 70vh);
  min-height: 480px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.18);
}

/* Aperçu TSS / landscape : cadre plus large + scroll pour voir tout le tableau */
.traza-iso-doc-modal--wide .traza-iso-preview-frame-wrap {
  justify-content: flex-start;
  padding: 12px;
}

.traza-iso-doc-modal--wide .traza-iso-preview-frame {
  width: min(1280px, 98%);
  height: min(860px, 78vh);
  min-width: min(960px, 100%);
  min-height: 560px;
  flex-shrink: 0;
}

.traza-iso-save-overlay {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(3, 10, 24, 0.82);
}

.traza-iso-save-overlay.hidden {
  display: none;
}

.traza-iso-save-overlay-card {
  max-width: 420px;
  width: 100%;
  padding: 28px 24px;
  border-radius: 12px;
  background: #fff;
  color: #0f172a;
  text-align: center;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35);
}

.traza-iso-save-overlay-card p {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
}

.traza-iso-save-overlay-hint {
  margin-top: 10px !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #475569 !important;
}

.traza-iso-save-overlay-spinner {
  width: 36px;
  height: 36px;
  margin: 0 auto 16px;
  border: 3px solid #e2e8f0;
  border-top-color: #1d4ed8;
  border-radius: 50%;
  animation: traza-iso-spin 0.8s linear infinite;
}

@keyframes traza-iso-spin {
  to {
    transform: rotate(360deg);
  }
}

.traza-iso-doc-foot {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 14px 14px;
  border-top: 1px solid var(--border);
}

.traza-iso-doc-foot-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.traza-iso-doc-foot .btn.small {
  width: auto;
  margin: 0;
}

.btn-traza-iso-doc-clear {
  color: #991b1b !important;
  background: #fee2e2 !important;
  border-color: rgba(239, 68, 68, 0.45) !important;
}

.btn-traza-iso-doc-clear:hover {
  background: #fecaca !important;
}

.traza-iso-doc-export-status {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12px;
  color: #1d4ed8;
  text-align: center;
  padding: 0 8px;
}

.traza-iso-doc-foot-actions .btn.small:disabled {
  opacity: 0.55;
  cursor: wait;
}

.traza-iso-doc-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.traza-iso-doc-table th,
.traza-iso-doc-table td {
  border: 1px solid var(--border);
  padding: 7px 10px;
  vertical-align: middle;
  text-align: left;
}

.traza-iso-doc-table th {
  background: #1e3a5f;
  color: #fff;
  font-weight: 600;
  font-size: 12px;
}

.traza-iso-doc-label {
  width: 38%;
  font-weight: 500;
  color: var(--text);
}

.traza-iso-doc-input {
  width: 100%;
  box-sizing: border-box;
  padding: 5px 8px;
  font-size: 13px;
  color: var(--text);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
}

.traza-iso-doc-input:focus {
  outline: none;
  border-color: rgba(59, 130, 246, 0.75);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
}

.traza-iso-meta-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px;
  margin-bottom: 14px;
  padding: 10px 12px;
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.18) 0%, rgba(15, 23, 42, 0.35) 100%);
  border: 1px solid rgba(59, 130, 246, 0.25);
  border-radius: 8px;
}

.traza-iso-meta-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.traza-iso-meta-item span {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.traza-iso-meta-item strong {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  word-break: break-word;
}

.traza-iso-section {
  margin-bottom: 14px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}

.traza-iso-section-head {
  padding: 10px 14px 8px;
  background: linear-gradient(90deg, rgba(59, 130, 246, 0.12) 0%, rgba(59, 130, 246, 0.03) 100%);
  border-bottom: 1px solid var(--border);
}

.traza-iso-section-head h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
}

.traza-iso-section-head p {
  margin: 3px 0 0;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.35;
}

.traza-iso-section-body {
  padding: 12px 14px 14px;
}

.traza-iso-grid {
  display: grid;
  gap: 10px 14px;
}

.traza-iso-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.traza-iso-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.traza-iso-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.traza-iso-stack--dual {
  gap: 12px;
}

.traza-iso-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.traza-iso-field--span2 {
  grid-column: span 2;
}

.traza-iso-field--span3 {
  grid-column: 1 / -1;
}

.traza-iso-field-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.02em;
}

.traza-iso-doc-textarea {
  min-height: 64px;
  resize: vertical;
  font-family: inherit;
  line-height: 1.4;
}

.traza-iso-doc-select {
  cursor: pointer;
}

.traza-iso-dual-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.traza-iso-dual-col {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.traza-iso-dual-hint {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.traza-iso-doc-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.traza-iso-doc-matrix th,
.traza-iso-doc-matrix td {
  border: 1px solid var(--border);
  padding: 6px 8px;
  vertical-align: middle;
}

.traza-iso-doc-matrix th {
  background: #1e3a5f;
  color: #fff;
  font-weight: 600;
  font-size: 11px;
  text-align: left;
}

.traza-iso-matrix-num {
  width: 36px;
  text-align: center;
  font-weight: 700;
  color: #fff;
  background: #1e3a5f;
}

.traza-iso-doc-matrix .traza-iso-doc-input {
  font-size: 12px;
  padding: 4px 6px;
}

.traza-iso-signatures {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.traza-iso-signatures.traza-iso-signatures--1 {
  grid-template-columns: minmax(0, 1fr);
}

.traza-iso-signatures.traza-iso-signatures--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.traza-iso-signatures.traza-iso-signatures--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.traza-iso-signature-card {
  padding: 12px 12px 10px;
  background: #fff;
  border: 1px solid #94a3b8;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.traza-iso-signature-card-title {
  margin: -12px -12px 0;
  padding: 8px 12px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #0f172a;
  background: #e2e8f0;
  border-bottom: 1px solid #94a3b8;
  border-radius: 8px 8px 0 0;
}

.traza-iso-signature-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.traza-iso-signature-row-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.traza-iso-signature-row .traza-iso-field {
  margin: 0;
}

.traza-iso-signature-row .traza-iso-field-label {
  display: none;
}

.traza-iso-signature-line {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #cbd5e1;
  font-size: 10px;
  color: #64748b;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

@media (max-width: 900px) {
  .traza-iso-signatures {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .traza-iso-grid--2,
  .traza-iso-grid--3,
  .traza-iso-dual-inputs {
    grid-template-columns: 1fr;
  }

  .traza-iso-field--span2,
  .traza-iso-field--span3 {
    grid-column: span 1;
  }
}

.ifc-info-table--trazabilidad-assign {
  min-width: 1180px;
}

/* Modal Asignar trazabilidad: casi pantalla completa (área útil / recuadro visor) */
#trazabilidad-assign-modal {
  --traza-assign-scale: 1.4;
  padding: 8px 8px 10px 8px;
  align-items: stretch;
  justify-content: stretch;
}

#trazabilidad-assign-modal .trazabilidad-assign-modal-dialog {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  border-radius: 6px;
}

#trazabilidad-assign-modal .trazabilidad-assign-modal-body {
  padding: calc(8px * var(--traza-assign-scale)) calc(10px * var(--traza-assign-scale));
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-assign {
  min-width: calc(1180px * var(--traza-assign-scale));
  width: 100%;
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-num {
  width: calc(28px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-phase {
  width: calc(118px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-op {
  width: calc(150px * var(--traza-assign-scale));
  vertical-align: middle;
  text-align: center;
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-doc {
  width: calc(210px * var(--traza-assign-scale));
  min-width: calc(210px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-ind {
  width: calc(36px * var(--traza-assign-scale));
  min-width: calc(36px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-comment {
  width: calc(88px * var(--traza-assign-scale));
  font-size: calc(7px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-vert {
  width: calc(22px * var(--traza-assign-scale));
  padding: calc(4px * var(--traza-assign-scale)) calc(2px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-vert > span {
  font-size: calc(7px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-mod-log {
  width: calc(24px * var(--traza-assign-scale));
  min-width: calc(24px * var(--traza-assign-scale));
  max-width: calc(24px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-mod-log > span {
  font-size: calc(6px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-cell-mod-log {
  width: calc(24px * var(--traza-assign-scale));
  min-width: calc(24px * var(--traza-assign-scale));
  max-width: calc(24px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-mod-log-menu {
  width: min(calc(720px * var(--traza-assign-scale)), 78vw);
  min-width: calc(520px * var(--traza-assign-scale));
  max-height: calc(360px * var(--traza-assign-scale));
  font-size: calc(10px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-mod-log-table th,
#trazabilidad-assign-modal .ifc-traza-mod-log-table td {
  font-size: calc(9px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-sub {
  font-size: calc(7px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-cell-op {
  font-size: calc(7px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad th,
#trazabilidad-assign-modal .ifc-info-table--trazabilidad td {
  font-size: calc(9px * var(--traza-assign-scale));
  padding: calc(3px * var(--traza-assign-scale)) calc(4px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-input {
  font-size: calc(8px * var(--traza-assign-scale));
  padding: calc(1px * var(--traza-assign-scale)) calc(2px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-input--operacion {
  min-width: calc(140px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-input--documento {
  min-width: 0;
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-cell-doc {
  min-width: calc(210px * var(--traza-assign-scale));
  max-width: calc(210px * var(--traza-assign-scale));
  overflow: visible;
}

#trazabilidad-assign-modal .ifc-traza-doc-btn--attach {
  width: calc(22px * var(--traza-assign-scale));
  height: calc(22px * var(--traza-assign-scale));
  min-width: calc(22px * var(--traza-assign-scale));
  min-height: calc(22px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-input--documento {
  min-width: 0;
  text-overflow: ellipsis;
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-cell-ind {
  min-width: calc(36px * var(--traza-assign-scale));
  max-width: calc(36px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-input--commentaire {
  min-width: calc(72px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-select {
  font-size: calc(7px * var(--traza-assign-scale));
  padding: calc(1px * var(--traza-assign-scale)) calc(2px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-select--phase {
  min-width: calc(108px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-select--operacion {
  min-width: calc(140px * var(--traza-assign-scale));
  font-size: calc(7px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-group {
  padding: calc(2px * var(--traza-assign-scale)) calc(3px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-stack {
  gap: calc(2px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-label {
  font-size: calc(8px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-group-input {
  font-size: calc(8px * var(--traza-assign-scale));
  padding: calc(1px * var(--traza-assign-scale)) calc(3px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-date,
#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-cell-date {
  width: calc(82px * var(--traza-assign-scale));
  min-width: calc(82px * var(--traza-assign-scale));
  max-width: calc(82px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-th-nom,
#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme .ifc-traza-cell-nom {
  width: calc(64px * var(--traza-assign-scale));
  min-width: calc(64px * var(--traza-assign-scale));
  max-width: calc(64px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-cell-date .ifc-traza-input--date {
  font-size: calc(8px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable .ifc-traza-input--nom {
  min-width: calc(48px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-editable td {
  padding: calc(1px * var(--traza-assign-scale)) calc(2px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio td {
  padding: calc(1px * var(--traza-assign-scale)) calc(2px * var(--traza-assign-scale));
  background: rgba(148, 163, 184, 0.06);
  cursor: pointer;
}

#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--selected td,
#trazabilidad-assign-modal .ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--selected.ifc-traza-row--espacio td {
  background: rgba(13, 148, 136, 0.34);
}

#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-espacio-mirror select,
#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-espacio-mirror input {
  visibility: hidden;
  pointer-events: none;
}

#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-doc .ifc-traza-doc-wrap,
#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-doc select,
#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-doc input,
#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-doc button {
  visibility: visible;
  pointer-events: auto;
}

#trazabilidad-assign-modal .ifc-traza-row--espacio .ifc-traza-cell-op--espacio select.ifc-traza-select--operacion {
  visibility: visible;
  pointer-events: auto;
}

#trazabilidad-assign-modal .ifc-traza-assign-toolbar {
  flex-wrap: nowrap;
  align-items: center;
  gap: calc(6px * var(--traza-assign-scale));
  margin-bottom: calc(8px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-assign-toolbar-templates {
  flex-direction: row;
  align-items: center;
  gap: calc(6px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-plantilla-row {
  gap: calc(6px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-plantilla-select {
  min-width: calc(120px * var(--traza-assign-scale));
  max-width: calc(180px * var(--traza-assign-scale));
  font-size: calc(11px * var(--traza-assign-scale));
  padding: calc(4px * var(--traza-assign-scale)) calc(6px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-btn--save-plantilla,
#trazabilidad-assign-modal .ifc-traza-btn--apply-plantilla {
  font-size: calc(11px * var(--traza-assign-scale));
  padding: calc(4px * var(--traza-assign-scale)) calc(8px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-btn--add,
#trazabilidad-assign-modal .ifc-traza-btn--remove {
  min-width: calc(28px * var(--traza-assign-scale));
  width: calc(28px * var(--traza-assign-scale));
  font-size: calc(15px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-btn--space,
#trazabilidad-assign-modal .ifc-traza-btn--new {
  font-size: calc(11px * var(--traza-assign-scale));
  padding: calc(4px * var(--traza-assign-scale)) calc(8px * var(--traza-assign-scale));
  white-space: nowrap;
}

#trazabilidad-assign-modal .ifc-traza-search-wrap {
  flex: 0 1 calc(180px * var(--traza-assign-scale));
  min-width: calc(130px * var(--traza-assign-scale));
  max-width: calc(200px * var(--traza-assign-scale));
}

#trazabilidad-assign-modal .ifc-traza-search {
  padding: calc(5px * var(--traza-assign-scale)) calc(8px * var(--traza-assign-scale));
  font-size: calc(12px * var(--traza-assign-scale));
}

.traza-report-modal-dialog {
  width: min(720px, 96vw);
  max-width: min(720px, 96vw);
}

.traza-report-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  max-height: min(72vh, 640px);
  padding: 10px 14px;
  overflow: auto;
}

.traza-report-options {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fafc;
}

.traza-report-options legend {
  padding: 0 6px;
  font-size: 12px;
  font-weight: 700;
}

.traza-report-option {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
  font-size: 12px;
  cursor: pointer;
}

.traza-report-options-sub {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed #cbd5e1;
}

.traza-report-options-subtitle {
  font-size: 11px;
  font-weight: 700;
  color: #475569;
  margin-bottom: 4px;
}

.traza-report-option-field {
  display: block;
  width: 100%;
  margin: 0 0 8px 22px;
  max-width: calc(100% - 22px);
  padding: 5px 8px;
  font-size: 11px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #fff;
  box-sizing: border-box;
}

.traza-report-options-subtitle--logos {
  margin-top: 4px;
}

.traza-report-options-subtitle--layout {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed #e2e8f0;
}

.traza-report-index-mode {
  margin: 2px 0 8px 22px;
}

.traza-report-index-mode.hidden {
  display: none;
}

.traza-report-option--sub {
  margin: 4px 0 4px 8px;
}

.traza-report-logo-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 8px;
}

.traza-report-logo-hint {
  margin: 0 0 6px 22px;
  font-size: 10px;
  line-height: 1.35;
  color: #64748b;
}

.traza-report-logo-block {
  margin: 0;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
}

.traza-report-logo-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.traza-report-logo-actions .btn.small {
  width: auto;
  flex: 1 1 calc(50% - 4px);
  min-width: 0;
  margin: 0;
}

.traza-report-logo-preview {
  width: 52px;
  height: 36px;
  object-fit: contain;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  background: #f8fafc;
  padding: 2px;
}

.traza-report-logo-preview.hidden {
  display: none;
}

.traza-report-cover-block {
  margin: 4px 0 10px;
}

.traza-report-cover-preview {
  max-height: 96px;
  object-fit: contain;
}

.traza-report-cover-block.traza-report-cover-block--disabled {
  opacity: 0.55;
  pointer-events: none;
}

@media (max-width: 560px) {
  .traza-report-logo-grid {
    grid-template-columns: 1fr;
  }
}

.traza-report-option-field:disabled {
  opacity: 0.5;
  background: #f1f5f9;
}

.traza-report-process-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.traza-report-process-head strong {
  flex: 1 1 auto;
  font-size: 12px;
}

.traza-report-process-list {
  max-height: min(42vh, 360px);
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px;
  background: #fff;
}

.traza-report-process-list--disabled {
  opacity: 0.55;
  pointer-events: none;
}

.traza-report-element-group + .traza-report-element-group {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed #cbd5e1;
}

.traza-report-element-title {
  font-size: 11px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 4px;
}

.traza-report-element-id {
  font-weight: 500;
  color: #64748b;
}

.traza-report-process-item {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 3px 0;
  font-size: 11px;
  cursor: pointer;
}

.traza-report-process-item--muted {
  color: #64748b;
}

.traza-report-process-item--has-doc .traza-report-process-doc {
  color: #15803d;
  font-weight: 600;
}

.traza-report-process-doc {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  color: #1d4ed8;
}

.traza-report-process-doc--missing {
  color: #94a3b8;
  font-weight: 400;
  font-style: italic;
}

.traza-report-modal-foot {
  gap: 10px;
  justify-content: flex-end;
}

.traza-report-modal-feedback {
  margin: 0 14px 8px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.35;
  color: #0f172a;
  background: #eef6ff;
  border: 1px solid #bfdbfe;
}

.traza-report-modal-feedback.is-error {
  color: #7f1d1d;
  background: #fef2f2;
  border-color: #fecaca;
}

.traza-report-modal-feedback.hidden {
  display: none !important;
}

.ifc-traza-assign-toolbar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  padding: 4px 2px 0;
  min-width: 0;
}

.ifc-traza-assign-toolbar-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.ifc-traza-assign-toolbar-templates {
  margin-left: auto;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.ifc-traza-plantilla-select-wrap {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.ifc-traza-plantilla-row {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
}

.ifc-traza-plantilla-select {
  min-width: 120px;
  max-width: 180px;
  font-size: 11px;
  padding: 4px 6px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #fff;
  color: var(--text);
}

.ifc-traza-btn--save-plantilla,
.ifc-traza-btn--apply-plantilla {
  font-size: 11px;
  white-space: nowrap;
}

.ifc-traza-assign-toolbar .btn.small {
  width: auto;
  margin: 0;
  flex-shrink: 0;
}

.ifc-traza-btn--add,
.ifc-traza-btn--remove {
  min-width: 28px;
  width: 28px;
  padding: 4px 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.ifc-traza-btn--space,
.ifc-traza-btn--new {
  font-size: 11px;
  padding: 4px 8px;
  white-space: nowrap;
}

.ifc-traza-search-wrap {
  flex: 0 1 180px;
  min-width: 130px;
  max-width: 200px;
  margin: 0;
}

.ifc-traza-search {
  width: 100%;
  box-sizing: border-box;
  padding: 5px 8px;
  font-size: 12px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel);
  color: var(--text);
}

.ifc-traza-search:focus {
  outline: 2px solid rgba(20, 184, 166, 0.45);
  outline-offset: 1px;
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--selected {
  background: rgba(13, 148, 136, 0.34);
  outline: 2px solid rgba(13, 148, 136, 0.9);
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--selected td {
  background: rgba(13, 148, 136, 0.34);
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--hidden {
  display: none;
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio td {
  background: rgba(148, 163, 184, 0.06);
  padding: 1px 2px;
  vertical-align: middle;
  cursor: pointer;
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--selected.ifc-traza-row--espacio td {
  background: rgba(13, 148, 136, 0.34);
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-espacio-mirror select,
.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-espacio-mirror input {
  visibility: hidden;
  pointer-events: none;
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-doc .ifc-traza-doc-wrap,
.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-doc select,
.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-doc input,
.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-doc button {
  visibility: visible;
  pointer-events: auto;
}

.ifc-info-table--trazabilidad-gamme tbody tr.ifc-traza-row--espacio .ifc-traza-cell-op--espacio select.ifc-traza-select--operacion {
  visibility: visible;
  pointer-events: auto;
}

.scroll {
  overflow: auto;
  flex: 1;
  min-height: 0;
}

.tree {
  font-size: 12px;
  line-height: 1.5;
}

.tree-item {
  cursor: pointer;
  padding: 2px 4px;
  border-radius: 4px;
  margin-left: calc(var(--depth, 0) * 10px);
}

.tree-item:hover {
  background: rgba(20, 184, 166, 0.15);
}

.tree-item.selected {
  background: rgba(255, 20, 147, 0.45);
}

.hint {
  font-size: 11px;
  color: var(--muted);
  margin: 0 0 8px;
}

.check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  margin-bottom: 8px;
}

/* Modal plano 2D (captura + anotaciones) — casi pantalla completa */
.plan-sheet-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  padding: max(8px, env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-right, 0px))
    max(8px, env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
}

.plan-sheet-modal.hidden {
  display: none;
}

.plan-sheet-modal.plan-sheet-modal--saving {
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
}

.plan-sheet-backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.75);
  cursor: pointer;
}

.plan-sheet-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  margin: 0;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
  min-height: 0;
}

.plan-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-shrink: 0;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
}

.budget-sheet-head {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  flex-shrink: 0;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
}

.budget-sheet-projet-ref {
  font-size: 14px;
  font-weight: 700;
  color: var(--muted);
  line-height: 1.2;
  letter-spacing: 0.2px;
}

.budget-sheet-head-actions {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: stretch;
  gap: 6px;
  width: 100%;
  margin-left: 0;
}

.budget-sheet-head-actions .btn-header-pill {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.budget-sheet-head-actions .btn.btn-budget-blue {
  background: var(--btn-geo);
  color: var(--text);
  border: 1px solid var(--btn-geo-border);
  text-shadow: none;
}

.budget-sheet-head-actions .btn.btn-budget-blue:hover {
  background: var(--btn-geo-hover);
  border-color: var(--accent);
  color: var(--text);
}

#budget-explosion-level-title.budget-explosion-level-title {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.budget-explosion-progress {
  width: min(520px, 100%);
  align-self: flex-end;
  margin-left: auto;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  border-radius: 12px;
  padding: 7px 10px 9px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.budget-explosion-progress.hidden {
  display: none;
}

.budget-explosion-progress-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 11px;
  color: #d3e9ff;
}

#budget-explosion-progress-label {
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.budget-explosion-progress-track {
  position: relative;
  height: 8px;
  border-radius: 999px;
  background: rgba(22, 62, 96, 0.55);
  overflow: hidden;
}

.budget-explosion-progress-bar {
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #38bdf8, #2563eb);
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.45);
  transition: width 240ms ease;
}

.budget-explosion-level-modal {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.budget-explosion-level-modal.hidden {
  display: none;
}

.budget-explosion-level-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(2, 12, 24, 0.72);
  cursor: pointer;
}

.budget-explosion-level-dialog {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  max-height: min(90vh, 520px);
  overflow: auto;
  border-radius: 12px;
  border: 1px solid rgba(94, 184, 245, 0.35);
  background: linear-gradient(180deg, rgba(10, 40, 68, 0.98), rgba(4, 22, 42, 0.99));
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.45);
  padding: 18px 20px 16px;
}

.budget-explosion-level-title {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 600;
  color: #e8f4ff;
}

.budget-explosion-level-hint {
  margin: 0 0 16px;
  font-size: 12px;
  line-height: 1.45;
  color: #a8c5df;
}

.budget-explosion-level-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  align-items: center;
  margin-bottom: 18px;
}

.budget-explosion-level-grid label {
  font-size: 12px;
  color: #c5dff5;
}

.budget-explosion-level-grid .budget-input {
  width: 100%;
}

.budget-explosion-level-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.plan-sheet-head h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.plan-sheet-head .btn.small {
  width: auto;
  margin: 0;
}

.plan-sheet-intro {
  margin: 0;
  padding: 10px 14px;
  font-size: 12px;
  line-height: 1.45;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}

.plan-sheet-toolbar-wrap {
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.35);
}

.plan-sheet-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 10px 14px;
}

.plan-sheet-toolbar-row--main {
  padding-bottom: 8px;
}

.plan-sheet-toolbar-row--export {
  padding-top: 0;
  padding-bottom: 10px;
}

.plan-sheet-toolbar-row--zoom {
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  padding-top: 8px;
  padding-bottom: 8px;
}

.plan-sheet-toolbar-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  min-width: 0;
}

.plan-sheet-toolbar-group--actions {
  flex: 0 1 auto;
}

.plan-sheet-toolbar-group--tools,
.plan-sheet-toolbar-group--lines {
  flex: 1 1 260px;
}

.plan-sheet-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 10px 14px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}

.plan-sheet-toolbar .btn.small,
.plan-sheet-toolbar-row .btn.small,
.plan-sheet-toolbar-wrap .btn.small {
  width: auto;
  margin: 0;
  white-space: nowrap;
}

.plan-tool-label {
  font-size: 12px;
  color: var(--muted);
}

.plan-tool-opt {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: var(--text);
  cursor: pointer;
  user-select: none;
}

.plan-sheet-export-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  width: 100%;
  margin-left: 0;
  justify-content: flex-end;
}

.plan-sheet-toolbar-zoom,
.plan-sheet-toolbar-row--zoom {
  padding-top: 8px;
  padding-bottom: 8px;
}

.plan-scale-label {
  min-width: 3.5rem;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

.plan-model-scale {
  margin-left: 8px;
  font-size: 11px;
  color: var(--muted, #64748b);
  white-space: nowrap;
}

.plan-display-prefs {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px 10px;
  margin-left: auto;
}

.plan-display-pref-field {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  font-size: 11px;
  color: var(--muted, #64748b);
}

.plan-display-pref-field > span {
  font-weight: 600;
  line-height: 1.1;
}

.plan-display-select {
  min-width: 4.5rem;
  padding: 4px 8px;
  border-radius: 8px;
  border: 1px solid var(--border, #cbd5e1);
  background: #fff;
  color: var(--text, #0f172a);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.btn-plan-multiview,
.btn-plan-auto-diameter {
  font-weight: 600;
}

.btn-plan-auto-diameter {
  color: #c61170;
  border-color: rgba(198, 17, 112, 0.45);
}

.plan-mv-picker {
  position: fixed;
  inset: 0;
  z-index: 13050;
  display: flex;
  align-items: center;
  justify-content: center;
}

.plan-mv-picker.hidden {
  display: none;
}

.plan-mv-picker-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, 0.45);
  cursor: pointer;
}

.plan-mv-picker-dialog {
  position: relative;
  z-index: 1;
  width: min(440px, calc(100vw - 32px));
  max-height: min(80vh, 560px);
  overflow: auto;
  padding: 18px 18px 14px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid #cbd5e1;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.28);
}

.plan-mv-picker-dialog h3 {
  margin: 0 0 8px;
  font-size: 16px;
  color: #0f172a;
}

.plan-mv-picker-hint {
  margin: 0 0 12px;
  font-size: 12px;
}

.plan-mv-picker-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}

.plan-mv-picker-opt {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  font-size: 13px;
  color: #1e293b;
  cursor: pointer;
  background: #f8fafc;
}

.plan-mv-picker-opt:hover {
  border-color: #c61170;
  background: #fff;
}

.plan-mv-picker-opt input {
  margin-top: 2px;
}

.plan-mv-picker-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.plan-mv-picker-spacer {
  flex: 1 1 auto;
}

.plan-tb-field {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--muted, #64748b);
}

.plan-tb-field input {
  width: 4.5rem;
  padding: 3px 6px;
  font-size: 11px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: #fff;
}

.plan-tb-field input#plan-tb-indice {
  width: 2.2rem;
  text-align: center;
}

.plan-zoom-btn {
  min-width: 2rem;
  font-weight: 700;
  padding-left: 10px;
  padding-right: 10px;
}

.plan-toolbar-sep {
  width: 1px;
  height: 22px;
  background: var(--border);
  margin: 0 6px;
  flex-shrink: 0;
}

.plan-history-btn {
  min-width: 2.25rem;
  font-weight: 700;
}

.plan-hint-zoom {
  margin: 0;
  font-size: 11px;
  color: var(--muted);
  flex: 1 1 140px;
  min-width: 0;
}

.plan-sheet-zoom-outer {
  display: inline-block;
  vertical-align: top;
  position: relative;
}

.plan-sheet-zoom-inner {
  transform-origin: 0 0;
}

.plan-sheet-stack {
  position: relative;
  display: block;
  line-height: 0;
  overflow: visible;
}

.plan-sheet-viewport {
  position: relative;
  flex: 1 1 auto;
  min-height: 180px;
  overflow: auto;
  padding: 12px;
  background: rgba(0, 0, 0, 0.2);
  -webkit-overflow-scrolling: touch;
}

.plan-sheet-loading {
  position: absolute;
  inset: 12px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #334155;
}

.plan-sheet-loading.hidden {
  display: none;
}

.plan-sheet-loading-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #cbd5e1;
  border-top-color: #c61170;
  border-radius: 50%;
  animation: plan-sheet-spin 0.8s linear infinite;
}

@keyframes plan-sheet-spin {
  to {
    transform: rotate(360deg);
  }
}

.plan-sheet-bg-vector {
  display: block;
  max-width: none;
  height: auto;
  user-select: none;
  pointer-events: none;
  overflow: visible;
  shape-rendering: geometricPrecision;
}

.plan-sheet-bg {
  display: block;
  max-width: none;
  height: auto;
  user-select: none;
  pointer-events: none;
}

.plan-sheet-bg[hidden],
.plan-sheet-bg-vector[hidden] {
  display: none !important;
}

.plan-sheet-draw {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  pointer-events: none;
  touch-action: none;
}

.plan-sheet-hit {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  pointer-events: auto;
  cursor: crosshair;
  touch-action: none;
  background: transparent;
}

.btn-generar-plano {
  font-size: 12px;
  padding-left: 10px;
  padding-right: 10px;
  background: var(--btn-draw);
  color: var(--text);
  border: 1px solid var(--btn-draw-border);
  text-shadow: none;
}

.btn-generar-plano:hover {
  background: var(--btn-draw-hover);
  border-color: var(--accent);
  color: var(--text);
}

.btn.btn-toolbar-plain.btn-walkthrough {
  font-size: var(--header-action-btn-font);
  padding-left: 10px;
  padding-right: 10px;
  min-height: var(--header-action-btn-min-h);
  background: var(--btn-olive);
  color: var(--text);
  border: 1px solid var(--btn-olive-border);
  font-weight: 600;
  text-shadow: none;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.btn.btn-toolbar-plain.btn-walkthrough:hover {
  background: var(--btn-olive-hover);
  border-color: var(--accent);
  color: var(--text);
}


.toolbar-plano-tools {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.toolbar-plano-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.toolbar-plano-group-right {
  margin-left: auto;
}

/* Barra superior: mismo color y tamaño de letra que SIMULACIÓN en todos los botones */
.toolbar-top-actions .btn,
.toolbar-top-actions .btn.btn-back,
.toolbar-top-actions .btn.btn-cad-nuevo,
.toolbar-top-actions .btn.btn-cad-file,
.toolbar-top-actions .btn.btn-cut,
.toolbar-top-actions .btn.btn-measure,
.toolbar-top-actions .btn.btn-toolbar-plain,
.toolbar-top-actions .btn.btn-generar-plano,
.toolbar-top-actions .btn.btn-walkthrough,
.toolbar-top-actions .btn.btn-catalogo,
.toolbar-top-actions .btn.btn-cronograma,
.toolbar-top-actions .btn.btn-simulacion,
.toolbar-top-actions .btn.btn-import-grid-dxf {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  max-width: none;
  font-size: var(--header-action-btn-font);
  padding-left: 10px;
  padding-right: 10px;
  min-height: var(--header-action-btn-min-h);
  font-weight: 600;
  background: var(--btn-cta-sky);
  color: var(--btn-on-cta);
  border: 1px solid var(--btn-cta-sky-border);
  text-shadow: none;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  border-radius: 999px;
}

.toolbar-top-actions .btn.btn-cad-nuevo {
  background: #cdeee8;
  color: var(--btn-on-cta);
  border-color: #3a9d8f;
  font-weight: 700;
}

.toolbar-top-actions .btn.btn-cad-file {
  background: #dcfce7;
  color: var(--btn-on-cta);
  border-color: #86efac;
  font-weight: 700;
}

.toolbar-top-actions .btn.btn-cut {
  background: #e0f2fe;
  border-color: #38bdf8;
}

.toolbar-top-actions .btn.btn-generar-plano {
  background: #e8e2f4;
  border-color: #9b86c9;
}

.toolbar-top-actions .btn.btn-walkthrough {
  background: #ffe8d9;
  border-color: #fdba74;
}

.toolbar-top-actions .btn.btn-import-grid-dxf {
  background: #ede9fe;
  border-color: #a78bfa;
}

.toolbar-top-actions .btn:hover,
.toolbar-top-actions .btn.btn-back:hover,
.toolbar-top-actions .btn.btn-cad-nuevo:hover,
.toolbar-top-actions .btn.btn-cad-file:hover,
.toolbar-top-actions .btn.btn-cut:hover,
.toolbar-top-actions .btn.btn-measure:hover,
.toolbar-top-actions .btn.btn-toolbar-plain:hover,
.toolbar-top-actions .btn.btn-generar-plano:hover,
.toolbar-top-actions .btn.btn-walkthrough:hover,
.toolbar-top-actions .btn.btn-catalogo:hover,
.toolbar-top-actions .btn.btn-cronograma:hover,
.toolbar-top-actions .btn.btn-simulacion:hover,
.toolbar-top-actions .btn.btn-import-grid-dxf:hover {
  background: var(--btn-cta-sky-hover);
  border-color: var(--accent);
  color: var(--btn-on-cta);
}

.toolbar-top-actions .btn.btn-cad-nuevo:hover {
  background: #bde6dd;
  border-color: #0d9488;
  color: var(--btn-on-cta);
}

.toolbar-top-actions .btn.btn-cad-file:hover {
  background: #bbf7d0;
  border-color: #16a34a;
  color: var(--btn-on-cta);
}

.toolbar-top-actions .btn.btn-cut:hover {
  background: #bae6fd;
  border-color: #0284c7;
  color: var(--btn-on-cta);
}

.toolbar-top-actions .btn.btn-generar-plano:hover {
  background: #ddd3f0;
  border-color: #7c3aed;
  color: var(--btn-on-cta);
}

.toolbar-top-actions .btn.btn-walkthrough:hover {
  background: #ffd9c0;
  border-color: #ea580c;
  color: var(--btn-on-cta);
}

.toolbar-top-actions .btn.btn-import-grid-dxf:hover {
  background: #ddd6fe;
  border-color: #7c3aed;
  color: var(--btn-on-cta);
}

/* Enlace compartido: modo solo parcours (sin barra completa) */
html.viewer-guest-parcours-only #app > .app-screen-title-bar,
html.viewer-guest-parcours-only #app > .toolbar,
html.viewer-guest-parcours-only #app .panel-general,
html.viewer-guest-parcours-only #status {
  display: none !important;
}

html.viewer-guest-parcours-only #app:not(.walkthrough-active) .app-body {
  position: fixed;
  inset: 0;
  z-index: 40;
  margin: 0;
  width: 100vw;
  height: 100vh;
  max-height: 100dvh;
}

html.viewer-guest-parcours-only #app:not(.walkthrough-active) .app-body > .viewport-wrap {
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
}

html.viewer-guest-parcours-only .walkthrough-exit-btn,
html.viewer-guest-parcours-only #walkthrough-ai-tour-btn {
  display: none !important;
}

html.viewer-guest-share #viewer-share-modal,
html.viewer-guest-share #btn-general-compartir-enlace {
  display: none !important;
}

html.projet-guest-share .projet-top-toolbar .btn:not(#btn-continue):not(#btn-open-config):not(#btn-open-price-db),
html.projet-guest-share .projet-secondary-toolbar {
  display: none !important;
}

.viewer-share-config {
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border, rgba(255, 255, 255, 0.12));
}

.viewer-share-config-title {
  font-size: 0.95rem;
  font-weight: 700;
  margin: 0 0 0.35rem;
}

.viewer-share-config-hint {
  font-size: 0.8rem;
  opacity: 0.85;
  margin: 0 0 0.65rem;
  line-height: 1.35;
}

.viewer-share-perm-tree {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  max-height: min(42vh, 320px);
  overflow: auto;
  padding-right: 4px;
}

.viewer-share-perm-module {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 0.45rem 0.55rem;
  background: rgba(0, 0, 0, 0.15);
}

.viewer-share-perm-module-head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 700;
  font-size: 0.88rem;
  cursor: pointer;
  margin-bottom: 0.25rem;
}

.viewer-share-perm-children {
  list-style: none;
  margin: 0;
  padding: 0 0 0 1.35rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.viewer-share-perm-child {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  font-size: 0.82rem;
  line-height: 1.3;
  cursor: pointer;
}

.viewer-share-perm-child input,
.viewer-share-perm-module-head input {
  margin-top: 0.15rem;
  flex-shrink: 0;
}

.viewer-share-persist {
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border, rgba(255, 255, 255, 0.12));
}

.viewer-share-persist-options {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.viewer-share-persist-option {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  font-size: 0.84rem;
  line-height: 1.35;
  cursor: pointer;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.08);
}

.viewer-share-persist-option input {
  margin-top: 0.15rem;
  flex-shrink: 0;
}

html.share-guest-persist-off #btn-save,
html.share-guest-persist-off .saved-projects-toolbar,
html.projet-guest-share.share-guest-persist-off #btn-save {
  display: none !important;
}

html.share-guest-persist-on #btn-save,
html.projet-guest-share.share-guest-persist-on #btn-save {
  display: inline-flex !important;
}

/* Modo recorrido: solo lienzo 3D + retícula y barra inferior */
#app.walkthrough-active > .app-screen-title-bar,
#app.walkthrough-active > .toolbar {
  display: none !important;
}

#app.walkthrough-active .app-body > .panel-general {
  display: none !important;
}

#app.walkthrough-active .app-body {
  position: fixed;
  inset: 0;
  z-index: 40;
  flex: 1 1 auto;
  min-height: 0;
  width: 100vw;
  height: 100vh;
  max-height: 100dvh;
  margin: 0;
}

#app.walkthrough-active .app-body > .viewport-wrap {
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  min-height: 100%;
}

#app.walkthrough-active,
#app.walkthrough-active body,
html.bimtraza-shell-parcours #app.walkthrough-active {
  cursor: default !important;
}

#app.walkthrough-active #c,
#app.walkthrough-active #c.has-cad-crosshair {
  min-height: 100%;
  cursor: default !important;
}

#app.walkthrough-active #c.walkthrough-cursor-target {
  cursor: pointer !important;
}

.walkthrough-layer {
  position: fixed;
  inset: 0;
  z-index: 120;
  pointer-events: none;
}

.walkthrough-layer.hidden {
  display: none;
}

/* Altura de la barra inferior (velocidad / IA / salir) + hueco para crucetas y minimapa */
#app.walkthrough-active {
  --walkthrough-controls-bottom: max(72px, calc(64px + env(safe-area-inset-bottom, 0px)));
}

.walkthrough-minimap {
  position: relative;
  left: auto;
  bottom: auto;
  top: auto;
  transform: none;
  flex: 0 0 auto;
  align-self: flex-end;
  z-index: 1;
  width: min(36vw, 272px);
  height: 148px;
  max-width: min(272px, calc(100vw - 280px));
  min-width: 148px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  background: linear-gradient(165deg, rgba(22, 42, 62, 0.55) 0%, rgba(8, 18, 30, 0.62) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  pointer-events: none;
  overflow: hidden;
  box-sizing: border-box;
}

@media (max-width: 720px) {
  .walkthrough-minimap {
    width: min(40vw, 220px);
    height: 132px;
    max-width: min(220px, calc(100vw - 220px));
  }
}

.walkthrough-minimap canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.walkthrough-reticle {
  --wt-ring-size: 29px;
  --wt-cross-span: 58px;
  --wt-sight-stroke: 1px;
  --wt-sight-gap: 5px;
  position: fixed;
  left: 50%;
  top: 50%;
  width: var(--wt-cross-span);
  height: var(--wt-cross-span);
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 130;
  border: none;
  border-radius: 0;
  background:
    linear-gradient(#111, #111) 50% var(--wt-sight-stroke) / var(--wt-sight-stroke)
      calc(var(--wt-cross-span) / 2 - var(--wt-sight-gap)) no-repeat,
    linear-gradient(#111, #111) 50% calc(100% - var(--wt-sight-stroke)) / var(--wt-sight-stroke)
      calc(var(--wt-cross-span) / 2 - var(--wt-sight-gap)) no-repeat,
    linear-gradient(90deg, #111, #111) var(--wt-sight-stroke) 50% / calc(var(--wt-cross-span) / 2 - var(--wt-sight-gap))
      var(--wt-sight-stroke) no-repeat,
    linear-gradient(90deg, #111, #111) calc(100% - var(--wt-sight-stroke)) 50% / calc(var(--wt-cross-span) / 2 - var(--wt-sight-gap))
      var(--wt-sight-stroke) no-repeat;
  box-shadow: none;
}

.walkthrough-reticle::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--wt-ring-size);
  height: var(--wt-ring-size);
  transform: translate(-50%, -50%);
  border: var(--wt-sight-stroke) solid #111;
  border-radius: 50%;
  box-sizing: border-box;
  pointer-events: none;
}

.walkthrough-reticle::after {
  content: none;
}

.walkthrough-hud {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 10px max(10px, env(safe-area-inset-right, 0px))
    max(18px, calc(14px + env(safe-area-inset-bottom, 0px))) max(10px, env(safe-area-inset-left, 0px));
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(0deg, rgba(6, 18, 32, 0.96) 0%, rgba(6, 18, 32, 0.88) 100%);
  pointer-events: auto;
  z-index: 127;
}

.walkthrough-ai-tour-btn {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: 8px 10px;
  font-weight: 700;
  background: linear-gradient(180deg, #1d4ed8 0%, #1e3a8a 100%);
  border-color: rgba(191, 219, 254, 0.35);
  color: #eaf2ff;
  font-size: 11px;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.walkthrough-controls-row .walkthrough-ai-tour-btn {
  order: 2;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  max-width: none;
  align-self: center;
}

.walkthrough-controls-row .walkthrough-slider-row--speed {
  order: 1;
  flex: 1.4 1 0;
}

.walkthrough-controls-row .walkthrough-color-row {
  order: 3;
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(200px, 42vw);
  color: #e2e8f0;
  font-weight: 700;
}

.walkthrough-controls-row .walkthrough-exit-btn {
  order: 4;
  flex: 1 1 0;
  min-width: 0;
  margin-left: 0;
  align-self: center;
}

.walkthrough-color-select {
  flex: 1 1 auto;
  min-width: 108px;
  max-width: min(150px, 38vw);
  padding: 6px 26px 6px 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  color: #0f172a;
  background: rgba(248, 250, 252, 0.96);
  border: 1px solid rgba(148, 163, 184, 0.65);
  border-radius: 8px;
  cursor: pointer;
  appearance: auto;
}

.walkthrough-color-select:focus {
  outline: none;
  border-color: #38bdf8;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.35);
}

.walkthrough-ai-tour-btn:hover:not(:disabled) {
  filter: brightness(1.08);
}


.walkthrough-pointer-hint {
  display: none;
}

.walkthrough-pointer-hint.is-pointer-locked {
  display: none;
}

.walkthrough-controls-row {
  flex: 1 1 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: stretch;
  align-items: center;
  gap: 8px;
  min-width: 0;
  box-sizing: border-box;
  transform: translateY(-3px);
}

.walkthrough-slider-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--text);
  min-width: 0;
  flex: 1 1 0;
}

.walkthrough-controls-row .walkthrough-slider-row--speed {
  min-width: 0;
  max-width: none;
  color: #38bdf8;
  font-weight: 700;
}

.walkthrough-controls-row .walkthrough-slider-row--eye {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
}

.walkthrough-slider-row input[type="range"] {
  flex: 1 1 44px;
  width: auto;
  min-width: 36px;
  max-width: none;
  vertical-align: middle;
}

.walkthrough-slider-row input[type="number"] {
  width: 3.9rem;
  min-width: 3.9rem;
  max-width: 3.9rem;
  padding: 2px 4px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  font-size: 11px;
  text-align: right;
  box-sizing: border-box;
}

.walkthrough-controls-row .walkthrough-slider-row--eye input[type="range"] {
  max-width: none;
}

.walkthrough-slider-value {
  display: none;
}

.walkthrough-exit-btn {
  background: linear-gradient(180deg, #fb923c 0%, #c2410c 100%);
  color: #fff7ed;
  border: 1px solid rgba(255, 237, 213, 0.35);
  font-size: 12px;
  font-weight: 700;
  padding: 8px 10px;
  min-width: 0;
  width: 100%;
}

.walkthrough-exit-btn:hover {
  filter: brightness(1.08);
}

#app.walkthrough-active .walkthrough-hud {
  padding-right: max(10px, env(safe-area-inset-right, 0px));
}

/* Cruceta + panel IFC (recorrido): fijo abajo a la derecha */
.walkthrough-floating-stack {
  position: fixed;
  right: max(40px, calc(16px + env(safe-area-inset-right, 0px)));
  bottom: var(--walkthrough-controls-bottom);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none;
  z-index: 125;
  max-width: min(300px, calc(100vw - 20px));
}

.walkthrough-floating-stack .walkthrough-elem-info,
.walkthrough-floating-stack .walkthrough-dpad,
.walkthrough-nav-orbit {
  pointer-events: auto;
}

.walkthrough-elem-info {
  position: relative;
  width: 100%;
  max-width: 280px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: linear-gradient(165deg, #fafbfd 0%, #f0f4fa 100%);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
}

.walkthrough-elem-info.hidden {
  display: none;
}

.walkthrough-elem-info-close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 18px;
  line-height: 1;
  color: var(--text);
  background: var(--btn-default);
  cursor: pointer;
  touch-action: manipulation;
  z-index: 2;
}

.walkthrough-elem-info-close:hover {
  background: var(--btn-default-hover);
  border-color: var(--accent);
}

.walkthrough-elem-info-inner {
  padding: 10px 36px 10px 12px;
  max-height: min(42vh, 320px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.walkthrough-elem-info-title {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 8px;
  line-height: 1.3;
  padding-right: 4px;
}

.walkthrough-elem-info-body {
  font-size: 11px;
  line-height: 1.4;
  color: var(--muted);
}

.walkthrough-elem-info-body .general-row {
  margin-bottom: 6px;
}

.walkthrough-elem-info-body .g-label {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.walkthrough-elem-info-body .g-val {
  color: var(--text);
  word-break: break-word;
}

.walkthrough-elem-info-traza-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  margin: 8px 0 0;
  padding: 6px 10px;
  border: 1px dashed #94a3b8;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  color: #1e3a5f;
  background: rgba(255, 255, 255, 0.85);
  cursor: pointer;
  touch-action: manipulation;
}

.walkthrough-elem-info-traza-toggle:hover {
  border-color: var(--accent);
  background: #fff;
}

.walkthrough-elem-info-traza-toggle.is-expanded {
  border-style: solid;
  border-color: var(--accent);
  background: #eef6ff;
}

.walkthrough-elem-info-traza-toggle-glyph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  font-size: 15px;
  line-height: 1;
  font-weight: 700;
  background: #1e3a5f;
  color: #fff;
}

.walkthrough-elem-info-traza-panel {
  margin-top: 8px;
}

.walkthrough-elem-info-traza-body {
  max-height: min(42vh, 320px);
  overflow: auto;
  border: 1px solid #c5d3e3;
  border-radius: 8px;
  background: #fff;
}

.walkthrough-elem-info.is-traza-expanded {
  max-width: min(96vw, 940px);
}

.walkthrough-floating-stack:has(.walkthrough-elem-info.is-traza-expanded) {
  max-width: min(96vw, 940px);
}

.walkthrough-elem-info-traza-body .ifc-info-table--trazabilidad {
  min-width: 860px;
}

.walkthrough-elem-info-traza-body .ifc-traza-doc-wrap--walkthrough {
  justify-content: center;
  width: 100%;
}

.walkthrough-elem-info-traza-body .ifc-traza-doc-open-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  min-width: 0;
  width: auto;
  margin: 0 auto;
  padding: 4px 10px;
  border: 1px solid #93c5fd;
  border-radius: 4px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
  font-size: 11px;
  line-height: 1.35;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.walkthrough-elem-info-traza-body .ifc-traza-doc-open-btn:hover:not(:disabled) {
  background: #dbeafe;
  border-color: #60a5fa;
}

.walkthrough-elem-info-traza-body .ifc-traza-doc-open-btn--empty {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #94a3b8;
  font-style: italic;
  font-weight: 400;
  cursor: default;
}

.walkthrough-elem-info-traza-body .ifc-traza-cell-doc {
  text-align: center;
}

.walkthrough-elem-info-traza-body .ifc-traza-cell-wt-fixed {
  background: #f8fafc;
}

.walkthrough-elem-info-traza-body .ifc-traza-cell-wt-fixed .ifc-traza-readonly {
  display: block;
  width: 100%;
  color: #0f172a;
  font-weight: 600;
  text-align: center;
  user-select: text;
}

.walkthrough-dpad {
  width: 132px;
  height: 132px;
}

.walkthrough-dpad-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 5px;
  width: 100%;
  height: 100%;
  padding: 7px;
  box-sizing: border-box;
  border-radius: 18px;
  background: linear-gradient(165deg, rgba(22, 42, 62, 0.96) 0%, rgba(8, 18, 30, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.11);
  box-shadow:
    0 10px 32px rgba(0, 0, 0, 0.48),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.walkthrough-dpad-spacer {
  pointer-events: none;
}

.walkthrough-dpad-hub {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.walkthrough-dpad-arrow {
  margin: 0;
  padding: 0;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.07);
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  touch-action: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s ease, border-color 0.12s ease;
}

.walkthrough-dpad-glyph {
  font-size: 13px;
  line-height: 1;
  opacity: 0.92;
}

.walkthrough-dpad-arrow:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.2);
}

.walkthrough-dpad-arrow:active,
.walkthrough-dpad-arrow.is-held {
  background: rgba(56, 189, 248, 0.22);
  border-color: rgba(56, 189, 248, 0.5);
  color: #fff;
}

.walkthrough-dpad-arrow.is-held .walkthrough-dpad-glyph {
  opacity: 1;
}

.walkthrough-dpad-up {
  grid-column: 2;
  grid-row: 1;
}

.walkthrough-dpad-left {
  grid-column: 1;
  grid-row: 2;
}

.walkthrough-dpad-hub-cell {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.walkthrough-dpad-right {
  grid-column: 3;
  grid-row: 2;
}

.walkthrough-dpad-down {
  grid-column: 2;
  grid-row: 3;
}

/* Con simulación activa: ocultar barra principal del visor y paneles laterales */
body.simulation-active #app > header.toolbar {
  display: none !important;
}

body.simulation-active #app .app-body > .panel-general {
  display: none !important;
}

/* Ventana a pantalla completa: V Simulación (lienzo movido aquí) */
.simulation-window {
  position: fixed;
  inset: 0;
  /* Por encima del panel de corte (900) y similares; por debajo de modales de módulos/tabla (≥1000) */
  z-index: 960;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  box-sizing: border-box;
}

.simulation-window.hidden {
  display: none !important;
}

.simulation-window.simulation-window--export-suppressed {
  visibility: hidden !important;
  pointer-events: none !important;
}

.simulation-window-toolbar {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px 12px;
  padding: 8px 14px;
  padding-left: calc(14px + env(safe-area-inset-left, 0px));
  padding-right: calc(14px + env(safe-area-inset-right, 0px));
  border-bottom: 1px solid var(--border);
  background: var(--panel);
}

.simulation-window-toolbar #simulation-window-close {
  margin-left: auto;
}

.simulation-window-nav {
  display: none !important;
  margin-left: auto;
  /* resto conservado por si se reactiva; no visible */
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  max-width: min(920px, 72vw);
  justify-content: flex-end;
}

.simulation-window-nav .btn-header-pill {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.simulation-curve-panel {
  flex-shrink: 0;
  z-index: 4;
  padding: 8px 14px 10px;
  padding-left: calc(14px + env(safe-area-inset-left, 0px));
  padding-right: calc(14px + env(safe-area-inset-right, 0px));
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #ecfdf5 0%, #e8f5f0 100%);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.simulation-curve-panel.hidden {
  display: none !important;
}

.simulation-curve-head-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 12px;
  margin-bottom: 6px;
}

.simulation-curve-head-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.simulation-curve-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.02em;
}

.simulation-curve-toggle {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  color: #0c4a6e;
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 100%);
  border: 1.5px solid #0284c7;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.simulation-curve-toggle:hover {
  background: linear-gradient(180deg, #e0f2fe 0%, #38bdf8 100%);
  border-color: #0369a1;
}

.simulation-curve-sub {
  font-size: 10px;
  color: var(--muted);
  max-width: 100%;
}

.simulation-curve-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.simulation-curve-panel.is-collapsed .simulation-curve-head-row {
  margin-bottom: 0;
}

.simulation-curve-panel.is-collapsed .simulation-curve-body {
  display: none;
}

.simulation-curve-panel.is-collapsed .simulation-curve-sub {
  display: none;
}

.simulation-curve-panel canvas {
  display: block;
  width: 100%;
  height: 112px;
  max-height: 28vh;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--border);
}

.simulation-curve-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin-top: 6px;
  font-size: 10px;
  color: var(--muted);
}

.simulation-curve-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.simulation-curve-swatch {
  display: inline-block;
  width: 14px;
  height: 3px;
  border-radius: 2px;
  flex-shrink: 0;
}

.simulation-curve-swatch--phys-p {
  background: rgba(20, 184, 166, 0.95);
}

.simulation-curve-swatch--phys-r {
  background: rgba(94, 234, 212, 0.75);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.simulation-curve-swatch--fin-p {
  background: rgba(139, 92, 246, 0.95);
}

.simulation-curve-swatch--fin-r {
  background: rgba(196, 181, 253, 0.85);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.simulation-curve-now {
  margin-left: auto;
  font-size: 10px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--accent-dim);
}

.simulation-window-title-bar {
  padding-top: calc(10px + env(safe-area-inset-top, 0px));
  padding-bottom: 8px;
}

.simulation-window-projet-ref {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  color: var(--muted);
  line-height: 1.2;
  letter-spacing: 0.2px;
}

.simulation-window-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  flex: 1 1 auto;
  min-width: 0;
}

.simulation-window-view-select {
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  font-size: 12px;
}

.simulation-window-status {
  flex: 1 1 120px;
  min-width: 0;
  font-size: 11px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.simulation-window-viewport {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  isolation: isolate;
}

.simulation-window-viewport #c {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  touch-action: none;
  background: var(--bg);
}

.simulation-window-viewport #loading {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.simulation-window-viewport #loading.hidden {
  display: none !important;
}

.simulation-window-viewport .simulation-progress-panel,
.simulation-window-viewport .simulation-insumos-panel,
.simulation-window-viewport .simulation-sensitivity-panel,
.simulation-window-viewport .simulation-co2-panel,
.simulation-window-viewport .simulation-insumos-analysis-panel,
.simulation-window-viewport .simulation-explosion-detail-modal,
.simulation-window-viewport .simulation-co2-report-modal,
.simulation-window-viewport .simulation-empty-hint,
.simulation-window-viewport #simulation-quickcheck-panel,
.simulation-window-viewport #simulation-forced-explosion-panel {
  z-index: 12;
}

.simulation-window-viewport .simulation-co2-panel {
  z-index: 30;
}

/* Recorrido: órbita/altura (izq.) y caminar (der.) */
.walkthrough-nav-orbit {
  position: fixed;
  left: max(10px, env(safe-area-inset-left, 0px));
  bottom: var(--walkthrough-controls-bottom);
  z-index: 126;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-end;
  gap: 8px;
  max-width: calc(100vw - 120px);
  pointer-events: auto;
}

.walkthrough-nav-orbit.hidden {
  display: none;
}

.walkthrough-nav-orbit-height {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 6px;
  border-radius: 14px;
  background: linear-gradient(165deg, rgba(22, 42, 62, 0.96) 0%, rgba(8, 18, 30, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.11);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
}

.walkthrough-nav-orbit-height-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
}

.walkthrough-nav-orbit-height-track {
  position: relative;
  width: 28px;
  height: 108px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
  touch-action: none;
  pointer-events: none;
}

.walkthrough-nav-orbit-height-fill {
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 4px;
  height: 40%;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(56, 189, 248, 0.55), rgba(14, 165, 233, 0.35));
  pointer-events: none;
}

.walkthrough-nav-orbit-height-thumb {
  position: absolute;
  left: 50%;
  bottom: 40%;
  width: 22px;
  height: 22px;
  margin: 0 0 0 -11px;
  padding: 0;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.85);
  background: rgba(56, 189, 248, 0.9);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  pointer-events: none;
  touch-action: none;
}

.walkthrough-nav-orbit-height-value {
  font-size: 10px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
  min-width: 3.2em;
  text-align: center;
}

.walkthrough-look-dpad {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.walkthrough-dpad-grid--look {
  width: 132px;
  height: 132px;
}

.walkthrough-look-dpad-hint {
  margin: 0;
  font-size: 9px;
  color: rgba(255, 255, 255, 0.65);
  text-align: center;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
  max-width: 140px;
}

.walkthrough-height-arrow {
  width: 28px;
  height: 24px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(15, 30, 48, 0.9);
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  touch-action: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.walkthrough-height-arrow:hover {
  background: rgba(30, 58, 90, 0.95);
}

.walkthrough-height-arrow:active,
.walkthrough-height-arrow.is-held {
  background: rgba(56, 189, 248, 0.35);
  border-color: rgba(125, 211, 252, 0.55);
}

.walkthrough-nav-orbit-pad {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 2px;
  border-radius: 12px;
  border: 1px dashed rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.2);
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  touch-action: none;
  cursor: grab;
  user-select: none;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
}

.walkthrough-nav-orbit-pad-label {
  display: block;
  max-width: 100%;
  padding: 0 1px;
  font-size: 7px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-align: center;
  text-transform: none;
  color: rgba(125, 211, 252, 0.88);
  overflow: hidden;
  word-break: break-word;
}

.walkthrough-nav-orbit-pad:hover {
  color: rgba(255, 255, 255, 0.92);
  border-color: rgba(125, 211, 252, 0.45);
}

.walkthrough-nav-orbit-pad:active {
  background: rgba(56, 189, 248, 0.2);
}

.walkthrough-dpad-grid--look .walkthrough-dpad-hub-cell {
  padding: 0;
  background: transparent;
  border: none;
}

.walkthrough-dpad-hint {
  margin: 4px 0 0;
  font-size: 9px;
  color: rgba(255, 255, 255, 0.65);
  text-align: right;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

/* legacy simulation-nav removed */
.simulation-nav-orbit,
.simulation-nav-walk {
  position: absolute;
  z-index: 12;
  pointer-events: none;
}

.simulation-nav-orbit.hidden,
.simulation-nav-walk.hidden {
  display: none;
}

.simulation-nav-orbit {
  left: max(10px, env(safe-area-inset-left, 0px));
  bottom: max(88px, calc(82px + env(safe-area-inset-bottom, 0px)));
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  gap: 8px;
  pointer-events: auto;
}

.simulation-nav-orbit-height {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 6px;
  border-radius: 14px;
  background: linear-gradient(165deg, rgba(22, 42, 62, 0.96) 0%, rgba(8, 18, 30, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.11);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
}

.simulation-nav-orbit-height-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
}

.simulation-nav-orbit-height-track {
  position: relative;
  width: 28px;
  height: 108px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
  touch-action: none;
}

.simulation-nav-orbit-height-fill {
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 4px;
  height: 40%;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(56, 189, 248, 0.55), rgba(14, 165, 233, 0.35));
  pointer-events: none;
}

.simulation-nav-orbit-height-thumb {
  position: absolute;
  left: 50%;
  bottom: 40%;
  width: 22px;
  height: 22px;
  margin: 0 0 0 -11px;
  padding: 0;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.85);
  background: rgba(56, 189, 248, 0.9);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  cursor: grab;
  touch-action: none;
}

.simulation-nav-orbit-height-thumb:active {
  cursor: grabbing;
}

.simulation-nav-orbit-height-value {
  font-size: 10px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
  min-width: 3.2em;
  text-align: center;
}

.simulation-nav-orbit-pad {
  width: 96px;
  height: 96px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: linear-gradient(165deg, rgba(22, 42, 62, 0.92) 0%, rgba(8, 18, 30, 0.96) 100%);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  touch-action: none;
  cursor: grab;
  user-select: none;
}

.simulation-nav-orbit-pad:active {
  cursor: grabbing;
}

.simulation-nav-orbit-pad-hint {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}

.simulation-nav-walk {
  right: max(10px, env(safe-area-inset-right, 0px));
  bottom: max(108px, calc(102px + env(safe-area-inset-bottom, 0px)));
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  pointer-events: auto;
}

.simulation-nav-walk-hint {
  margin: 0;
  font-size: 9px;
  color: rgba(255, 255, 255, 0.65);
  text-align: right;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

.simulation-nav-dpad {
  width: 132px;
  height: 132px;
}

.simulation-nav-dpad-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 5px;
  width: 100%;
  height: 100%;
  padding: 7px;
  box-sizing: border-box;
  border-radius: 18px;
  background: linear-gradient(165deg, rgba(22, 42, 62, 0.96) 0%, rgba(8, 18, 30, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.11);
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.48);
}

.simulation-nav-dpad-spacer {
  pointer-events: none;
}

.simulation-nav-dpad-hub {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
  padding: 0;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid rgba(56, 189, 248, 0.45);
  background: radial-gradient(circle at 35% 30%, rgba(56, 189, 248, 0.35), rgba(255, 255, 255, 0.08));
  cursor: pointer;
  touch-action: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.simulation-nav-dpad-hub.is-held {
  border-color: rgba(56, 189, 248, 0.85);
  background: radial-gradient(circle at 35% 30%, rgba(56, 189, 248, 0.55), rgba(14, 165, 233, 0.25));
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.45);
}

.simulation-nav-dpad-arrow {
  margin: 0;
  padding: 0;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.07);
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  touch-action: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

.simulation-nav-dpad-glyph {
  font-size: 13px;
  line-height: 1;
}

.simulation-nav-dpad-arrow.is-held {
  background: rgba(56, 189, 248, 0.22);
  border-color: rgba(56, 189, 248, 0.5);
}

.simulation-nav-dpad-up {
  grid-column: 2;
  grid-row: 1;
}

.simulation-nav-dpad-left {
  grid-column: 1;
  grid-row: 2;
}

.simulation-nav-dpad-right {
  grid-column: 3;
  grid-row: 2;
}

.simulation-nav-dpad-down {
  grid-column: 2;
  grid-row: 3;
}

body.simulation-active .simulation-progress-panel {
  bottom: max(10px, env(safe-area-inset-bottom, 0px));
  right: max(10px, env(safe-area-inset-right, 0px));
  /* Evita que el ratón “caiga” al canvas (#c cursor:none) bajo el panel Avance */
  pointer-events: auto;
}

/* Simulation: cruz CAD desactivada; puntero del sistema visible (como en el resto de la UI) */
body.simulation-active #c,
body.simulation-active #c.has-cad-crosshair,
body.simulation-active .simulation-window-viewport,
body.simulation-active .simulation-progress-panel {
  cursor: default !important;
}

body.simulation-active .simulation-curve-toggle,
body.simulation-active .simulation-window button,
body.simulation-active .simulation-bar button,
body.simulation-active .simulation-co2-report-btn,
body.simulation-active a,
body.simulation-active [role="button"] {
  cursor: pointer !important;
}

.simulation-co2-panel {
  position: absolute;
  right: max(10px, env(safe-area-inset-right, 0px));
  top: max(10px, env(safe-area-inset-top, 0px));
  z-index: 5;
  width: min(88vw, 260px);
  max-height: min(46vh, 380px);
  padding: 10px 10px 8px;
  border-radius: 14px;
  background: linear-gradient(165deg, rgba(8, 38, 28, 0.94) 0%, rgba(6, 24, 18, 0.96) 100%);
  border: 1px solid rgba(57, 255, 20, 0.35);
  box-shadow:
    0 0 18px rgba(57, 255, 20, 0.12),
    0 12px 32px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(8px);
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(57, 255, 20, 0.55) rgba(0, 0, 0, 0.25);
}

.simulation-co2-panel::-webkit-scrollbar {
  width: 7px;
}

.simulation-co2-panel::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.22);
  border-radius: 999px;
}

.simulation-co2-panel::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #86efac 0%, #39ff14 100%);
  border-radius: 999px;
  border: 1px solid rgba(6, 24, 18, 0.55);
}

.simulation-co2-panel.hidden {
  display: none !important;
}

.simulation-co2-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-shrink: 0;
}

.simulation-co2-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #bbf7d0;
}

.simulation-co2-total-badge {
  font-size: 10px;
  font-weight: 700;
  color: #052e16;
  background: linear-gradient(180deg, #ccff00 0%, #39ff14 100%);
  border: 1px solid #adff2f;
  border-radius: 999px;
  padding: 2px 8px;
  box-shadow: 0 0 10px rgba(57, 255, 20, 0.45);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.simulation-co2-meta {
  margin: 0;
  font-size: 9px;
  line-height: 1.35;
  font-weight: 600;
  color: rgba(187, 247, 208, 0.88);
  flex-shrink: 0;
}

.simulation-co2-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  flex-shrink: 0;
}

.simulation-co2-kpi {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 7px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(57, 255, 20, 0.18);
}

.simulation-co2-kpi-label {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(187, 247, 208, 0.72);
}

.simulation-co2-kpi-value {
  font-size: 11px;
  font-weight: 700;
  color: #ecfccb;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}

.simulation-co2-section-caption {
  margin: 2px 0 0;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(187, 247, 208, 0.65);
  flex-shrink: 0;
}

.simulation-co2-bars {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-shrink: 0;
  max-height: none;
  overflow: visible;
}

.simulation-co2-bar-row {
  display: grid;
  grid-template-columns: 58px 1fr 46px;
  align-items: center;
  gap: 5px;
}

.simulation-co2-bar-lab {
  font-size: 8px;
  color: #dcfce7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.simulation-co2-bar-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.18);
  overflow: hidden;
}

.simulation-co2-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #22c55e 0%, #39ff14 100%);
  box-shadow: 0 0 6px rgba(57, 255, 20, 0.55);
}

.simulation-co2-bar-val {
  font-size: 8px;
  font-weight: 700;
  color: #ecfccb;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.simulation-co2-process-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
}

.simulation-co2-process-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 6px;
  align-items: center;
  padding: 4px 6px;
  border-radius: 7px;
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid rgba(57, 255, 20, 0.12);
}

.simulation-co2-process-name {
  font-size: 8px;
  color: #dcfce7;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.simulation-co2-process-co2 {
  font-size: 8px;
  font-weight: 700;
  color: #bbf7d0;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.simulation-co2-process-track {
  grid-column: 1 / -1;
  height: 5px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
}

.simulation-co2-process-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #16a34a 0%, #84cc16 100%);
}

.simulation-co2-footnote {
  margin: 0;
  font-size: 7px;
  line-height: 1.3;
  color: rgba(187, 247, 208, 0.55);
  flex: 1;
  min-width: 0;
}

.simulation-co2-foot {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  flex-shrink: 0;
  margin-top: 2px;
}

.simulation-co2-report-btn {
  width: 100%;
  padding: 5px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #052e16;
  background: linear-gradient(180deg, #bbf7d0 0%, #4ade80 100%);
  border: 1px solid rgba(57, 255, 20, 0.45);
  border-radius: 8px;
  cursor: pointer;
}

.simulation-co2-report-btn:hover {
  filter: brightness(1.05);
}

/* Taille = viewport simulation (pas 92vh) pour laisser toolbar + barre bas visibles */
.simulation-window-viewport .simulation-co2-report-modal {
  overflow: hidden;
  padding: 16px 14px;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
}

.simulation-co2-report-dialog {
  width: min(92%, 840px);
  max-width: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden; /* un seul scroll : .simulation-co2-report-body */
  box-sizing: border-box;
}

.simulation-co2-report-dialog .simulation-explosion-detail-head,
.simulation-co2-report-dialog .simulation-explosion-detail-meta {
  flex-shrink: 0;
}

.simulation-co2-report-head-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
}

.simulation-co2-report-head-actions .btn {
  width: auto;
  margin: 0;
  white-space: nowrap;
}

.simulation-co2-report-head-actions #simulation-co2-report-export-pdf {
  order: 1;
}

.simulation-co2-report-head-actions #simulation-co2-report-close {
  order: 2;
}

.simulation-co2-report-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: none;
  padding-right: 6px;
  font-size: 12px;
  line-height: 1.45;
  color: #e2e8f0;
  -webkit-overflow-scrolling: touch;
}

.simulation-co2-report-section {
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.2);
}

.simulation-co2-report-section h4 {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #86efac;
}

.simulation-co2-report-section p {
  margin: 0 0 8px;
}

.simulation-co2-report-section p:last-child {
  margin-bottom: 0;
}

.simulation-co2-report-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.simulation-co2-report-kpi {
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(6, 78, 59, 0.35);
  border: 1px solid rgba(74, 222, 128, 0.25);
}

.simulation-co2-report-kpi .k {
  display: block;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 3px;
}

.simulation-co2-report-kpi .v {
  font-size: 13px;
  font-weight: 700;
  color: #ecfdf5;
}

.simulation-co2-report-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.simulation-co2-report-table th,
.simulation-co2-report-table td {
  padding: 5px 6px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
  text-align: left;
  vertical-align: top;
}

.simulation-co2-report-table th {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}

.simulation-co2-report-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.simulation-co2-report-sensitivity {
  margin-top: 8px;
  padding: 8px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.35);
}

.simulation-co2-report-sensitivity canvas {
  display: block;
  width: 100%;
  max-width: 640px;
  height: auto;
  margin: 0 auto;
}

.simulation-co2-report-ol {
  margin: 0;
  padding-left: 18px;
}

.simulation-co2-report-ol li {
  margin-bottom: 6px;
}

.simulation-co2-report-norms {
  margin: 0;
  padding-left: 16px;
}

.simulation-co2-report-norms li {
  margin-bottom: 6px;
}

.simulation-co2-report-disclaimer {
  font-size: 10px;
  color: #94a3b8;
  font-style: italic;
}

.simulation-progress-panel {
  position: absolute;
  right: max(10px, env(safe-area-inset-right, 0px));
  bottom: max(10px, env(safe-area-inset-bottom, 0px));
  z-index: 6;
  box-sizing: border-box;
  width: min(92vw, 260px);
  padding: 10px 10px 8px;
  border-radius: 14px;
  background: linear-gradient(165deg, rgba(12, 32, 56, 0.94) 0%, rgba(8, 22, 40, 0.96) 100%);
  border: 1px solid rgba(125, 211, 252, 0.28);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(8px);
  pointer-events: none;
}

.simulation-progress-panel.hidden {
  display: none !important;
}

.simulation-progress-head {
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 4px;
  letter-spacing: 0.02em;
}

.simulation-progress-panel canvas {
  display: none !important;
}

.simulation-progress-bars {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 2px 0 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

.simulation-progress-row {
  display: grid;
  grid-template-columns: 4.6rem minmax(0, 1fr) 2.4rem;
  align-items: center;
  gap: 8px;
}

.simulation-progress-name {
  font-size: 11px;
  font-weight: 600;
  color: rgba(226, 232, 240, 0.88);
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.simulation-progress-track {
  display: block;
  height: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
  overflow: hidden;
}

.simulation-progress-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  max-width: 100%;
  transition: width 0.18s ease;
}

.simulation-progress-fill--phys {
  background: linear-gradient(90deg, rgba(20, 184, 166, 0.95), rgba(59, 130, 246, 0.95));
}

.simulation-progress-fill--fin {
  background: linear-gradient(90deg, rgba(139, 92, 246, 0.95), rgba(59, 130, 246, 0.95));
}

.simulation-progress-pct {
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: rgba(248, 250, 252, 0.95);
  text-align: right;
  letter-spacing: 0.01em;
}

.simulation-progress-labels {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 6px;
  font-size: 10px;
  color: var(--muted);
}

.simulation-progress-row-main {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.simulation-progress-tag {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 0;
  min-width: 0;
}

.simulation-progress-tag strong {
  color: var(--text);
  font-variant-numeric: tabular-nums;
  margin-left: auto;
}

.simulation-progress-euro-row {
  text-align: right;
  line-height: 1.3;
}

.simulation-euro-line {
  font-size: 8px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  line-height: 1.3;
  max-width: 100%;
  word-break: break-word;
}

.simulation-insumos-panel,
.simulation-sensitivity-panel {
  position: absolute;
  /* Columna derecha entre CO₂ y Avance (posiciones finales vía JS). */
  right: max(10px, env(safe-area-inset-right, 0px));
  left: auto;
  top: max(12px, calc(10px + env(safe-area-inset-top, 0px) + min(28vh, 220px) + 10px));
  bottom: max(118px, calc(108px + env(safe-area-inset-bottom, 0px)));
  z-index: 5;
  width: min(92vw, 260px);
  max-height: none;
  height: auto;
  padding: 10px 10px 8px;
  border-radius: 14px;
  background: linear-gradient(165deg, rgba(12, 32, 56, 0.94) 0%, rgba(8, 22, 40, 0.96) 100%);
  border: 1px solid rgba(125, 211, 252, 0.28);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(8px);
  pointer-events: auto;
  cursor: default;
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow: hidden;
}

.simulation-insumos-panel.hidden,
.simulation-sensitivity-panel.hidden {
  display: none !important;
}

.simulation-insumos-analysis-panel {
  position: absolute;
  left: max(10px, env(safe-area-inset-left, 0px));
  bottom: max(10px, env(safe-area-inset-bottom, 0px));
  z-index: 6;
  width: min(92vw, 260px);
  padding: 8px 10px;
  border-radius: 12px;
  background: linear-gradient(165deg, rgba(12, 32, 56, 0.92) 0%, rgba(8, 22, 40, 0.95) 100%);
  border: 1px solid rgba(125, 211, 252, 0.3);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.34);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.simulation-insumos-analysis-panel.hidden {
  display: none !important;
}

/* Oculto por solicitud: solo mantener el panel grande de explosión (recuadro rojo). */
#simulation-insumos-analysis-panel {
  display: none !important;
}

.simulation-insumos-analysis-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.simulation-insumos-analysis-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #e2e8f0;
}

.simulation-insumos-analysis-total {
  font-size: 10px;
  font-weight: 700;
  color: #bae6fd;
}

.simulation-insumos-analysis-meta {
  margin: 0;
  font-size: 9px;
  color: rgba(226, 232, 240, 0.88);
}

.simulation-insumos-analysis-bars {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.simulation-insumos-analysis-chart-wrap {
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.34);
  border: 1px solid rgba(148, 163, 184, 0.2);
  padding: 4px;
}

.simulation-insumos-analysis-canvas {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
  max-height: 120px;
}

.simulation-insumos-analysis-row {
  display: grid;
  grid-template-columns: 66px 1fr 42px;
  align-items: center;
  gap: 6px;
}

.simulation-insumos-analysis-lab {
  font-size: 9px;
  color: #e2e8f0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.simulation-insumos-analysis-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.22);
  overflow: hidden;
}

.simulation-insumos-analysis-fill {
  height: 100%;
  border-radius: 999px;
}

.simulation-insumos-analysis-pct {
  font-size: 9px;
  font-weight: 700;
  color: #e2e8f0;
  text-align: right;
}

.simulation-insumos-analysis-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 8px;
  font-variant-numeric: tabular-nums;
}

.simulation-insumos-analysis-table th,
.simulation-insumos-analysis-table td {
  padding: 3px 4px;
  border-bottom: 1px solid rgba(148, 197, 255, 0.12);
  color: #e2e8f0;
  text-align: left;
}

.simulation-insumos-analysis-table th {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #f1f5f9;
  background: rgba(30, 58, 82, 0.8);
}

.simulation-insumos-analysis-table .num {
  text-align: right;
  white-space: nowrap;
}

.simulation-insumos-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-shrink: 0;
}

.simulation-insumos-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #e2e8f0;
}

.simulation-insumos-expand-btn {
  flex: 0 0 auto;
  min-height: 26px !important;
  padding: 0 10px !important;
  font-size: 10px !important;
  margin: 0 !important;
  width: auto !important;
}

.simulation-insumos-meta,
.simulation-sensitivity-sub {
  margin: 0;
  font-size: 9px;
  line-height: 1.35;
  font-weight: 600;
  color: rgba(226, 232, 240, 0.88);
  flex-shrink: 0;
}

.simulation-insumos-chart-wrap {
  flex-shrink: 0;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.35);
  border: 1px solid rgba(148, 163, 184, 0.16);
  padding: 4px;
}

.simulation-insumos-chart,
.simulation-insumos-panel canvas,
.simulation-sensitivity-panel canvas {
  display: block;
  width: 100%;
  height: auto;
  max-height: 148px;
  margin: 0 auto;
}

.simulation-insumos-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
  flex-shrink: 0;
}

.simulation-insumos-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 8px;
  font-weight: 600;
  color: rgba(226, 232, 240, 0.9);
  white-space: nowrap;
}

.simulation-insumos-legend-swatch {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.simulation-insumos-tables {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow: hidden;
}

.simulation-insumos-concepts-caption {
  margin: 2px 0 0;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(148, 163, 184, 0.95);
  flex-shrink: 0;
}

.simulation-insumos-concepts-wrap {
  flex: 1 1 auto;
  min-height: 48px;
  max-height: 140px;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid rgba(148, 197, 255, 0.16);
  scrollbar-width: thin;
}

.simulation-insumos-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 9px;
  font-variant-numeric: tabular-nums;
}

.simulation-insumos-table th,
.simulation-insumos-table td {
  padding: 4px 5px;
  border-bottom: 1px solid rgba(148, 197, 255, 0.1);
  text-align: left;
  color: #e2e8f0;
}

.simulation-insumos-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: linear-gradient(180deg, #1e3a52 0%, #152a3d 100%);
  color: #f1f5f9;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.simulation-insumos-table td.num,
.simulation-insumos-table th.num {
  text-align: right;
  white-space: nowrap;
}

.simulation-insumos-table tbody tr:last-child td {
  border-bottom: none;
}

.simulation-insumos-table--concepts td:first-child {
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.simulation-insumos-table .simulation-insumos-rubro-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 2px;
  margin-right: 5px;
  vertical-align: middle;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
}

.simulation-insumos-table tr.is-empty td {
  color: rgba(148, 163, 184, 0.75);
  font-style: italic;
  text-align: center;
}

.simulation-sensitivity-head {
  font-size: 9px;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 4px;
  letter-spacing: 0.02em;
}

.simulation-sensitivity-hint {
  margin: 0 0 4px;
  font-size: 8px;
  line-height: 1.2;
  color: var(--muted);
  opacity: 0.92;
}

.simulation-explosion-detail-modal {
  position: absolute;
  inset: 0;
  z-index: 12;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
  box-sizing: border-box;
}

.simulation-explosion-detail-modal.hidden {
  display: none !important;
}

.simulation-explosion-detail-backdrop {
  position: absolute;
  inset: 0;
  border: none;
  margin: 0;
  padding: 0;
  background: rgba(2, 10, 24, 0.72);
  cursor: pointer;
}

.simulation-explosion-detail-dialog {
  position: relative;
  z-index: 1;
  width: min(96vw, 920px);
  max-height: min(88vh, 640px);
  overflow: auto;
  border-radius: 12px;
  border: 1px solid rgba(148, 197, 255, 0.28);
  background: linear-gradient(180deg, rgba(10, 28, 48, 0.98), rgba(8, 22, 38, 0.98));
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
  padding: 12px;
}

/* Rapport CO₂ : hauteur = zone 3D (orange), un seul scroll dans le corps. */
.simulation-explosion-detail-dialog.simulation-co2-report-dialog {
  display: flex;
  flex-direction: column;
  width: min(92%, 840px);
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.simulation-explosion-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.simulation-explosion-detail-head h3 {
  margin: 0;
  font-size: 14px;
  color: var(--text);
}

.simulation-explosion-detail-meta {
  margin: 0 0 8px;
  font-size: 11px;
  color: rgba(226, 232, 240, 0.92);
}

.simulation-explosion-detail-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

@media (min-width: 720px) {
  .simulation-explosion-detail-summary {
    grid-template-columns: repeat(4, minmax(100px, 1fr));
  }
}

.simulation-explosion-detail-chip {
  border: 1px solid rgba(148, 197, 255, 0.22);
  border-radius: 8px;
  padding: 6px 8px;
  background: rgba(11, 34, 58, 0.62);
}

.simulation-explosion-detail-chip .k {
  display: block;
  font-size: 10px;
  color: rgba(203, 213, 225, 0.9);
}

.simulation-explosion-detail-chip .v {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 700;
  color: #f8fafc;
}


.simulation-explosion-detail-table-wrap {
  overflow: auto;
  border: 1px solid rgba(148, 197, 255, 0.18);
  border-radius: 8px;
}

.simulation-explosion-detail-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
}

.simulation-explosion-detail-table th,
.simulation-explosion-detail-table td {
  padding: 6px 8px;
  font-size: 11px;
  border-bottom: 1px solid rgba(148, 197, 255, 0.14);
}

.simulation-explosion-detail-table th {
  position: sticky;
  top: 0;
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  color: var(--visor-sheet-header-text);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 600;
  text-align: left;
  z-index: 1;
}

.simulation-explosion-detail-table td {
  color: var(--text);
  font-variant-numeric: tabular-nums;
}

.simulation-explosion-detail-table td.num {
  text-align: right;
}

.sim-dot {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  flex-shrink: 0;
}

.sim-dot--phys {
  background: var(--btn-persist);
  box-shadow: 0 0 6px rgba(13, 115, 119, 0.45);
}

.sim-dot--fin {
  background: #7cc8fc;
  box-shadow: 0 0 6px var(--accent-glow);
}

.simulation-empty-hint {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  background: rgba(6, 21, 37, 0.88);
  pointer-events: none;
}

.simulation-empty-hint.hidden {
  display: none !important;
}

.simulation-empty-hint-inner {
  max-width: 28rem;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text);
}

.simulation-empty-hint-title {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 600;
}

.simulation-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 60;
  padding: 10px 14px;
  padding-bottom: calc(12px + max(env(safe-area-inset-bottom, 0px), 22px));
  padding-left: max(14px, env(safe-area-inset-left, 0px));
  padding-right: max(14px, env(safe-area-inset-right, 0px));
  background: rgba(18, 22, 32, 0.96);
  border-top: 1px solid var(--border);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.45);
}

.simulation-bar.simulation-bar--in-window {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  z-index: 40;
  flex-shrink: 0;
  box-shadow: none;
  padding: 6px 10px 8px;
  background: rgba(18, 22, 32, 0.92);
}

.simulation-bar.hidden {
  display: none;
}

.simulation-bar-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  max-width: 1320px;
  margin: 0 auto;
  justify-content: center;
}

.simulation-bar .btn.small {
  width: auto;
  margin-bottom: 0;
  padding: 4px 10px;
  min-height: 28px;
}

.simulation-date-label {
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  min-width: 7.4rem;
  text-align: center;
}

.simulation-date-picker {
  position: relative;
  z-index: 41;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 28px;
  padding: 3px 9px;
  border-radius: 8px;
  border: 1px solid rgba(148, 197, 255, 0.45);
  background: rgba(15, 28, 48, 0.92);
  color: #e8eef7;
  cursor: pointer;
  isolation: isolate;
  color-scheme: dark;
}

.simulation-date-picker:hover {
  border-color: rgba(20, 184, 166, 0.55);
  background: rgba(20, 184, 166, 0.1);
}

.simulation-date-picker-text {
  position: relative;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  color: #e8eef7;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.simulation-date-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  color: transparent;
  background: transparent;
  cursor: pointer;
  font-size: 16px;
  z-index: 2;
  pointer-events: auto;
  -webkit-appearance: none;
  appearance: none;
}

.simulation-speed-label,
.simulation-scrub-label,
.simulation-3d-reveal-label {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #e2e8f0;
  min-width: 0;
  white-space: nowrap;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

.simulation-speed-label,
.simulation-3d-reveal-label {
  flex: 0 1 auto;
}

.simulation-unit {
  font-size: 11px;
  font-weight: 600;
  opacity: 0.95;
  color: #cbd5e1;
}

.simulation-3d-reveal-label select,
.simulation-3d-reveal-select,
#simulation-3d-reveal-mode {
  max-width: 14rem;
  min-width: 8.5rem;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 8px;
  /* Fond clair + texte foncé : les options natives (Windows) restent lisibles. */
  border: 1px solid #64748b;
  background: #f8fafc;
  color: #0f172a;
  color-scheme: light;
}

.simulation-3d-reveal-label select option,
.simulation-3d-reveal-select option,
#simulation-3d-reveal-mode option {
  color: #0f172a;
  background: #ffffff;
  font-weight: 600;
}

.simulation-3d-reveal-label select option:checked,
.simulation-3d-reveal-select option:checked,
#simulation-3d-reveal-mode option:checked,
.simulation-3d-reveal-label select option:hover,
.simulation-3d-reveal-select option:hover,
#simulation-3d-reveal-mode option:hover {
  color: #0f172a;
  background: #e2e8f0;
}

.simulation-scrub-label {
  flex: 1 1 280px;
  max-width: 420px;
  font-size: 12px;
}

.simulation-speed-label input[type="range"],
.simulation-scrub-label input[type="range"] {
  width: 100%;
  min-width: 110px;
  height: 18px;
  accent-color: #38bdf8;
}

@media (max-width: 720px) {
  .plan-sheet-export-group {
    margin-left: 0;
    width: 100%;
  }
}

/* Modal III catálogo / IV cronograma */
.budget-sheet-modal {
  position: fixed;
  inset: 0;
  z-index: 1012;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(10px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px))
    max(10px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
}

.budget-sheet-modal.hidden {
  display: none;
}

.budget-sheet-backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.75);
  cursor: pointer;
}

.budget-sheet-dialog {
  position: relative;
  z-index: 2;
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  width: min(98vw, 1100px);
  max-height: min(92vh, 900px);
  margin: 0 auto;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
  min-height: 0;
}

.budget-sheet-intro {
  margin: 0;
  padding: 10px 14px;
  font-size: 12px;
  line-height: 1.45;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}

.budget-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 10px 14px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}

.budget-toolbar-group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: stretch;
  gap: 8px;
  flex: 1;
  min-width: 0;
}

.budget-toolbar-group > #budget-clear-all.btn,
.budget-toolbar-group > #budget-delete-row.btn,
.budget-toolbar-group > #budget-fill-ifc-weight.btn {
  width: 100%;
  min-width: 0;
  margin: 0;
  text-align: center;
  line-height: 1.2;
  white-space: normal;
  padding-left: 8px;
  padding-right: 8px;
}

.budget-toolbar-group #budget-delete-row.btn {
  margin-right: 0;
}

.budget-toolbar-group #budget-fill-ifc-weight.btn {
  margin-right: 0;
}

.budget-toolbar-subrow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 8px;
  padding: 8px 14px 10px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #faf5ff 0%, #f3effa 100%);
}

.budget-toolbar-subrow .btn.small {
  width: 100%;
  min-width: 0;
  margin: 0;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  white-space: normal;
  padding-left: 8px;
  padding-right: 8px;
}

.budget-toolbar-group + .budget-toolbar-group {
  padding-left: 14px;
  border-left: 1px solid var(--border);
  margin-left: 0;
}

.budget-toolbar .btn.small {
  width: auto;
  margin: 0;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

/* Persistencia / filas (prioridad media) — acier, pas vert néon */
.budget-toolbar .btn.btn-budget-green {
  background: var(--btn-persist);
  color: var(--text);
  border: 1px solid var(--btn-persist-border);
  text-shadow: none;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.budget-toolbar .btn.btn-budget-green:hover {
  background: var(--btn-persist-hover);
  border-color: var(--accent);
  color: var(--text);
}

/* IFC / extraction (avertissement mesuré) — terre cuite, distinct du vert */
.budget-toolbar .btn.btn-budget-orange {
  background: var(--btn-warn);
  color: var(--text);
  border: 1px solid var(--btn-warn-border);
  text-shadow: none;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.budget-toolbar .btn.btn-budget-orange:hover {
  background: var(--btn-warn-hover);
  border-color: var(--accent);
  color: var(--text);
}

.budget-toolbar-label {
  font-size: 12px;
  color: var(--muted);
  margin-right: 2px;
}

.budget-cell-editor {
  flex-shrink: 0;
  padding: 8px 14px 10px;
  border-bottom: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.12);
}

.budget-cell-editor-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  margin-bottom: 6px;
}

.budget-cell-editor-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
}

.budget-cell-editor-hint {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.3;
  max-width: 100%;
  text-align: right;
  flex: 1 1 auto;
  min-width: 0;
}

.budget-cell-editor-field {
  display: block;
  width: 100%;
  box-sizing: border-box;
  min-height: 100px;
  max-height: min(32vh, 360px);
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.45;
  font-family: inherit;
  color: var(--text);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 6px;
  resize: vertical;
}

.budget-cell-editor-field:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.budget-table tbody td.budget-importe {
  cursor: pointer;
}

.budget-table-wrap {
  flex: 1;
  min-height: 180px;
  overflow: auto;
  padding: 12px 14px 14px;
  background: rgba(0, 0, 0, 0.18);
  -webkit-overflow-scrolling: touch;
}

/* Iframe fuera de pantalla: impresión desde la ventana principal sin vista previa */
.budget-report-print-host {
  position: absolute;
  left: -9999px;
  top: 0;
  width: 210mm;
  height: 297mm;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
}

.budget-report-print-host .budget-report-iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #f5f7f8;
}

.budget-table {
  width: max(100%, 720px);
  border-collapse: collapse;
  font-size: 12px;
  background: var(--panel);
}

.budget-table thead th {
  text-align: left;
  padding: 9px 10px;
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  color: var(--visor-sheet-header-text);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.12);
  white-space: nowrap;
}

.budget-table thead tr.budget-table-filter-row th {
  position: sticky;
  top: 0;
  z-index: 3;
  padding: 5px 6px;
  vertical-align: middle;
  font-weight: 500;
  background: linear-gradient(180deg, #e8edf5 0%, #dfe6f0 100%);
  color: var(--text);
  box-shadow: 0 1px 0 var(--border);
}

.budget-table thead tr.budget-table-head-row th {
  position: sticky;
  top: var(--budget-filter-thead-sticky-offset, 2.65rem);
  z-index: 2;
}

.budget-table .budget-filter-input {
  font-weight: 400;
  font-size: 11px;
  padding: 5px 7px;
  min-height: 2rem;
}

.budget-table tbody tr.budget-row--filtered-out {
  display: none !important;
}

.budget-table tbody td {
  padding: 4px 6px;
  border: 1px solid var(--border);
  vertical-align: middle;
}

.budget-td-level {
  font-weight: 600;
  font-size: 11px;
  white-space: nowrap;
  color: var(--muted);
}

.budget-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 6px 8px;
  font-size: 12px;
  font-family: inherit;
  color: var(--text);
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid var(--border);
  border-radius: 6px;
}

.budget-input:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.budget-table .budget-input:disabled,
.budget-table .budget-ud-select:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  color: var(--muted);
  border-color: rgba(148, 163, 184, 0.22);
}

.budget-table .budget-desc {
  min-width: 200px;
}

.budget-table .budget-ud-select {
  min-width: 3.25rem;
  max-width: 5rem;
  cursor: pointer;
}

.budget-importe {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text);
  background: rgba(0, 0, 0, 0.15);
  padding: 8px 10px !important;
}

.budget-importe.budget-importe--rollup {
  color: var(--accent);
}

.budget-input.budget-qty.budget-qty--rollup {
  color: var(--accent);
  font-weight: 600;
}

.budget-row--l1 {
  background: rgba(43, 143, 217, 0.1);
}

.budget-row--l1 .budget-td-level {
  color: #8ec8f0;
}

.budget-row--l2 {
  background: rgba(255, 255, 255, 0.04);
}

.budget-row--l2 .budget-td-level {
  color: #b8c5d9;
}

.budget-row--l3 {
  background: transparent;
}

.budget-row--l3 .budget-td-level {
  color: var(--muted);
}

.budget-row--l4 {
  background: rgba(255, 255, 255, 0.025);
}

.budget-row--l4 .budget-td-level {
  color: #9eb0c8;
}

.budget-row--l5 {
  background: rgba(0, 0, 0, 0.12);
}

.budget-row--l5 .budget-td-level {
  color: #8a9aac;
}

.budget-level-select {
  cursor: pointer;
  min-width: 5.75rem;
  max-width: 100%;
}

.budget-row--selected {
  outline: 2px solid rgba(20, 184, 166, 0.75);
  outline-offset: -2px;
}

/* Modal conceptos de costos */
.budget-concepts-modal {
  position: fixed;
  inset: 0;
  z-index: 1013;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(10px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px))
    max(10px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
}

.budget-concepts-modal.hidden {
  display: none;
}

.budget-concepts-backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.75);
  cursor: pointer;
}

.budget-concepts-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(99vw, 1180px);
  max-height: min(92vh, 900px);
  margin: 0 auto;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
  min-height: 0;
}

.budget-concepts-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: max(22px, calc(14px + env(safe-area-inset-top, 0px))) 14px 18px;
  border-bottom: 1px solid var(--border);
}

.budget-concepts-head #budget-concepts-title {
  width: 100%;
  margin: 0;
  padding: 6px 88px 0;
  box-sizing: border-box;
  text-align: center;
}

.budget-concepts-head-actions {
  position: absolute;
  right: max(14px, env(safe-area-inset-right, 0px));
  top: 50%;
  transform: translateY(calc(-50% + 3px));
}

.budget-concepts-head h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.budget-concepts-head-actions .btn.small {
  width: auto;
  margin: 0;
}

.budget-concepts-toolbar {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.budget-concepts-toolbar .btn.small {
  width: 100%;
  min-width: 0;
  margin: 0;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  white-space: normal;
  padding-left: 6px;
  padding-right: 6px;
}

.budget-concepts-catalog-block {
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.08);
}

.budget-concepts-catalog-toolbar {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: stretch;
  gap: 8px;
  padding: 10px 14px;
  flex-shrink: 0;
}

.budget-concepts-catalog-toolbar .btn.small {
  width: 100%;
  min-width: 0;
  margin: 0;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  white-space: normal;
  padding-left: 6px;
  padding-right: 6px;
}

.budget-cell-editor--concepts {
  padding-top: 10px;
  padding-bottom: 10px;
}

.budget-cell-editor--concepts .budget-cell-editor-field {
  min-height: 72px;
  max-height: min(24vh, 220px);
}

.budget-concepts-table-wrap {
  flex: 1;
  min-height: 180px;
  overflow: auto;
  padding: 12px 14px 14px;
  background: rgba(0, 0, 0, 0.18);
  -webkit-overflow-scrolling: touch;
}

.budget-concepts-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
  background: #dce6f0;
  color: #101827;
}

.budget-concepts-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 8px 6px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  color: var(--visor-sheet-header-text);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
}

.budget-concepts-table td {
  border: 1px solid #b8c6d6;
  padding: 3px 4px;
  background: #dce6f0;
}

.budget-concepts-table tbody tr:nth-child(even) td {
  background: #d3dfeb;
}

.budget-concepts-table .budget-input {
  background: #f5f8fb;
  color: #122033;
  border: 1px solid #9fb2c7;
}

.budget-concepts-table th:nth-child(1),
.budget-concepts-table td:nth-child(1) {
  width: 12%;
}

.budget-concepts-table th:nth-child(2),
.budget-concepts-table td:nth-child(2) {
  width: 20%;
}

.budget-concepts-table th:nth-child(3),
.budget-concepts-table td:nth-child(3) {
  width: 44%;
}

.budget-concepts-table th:nth-child(4),
.budget-concepts-table td:nth-child(4),
.budget-concepts-table th:nth-child(5),
.budget-concepts-table td:nth-child(5) {
  width: 12%;
}

/* Oculta Quantité (columna 6), mantiene dato para Enviar. */
.budget-concepts-table th:nth-child(6),
.budget-concepts-table td:nth-child(6) {
  display: none;
}

.budget-concepts-row--selected td {
  outline: 2px solid rgba(20, 184, 166, 0.75);
  outline-offset: -2px;
}

/* Modal IV Cronograma — pantalla completa (mismo criterio que catálogo en projet.html) */
.planning-5d-modal {
  position: fixed;
  inset: 0;
  z-index: 1014;
  isolation: isolate;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  padding: 0;
  overflow: hidden;
}

.planning-5d-modal.hidden {
  display: none;
}

.budget-pu-catalog-modal {
  position: fixed;
  inset: 0;
  z-index: 1018;
  display: flex;
  align-items: center;
  justify-content: center;
}

.budget-pu-catalog-modal.hidden {
  display: none;
}

.budget-pu-catalog-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: rgba(3, 7, 18, 0.66);
}

.budget-pu-catalog-dialog {
  position: relative;
  z-index: 1;
  width: min(96vw, 1060px);
  max-height: min(90vh, 820px);
  background: #f5f7fb;
  color: #1f2937;
  border: 1px solid #cdd7e3;
  border-radius: 10px;
  box-shadow: 0 20px 56px rgba(0, 0, 0, 0.45);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.budget-pu-catalog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #d7dfeb;
  background: #ffffff;
}

.budget-pu-catalog-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #1f2937;
}

.budget-pu-catalog-head-actions .btn.small {
  width: auto;
  margin: 0;
}

#budget-pu-catalog-add,
#budget-pu-catalog-remove {
  min-width: 32px;
  padding-left: 10px;
  padding-right: 10px;
}

#budget-pu-catalog-recalc.btn {
  background: var(--budget-recal-orange);
  border-color: rgba(30, 41, 59, 0.2);
  color: var(--btn-ivory);
  text-shadow: none;
}
#budget-pu-catalog-recalc.btn:hover:not(:disabled) {
  background: var(--budget-recal-orange-hover);
  border-color: rgba(30, 41, 59, 0.28);
  color: var(--btn-ivory);
}

.budget-pu-catalog-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid #d7dfeb;
  background: #ffffff;
}

.budget-pu-catalog-tab {
  border: 1px solid transparent;
  border-bottom: 0;
  background: #ffffff;
  color: #6b7280;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.budget-pu-catalog-tab.is-active {
  color: #1f2937;
  border-color: #d7dfeb;
  box-shadow: inset 0 -2px 0 #2563eb;
}

.budget-pu-catalog-body {
  flex: 1;
  min-height: 200px;
  overflow: auto;
  background: #ffffff;
  padding: 10px 12px 14px;
}

.budget-pu-catalog-resumen.hidden {
  display: none;
}

.budget-pu-catalog-resumen {
  border: 1px solid #e1e7f0;
  border-radius: 8px;
  background: #fbfdff;
  padding: 10px 12px;
}

.budget-pu-catalog-resumen h3 {
  margin: 0 0 8px;
  font-size: 14px;
  color: #334155;
}

.budget-pu-catalog-concept-head,
.budget-pu-catalog-concept-row {
  display: grid;
  grid-template-columns: 18% 44% 9% 14% 15%;
}

.budget-pu-catalog-concept-head {
  background: #5fa4dc;
  color: #ffffff;
  border: 1px solid #3c8ccf;
  border-radius: 6px 6px 0 0;
}

.budget-pu-catalog-concept-title {
  padding: 6px 8px;
  font-weight: 700;
  text-align: center;
  border-right: 1px solid rgba(255, 255, 255, 0.45);
}

.budget-pu-catalog-concept-title:last-child {
  border-right: 0;
}

.budget-pu-catalog-concept-row {
  border: 1px solid #8ec0ea;
  border-top: 0;
  margin-bottom: 8px;
  border-radius: 0 0 6px 6px;
}

.budget-pu-catalog-concept-cell {
  padding: 6px 8px;
  border-right: 1px solid #d8e7f4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.budget-pu-catalog-concept-cell:last-child {
  border-right: 0;
}

.budget-pu-catalog-concept-cell-pct {
  text-align: right;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.budget-pu-catalog-resumen-row {
  display: grid;
  grid-template-columns: 1fr auto 4.75rem;
  align-items: baseline;
  gap: 10px;
  padding: 4px 0;
  border-bottom: 1px dashed #e3eaf4;
  font-size: 13px;
}

.budget-pu-catalog-resumen-row:last-child {
  border-bottom: 0;
}

.budget-pu-catalog-resumen-label {
  min-width: 0;
}

.budget-pu-catalog-resumen-eur {
  color: #0f172a;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.budget-pu-catalog-resumen-pct {
  text-align: right;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.budget-pu-catalog-obra-block {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 2px solid #cbd5e1;
}

.budget-pu-catalog-obra-title {
  font-weight: 700;
  font-size: 12px;
  color: #0f172a;
  margin-bottom: 8px;
  line-height: 1.35;
}

.budget-pu-catalog-obra-note {
  margin: 0 0 10px;
  font-size: 11px;
  line-height: 1.4;
  color: #475569;
}

.budget-pu-catalog-obra-gridhead,
.budget-pu-catalog-obra-row {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) 0.95fr 0.62fr 1fr;
  gap: 6px 8px;
  align-items: center;
  font-size: 11px;
}

.budget-pu-catalog-obra-gridhead {
  font-weight: 700;
  color: #334155;
  padding-bottom: 4px;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 2px;
}

.budget-pu-catalog-obra-row {
  padding: 4px 0;
  border-bottom: 1px dashed #e8eef6;
}

.budget-pu-catalog-obra-row--total {
  border-bottom: 0;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid #cbd5e1;
  font-weight: 700;
}

.budget-pu-catalog-obra-label {
  min-width: 0;
  color: #1e293b;
}

.budget-pu-catalog-obra-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: #0f172a;
}

.budget-pu-catalog-obra-num--strong {
  font-weight: 700;
  color: #0c4a6e;
}

.budget-pu-catalog-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}

.budget-pu-catalog-table.hidden {
  display: none;
}

.budget-pu-catalog-table th,
.budget-pu-catalog-table td {
  border: 1px solid #e1e7f0;
  padding: 8px 8px;
  text-align: left;
}

.budget-pu-catalog-table th {
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  color: var(--visor-sheet-header-text);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-color: rgba(255, 255, 255, 0.12);
}

.budget-pu-catalog-table th:nth-child(1),
.budget-pu-catalog-table td:nth-child(1) {
  width: 15%;
}

.budget-pu-catalog-table th:nth-child(2),
.budget-pu-catalog-table td:nth-child(2) {
  width: 40%;
}

.budget-pu-catalog-table th:nth-child(3),
.budget-pu-catalog-table td:nth-child(3) {
  width: 10%;
}

.budget-pu-catalog-table th:nth-child(4),
.budget-pu-catalog-table td:nth-child(4) {
  width: 10%;
}

.budget-pu-catalog-table th:nth-child(5),
.budget-pu-catalog-table td:nth-child(5) {
  width: 12%;
}

.budget-pu-catalog-table th:nth-child(6),
.budget-pu-catalog-table td:nth-child(6) {
  width: 13%;
}

.budget-pu-catalog-table tbody tr {
  cursor: pointer;
}

.budget-pu-catalog-table tbody tr:hover {
  background: #f8fbff;
}

.budget-pu-catalog-table tbody tr.is-selected {
  outline: 2px solid rgba(37, 99, 235, 0.45);
  outline-offset: -2px;
}

.budget-pu-catalog-input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d6e0ee;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
  padding: 4px 6px;
  font-size: 13px;
}

.budget-pu-catalog-input.is-computed {
  background: #f1f5f9;
  color: #334155;
  cursor: default;
}

.budget-pu-catalog-picker-modal {
  position: fixed;
  inset: 0;
  z-index: 1022;
  display: flex;
  align-items: center;
  justify-content: center;
}

.budget-pu-catalog-picker-modal.hidden {
  display: none;
}

.budget-pu-catalog-picker-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: rgba(3, 7, 18, 0.72);
}

.budget-pu-catalog-picker-dialog {
  position: relative;
  z-index: 1;
  width: min(94vw, 720px);
  max-height: min(86vh, 640px);
  background: #f5f7fb;
  color: #1f2937;
  border: 1px solid #cdd7e3;
  border-radius: 10px;
  box-shadow: 0 20px 56px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.budget-pu-catalog-picker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #d7dfeb;
  background: #ffffff;
}

.budget-pu-catalog-picker-head h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: #1f2937;
}

.budget-pu-catalog-picker-hint {
  margin: 8px 12px 0;
  font-size: 13px;
  color: #4b5563;
}

.budget-pu-catalog-picker-table-wrap {
  flex: 1;
  min-height: 120px;
  margin: 10px 12px 0;
  border: 1px solid #d7dfeb;
  border-radius: 8px;
  background: #ffffff;
  overflow: auto;
}

.budget-pu-catalog-picker-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.budget-pu-catalog-picker-table th,
.budget-pu-catalog-picker-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #e8edf5;
  text-align: left;
  vertical-align: middle;
}

.budget-pu-catalog-picker-table th {
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--visor-sheet-header-text);
  border-color: rgba(255, 255, 255, 0.12);
  position: sticky;
  top: 0;
  z-index: 1;
}

.budget-pu-catalog-picker-th-cb,
.budget-pu-catalog-picker-td-cb {
  width: 40px;
  text-align: center;
}

.budget-pu-catalog-picker-empty {
  padding: 24px 12px;
  text-align: center;
  color: #6b7280;
}

.budget-pu-catalog-picker-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 10px;
  padding: 12px;
  border-top: 1px solid #d7dfeb;
  background: #ffffff;
}

.budget-pu-catalog-picker-actions .btn.small {
  width: 100%;
  min-width: 0;
  margin: 0;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  white-space: normal;
}

#budget-pu-catalog-picker-create-new.btn {
  background: var(--btn-geo);
  border-color: rgba(30, 41, 59, 0.2);
  color: var(--btn-ivory);
  text-shadow: none;
}
#budget-pu-catalog-picker-create-new.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
  border-color: rgba(30, 41, 59, 0.28);
  color: var(--btn-ivory);
}

.planning-5d-backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.75);
  cursor: pointer;
}

.planning-5d-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: 100%;
  margin: 0;
  background: var(--panel);
  border: none;
  border-radius: 0;
  box-shadow: none;
  min-height: 0;
  overflow: hidden;
  padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px)
    env(safe-area-inset-left, 0px);
}

.planning-5d-head {
  text-align: center;
}

.planning-5d-projet-ref {
  margin-top: 4px;
  font-size: 14px;
  font-weight: 700;
  color: var(--muted);
  line-height: 1.2;
  letter-spacing: 0.2px;
}

.planning-5d-projet-ref[hidden],
#cronograma-projet-ref {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

#cronograma-modal .planning-5d-head.modal-screen-title-bar {
  padding-top: 10px;
  padding-bottom: 8px;
}

.planning-5d-head-actions {
  display: none !important;
  flex-wrap: wrap;
  gap: var(--header-action-gap);
  align-items: center;
  justify-content: flex-end;
  padding: 0;
  border-bottom: none;
  background: transparent;
  height: 0;
  overflow: hidden;
  margin: 0;
}

.planning-5d-head-actions .btn-header-pill {
  flex: 0 1 auto;
  min-width: 0;
}

.planning-5d-intro {
  margin: 0;
  padding: 10px 14px;
  font-size: 12px;
  line-height: 1.45;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}

.planning-5d-toolbar {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 8px 12px 10px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  min-width: 0;
  position: relative;
  z-index: 50;
}

.planning-5d-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 8px;
  min-width: 0;
  width: 100%;
}

.planning-5d-toolbar-row:first-child > .planning-5d-tb-group {
  flex: 1 1 100%;
}

.planning-5d-tb-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding: 7px 10px 8px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
}

/* Acciones Planning: una sola línea, botones iguales, sin romper el resto */
.planning-5d-toolbar-row:nth-child(2) {
  display: grid;
  grid-template-columns: repeat(15, minmax(0, 1fr));
  gap: 5px;
  align-items: stretch;
  width: 100%;
  padding: 2px 0;
  box-sizing: border-box;
}

.planning-5d-toolbar-row:nth-child(2) > .planning-5d-tb-group {
  display: contents;
}

.planning-5d-toolbar-row:nth-child(2) > .planning-5d-tb-group > .planning-5d-tb-label {
  display: none;
}

.planning-5d-toolbar-row:nth-child(2) > .planning-5d-tb-group > .planning-5d-tb-controls,
.planning-5d-toolbar-row:nth-child(2) .planning-5d-tb-controls--inline,
.planning-5d-toolbar-row:nth-child(2) .planning-5d-free-actions,
.planning-5d-toolbar-row:nth-child(2) .planning-5d-io-actions {
  display: contents;
}

.planning-5d-toolbar-row:nth-child(2) > .planning-5d-tb-group:nth-child(2) {
  flex: unset;
}

.planning-5d-tb-group--primary {
  border-color: rgba(56, 189, 248, 0.45);
  background: linear-gradient(180deg, #f0f9ff 0%, #e0f2fe 100%);
  margin-left: 0;
}

.planning-5d-toolbar-row:first-child .planning-5d-tb-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  width: 100%;
  gap: 8px 10px;
}

.planning-5d-toolbar-row:first-child .btn.small,
.planning-5d-toolbar-row:first-child #planning-5d-columns-btn,
.planning-5d-toolbar-row:first-child #cronograma-columns-btn {
  flex: 0 0 auto;
  width: auto;
  min-width: 6.5rem;
  max-width: none;
}

.planning-5d-tb-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  line-height: 1;
  user-select: none;
}

.planning-5d-tb-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
  min-width: 0;
}

.planning-5d-tb-controls--inline {
  align-items: flex-end;
  gap: 10px 12px;
  flex-wrap: wrap;
}

.planning-5d-toolbar .btn.small,
.planning-5d-tb-controls .btn.small {
  flex: 0 0 auto;
  width: auto;
  margin: 0;
  min-height: 34px;
  height: auto;
  min-width: 0;
  max-width: none;
  padding: 8px 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-radius: 999px;
  line-height: 1.25;
  box-sizing: border-box;
  justify-content: center;
  color: var(--btn-on-cta, #0f172a);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

/* Solo la rejilla de acciones: una línea, celdas iguales */
.planning-5d-toolbar-row:nth-child(2) .btn.small {
  width: 100%;
  min-width: 0;
  flex: unset;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 5px 3px;
  font-size: 8.5px;
  letter-spacing: 0.01em;
  border-radius: 8px;
  line-height: 1.15;
}

.planning-5d-toolbar .btn-budget-blue {
  min-width: 0;
  background: #cdeee8;
  border-color: #3a9d8f;
  color: var(--btn-on-cta, #0f172a);
}

#planning-5d-new-free,
#cronograma-new-free,
#planning-5d-columns-btn,
#cronograma-columns-btn {
  background: #e0f2fe;
  border-color: #38bdf8;
}

#planning-5d-level-up,
#cronograma-level-up,
#planning-5d-save-schedule,
#cronograma-save-schedule {
  background: #cdeee8;
  border-color: #3a9d8f;
}

#planning-5d-recalc-dates,
#cronograma-recalc-dates,
.planning-5d-recalc-dates-btn {
  background: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

#planning-5d-recalc-dates:hover:not(:disabled),
#cronograma-recalc-dates:hover:not(:disabled),
.planning-5d-recalc-dates-btn:hover:not(:disabled) {
  background: #fde68a;
  border-color: #d97706;
  color: #78350f;
}

#planning-5d-level-same,
#cronograma-level-same {
  background: #dbeafe;
  border-color: #60a5fa;
}

#planning-5d-level-down,
#cronograma-level-down,
#planning-5d-export-projet,
#cronograma-export-projet {
  background: #e8e2f4;
  border-color: #9b86c9;
}

#planning-5d-edit-line,
#cronograma-edit-line,
#planning-5d-report-pdf,
#cronograma-report-pdf,
#planning-5d-calendar-btn,
#cronograma-calendar-btn {
  background: #ffe8d9;
  border-color: #fdba74;
}

#planning-5d-delete-line,
#cronograma-delete-line {
  background: #fadbe5;
  border-color: #f0a8bc;
}

#planning-5d-export-excel,
#cronograma-export-excel {
  background: #dcfce7;
  border-color: #86efac;
}

#planning-5d-import-excel,
#cronograma-import-excel,
#planning-5d-import-projet,
#cronograma-import-projet {
  background: #ede9fe;
  border-color: #a78bfa;
}

.planning-5d-toolbar .planning-5d-opt-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  margin: 0;
  padding: 0 2px 1px;
  min-height: 30px;
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}

.planning-5d-toolbar .planning-5d-opt-check input {
  width: 14px;
  height: 14px;
  margin: 0;
  flex: 0 0 auto;
  accent-color: #0284c7;
}

/* Compatibilité anciens sélecteurs (si encore référencés) */
.planning-5d-toolbar-filters,
.planning-5d-toolbar-actions,
.planning-5d-toolbar-meta,
.planning-5d-toolbar-pair,
.planning-5d-anchor-stack,
.planning-5d-anchor-filters-row {
  display: contents;
}

.planning-5d-action-status {
  flex-shrink: 0;
  margin: 0;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  border-bottom: 1px solid var(--border);
  background: #f0f9ff;
  color: #0c4a6e;
}

.planning-5d-action-status[data-kind="err"] {
  background: #fef2f2;
  color: #991b1b;
}

.planning-5d-action-status[data-kind="ok"] {
  background: #f0fdf4;
  color: #166534;
}

.planning-5d-head-chart.planning-5d-chart-flash {
  animation: planning-chart-flash 1.2s ease;
}

@keyframes planning-chart-flash {
  0%,
  100% {
    box-shadow: none;
  }
  30%,
  70% {
    box-shadow: inset 0 0 0 3px rgba(37, 99, 235, 0.55);
  }
}

.planning-5d-toolbar-pair .btn-header-pill {
  flex: 1 1 0;
  min-width: 145px;
}

.planning-5d-calc-hint {
  display: none;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
  opacity: 0.95;
  line-height: 1.1;
}

.planning-5d-anchor-label,
.planning-5d-max-level-label,
.planning-5d-scale-label,
.planning-5d-duration-mode-label,
.planning-5d-name-mode-label {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 4px;
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: 0;
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.2;
  white-space: nowrap;
}

/* Evitar que font-size/line-height de la etiqueta recorten el texto del control (WebView2). */
.planning-5d-anchor-label > input,
.planning-5d-anchor-label > select,
.planning-5d-max-level-label > select,
.planning-5d-scale-label > select,
.planning-5d-duration-mode-label > select,
.planning-5d-name-mode-label > select {
  font-size: 12px;
  font-weight: 500;
  line-height: 22px;
  color: var(--text, #0f172a);
}

.planning-5d-anchor-label {
  min-width: 148px;
}

.planning-5d-max-level-label {
  min-width: 140px;
}

.planning-5d-scale-label,
.planning-5d-duration-mode-label {
  min-width: 136px;
}

.planning-5d-name-mode-label,
.planning-5d-name-mode-label--actions {
  min-width: 0;
  max-width: none;
  justify-content: flex-end;
  border-right: none;
  margin-right: 0;
}

.planning-5d-max-level-select,
.planning-5d-time-scale-select,
.planning-5d-duration-mode-select,
.planning-5d-name-mode-select {
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 36px;
  min-height: 36px;
  max-height: none;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 500;
  line-height: 34px;
  border-radius: 6px;
  background: #fff;
  border: 1px solid #94a3b8;
  box-sizing: border-box;
  color: var(--text, #0f172a);
  overflow: visible;
  appearance: auto;
  -webkit-appearance: menulist;
  vertical-align: middle;
}

.planning-5d-name-mode-label--actions .planning-5d-name-mode-select {
  height: 36px;
  min-height: 36px;
  font-weight: 650;
}

.planning-5d-view-chart-btn {
  flex: 0 0 auto;
  align-self: flex-end;
  min-width: auto;
  white-space: nowrap;
}

/* Evitar regla duplicada anterior (height fijo 30px) que recortaba el texto. */

@media (max-width: 1100px) {
  .planning-5d-tb-group--primary {
    margin-left: 0;
  }
}

@media (max-width: 1100px) {
  .planning-5d-toolbar-row:nth-child(2) {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .planning-5d-toolbar-row {
    flex-direction: column;
  }
  .planning-5d-tb-group,
  .planning-5d-tb-group--primary {
    width: 100%;
    margin-left: 0;
  }
  .planning-5d-toolbar-row:first-child > .planning-5d-tb-group {
    flex: 1 1 auto;
  }
  .planning-5d-toolbar-row:nth-child(2) {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .planning-5d-toolbar-row:nth-child(2) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.planning-5d-calendar-wrap {
  position: absolute;
  inset: 0;
  z-index: 8;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
}

.planning-5d-calendar-wrap.hidden {
  display: none;
}

.planning-5d-calendar-backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(3, 7, 18, 0.62);
  cursor: pointer;
}

.planning-5d-calendar-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 400px);
  max-height: min(88vh, 520px);
  overflow: auto;
  padding: 14px 16px 16px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--panel);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.55);
}

.planning-5d-calendar-title {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
}

.planning-5d-calendar-hint {
  margin: 0 0 14px;
  font-size: 11px;
  line-height: 1.45;
  color: var(--muted);
}

.planning-5d-calendar-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 16px;
}

.planning-5d-calendar-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}

.planning-5d-calendar-select,
.planning-5d-calendar-hours {
  max-width: 100%;
  font-weight: 500;
}

.planning-5d-calendar-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
}

.planning-5d-calendar-check input {
  width: 16px;
  height: 16px;
  accent-color: #14b8a6;
}

.planning-5d-calendar-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

/* Dialogue Modifier ligne (remplace window.prompt) */
.planning-5d-form-modal {
  position: fixed;
  inset: 0;
  z-index: 23000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
}
.planning-5d-form-modal.hidden {
  display: none !important;
}
.planning-5d-form-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(15, 23, 42, 0.45);
  cursor: pointer;
}
.planning-5d-form-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 420px);
  max-height: min(88vh, 560px);
  overflow: auto;
  padding: 16px 18px 14px;
  border-radius: 10px;
  border: 1px solid #94a3b8;
  background: #f8fafc;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.35);
  box-sizing: border-box;
}
.planning-5d-form-title {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}
.planning-5d-form-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0 0 14px;
}
.planning-5d-form-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
}
.planning-5d-form-input {
  width: 100%;
  box-sizing: border-box;
  font-weight: 500;
  font-size: 13px;
  padding: 7px 9px;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
}
.planning-5d-form-input:focus {
  outline: 2px solid rgba(2, 132, 199, 0.35);
  border-color: #0284c7;
}
.planning-5d-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.planning-5d-form-actions .btn-budget-blue {
  background: linear-gradient(180deg, #4a8fb8 0%, #356a90 100%);
  border-color: #2d5f82;
  color: #fff;
}

.planning-5d-columns-dialog {
  width: min(100%, 380px);
}

.planning-5d-columns-hint {
  margin: 0 0 12px;
  font-size: 11px;
  line-height: 1.45;
  color: var(--muted);
  font-weight: 500;
}

.planning-5d-columns-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
  max-height: min(52vh, 360px);
  overflow: auto;
}

.planning-5d-columns-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
  user-select: none;
}

.planning-5d-columns-check input {
  width: 16px;
  height: 16px;
  accent-color: #0ea5e9;
  flex: 0 0 auto;
}

.planning-5d-columns-check input:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.planning-5d-columns-bulk {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.planning-5d-columns-btn {
  flex: 0 0 auto;
}

.planning-5d-io-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.planning-5d-io-btn {
  flex: 0 0 auto;
  white-space: nowrap;
}

.planning-5d-num-wrap--in-name {
  display: inline-flex;
  align-items: center;
  margin-right: 4px;
  flex: 0 0 auto;
}

.planning-5d-free-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7.2rem, 1fr));
  align-items: stretch;
  gap: 6px;
  width: 100%;
}

.planning-5d-io-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7.2rem, 1fr));
  align-items: stretch;
  gap: 6px;
  width: 100%;
}

.planning-5d-toolbar .planning-5d-new-free-btn,
.planning-5d-toolbar .planning-5d-datos-devis-btn,
.planning-5d-toolbar .planning-5d-delete-line-btn,
.planning-5d-toolbar .planning-5d-free-edit-btn,
.planning-5d-toolbar .planning-5d-io-btn,
.planning-5d-toolbar .planning-5d-view-chart-btn {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.planning-5d-gantt-row.planning-5d-row--selected .planning-5d-row-cols {
  outline: 2px solid rgba(15, 118, 110, 0.85);
  outline-offset: -2px;
  background: rgba(20, 184, 166, 0.12);
}

.planning-5d-gantt-row.planning-5d-row--selected .planning-5d-lane {
  background-color: rgba(20, 184, 166, 0.08);
  box-shadow: inset 0 0 0 1px rgba(15, 118, 110, 0.35);
}

.planning-5d-anchor-input {
  display: block;
  width: 100%;
  padding: 0 10px;
  height: 36px;
  min-height: 36px;
  max-height: none;
  line-height: 34px;
  border-radius: 6px;
  border: 1px solid #94a3b8;
  background: #fff;
  color: var(--text);
  font-size: 12px;
  font-weight: 500;
  min-width: 0;
  box-sizing: border-box;
  overflow: visible;
}

.planning-5d-anchor-input::-webkit-datetime-edit,
.planning-5d-anchor-input::-webkit-datetime-edit-fields-wrapper,
.planning-5d-anchor-input::-webkit-datetime-edit-text,
.planning-5d-anchor-input::-webkit-datetime-edit-month-field,
.planning-5d-anchor-input::-webkit-datetime-edit-day-field,
.planning-5d-anchor-input::-webkit-datetime-edit-year-field {
  padding: 0;
  line-height: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
}

.planning-5d-anchor-input::-webkit-calendar-picker-indicator {
  margin: 0;
  padding: 0;
  height: 18px;
  width: 18px;
  cursor: pointer;
}

.planning-5d-anchor-input:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-dur-input {
  width: 100%;
  max-width: 4.5rem;
  min-height: 28px;
  height: auto;
  padding: 5px 6px;
  font-size: var(--planning-table-font, 11px);
  line-height: 1.3;
  font-family: inherit;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  font-variant-numeric: tabular-nums;
  text-align: center !important;
  box-sizing: border-box;
}

.planning-5d-dur-input::-webkit-outer-spin-button,
.planning-5d-dur-input::-webkit-inner-spin-button {
  margin: 0;
}

.planning-5d-dur-unit {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 600;
  color: var(--muted, #64748b);
  user-select: none;
}

.planning-5d-dur-input:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-pred-select {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 28px;
  height: auto;
  padding: 5px 6px;
  font-size: var(--planning-table-font, 11px);
  line-height: 1.3;
  font-family: inherit;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  box-sizing: border-box;
  overflow: visible;
}

.planning-5d-pred-select:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-cell--pred .planning-5d-pred-select {
  border-color: var(--border);
  background: var(--panel-elev);
  color: var(--text);
}

.planning-5d-start-input,
.planning-5d-end-input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 28px;
  height: auto;
  padding: 5px 6px;
  font-size: var(--planning-table-font, 11px);
  line-height: 1.3;
  font-family: inherit;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
}

.planning-5d-start-input:focus,
.planning-5d-end-input:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-start-input:disabled {
  opacity: 1;
  color: #2563eb;
  font-weight: 600;
  cursor: not-allowed;
  background: rgba(237, 242, 248, 0.85);
}

.planning-5d-actual-date-input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 28px;
  height: auto;
  padding: 5px 6px;
  font-size: var(--planning-table-font, 11px);
  line-height: 1.3;
  font-family: inherit;
  border-radius: 4px;
  border: 1px solid #2f6f4a;
  background: rgba(21, 128, 61, 0.1);
  color: var(--text);
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
}

.planning-5d-actual-date-input:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-pred-static {
  text-align: center;
}

.planning-5d-body {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  /*
   * Sin padding-top/left: el padding del scrollport deja un hueco donde las columnas
   * Durée/fechas se asoman a la izquierda de la franja sticky (línea roja crítica).
   */
  padding: 0 12px 8px 0;
  margin-bottom: 0;
  /* Viewport único: scroll H+V aquí → barras siempre al borde visible (no al final del Gantt). */
  overflow-x: auto !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  background: var(--bg);
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #1e40af #93c5fd;
  display: block;
  position: relative;
  isolation: isolate;
}

.planning-5d-body::-webkit-scrollbar {
  width: 14px !important;
  height: 12px !important;
  background: #93c5fd !important;
}

.planning-5d-body::-webkit-scrollbar:horizontal {
  height: 12px !important;
  display: block !important;
  background: #93c5fd !important;
}

.planning-5d-body::-webkit-scrollbar:vertical {
  width: 14px !important;
  display: block !important;
  background: #93c5fd !important;
}

.planning-5d-body::-webkit-scrollbar-track {
  background: #93c5fd !important;
}

.planning-5d-body::-webkit-scrollbar-thumb {
  background: #1e40af !important;
  border-radius: 8px;
  border: 2px solid #93c5fd;
  min-width: 48px;
  min-height: 48px;
}

.planning-5d-body::-webkit-scrollbar-thumb:hover {
  background: #1e3a8a !important;
}

.planning-5d-body::-webkit-scrollbar-corner {
  background: #93c5fd !important;
}

.planning-5d-body.scroll {
  overflow-x: auto !important;
  overflow-y: auto !important;
}

.planning-5d-placeholder {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
}

/* Misma utilidad que `.loading.hidden`: sin esto el texto vacío sigue visible encima del Gantt. */
.planning-5d-placeholder.hidden,
.planning-5d-gantt-root.hidden {
  display: none !important;
}

.planning-5d-gantt-root {
  /* Contenido ancho; el scroll vertical/horizontal lo hace .planning-5d-body (viewport). */
  display: block;
  flex: none;
  align-self: auto;
  height: auto;
  min-height: 0;
  max-height: none;
  margin-top: 0;
  padding-top: 0;
  /* Ancho mínimo = tabla (incl. predecesora) + franja mínima del diagrama; evita que la tabla se pinte encima del Gantt. */
  --planning-left-min: 520px;
  --planning-scroll-cols-min: 640px;
  --planning-chart-min: 560px;
  --planning-chart-width: var(--planning-chart-min);
  /* Hueco entre tabla y diagrama (0 = unidos; línea negra define la división). */
  --planning-gantt-split-gap: 0px;
  --planning-gantt-divider: 1px solid #0f172a;
  --planning-gantt-hscroll-min: calc(
    var(--planning-left-min) + var(--planning-chart-width) + var(--planning-gantt-split-gap) + 40px +
      var(--planning-chart-trail-px, 48px)
  );
  /* Sin franja difuminada al final del diagrama (antes 48px + gradient). */
  --planning-chart-trail-px: 8px;
  min-width: max(100%, var(--planning-gantt-hscroll-min));
  width: max-content;
  max-width: none;
  box-sizing: border-box;
  overflow: visible;
}

.planning-5d-gantt {
  /* Tabla con ancho mínimo real; el diagrama reserva chart-min + hueco entre columnas. */
  --planning-table-font: 11px;
  --planning-col-n-px: 88px;
  --planning-col-estado-px: 168px;
  --planning-col-pred-px: 88px;
  --planning-col-name-px: 140px;
  --planning-col-comienzo-px: 104px;
  --planning-col-fin-px: 104px;
  --planning-cols-grid:
    minmax(0, var(--planning-col-n-px))
    minmax(0, var(--planning-col-estado-px))
    minmax(0, 100px)
    minmax(0, 100px)
    minmax(0, var(--planning-col-name-px))
    minmax(0, 108px)
    minmax(0, var(--planning-col-comienzo-px))
    minmax(0, var(--planning-col-fin-px))
    minmax(0, 80px)
    minmax(0, 80px)
    minmax(0, var(--planning-col-pred-px))
    minmax(0, 64px)
    minmax(0, 140px);
  --planning-left-track: var(--planning-left-min);
  --planning-scroll-cols-track: var(--planning-scroll-cols-min, 640px);
  --planning-chart-track: var(--planning-chart-width, var(--planning-chart-min, 560px));
  --planning-freeze-grid: var(--planning-cols-grid);
  --planning-scroll-grid:
    minmax(0, 108px)
    minmax(0, var(--planning-col-comienzo-px))
    minmax(0, var(--planning-col-fin-px))
    minmax(0, 80px)
    minmax(0, 80px)
    minmax(0, var(--planning-col-pred-px))
    minmax(0, 64px)
    minmax(0, 140px);
  display: flex;
  flex-direction: column;
  flex: none;
  min-height: 0;
  gap: 0;
  border: 1px solid var(--visor-sheet-grid);
  border-radius: 10px;
  overflow: visible;
  width: max-content;
  min-width: var(--planning-gantt-hscroll-min);
  height: auto;
  box-sizing: border-box;
  background: var(--panel-elev);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.planning-5d-gantt-head {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: var(--planning-left-track) var(--planning-scroll-cols-track) var(--planning-chart-track);
  column-gap: var(--planning-gantt-split-gap);
  align-items: stretch;
  flex-shrink: 0;
  /* Sticky respecto a .planning-5d-body (scroll H+V unificado). */
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--bg, #e2e9f2);
  border-bottom: 1px solid var(--visor-sheet-grid);
  border-radius: 10px 10px 0 0;
  direction: ltr;
  /* Cubre filas que se asoman arriba y columnas que se asoman a la izquierda. */
  box-shadow:
    0 -20px 0 0 var(--bg, #e2e9f2),
    -28px 0 0 0 var(--bg, #e2e9f2);
}

.planning-5d-gantt-head::before {
  content: "";
  position: absolute;
  left: -28px;
  right: 0;
  top: -24px;
  height: 24px;
  background: var(--bg, #e2e9f2);
  pointer-events: none;
  z-index: 0;
}

.planning-5d-head-cols {
  box-sizing: border-box;
  display: grid;
  column-gap: 6px;
  row-gap: 0;
  align-items: stretch;
  padding: 6px 8px 6px 6px;
  font-size: var(--planning-table-font);
  font-weight: 600;
  color: var(--visor-sheet-header-text);
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  border-right: none;
  overflow: hidden;
  position: relative;
}

.planning-5d-head-cols--freeze {
  width: var(--planning-left-track);
  min-width: 0;
  max-width: var(--planning-left-track);
  grid-template-columns: var(--planning-freeze-grid, var(--planning-cols-grid));
  position: sticky;
  left: 0;
  z-index: 42;
  /* Sombra sólida a la izquierda: tapa Durée/fechas al scroll H (no la recorta overflow). */
  box-shadow:
    2px 0 0 rgba(15, 23, 42, 0.12),
    -40px 0 0 0 var(--visor-sheet-header-bot, #1e3a5f);
  border-radius: 10px 0 0 0;
  isolation: isolate;
}

.planning-5d-head-cols--scroll {
  width: var(--planning-scroll-cols-track);
  min-width: var(--planning-scroll-cols-track);
  max-width: var(--planning-scroll-cols-track);
  grid-template-columns: var(--planning-scroll-grid);
  position: relative;
  z-index: 41;
  box-shadow: none;
  border-radius: 0;
}

.planning-5d-head-cols > .planning-5d-hcell {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  padding: 2px 2px;
  box-sizing: border-box;
  text-align: center;
  line-height: 1.15;
}

.planning-5d-head-cols > .planning-5d-hcell--sortable {
  justify-content: center;
  padding-right: 12px;
}

.planning-5d-head-cols > .planning-5d-hcell:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 2px;
  bottom: 2px;
  right: -4px;
  width: 1px;
  background: rgba(255, 255, 255, 0.42);
  pointer-events: none;
}

.planning-5d-hcell--sortable {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  border-radius: 3px;
  width: 100%;
}

.planning-5d-hcell--sortable:hover {
  background: rgba(255, 255, 255, 0.12);
}

.planning-5d-hcell--sortable:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.55);
  outline-offset: 0;
}

.planning-5d-hcell-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  flex: 1 1 auto;
}

.planning-5d-sort-arrows {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  flex: 0 0 auto;
  line-height: 0.9;
  margin: 0;
  position: absolute;
  right: 1px;
  top: 50%;
  transform: translateY(-50%);
  align-self: center;
}

.planning-5d-sort-up,
.planning-5d-sort-down {
  font-size: 10px;
  opacity: 0.45;
  color: rgba(255, 255, 255, 0.92);
}

.planning-5d-sort-up.is-active,
.planning-5d-sort-down.is-active {
  opacity: 1;
  color: #fbbf24;
}

.planning-5d-head-cols,
.planning-5d-row-cols {
  /* Evita que el contenido (surtout Complet) déborde sur le Gantt. */
  overflow-x: hidden;
  overflow-y: visible;
}

.planning-5d-hcell--n {
  text-align: center;
  white-space: nowrap;
}

.planning-5d-hcell--estado {
  text-align: center;
  white-space: nowrap;
}

.planning-5d-cell--estado {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: stretch;
}

.planning-5d-estado-select {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 28px;
  height: auto;
  padding: 5px 6px;
  font-size: var(--planning-table-font, 11px);
  line-height: 1.3;
  font-family: inherit;
  font-weight: 600;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--panel-elev);
  color: var(--text);
  cursor: pointer;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: visible;
  text-overflow: ellipsis;
}

.planning-5d-estado-select:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-estado-select[data-estado="pendiente_aprobacion"],
.planning-5d-estado-select option[value="pendiente_aprobacion"] {
  color: #ca8a04;
}

.planning-5d-estado-select[data-estado="aprobado"],
.planning-5d-estado-select option[value="aprobado"] {
  color: #2563eb;
}

.planning-5d-estado-select[data-estado="no_iniciado"],
.planning-5d-estado-select option[value="no_iniciado"] {
  color: #94a3b8;
}

.planning-5d-estado-select[data-estado="en_ejecucion"],
.planning-5d-estado-select option[value="en_ejecucion"] {
  color: #ea580c;
}

.planning-5d-estado-select[data-estado="pendiente_verificacion"],
.planning-5d-estado-select option[value="pendiente_verificacion"] {
  color: #9333ea;
}

.planning-5d-estado-select[data-estado="finalizado_conforme"],
.planning-5d-estado-select option[value="finalizado_conforme"] {
  color: #16a34a;
}

.planning-5d-row-cols .planning-5d-estado-select {
  max-width: 100%;
}

.planning-5d-hcell--name {
  white-space: nowrap;
  overflow: visible;
}

.planning-5d-hcell--name .planning-5d-hcell-label {
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Divisor visible entre Désignation y Durée (no recortar por overflow). */
.planning-5d-head-cols > .planning-5d-hcell--name::after {
  content: "";
  position: absolute;
  top: 2px;
  bottom: 2px;
  right: -4px;
  width: 1px;
  background: rgba(255, 255, 255, 0.42);
  pointer-events: none;
  z-index: 1;
}

.planning-5d-col-resize {
  position: absolute;
  top: 0;
  right: -5px;
  bottom: 0;
  width: 10px;
  cursor: col-resize;
  z-index: 4;
  touch-action: none;
}

.planning-5d-col-resize::after {
  content: "";
  position: absolute;
  top: 18%;
  bottom: 18%;
  left: 4px;
  width: 2px;
  border-radius: 1px;
  background: rgba(255, 255, 255, 0.55);
  pointer-events: none;
}

.planning-5d-col-resize:hover::after,
.planning-5d-gantt-root.is-resizing-name-col .planning-5d-col-resize::after {
  background: #93c5fd;
  box-shadow: 0 0 0 1px rgba(147, 197, 253, 0.35);
}

.planning-5d-gantt-root.is-resizing-name-col {
  cursor: col-resize;
  user-select: none;
}

.planning-5d-hcell--dur {
  white-space: nowrap;
  text-align: center;
  justify-content: center;
}

/* Predecesora: cabecera visible (números de fila concepto en el desplegable) */
.planning-5d-head-cols > .planning-5d-hcell--pred {
  text-align: center;
  line-height: 1.2;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.08);
  color: var(--visor-sheet-header-text);
  box-shadow: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.planning-5d-head-cols > .planning-5d-hcell--avance,
.planning-5d-head-cols > .planning-5d-hcell--obs {
  text-align: center;
  line-height: 1.2;
  min-width: 0;
}

.planning-5d-head-cols > .planning-5d-hcell--obs {
  text-align: left;
}

.planning-5d-head-chart {
  width: var(--planning-chart-width, var(--planning-chart-min, 560px));
  min-width: var(--planning-chart-width, var(--planning-chart-min, 560px));
  flex-shrink: 0;
  padding: 8px 12px 8px 0;
  padding-right: calc(12px + var(--planning-chart-trail-px, 48px));
  margin: 0;
  border-radius: 0;
  border-left: var(--planning-gantt-divider, 1px solid #0f172a);
  display: flex;
  align-items: center;
  position: relative;
  z-index: 41;
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  box-sizing: border-box;
}

.planning-5d-timeline-labels {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: 4px;
  font-size: 9px;
  color: rgba(241, 245, 249, 0.82);
}

.planning-5d-timeline-axis {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  gap: 0;
}

.planning-5d-timeline-months {
  display: none;
}

.planning-5d-tick {
  flex: 1;
  text-align: center;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

#planning-5d-gantt-root[data-time-scale="day"] .planning-5d-timeline-labels,
.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-timeline-labels {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0;
}

/* Escala « Par jour » : colonnes nettes comme « Par semaine » */
.planning-5d-gantt-root[data-time-scale="day"] {
  --planning-chart-pad-l: 0px;
  --planning-chart-pad-r: 0px;
  --planning-chart-trail-px: 0px;
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-head-chart {
  padding: 2px 0 2px 0;
  align-items: stretch;
  min-height: 34px;
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-timeline-months {
  display: grid;
  grid-template-columns: repeat(var(--planning-timeline-divs, var(--planning-week-cols, 8)), minmax(0, 1fr));
  gap: 0;
  width: 100%;
  min-height: 13px;
  align-items: stretch;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(241, 245, 249, 0.35);
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-month-band {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border-right: 1px solid rgba(241, 245, 249, 0.55);
  padding: 0 2px;
  font-size: 9px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.02em;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-month-band:last-child {
  border-right: 0;
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-timeline-labels {
  display: grid;
  grid-template-columns: repeat(var(--planning-timeline-divs, var(--planning-week-cols, 8)), minmax(0, 1fr));
  gap: 0;
  width: 100%;
  height: auto;
  min-height: 16px;
  justify-content: stretch;
  box-sizing: border-box;
  color: rgba(248, 250, 252, 0.95);
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-tick {
  flex: unset;
  box-sizing: border-box;
  border-right: 1px solid rgba(241, 245, 249, 0.55);
  padding: 1px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-tick:last-child {
  border-right: 0;
}

/* Rejilla día encima + sombreado sam/dim/férié debajo (--planning-day-shade-bg). */
.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-lane {
  padding: 0;
  background-image: linear-gradient(
      to right,
      transparent calc(100% - 1px),
      rgba(15, 23, 42, 0.28) 0
    ),
    var(--planning-day-shade-bg, none);
  background-size: calc(100% / max(1, var(--planning-timeline-divs, var(--planning-week-cols, 8)))) 100%,
    100% 100%;
  background-position: 0 0, 0 0;
  background-origin: padding-box;
  background-clip: padding-box;
  background-repeat: repeat-x, no-repeat;
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-gantt-row:nth-child(even) .planning-5d-lane {
  background-image: linear-gradient(
      to right,
      transparent calc(100% - 1px),
      rgba(15, 23, 42, 0.32) 0
    ),
    var(--planning-day-shade-bg, none);
}

.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-bar--task,
.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-bar--critical,
.planning-5d-gantt-root[data-time-scale="day"] .planning-5d-bar--actual {
  border-radius: 2px;
  box-sizing: border-box;
  max-width: calc(100% - 2px);
}

/* Escala « Par semaine » : mêmes paddings / colonnes pour en-tête et corps */
.planning-5d-gantt-root[data-time-scale="week"] {
  --planning-chart-pad-l: 0px;
  --planning-chart-pad-r: 0px;
  --planning-chart-trail-px: 0px;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-head-chart {
  padding: 6px 0 6px 0;
  align-items: stretch;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-head-chart::after {
  display: none;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-timeline-labels {
  display: grid;
  grid-template-columns: repeat(var(--planning-week-cols, 8), minmax(0, 1fr));
  gap: 0;
  width: 100%;
  height: 100%;
  min-height: 22px;
  justify-content: stretch;
  box-sizing: border-box;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-tick {
  flex: unset;
  box-sizing: border-box;
  border-right: 1px solid rgba(241, 245, 249, 0.55);
  padding: 2px 1px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-tick:last-child {
  border-right: 0;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-lane {
  padding: 0;
  background-image: linear-gradient(
    to right,
    transparent calc(100% - 1px),
    rgba(15, 23, 42, 0.28) 0
  );
  background-size: calc(100% / max(1, var(--planning-week-cols, 8))) 100%;
  background-position: 0 0;
  background-origin: padding-box;
  background-clip: padding-box;
  background-repeat: repeat-x;
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-gantt-row:nth-child(even) .planning-5d-lane {
  background-image: linear-gradient(
    to right,
    transparent calc(100% - 1px),
    rgba(15, 23, 42, 0.32) 0
  );
}

.planning-5d-gantt-root[data-time-scale="week"] .planning-5d-lane::after {
  display: none;
}

/* Escala « Par mois » / « Par an » : mismas líneas de columna nítidas */
.planning-5d-gantt-root[data-time-scale="month"],
.planning-5d-gantt-root[data-time-scale="year"] {
  --planning-chart-pad-l: 0px;
  --planning-chart-pad-r: 0px;
  --planning-chart-trail-px: 0px;
}

.planning-5d-gantt-root[data-time-scale="month"] .planning-5d-head-chart,
.planning-5d-gantt-root[data-time-scale="year"] .planning-5d-head-chart {
  padding: 6px 0;
  align-items: stretch;
}

.planning-5d-gantt-root[data-time-scale="month"] .planning-5d-timeline-labels,
.planning-5d-gantt-root[data-time-scale="year"] .planning-5d-timeline-labels {
  display: grid;
  grid-template-columns: repeat(var(--planning-timeline-divs, var(--planning-week-cols, 1)), minmax(0, 1fr));
  gap: 0;
  width: 100%;
  height: 100%;
  min-height: 22px;
  justify-content: stretch;
  box-sizing: border-box;
}

.planning-5d-gantt-root[data-time-scale="month"] .planning-5d-tick,
.planning-5d-gantt-root[data-time-scale="year"] .planning-5d-tick {
  flex: unset;
  box-sizing: border-box;
  border-right: 1px solid rgba(241, 245, 249, 0.55);
  padding: 2px 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.planning-5d-gantt-root[data-time-scale="month"] .planning-5d-tick:last-child,
.planning-5d-gantt-root[data-time-scale="year"] .planning-5d-tick:last-child {
  border-right: 0;
}

.planning-5d-gantt-root[data-time-scale="month"] .planning-5d-lane,
.planning-5d-gantt-root[data-time-scale="year"] .planning-5d-lane {
  padding: 0;
  background-image: linear-gradient(
    to right,
    transparent calc(100% - 1px),
    rgba(15, 23, 42, 0.28) 0
  );
  background-size: calc(100% / max(1, var(--planning-timeline-divs, var(--planning-week-cols, 1)))) 100%;
  background-position: 0 0;
  background-origin: padding-box;
  background-clip: padding-box;
  background-repeat: repeat-x;
}

.planning-5d-gantt-root[data-time-scale="month"] .planning-5d-gantt-row:nth-child(even) .planning-5d-lane,
.planning-5d-gantt-root[data-time-scale="year"] .planning-5d-gantt-row:nth-child(even) .planning-5d-lane {
  background-image: linear-gradient(
    to right,
    transparent calc(100% - 1px),
    rgba(15, 23, 42, 0.32) 0
  );
}

.planning-5d-gantt-body {
  position: relative;
  width: 100%;
  flex: none;
  min-height: 0;
  max-height: none;
  height: auto;
  /* Sin scroll propio: la barra vertical vive en .planning-5d-body (siempre visible a la derecha). */
  overflow: visible !important;
  background: #eef2f7;
}

.planning-5d-gantt-body::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.planning-5d-gantt-root::-webkit-scrollbar,
.planning-5d-gantt::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.planning-5d-gantt-row {
  display: grid;
  grid-template-columns: var(--planning-left-track) var(--planning-scroll-cols-track) var(--planning-chart-track);
  column-gap: var(--planning-gantt-split-gap);
  align-items: stretch;
  min-height: 34px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  direction: ltr;
}

.planning-5d-gantt-row:nth-child(even) .planning-5d-lane {
  background-color: #eaf4fb;
}

.planning-5d-row--editing-actual {
  position: relative;
  z-index: 40;
  background: rgba(21, 128, 61, 0.06);
}

.planning-5d-row--editing-actual .planning-5d-row-cols {
  z-index: 41;
  overflow: visible;
  background: linear-gradient(rgba(21, 128, 61, 0.08), rgba(21, 128, 61, 0.08)), var(--panel-elev);
}

.planning-5d-row--editing-actual .planning-5d-actual-date-input {
  position: relative;
  z-index: 42;
}

.planning-5d-row-cols {
  box-sizing: border-box;
  display: grid;
  column-gap: 6px;
  row-gap: 0;
  align-items: center;
  padding: 5px 8px 5px 6px;
  font-size: var(--planning-table-font);
  line-height: 1.2;
  color: var(--text);
  background: var(--panel-elev);
  border-right: none;
  overflow: hidden;
  position: relative;
}

.planning-5d-row-cols--freeze {
  width: var(--planning-left-track);
  min-width: 0;
  max-width: var(--planning-left-track);
  grid-template-columns: var(--planning-freeze-grid, var(--planning-cols-grid));
  position: sticky;
  left: 0;
  z-index: 6;
  isolation: isolate;
  background: var(--panel-elev);
  box-shadow:
    2px 0 0 rgba(15, 23, 42, 0.1),
    -40px 0 0 0 var(--panel-elev);
}

.planning-5d-gantt-row:nth-child(even) .planning-5d-row-cols--freeze {
  box-shadow:
    2px 0 0 rgba(15, 23, 42, 0.1),
    -40px 0 0 0 #eaf4fb;
}

.planning-5d-row-cols--scroll {
  width: var(--planning-scroll-cols-track);
  min-width: var(--planning-scroll-cols-track);
  max-width: var(--planning-scroll-cols-track);
  grid-template-columns: var(--planning-scroll-grid);
  position: relative;
  z-index: 1;
  box-shadow: none;
}

.planning-5d-row-cols .planning-5d-plain-text,
.planning-5d-row-cols .planning-5d-cell,
.planning-5d-row-cols .planning-5d-tipo-select,
.planning-5d-row-cols .planning-5d-tipo-pill,
.planning-5d-row-cols .planning-5d-readonly-val,
.planning-5d-row-cols .planning-5d-aux-field-val,
.planning-5d-row-cols .planning-5d-aux-tipo-label,
.planning-5d-row-cols .planning-5d-row-num,
.planning-5d-row-cols .planning-5d-dur-input,
.planning-5d-row-cols .planning-5d-pred-select,
.planning-5d-row-cols .planning-5d-estado-select,
.planning-5d-row-cols .planning-5d-start-input,
.planning-5d-row-cols .planning-5d-end-input,
.planning-5d-row-cols .planning-5d-actual-date-input,
.planning-5d-row-cols .planning-5d-obs-input,
.planning-5d-row-cols .planning-5d-cell--d,
.planning-5d-row-cols .planning-5d-cell--pred,
.planning-5d-row-cols .planning-5d-cell--avance,
.planning-5d-row-cols .planning-5d-cell--obs,
.planning-5d-row-cols .planning-5d-pred-static {
  font-size: var(--planning-table-font);
  line-height: 1.2;
}

.planning-5d-gantt-row.planning-5d-tree-hidden {
  display: none !important;
}

.planning-5d-gantt-row[data-planning-nivel="proyecto"] .planning-5d-row-cols,
.planning-5d-gantt-row[data-planning-nivel="capitulo"] .planning-5d-row-cols,
.planning-5d-gantt-row[data-planning-nivel="partida"] .planning-5d-row-cols,
.planning-5d-gantt-row[data-planning-nivel="concepto"] .planning-5d-row-cols,
.planning-5d-gantt-row[data-planning-nivel="aux"] .planning-5d-row-cols,
.planning-5d-gantt-row[data-planning-nivel="insumo"] .planning-5d-row-cols,
.planning-5d-gantt-row[data-planning-nivel="grupo"] .planning-5d-row-cols,
.planning-5d-gantt-row.planning-5d-row--auxiliar .planning-5d-row-cols,
.planning-5d-gantt-row.planning-5d-row--grupo .planning-5d-row-cols,
.planning-5d-gantt-row.planning-5d-row--insumo .planning-5d-row-cols {
  background: var(--panel-elev);
  color: var(--text);
  font-weight: 400;
  font-style: normal;
}

/* Zebra tabla: después de los fondos por nivel, para que se vea de verdad. */
.planning-5d-gantt-row:nth-child(even) .planning-5d-row-cols,
.planning-5d-gantt-row:nth-child(even)[data-planning-nivel] .planning-5d-row-cols,
.planning-5d-gantt-row:nth-child(even).planning-5d-row--auxiliar .planning-5d-row-cols,
.planning-5d-gantt-row:nth-child(even).planning-5d-row--grupo .planning-5d-row-cols,
.planning-5d-gantt-row:nth-child(even).planning-5d-row--insumo .planning-5d-row-cols {
  background: #eaf4fb;
}

.planning-5d-gantt-row {
  min-height: 34px;
}

.planning-5d-row-cols .planning-5d-dur-input,
.planning-5d-row-cols .planning-5d-pred-select,
.planning-5d-row-cols .planning-5d-start-input,
.planning-5d-row-cols .planning-5d-end-input {
  font-size: var(--planning-table-font);
}

.planning-5d-opt-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text);
  white-space: nowrap;
}

.planning-5d-opt-check input {
  margin: 0;
}

.planning-5d-deps-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 3;
  overflow: visible;
}

.planning-5d-deps-svg.hidden {
  display: none;
}

.planning-5d-dep-path-outline {
  fill: none;
  stroke: #0f172a;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.planning-5d-dep-path {
  fill: none;
  stroke: #ea580c;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.planning-5d-dep-arrow-outline {
  fill: #0f172a;
  opacity: 0.92;
}

.planning-5d-dep-arrow {
  fill: #ea580c;
  opacity: 0.95;
}

/* Línea crítica solo en la franja sticky (freeze); si va en scroll se veía al asomarse. */
.planning-5d-gantt-row.planning-5d-row--critical .planning-5d-row-cols--freeze {
  box-shadow:
    inset 3px 0 0 #dc2626,
    2px 0 0 rgba(15, 23, 42, 0.1),
    -40px 0 0 0 var(--panel-elev);
}

.planning-5d-gantt-row:nth-child(even).planning-5d-row--critical .planning-5d-row-cols--freeze {
  box-shadow:
    inset 3px 0 0 #dc2626,
    2px 0 0 rgba(15, 23, 42, 0.1),
    -40px 0 0 0 #eaf4fb;
}

.planning-5d-bar--critical {
  background: linear-gradient(180deg, #fecaca 0%, #f87171 100%) !important;
  box-shadow: 0 0 0 1px #dc2626 !important;
}

.planning-5d-bar--summary-critical {
  border-bottom-color: #dc2626 !important;
}

.planning-5d-cell--tipo {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 2px;
}

.planning-5d-plain-text {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--planning-table-font);
  line-height: 1.2;
  color: inherit;
  font-weight: inherit;
  font-style: inherit;
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  box-shadow: none;
}

#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-plain-text,
#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-name-text {
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.3;
  max-width: 100%;
}

#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-gantt-row {
  min-height: 34px;
  height: auto;
  align-items: stretch;
}

#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-row-cols {
  align-items: start;
  padding-top: 6px;
  padding-bottom: 6px;
}

#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-cell--name,
#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-cell--cod,
#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-cell--tipo,
#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-cell--n {
  align-items: flex-start;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-gantt,
.planning-5d-gantt-root[data-name-mode="full"] .planning-5d-gantt {
  /* La grille est définie en JS (--planning-cols-grid) selon colonnes visibles. */
}

#planning-5d-gantt-root[data-name-mode="full"] .planning-5d-lane {
  min-height: 100%;
}

.planning-5d-cell--cod,
.planning-5d-cell--name {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.planning-5d-row-cols > .planning-5d-cell--name {
  border-right: 1px solid rgba(15, 23, 42, 0.14);
  padding-right: 4px;
  box-sizing: border-box;
}

.planning-5d-cell--name .planning-5d-plain-text {
  text-align: left;
}

.planning-5d-tipo-select {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  min-height: 28px;
  height: auto;
  padding: 5px 6px;
  background: #fff;
  font-size: var(--planning-table-font);
  line-height: 1.3;
  text-align: center;
  white-space: nowrap;
  overflow: visible;
  text-overflow: ellipsis;
  cursor: default;
  opacity: 1;
  -webkit-text-fill-color: currentColor;
}

.planning-5d-tipo-select:disabled {
  opacity: 1;
  color: inherit;
}

.planning-5d-tipo-pill {
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  padding: 3px 5px;
  background: #fff;
  font-size: var(--planning-table-font);
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.planning-5d-aux-tipo-label {
  font-size: var(--planning-table-font);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.planning-5d-cell--cod {
  min-width: 0;
}

.planning-5d-aux-field-val {
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-size: var(--planning-table-font);
  line-height: 1.2;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.planning-5d-gantt-row[data-planning-nivel="grupo"] .planning-5d-aux-field-val,
.planning-5d-gantt-row.planning-5d-row--grupo .planning-5d-aux-field-val {
  font-weight: 600;
  font-style: normal;
}

.planning-5d-readonly-val {
  display: block;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  padding: 3px 5px;
  background: #fff;
  font-size: var(--planning-table-font);
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.planning-5d-cell--n {
  min-width: 0;
  color: #64748b;
  font-weight: 600;
  font-size: var(--planning-table-font);
  font-variant-numeric: tabular-nums;
  background: #f1f5f9;
  border-right: 1px solid #e2e8f0;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  overflow: hidden;
}

.planning-5d-hcell--n {
  background: rgba(241, 245, 249, 0.22);
}

.planning-5d-num-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  min-height: 20px;
  min-width: 0;
  width: 100%;
  overflow: hidden;
}

.planning-5d-row-num {
  flex: 0 0 auto;
  min-width: 0;
  font-size: var(--planning-table-font);
  color: #64748b;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.planning-5d-cell--name {
  display: flex;
  align-items: center;
  min-width: 0;
}

.planning-5d-name-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.planning-5d-summary {
  font-weight: 700;
}

.planning-5d-cell--dur.planning-5d-summary .planning-5d-dur-input {
  font-weight: 700;
}

.planning-5d-cell--dur {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-align: center;
}

.planning-5d-cell--dur .planning-5d-dur-input {
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
  max-width: calc(100% - 12px);
  box-sizing: border-box;
  text-align: center !important;
}

.planning-5d-cell--dur.planning-5d-dur-rollup {
  justify-content: center;
  text-align: center;
  flex-direction: column;
  gap: 1px;
  line-height: 1.15;
  padding: 1px 0;
}

.planning-5d-dur-sum {
  color: #94a3b8;
  font-weight: 500;
  font-size: 10px;
}

.planning-5d-dur-rt {
  color: #15803d;
  font-weight: 800;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.planning-5d-tree-toggle {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid #94a3b8;
  border-radius: 3px;
  background: #fff;
  color: #0f172a;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  vertical-align: middle;
}

.planning-5d-tree-toggle:hover {
  background: #e2e8f0;
  border-color: #64748b;
}

.planning-5d-tree-toggle-spacer {
  flex: 0 0 20px;
  width: 20px;
  display: inline-block;
}

.planning-5d-cell--d,
.planning-5d-cell--pred {
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  color: var(--muted);
  min-width: 0;
}

.planning-5d-cell--plan-date,
.planning-5d-cell--plan-date .planning-5d-start-input,
.planning-5d-cell--plan-date .planning-5d-end-input {
  color: #2563eb;
  font-weight: 600;
}

.planning-5d-cell--plan-date .planning-5d-start-input,
.planning-5d-cell--plan-date .planning-5d-end-input {
  border-color: rgba(37, 99, 235, 0.35);
}

.planning-5d-cell--pred {
  overflow: hidden;
  position: relative;
  z-index: auto;
  min-width: 0;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: stretch;
  padding: 2px 0;
  margin: 0;
  border-radius: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}

.planning-5d-cell--pred.planning-5d-pred-static {
  color: var(--muted);
  font-weight: 600;
}

.planning-5d-cell--avance {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 12px;
  color: var(--muted);
}

.planning-5d-avance--partial {
  color: #c2410c;
}

.planning-5d-avance--done {
  color: #15803d;
}

.planning-5d-cell--obs {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 0;
}

.planning-5d-cell--obs.planning-5d-obs-static {
  justify-content: center;
  color: var(--muted);
  font-weight: 600;
}

.planning-5d-obs-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  min-height: 28px;
  height: 28px;
  padding: 0 6px;
  font-size: var(--planning-table-font, 11px);
  line-height: 26px;
  font-family: inherit;
  border-radius: 4px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: var(--text, #0f172a);
}

.planning-5d-obs-input:focus {
  outline: none;
  border-color: rgba(20, 184, 166, 0.55);
  box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.15);
}

.planning-5d-lane {
  position: relative;
  z-index: 1;
  width: var(--planning-chart-width, var(--planning-chart-min, 560px));
  min-width: var(--planning-chart-width, var(--planning-chart-min, 560px));
  flex-shrink: 0;
  min-height: 40px;
  padding: 0 calc(4px + var(--planning-chart-trail-px, 48px)) 0 0;
  margin: 0;
  border-radius: 0;
  border-left: var(--planning-gantt-divider, 1px solid #0f172a);
  /* Misma lógica zebra que la tabla: fila impar clara, par teñida. */
  background-color: #ffffff;
  /* Líneas de semana: desplazadas para no coincidir con el borde tabla↔diagrama */
  background-image: linear-gradient(to right, rgba(15, 23, 42, 0.08) 1px, transparent 1px);
  background-size: calc(100% / max(2, var(--planning-timeline-divs, var(--planning-weeks, 8)))) 100%;
  background-position: 14px 0;
  background-repeat: repeat;
  overflow: hidden;
  box-sizing: border-box;
}

/* Sin máscara/degradado al final (ocultaba barras en échelle «Par jour»). */
.planning-5d-lane::after,
.planning-5d-head-chart::after {
  content: none;
  display: none;
}

.planning-5d-bar {
  position: absolute;
  top: 8px;
  bottom: 8px;
  min-width: 3px;
  box-sizing: border-box;
  border-radius: 4px;
}

.planning-5d-bar--task {
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 100%);
  box-shadow: 0 0 0 1px rgba(14, 165, 233, 0.35);
}

.planning-5d-bar--summary {
  top: auto;
  bottom: 10px;
  height: 0;
  background: transparent;
  border-radius: 0;
  border-top: none;
  border-bottom: 3px solid #475569;
  box-shadow: none;
}

.planning-5d-bar--actual {
  /* Más delgada que la barra planificada (azul) para dejarla visible alrededor */
  top: 15px;
  bottom: 15px;
  z-index: 2;
  opacity: 1;
  border-radius: 3px;
}

/* Real dentro de Comienzo y Fin: verde fosforescente */
.planning-5d-bar--actual-in-plan {
  background: linear-gradient(180deg, #ccff00 0%, #39ff14 45%, #00e676 100%);
  border: 1px solid #adff2f;
  box-shadow:
    0 0 4px rgba(57, 255, 20, 0.65),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

/* Real fuera del periodo programado: ámbar/naranja fosforescente */
.planning-5d-bar--actual-out-plan {
  background: linear-gradient(180deg, #ffe066 0%, #ffb300 42%, #ff6f00 100%);
  border: 1px solid #ff9800;
  box-shadow:
    0 0 4px rgba(255, 179, 0, 0.65),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.ifc-table-modal.ifc-budget-pick {
  z-index: 1025;
}

.ifc-table-modal.ifc-catalogo-qty-pick {
  z-index: 1026;
}

.ifc-table-catalogo-qty-footer {
  flex-shrink: 0;
  padding: 10px 14px 12px;
  border-top: 1px solid var(--border);
  background: var(--panel-elev);
}

.ifc-catalogo-qty-panel {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ifc-catalogo-qty-concept-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 12px;
  padding: 9px 12px;
  border-radius: 8px;
  background: linear-gradient(180deg, var(--visor-sheet-header-top), var(--visor-sheet-header-bot));
  border: 1px solid rgba(21, 42, 61, 0.55);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.ifc-catalogo-qty-concept-kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(226, 236, 248, 0.82);
}

.ifc-catalogo-qty-concept-value {
  font-size: 14px;
  font-weight: 600;
  color: var(--visor-sheet-header-text);
  line-height: 1.3;
  word-break: break-word;
}

.ifc-catalogo-qty-footer-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr minmax(0, 1.15fr);
  gap: 8px;
  align-items: stretch;
}

.ifc-catalogo-select-by-wrap {
  position: relative;
  display: flex;
  align-items: stretch;
  min-width: 0;
}

.ifc-catalogo-select-by-wrap .ifc-catalogo-qty-select-by-btn {
  width: 100%;
}

.ifc-catalogo-select-by-panel {
  left: 0;
  right: 0;
  top: auto;
  bottom: calc(100% + 6px);
  z-index: 80;
  max-height: min(260px, 40vh);
}

.ifc-catalogo-select-by-wrap .ifc-catalogo-qty-select-by-btn.is-open,
.ifc-catalogo-select-by-wrap .ifc-catalogo-qty-select-by-btn[aria-expanded="true"] {
  background: linear-gradient(180deg, #cbd5e1 0%, #64748b 100%);
  color: #fff;
  border-color: #475569;
}

.ifc-table-catalogo-qty-footer .ifc-catalogo-qty-btn {
  width: auto;
  margin: 0;
  min-height: 36px;
  padding: 7px 10px;
  font-size: 12px;
  line-height: 1.2;
  white-space: normal;
  text-align: center;
  border-radius: 999px;
  background: var(--btn-default);
  color: var(--text);
  border: 1px solid var(--btn-default-border);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.ifc-table-catalogo-qty-footer .ifc-catalogo-qty-btn:hover:not(:disabled) {
  background: var(--btn-default-hover);
  border-color: var(--accent);
}

.ifc-table-catalogo-qty-footer .ifc-catalogo-qty-btn--apply {
  font-weight: 700;
  background: var(--accent);
  color: #fff;
  border-color: var(--accent-dim);
}

.ifc-table-catalogo-qty-footer .ifc-catalogo-qty-btn--apply:hover:not(:disabled) {
  background: var(--accent-dim);
  border-color: var(--accent-dim);
  color: #fff;
}

.ifc-catalogo-qty-toolbar {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
  margin: 0;
}

.ifc-catalogo-qty-toolbar-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: none;
}

@media (max-width: 720px) {
  .ifc-catalogo-qty-footer-actions {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 520px) {
  .ifc-catalogo-qty-footer-actions {
    grid-template-columns: 1fr;
  }
  .ifc-catalogo-qty-toolbar {
    grid-template-columns: 1fr;
  }
}

.ifc-table-catalogo-qty-footer.hidden {
  display: none;
}

.ifc-catalogo-qty-toolbar-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--muted);
  text-transform: uppercase;
}

.ifc-table-catalogo-qty-footer .ifc-catalogo-qty-toolbar-select {
  width: 100%;
  max-width: 100%;
  background: var(--panel-elev);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.ifc-table-catalogo-qty-footer .ifc-catalogo-qty-toolbar-select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-glow);
}

.ifc-catalogo-qty-foot-msg {
  margin: 0 0 8px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.35;
  background: rgba(220, 160, 40, 0.22);
  border: 1px solid rgba(255, 200, 80, 0.45);
  color: rgba(255, 245, 220, 0.95);
}

.ifc-catalogo-qty-foot-msg.hidden {
  display: none;
}

.ifc-table-budget-footer {
  flex-shrink: 0;
  padding: 10px 14px 14px;
  border-top: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.2);
}

.ifc-table-budget-footer.hidden {
  display: none;
}

.ifc-table-budget-hint {
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
}

.ifc-table-budget-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 12px;
}

.ifc-budget-group-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 12px;
  flex: 1 1 320px;
  min-width: min(100%, 240px);
}

.ifc-budget-group-row .ifc-budget-group-label {
  flex: 1 1 200px;
  min-width: min(100%, 160px);
  max-width: 100%;
}

.ifc-budget-group-row .ifc-budget-clear-in-footer {
  flex: 0 0 auto;
  margin: 0;
  min-height: 34px;
  width: auto;
  white-space: nowrap;
}

/* Una línea horizontal: [Seleccionar del 3D] [Seleccionar todo]
 * Debajo: [Agregar a nivel / capítulo]
 */
.ifc-budget-footer-btn-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 420px;
  min-width: min(100%, 240px);
}

/* Dos bloques en fila: 3D | todo */
.ifc-budget-footer-one-line {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
  min-width: 0;
  width: 100%;
}

.ifc-budget-footer-slot {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 52px;
  padding: 8px 10px;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.ifc-budget-footer-slot .ifc-budget-footer-line-todo,
.ifc-budget-footer-slot .ifc-budget-footer-line-3d {
  width: 100%;
  margin: 0;
  min-height: 36px;
  white-space: nowrap;
}

.ifc-budget-footer-line-add {
  margin: 0;
  min-height: 34px;
  width: 100%;
}

@media (max-width: 720px) {
  .ifc-budget-footer-one-line {
    grid-template-columns: 1fr;
  }

  .ifc-budget-footer-slot .ifc-budget-footer-line-todo,
  .ifc-budget-footer-slot .ifc-budget-footer-line-3d {
    white-space: normal;
  }
}

.ifc-budget-3d-pick-bar {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: max(18px, calc(env(safe-area-inset-bottom, 0px) + 10px));
  z-index: 1030;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(96vw, 420px);
  padding: 12px 14px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

.ifc-budget-3d-pick-bar.hidden {
  display: none !important;
}

.ifc-budget-3d-pick-hint {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--muted);
  text-align: center;
}

.ifc-budget-3d-pick-mode-status {
  margin: 0;
  padding: 6px 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  color: var(--accent);
  background: rgba(56, 189, 248, 0.1);
  border: 1px solid rgba(56, 189, 248, 0.35);
  border-radius: 6px;
}

.ifc-budget-3d-pick-mode-status.hidden {
  display: none !important;
}

.ifc-budget-3d-pick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.ifc-budget-3d-pick-actions .btn.small {
  flex: 1 1 120px;
  width: auto;
  margin: 0;
  min-height: 36px;
  font-size: 13px;
  font-weight: 600;
}

.ifc-budget-group-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--text);
  min-width: min(100%, 220px);
}

.ifc-budget-group-input {
  min-width: 200px;
  max-width: min(100%, 320px);
  padding: 6px 8px;
  border-radius: 6px;
}

/* Desde el Catálogo de precios (cubo cantidad IFC): no mostrar el visor 3D hasta que abra el modal de estructura. */
html.ifc-catalogo-qty-launch #app > .app-screen-title-bar,
html.ifc-catalogo-qty-launch #app > header.toolbar,
html.ifc-catalogo-qty-launch #app > .app-body {
  visibility: hidden !important;
}

/* Modal tabla IFC */
.ifc-table-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
    max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
}

.ifc-table-modal.hidden {
  display: none;
}

.ifc-table-modal-backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(10, 12, 18, 0.72);
  cursor: pointer;
}

.ifc-table-modal-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(96vw, 1200px);
  max-height: min(88vh, 900px);
  margin: 0 auto;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
  min-height: 0;
}

.ifc-table-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
  padding: 22px 14px 14px;
  border-bottom: 1px solid var(--border);
}

.ifc-table-modal-head-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ifc-table-modal-head h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.ifc-table-modal-head .btn.small {
  width: auto;
  margin: 0;
}

.ifc-table-modal-head-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  flex-shrink: 0;
}

.ifc-table-modal.ifc-budget-pick .ifc-table-eliminar-wrap {
  display: none;
}

.btn-eliminar-danger {
  border-color: rgba(242, 239, 230, 0.14) !important;
  background: var(--btn-danger) !important;
  color: var(--btn-ivory) !important;
  font-weight: 700;
  text-shadow: none !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

.btn-eliminar-danger:hover:not(:disabled) {
  background: var(--btn-danger-hover) !important;
  border-color: rgba(242, 239, 230, 0.22) !important;
}

.btn-eliminar-danger:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: none;
}

.simulation-auto-rotate-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
  margin: 0;
  cursor: pointer;
  user-select: none;
}

.simulation-auto-rotate-label input {
  accent-color: var(--accent);
  width: 15px;
  height: 15px;
}

.ifc-table-status {
  margin: 0;
  padding: 8px 14px;
  font-size: 12px;
  color: var(--muted);
  flex-shrink: 0;
}

.ifc-table-wrap {
  flex: 1;
  min-height: 0;
  padding: 0 8px 12px;
}

.ifc-elements-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  line-height: 1.35;
}

.ifc-elements-table th,
.ifc-elements-table td {
  border: 1px solid var(--border);
  padding: 6px 8px;
  text-align: left;
  vertical-align: top;
}

.ifc-elements-table th {
  background: linear-gradient(180deg, var(--visor-sheet-header-top) 0%, var(--visor-sheet-header-bot) 100%);
  color: var(--visor-sheet-header-text);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-color: rgba(255, 255, 255, 0.1);
  position: sticky;
  top: 0;
  z-index: 1;
}

.ifc-elements-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.02);
}

.ifc-elements-table tbody tr:hover {
  background: rgba(20, 184, 166, 0.12);
}

.ifc-elements-table tbody tr.selected-row {
  background: rgba(255, 20, 147, 0.38);
}

.ifc-elements-table tbody tr.ifc-table-row {
  cursor: pointer;
}

.ifc-elements-table td {
  word-break: break-word;
  max-width: 28vw;
}

.ifc-elements-table--structure .ifc-col-act {
  width: 52px;
  max-width: 64px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

.ifc-elements-table--structure .ifc-col-vista {
  width: 52px;
  max-width: 64px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

.ifc-elements-table--structure .ifc-col-id {
  width: 72px;
  max-width: 88px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.ifc-elements-table--structure .ifc-col-tipo {
  max-width: 220px;
  white-space: nowrap;
}

.ifc-elements-table--structure .ifc-col-elem {
  max-width: 22vw;
  min-width: 120px;
}

.ifc-elements-table--structure .ifc-col-desc {
  max-width: 36vw;
  min-width: 160px;
}

.ifc-elements-table--structure .ifc-tree-type-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding-left: calc(var(--ifc-dep, 0) * 14px);
}

.ifc-elements-table--structure .ifc-tree-toggle {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  padding: 0;
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #f1f5f9;
  color: var(--text);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.ifc-elements-table--structure .ifc-tree-toggle:hover {
  background: #e0f2fe;
  border-color: var(--accent);
}

.ifc-elements-table--structure .ifc-tree-toggle-placeholder {
  display: inline-block;
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.ifc-elements-table--structure .ifc-type-es-label {
  font-weight: 600;
}

.ifc-elements-table--structure tbody tr.ifc-table-folder-row {
  cursor: pointer;
  background: #f1f5f9;
}

.ifc-elements-table--structure tbody tr.ifc-table-section-row {
  cursor: default;
  background: #ecfdf5;
}

.ifc-elements-table--structure .ifc-table-section-cell {
  font-size: 11px;
  padding: 8px 10px;
}

.ifc-elements-table--structure tbody tr.ifc-table-row--collapsed-hidden,
.ifc-elements-table--structure tbody tr.ifc-table-row--detail-hidden {
  display: none;
}

.ifc-elements-table--structure tbody tr.ifc-table-subdivision-row {
  cursor: pointer;
  font-size: 10.5px;
  background: #fafbfc;
}

.ifc-elements-table--structure tbody tr.ifc-table-subdivision-row:hover {
  background: #ecfdf5;
}

.ifc-elements-table--structure .ifc-subdiv-tipo {
  color: var(--muted);
  font-weight: 500;
}

.ifc-elements-table--structure .ifc-detail-toggle {
  margin-right: 2px;
}

.ifc-elements-table--structure .ifc-table-active-cb {
  cursor: pointer;
  width: 16px;
  height: 16px;
}

.ifc-elements-table--structure .ifc-table-vista-cb {
  cursor: pointer;
  width: 16px;
  height: 16px;
}

.ifc-elements-table td:nth-child(1) {
  max-width: none;
  white-space: nowrap;
}

.ifc-elements-table--structure td:nth-child(1) {
  max-width: 64px;
}

@media (max-width: 900px) {
  .app-body {
    flex-wrap: wrap;
    align-content: stretch;
  }

  .panel-resizer {
    display: none;
  }

  .app-body > .panel-general {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
    min-width: 0;
    border-right: none;
    border-bottom: 1px solid var(--border);
    max-height: min(62vh, 560px);
  }

  .panel-general:not(.is-general-collapsed) .panel-general-body {
    max-height: min(72vh, 640px);
    overflow-y: auto;
  }

  .ifc-structure-inline-wrap {
    min-height: 100px;
    max-height: min(26vh, 260px);
  }

  .ifc-element-info {
    min-height: 120px;
    max-height: min(28vh, 280px);
  }

  .layer-block {
    max-height: min(18vh, 150px);
  }

  .app-body > .viewport-wrap {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
    min-height: clamp(200px, 42vh, 700px);
  }

  /* Barra superior más abajo: notch / cámara / barra de estado */
  .toolbar {
    padding-top: calc(22px + env(safe-area-inset-top, 0px) + 18px);
    padding-bottom: 14px;
  }

}

/* Prioridad por acción: modales presupuesto / cronograma / catálogos (mismo criterio que ficha projet) */
#budget-save-config.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-save-config.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#budget-explosion-pdf.btn {
  background: linear-gradient(180deg, #0d4f6f 0%, #0a3d55 100%);
  border-color: rgba(94, 184, 245, 0.45);
  color: #e8f4fc;
}

#budget-explosion-pdf.btn:hover:not(:disabled) {
  filter: brightness(1.08);
}

#budget-report-pdf.btn {
  background: var(--btn-geo);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-report-pdf.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
}

#budget-sheet-close.btn,
#budget-concepts-close.btn,
#planning-5d-close.btn {
  background: var(--btn-measure);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-sheet-close.btn:hover:not(:disabled),
#budget-concepts-close.btn:hover:not(:disabled),
#planning-5d-close.btn:hover:not(:disabled) {
  background: var(--btn-measure-hover);
}

#budget-head-atras.btn,
#budget-head-costos.btn,
#budget-head-inicio.btn,
#planning-5d-prev.btn {
  background: var(--btn-cta-sky);
  border-color: var(--btn-cta-sky-border);
  color: var(--btn-on-cta);
}
#budget-head-atras.btn:hover:not(:disabled),
#budget-head-costos.btn:hover:not(:disabled),
#budget-head-inicio.btn:hover:not(:disabled),
#planning-5d-prev.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  border-color: var(--accent);
  color: var(--btn-on-cta);
}

#budget-head-siguiente.btn,
#planning-5d-next.btn {
  background: var(--btn-cta-sky);
  border-color: var(--btn-cta-sky-border);
  color: var(--btn-on-cta);
}
#budget-head-siguiente.btn:hover:not(:disabled),
#planning-5d-next.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  border-color: var(--accent);
  color: var(--btn-on-cta);
}

#budget-clear-all.btn {
  background: var(--btn-warn);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-clear-all.btn:hover:not(:disabled) {
  background: var(--btn-warn-hover);
}

#budget-delete-row.btn {
  background: var(--btn-danger);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
  margin-right: 20px;
}
#budget-delete-row.btn:hover:not(:disabled) {
  background: var(--btn-danger-hover);
}

#budget-add-row.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-add-row.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#budget-open-concepts.btn {
  background: var(--btn-aubergine);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-concepts.btn:hover:not(:disabled) {
  background: var(--btn-aubergine-hover);
}

#budget-add-ifc-elements.btn {
  background: var(--btn-ingest);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-add-ifc-elements.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
}

.budget-toolbar-subrow #budget-add-row.btn {
  background: var(--budget-subrow-teal);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
  text-shadow: none;
  box-shadow: none;
}
.budget-toolbar-subrow #budget-add-row.btn:hover:not(:disabled) {
  background: var(--budget-subrow-teal-hover);
  border-color: rgba(15, 23, 42, 0.12);
  color: var(--btn-ivory);
}

.budget-toolbar-subrow #budget-open-concepts.btn {
  background: var(--budget-subrow-blue);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
  text-shadow: none;
  box-shadow: none;
}
.budget-toolbar-subrow #budget-open-concepts.btn:hover:not(:disabled) {
  background: var(--budget-subrow-blue-hover);
  border-color: rgba(15, 23, 42, 0.12);
  color: var(--btn-ivory);
}

.budget-toolbar-subrow #budget-add-ifc-elements.btn {
  background: var(--budget-subrow-cyan);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
  text-shadow: none;
  box-shadow: none;
}
.budget-toolbar-subrow #budget-add-ifc-elements.btn:hover:not(:disabled) {
  background: var(--budget-subrow-cyan-hover);
  border-color: rgba(15, 23, 42, 0.12);
  color: var(--btn-ivory);
}

#budget-fill-ifc-weight.btn {
  background: var(--btn-olive);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
  margin-right: 20px;
}
#budget-fill-ifc-weight.btn:hover:not(:disabled) {
  background: var(--btn-olive-hover);
}

#budget-recalc.btn {
  background: var(--budget-recal-orange);
  border-color: rgba(15, 23, 42, 0.12);
  color: var(--btn-ivory);
  width: auto;
  justify-self: end;
  text-shadow: none;
  box-shadow: none;
}
#budget-recalc.btn:hover:not(:disabled) {
  background: var(--budget-recal-orange-hover);
  border-color: rgba(15, 23, 42, 0.14);
  color: var(--btn-ivory);
}

#budget-concepts-add-row.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-concepts-add-row.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#budget-concepts-copy-row.btn {
  background: var(--btn-default);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-concepts-copy-row.btn:hover:not(:disabled) {
  background: var(--btn-default-hover);
  border-color: rgba(94, 184, 245, 0.3);
  color: var(--btn-ivory);
}

#budget-concepts-delete-row.btn {
  background: var(--btn-danger);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-concepts-delete-row.btn:hover:not(:disabled) {
  background: var(--btn-danger-hover);
}

#budget-concepts-send.btn {
  background: var(--btn-cta-sky);
  border-color: var(--btn-cta-sky-border);
  color: var(--btn-on-cta);
}
#budget-concepts-send.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  color: var(--btn-on-cta);
}

#budget-open-catalog-mano-obra.btn {
  background: var(--btn-ingest);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-catalog-mano-obra.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
}

#budget-open-catalog-material.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-catalog-material.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#budget-open-catalog-equipo.btn {
  background: var(--btn-geo);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-catalog-equipo.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
}

#budget-open-catalog-fletes.btn {
  background: var(--btn-olive);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-catalog-fletes.btn:hover:not(:disabled) {
  background: var(--btn-olive-hover);
}

#budget-open-catalog-subcontratos.btn {
  background: var(--btn-aubergine);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-catalog-subcontratos.btn:hover:not(:disabled) {
  background: var(--btn-aubergine-hover);
}

#budget-open-catalog-parametros.btn {
  background: var(--btn-warn);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-open-catalog-parametros.btn:hover:not(:disabled) {
  background: var(--btn-warn-hover);
}

#planning-5d-datos-devis.btn {
  background: #dbeafe;
  border-color: rgba(37, 99, 235, 0.28);
  color: #1e3a8a;
}
#planning-5d-datos-devis.btn:hover:not(:disabled) {
  background: #bfdbfe;
  border-color: #2563eb;
  color: #1e3a8a;
}

#planning-5d-delete-line.btn {
  background: #fecaca;
  border-color: rgba(185, 28, 28, 0.28);
  color: #7f1d1d;
}
#planning-5d-delete-line.btn:hover:not(:disabled) {
  background: #fca5a5;
  border-color: #b91c1c;
  color: #7f1d1d;
}
#planning-5d-delete-line.btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

#planning-5d-save-schedule.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#planning-5d-save-schedule.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#planning-5d-new-free.btn {
  background: var(--btn-persist);
  border-color: var(--btn-persist-border);
  color: var(--text);
}
#planning-5d-new-free.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
  border-color: var(--accent);
  color: var(--text);
}

#planning-5d-level-up.btn {
  background: var(--btn-geo);
  border-color: var(--btn-geo-border);
  color: var(--text);
}
#planning-5d-level-up.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
  border-color: var(--accent);
  color: var(--text);
}

#planning-5d-level-same.btn {
  background: #dbeafe;
  border-color: #60a5fa;
  color: var(--text);
}
#planning-5d-level-same.btn:hover:not(:disabled) {
  background: #bfdbfe;
  border-color: var(--accent);
  color: var(--text);
}

#planning-5d-level-down.btn {
  background: var(--btn-cta-sky);
  border-color: var(--btn-cta-sky-border);
  color: var(--text);
}
#planning-5d-level-down.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  border-color: var(--accent);
  color: var(--text);
}

#planning-5d-edit-line.btn {
  background: var(--btn-ingest);
  border-color: var(--btn-ingest-border);
  color: var(--text);
}
#planning-5d-edit-line.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
  border-color: var(--accent);
  color: var(--text);
}

.planning-5d-free-edit-btn.btn:disabled,
#planning-5d-new-free.btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

#planning-5d-report-pdf.btn {
  background: var(--btn-geo);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#planning-5d-report-pdf.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
}

#planning-5d-calc-rend.btn {
  background: var(--btn-warn);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#planning-5d-calc-rend.btn:hover:not(:disabled) {
  background: var(--btn-warn-hover);
}

#planning-5d-recalc-devis.btn,
#planning-5d-recalc-presupuesto.btn {
  background: var(--budget-recal-orange);
  border-color: rgba(15, 23, 42, 0.12);
  color: var(--btn-ivory);
  font-weight: 700;
  letter-spacing: 0.04em;
}
#planning-5d-recalc-devis.btn:hover:not(:disabled),
#planning-5d-recalc-presupuesto.btn:hover:not(:disabled) {
  background: var(--budget-recal-orange-hover);
}

/* .btn define display:inline-flex y anula el [hidden] nativo en algunos navegadores */
#budget-pu-catalog-import.btn[hidden],
#budget-pu-catalog-export.btn[hidden] {
  display: none !important;
}

#budget-pu-catalog-import.btn {
  background: var(--btn-ingest);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-pu-catalog-import.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
}

#budget-concepts-import-csv.btn {
  background: var(--btn-ingest);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-concepts-import-csv.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
}

#budget-pu-catalog-export.btn {
  background: var(--btn-geo);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-pu-catalog-export.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
}

#budget-pu-catalog-add.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-pu-catalog-add.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#budget-pu-catalog-remove.btn {
  background: var(--btn-danger);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-pu-catalog-remove.btn:hover:not(:disabled) {
  background: var(--btn-danger-hover);
}

#budget-pu-catalog-close.btn {
  background: var(--btn-measure);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#budget-pu-catalog-close.btn:hover:not(:disabled) {
  background: var(--btn-measure-hover);
}

#btn-close-ifc-table.btn {
  background: var(--btn-measure);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#btn-close-ifc-table.btn:hover:not(:disabled) {
  background: var(--btn-measure-hover);
}

/* Plano desde vista */
#plan-sheet-close.btn {
  background: var(--btn-measure);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-sheet-close.btn:hover:not(:disabled) {
  background: var(--btn-measure-hover);
}

#plan-capture-again.btn {
  background: var(--btn-ingest);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-capture-again.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
}

#plan-clear-annotations.btn {
  background: var(--btn-warn);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-clear-annotations.btn:hover:not(:disabled) {
  background: var(--btn-warn-hover);
}

#plan-export-pdf.btn {
  background: var(--btn-geo);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-export-pdf.btn:hover:not(:disabled) {
  background: var(--btn-geo-hover);
}

#plan-print.btn {
  background: #1f4e79;
  border-color: rgba(15, 23, 42, 0.12);
  color: #f8fafc;
}
#plan-print.btn:hover:not(:disabled) {
  background: #163a5c;
}

#plan-export-dxf.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-export-dxf.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#plan-zoom-out.btn {
  background: var(--btn-nav-back);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-zoom-out.btn:hover:not(:disabled) {
  background: var(--btn-nav-back-hover);
}

#plan-zoom-in.btn {
  background: var(--btn-cta-sky);
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--btn-on-cta);
}
#plan-zoom-in.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  color: var(--btn-on-cta);
}

#plan-zoom-reset.btn {
  background: var(--btn-measure);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-zoom-reset.btn:hover:not(:disabled) {
  background: var(--btn-measure-hover);
}

#plan-undo.btn {
  background: var(--btn-draw);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-undo.btn:hover:not(:disabled) {
  background: var(--btn-draw-hover);
}

#plan-redo.btn {
  background: var(--btn-olive);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#plan-redo.btn:hover:not(:disabled) {
  background: var(--btn-olive-hover);
}

/* Plano de corte (panel): tonos agua/tenues, orden X | Y | Z */
#cut-axis-x.cut-axis-btn-x.btn,
#cut-axis-x.btn {
  background: #f2dede;
  border-color: #e0c8c8;
  color: #8f4f4f;
}
#cut-axis-x.cut-axis-btn-x.btn:hover:not(:disabled),
#cut-axis-x.btn:hover:not(:disabled) {
  background: #ead4d4;
  color: #7a4242;
}

#cut-axis-z.cut-axis-btn-y.btn,
#cut-axis-y.cut-axis-btn-y.btn {
  background: #dce8f2;
  border-color: #c8dae8;
  color: #4a6882;
}
#cut-axis-z.cut-axis-btn-y.btn:hover:not(:disabled),
#cut-axis-y.cut-axis-btn-y.btn:hover:not(:disabled) {
  background: #d2e2ee;
  color: #3f5a72;
}

#cut-axis-y.cut-axis-btn-z.btn,
#cut-axis-z.cut-axis-btn-z.btn {
  background: #dceee6;
  border-color: #c6e0d6;
  color: #457a62;
}
#cut-axis-y.cut-axis-btn-z.btn:hover:not(:disabled),
#cut-axis-z.cut-axis-btn-z.btn:hover:not(:disabled) {
  background: #d2e8de;
  color: #3a6a54;
}

#cut-pick-face.btn {
  background: var(--btn-cta-sky);
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--btn-on-cta);
}
#cut-pick-face.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  color: var(--btn-on-cta);
}

#cut-invert.btn {
  background: var(--btn-warn);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#cut-invert.btn:hover:not(:disabled) {
  background: var(--btn-warn-hover);
}

#cut-remove.btn,
#cut-remove-float.btn {
  background: var(--btn-danger);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#cut-remove.btn:hover:not(:disabled),
#cut-remove-float.btn:hover:not(:disabled) {
  background: var(--btn-danger-hover);
}

#measure-clear.btn {
  background: var(--btn-measure);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#measure-clear.btn:hover:not(:disabled) {
  background: var(--btn-measure-hover);
}

#ifc-budget-clear-sel-btn.btn {
  background: var(--btn-warn);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#ifc-budget-clear-sel-btn.btn:hover:not(:disabled) {
  background: var(--btn-warn-hover);
}

#ifc-budget-pick-from-3d-btn.btn {
  background: var(--btn-ingest);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#ifc-budget-pick-from-3d-btn.btn:hover:not(:disabled) {
  background: var(--btn-ingest-hover);
}

#ifc-budget-footer-select-all-btn.btn {
  background: var(--btn-olive);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#ifc-budget-footer-select-all-btn.btn:hover:not(:disabled) {
  background: var(--btn-olive-hover);
}

#ifc-budget-add-to-presupuesto.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#ifc-budget-add-to-presupuesto.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#ifc-budget-3d-pick-ok.btn {
  background: var(--btn-persist);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#ifc-budget-3d-pick-ok.btn:hover:not(:disabled) {
  background: var(--btn-persist-hover);
}

#ifc-budget-3d-pick-cancel.btn {
  background: var(--btn-nav-back);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#ifc-budget-3d-pick-cancel.btn:hover:not(:disabled) {
  background: var(--btn-nav-back-hover);
}

#simulation-window-close.btn {
  background: var(--btn-nav-back);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#simulation-window-close.btn:hover:not(:disabled) {
  background: var(--btn-nav-back-hover);
}

#simulation-play-pause.btn {
  background: var(--btn-cta-sky);
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--btn-on-cta);
}
#simulation-play-pause.btn:hover:not(:disabled) {
  background: var(--btn-cta-sky-hover);
  color: var(--btn-on-cta);
}

#simulation-exit.btn {
  background: var(--btn-danger);
  border-color: rgba(15, 23, 42, 0.1);
  color: var(--btn-ivory);
}
#simulation-exit.btn:hover:not(:disabled) {
  background: var(--btn-danger-hover);
}

/* Costes y filas para IV Cronograma / V Simulación vienen del catálogo de conceptos (ficha de trabajo). */
#budget-sheet-modal.budget-sheet-modal {
  display: none !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

/* Presupuesto (hoja): filas Auxiliar — cursiva, peso normal (no negrita) */
.presupuesto-sheet-auxiliar-row td,
.presupuesto-sheet-auxiliar-row .presupuesto-sheet-cell,
.presupuesto-sheet-auxiliar-row .presupuesto-sheet-readonly-val,
.presupuesto-sheet-auxiliar-row .presupuesto-sheet-tipo-select {
  font-weight: 400 !important;
  font-style: italic !important;
  color: #475569 !important;
  opacity: 1 !important;
}

/* Générateur modèle devis IA — même violet que « REVISAR PRECIOS IA » */
.panel-general-actions .btn-generar-modelo-ia {
  flex: 1 1 100%;
  background: linear-gradient(180deg, #c4b5fd 0%, #7c3aed 100%);
  color: #fff;
  border: 1px solid #6d28d9;
  font-weight: 800;
}
.panel-general-actions .btn-generar-modelo-ia:hover {
  background: linear-gradient(180deg, #ddd6fe 0%, #8b5cf6 100%);
  border-color: #6d28d9;
  color: #fff;
}
#presupuesto-ia-modelo-dialog.config-modal {
  position: fixed;
  inset: 0;
  z-index: 13050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right))
    max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
  background: rgba(15, 23, 42, 0.35);
  backdrop-filter: blur(4px);
}
#presupuesto-ia-modelo-dialog.config-modal.hidden {
  display: none !important;
}
#presupuesto-ia-modelo-dialog .presupuesto-ia-modelo-window {
  width: min(920px, 96vw);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  overflow: auto;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, #fafbfd 0%, #f0f4fa 100%);
  box-shadow: 0 14px 40px rgba(15, 23, 42, 0.12);
  padding: 12px;
}
#presupuesto-ia-modelo-dialog .config-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
#presupuesto-ia-modelo-dialog .config-head-title {
  font-size: 1.02rem;
  font-weight: 700;
  color: var(--text);
}
.presupuesto-ia-modelo-intro {
  margin: 0 0 0.75rem;
  font-size: 0.88rem;
  color: #475569;
  line-height: 1.45;
}
.presupuesto-ia-modelo-meta {
  margin: 0 0 0.5rem;
  font-size: 0.8rem;
  color: #64748b;
}
.presupuesto-ia-modelo-devis-hint {
  margin: 0 0 0.65rem;
  font-size: 0.78rem;
  color: #0e7490;
}
.presupuesto-ia-modelo-form {
  display: grid;
  gap: 0.65rem;
  margin-bottom: 0.75rem;
}
.presupuesto-ia-modelo-form label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: #334155;
}
.presupuesto-ia-modelo-form select,
.presupuesto-ia-modelo-form textarea {
  font: inherit;
  padding: 0.45rem 0.55rem;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  color: var(--text);
}
.presupuesto-ia-modelo-form textarea {
  min-height: 88px;
  resize: vertical;
}
.presupuesto-ia-modelo-desc-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
}
.presupuesto-ia-modelo-desc-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.presupuesto-ia-modelo-clear-btn {
  flex-shrink: 0;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(100, 116, 139, 0.45);
  background: linear-gradient(180deg, #f1f5f9 0%, #e2e8f0 100%);
  color: #334155;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  cursor: pointer;
}
.presupuesto-ia-modelo-clear-btn:hover {
  background: linear-gradient(180deg, #e2e8f0 0%, #cbd5e1 100%);
  border-color: #94a3b8;
}
.presupuesto-ia-modelo-mic-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgba(217, 119, 6, 0.45);
  background: linear-gradient(180deg, #fde68a 0%, #f59e0b 100%);
  color: #78350f;
  cursor: pointer;
}
.presupuesto-ia-modelo-mic-btn:hover:not(:disabled) {
  background: linear-gradient(180deg, #fcd34d 0%, #d97706 100%);
  border-color: #b45309;
}
.presupuesto-ia-modelo-mic-btn.is-listening {
  background: linear-gradient(180deg, #fecaca 0%, #ef4444 100%);
  border-color: #b91c1c;
  color: #fff;
  animation: presupuesto-ia-mic-pulse 1.2s ease-in-out infinite;
}
.presupuesto-ia-modelo-mic-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
@keyframes presupuesto-ia-mic-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.45); }
  50% { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
}
.presupuesto-ia-modelo-import-mode {
  max-width: 280px;
}
.presupuesto-ia-modelo-fill-aux-wrap {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: #334155;
  cursor: pointer;
}
.presupuesto-ia-modelo-fill-aux-wrap input {
  margin-top: 0.15rem;
}
.presupuesto-ia-modelo-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
  width: 100%;
  box-sizing: border-box;
}
.presupuesto-ia-modelo-actions-btns {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
}
#presupuesto-ia-modelo-dialog .presupuesto-ia-modelo-actions-btns > button.btn.btn-primary,
.presupuesto-ia-modelo-actions-btns > button.btn.btn-primary {
  flex: 1 1 0;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
  position: static !important;
  margin: 0 !important;
  float: none !important;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.presupuesto-ia-modelo-status {
  display: block;
  width: 100%;
  margin: 0;
  font-size: 0.8rem;
  color: #64748b;
}
.presupuesto-ia-modelo-status--ok {
  color: #047857;
}
.presupuesto-ia-modelo-status--err {
  color: #b91c1c;
}
.presupuesto-ia-modelo-preview-wrap {
  flex: 1 1 auto;
  min-height: 160px;
  max-height: 42vh;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}
.presupuesto-ia-modelo-preview-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}
.presupuesto-ia-modelo-preview-table th,
.presupuesto-ia-modelo-preview-table td {
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
  vertical-align: top;
}
.presupuesto-ia-modelo-preview-table th {
  position: sticky;
  top: 0;
  background: #e2e8f0;
  z-index: 1;
  font-weight: 700;
}
.presupuesto-ia-modelo-empty {
  text-align: center;
  color: #94a3b8;
  padding: 1.5rem !important;
}

/* Grille de lignes — modale import DXF */
.grid-template-choice-modal {
  position: fixed;
  inset: 0;
  z-index: 20045;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.grid-template-choice-modal.hidden {
  display: none;
}

.grid-template-choice-dialog {
  position: relative;
  z-index: 1;
  width: min(480px, 94vw);
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 16px 48px rgba(15, 23, 42, 0.28);
  padding: 16px 18px 14px;
}

.grid-template-choice-dialog h2 {
  margin: 0 0 8px;
  font-size: 1.05rem;
}

.grid-template-choice-intro {
  margin: 0 0 14px;
  font-size: 12px;
}

.grid-template-choice-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}

.grid-template-choice-btn {
  width: 100%;
  margin: 0;
  text-align: left;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 10px 12px;
  line-height: 1.35;
}

.grid-template-choice-btn span {
  font-size: 11px;
  font-weight: 400;
  color: #64748b;
}

.grid-template-choice-cancel {
  width: auto;
  margin: 0 0 0 auto;
}

.grid-template-fixed-origin {
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 8px 10px;
  margin: 0 0 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}

.grid-template-fixed-origin legend {
  padding: 0 4px;
  font-size: 11px;
  font-weight: 600;
}

.grid-template-fixed-manual-btn {
  width: 100%;
  margin: 0 0 10px;
}

.grid-template-modal {
  position: fixed;
  inset: 0;
  z-index: 20040;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.grid-template-modal.hidden {
  display: none;
}

.grid-template-backdrop {
  position: absolute;
  inset: 0;
  border: none;
  background: rgba(15, 23, 42, 0.45);
  cursor: pointer;
}

.grid-template-dialog {
  position: relative;
  z-index: 1;
  width: min(980px, 96vw);
  max-height: min(92vh, 860px);
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 16px 48px rgba(15, 23, 42, 0.28);
}

.grid-template-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid #e2e8f0;
}

.grid-template-head h2 {
  margin: 0;
  font-size: 1.05rem;
}

.grid-template-intro {
  margin: 8px 14px 0;
  font-size: 12px;
}

.grid-template-toolbar {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  align-items: center;
  padding: 10px 14px 0;
  overflow: hidden;
}

.grid-template-toolbar .btn.small {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
  white-space: nowrap;
}

.grid-template-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  padding: 10px 14px;
  border-bottom: 1px solid #e2e8f0;
}

.grid-template-desc-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  flex: 1 1 200px;
}

.grid-template-desc-input {
  padding: 4px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
}

.grid-template-origin {
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 6px 10px;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}

.grid-template-origin legend {
  padding: 0 4px;
  font-size: 11px;
}

.grid-template-origin-input {
  width: 5.5rem;
  margin-left: 4px;
  padding: 3px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
}

.grid-template-body {
  flex: 1 1 auto;
  min-height: 120px;
  overflow: auto;
  padding: 8px 14px;
}

.grid-template-axis {
  margin-bottom: 14px;
}

.grid-template-axis-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 6px;
  flex-wrap: wrap;
}

.grid-template-axis-title {
  margin: 0;
  font-size: 13px;
  color: #1e3a5f;
  flex: 1 1 220px;
  min-width: 0;
  line-height: 1.35;
  white-space: normal;
}

.grid-template-axis-head .btn.small.grid-template-add-btn,
.grid-template-empty-cta .btn.small.grid-template-add-btn {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  margin: 0;
  white-space: nowrap;
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
  font-weight: 600;
  padding: 4px 10px;
}

.grid-template-axis-head .btn.small.grid-template-add-btn:hover,
.grid-template-empty-cta .btn.small.grid-template-add-btn:hover {
  background: #d1fae5;
  border-color: #34d399;
  color: #065f46;
}

.grid-template-empty-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 8px;
}

.grid-template-empty-cta .grid-template-add-btn {
  font-style: normal;
}

.grid-template-axis-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.grid-template-table-col {
  flex: 1 1 360px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.grid-template-table-wrap {
  flex: 1 1 auto;
  max-height: 200px;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.grid-template-labels-section .grid-template-table-wrap {
  max-height: 240px;
}

.grid-template-table {
  border-collapse: collapse;
  font-size: 12px;
  width: 100%;
}

.grid-template-table th,
.grid-template-table td {
  border: 1px solid #e2e8f0;
  padding: 3px 5px;
  vertical-align: middle;
}

.grid-template-table th {
  background: #f1f5f9;
  font-weight: 600;
  position: sticky;
  top: 0;
  z-index: 1;
}

.grid-template-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border: 1px solid #cbd5e1;
  border-radius: 3px;
  padding: 4px 6px;
  font-size: 12px;
  background: #fff;
}

.grid-template-input:focus {
  outline: 2px solid #93c5fd;
  border-color: #60a5fa;
}

.grid-template-input-num {
  width: 4.75rem;
}

.grid-template-input-coord {
  width: 5.5rem;
}

.grid-template-row-del {
  border: none;
  background: #fee2e2;
  color: #b91c1c;
  border-radius: 3px;
  cursor: pointer;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1;
  padding: 0;
}

.grid-template-empty {
  color: #64748b;
  font-style: italic;
  text-align: center;
}

.grid-template-axis-options {
  flex: 0 0 150px;
  font-size: 11px;
}

.grid-template-axis-options fieldset {
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  margin: 0 0 8px;
  padding: 6px 8px;
}

.grid-template-axis-options label {
  display: block;
  margin: 2px 0;
}

.grid-template-foot {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid #e2e8f0;
  overflow-x: auto;
}

.grid-template-foot .btn.small {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
  white-space: nowrap;
}

.grid-template-foot #grid-template-cancel {
  margin-right: auto;
}

.btn-primary-soft {
  background: #e0f2fe;
  border-color: #0284c7;
  color: #0369a1;
}

.btn-grid-clear {
  margin-left: auto;
  background: #fef2f2;
  border-color: #fca5a5;
  color: #b91c1c;
}

/* Menú contextual viewport: guardar captura */
.viewer-viewport-ctx-menu {
  position: fixed;
  z-index: 10050;
  min-width: 268px;
  max-width: min(340px, calc(100vw - 16px));
  padding: 6px;
  margin: 0;
  background: linear-gradient(180deg, #ffffff 0%, #eef5fb 100%);
  border: 1px solid #7aa3c7;
  border-radius: 14px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.85) inset,
    0 12px 28px rgba(15, 53, 96, 0.22),
    0 2px 6px rgba(15, 23, 42, 0.12);
  backdrop-filter: blur(8px);
}
.viewer-viewport-ctx-menu.hidden {
  display: none;
}
.viewer-viewport-ctx-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 10px 12px 10px 10px;
  border: 1px solid #0ea5e9;
  border-radius: 10px;
  background: linear-gradient(180deg, #dff6ff 0%, #b9e7fb 55%, #9fdcf5 100%);
  color: #0c4a6e;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.01em;
  text-align: left;
  cursor: pointer;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.75) inset,
    0 2px 6px rgba(14, 165, 233, 0.28);
  transition:
    background 0.14s ease,
    border-color 0.14s ease,
    transform 0.12s ease,
    box-shadow 0.14s ease;
}
.viewer-viewport-ctx-item:hover,
.viewer-viewport-ctx-item:focus-visible {
  background: linear-gradient(180deg, #c8effd 0%, #8fd4f4 55%, #6fc4eb 100%);
  border-color: #0284c7;
  color: #075985;
  outline: none;
  transform: translateY(-1px);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.8) inset,
    0 6px 14px rgba(2, 132, 199, 0.32);
}
.viewer-viewport-ctx-item:active {
  transform: translateY(0);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.55) inset,
    0 1px 3px rgba(2, 132, 199, 0.28);
}
.viewer-viewport-ctx-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: linear-gradient(160deg, #ffffff 0%, #e0f2fe 100%);
  border: 1px solid #7dd3fc;
  color: #0369a1;
  box-shadow: 0 1px 2px rgba(3, 105, 161, 0.12);
}
.viewer-viewport-ctx-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
}
.viewer-viewport-ctx-title {
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.viewer-viewport-ctx-hint {
  font-size: 11px;
  font-weight: 550;
  letter-spacing: 0.02em;
  color: #0284c7;
  opacity: 0.92;
  line-height: 1.2;
}
.viewer-viewport-ctx-chevron {
  flex: 0 0 auto;
  font-size: 18px;
  font-weight: 700;
  color: #0284c7;
  opacity: 0.75;
  line-height: 1;
  transform: translateY(-1px);
}
.viewer-viewport-ctx-item:hover .viewer-viewport-ctx-chevron,
.viewer-viewport-ctx-item:focus-visible .viewer-viewport-ctx-chevron {
  opacity: 1;
  color: #0369a1;
}

.btn-grid-clear:hover {
  background: #fee2e2;
  border-color: #f87171;
}