/* ── Design tokens ──────────────────────────────────────────────────── */
@import url("/platform-theme.css");

:root {
  --font-graphik: "Graphik", "Graphik Web", "Graphik LC", "Helvetica Neue", Arial, sans-serif;
  --font-ui: var(--font-graphik);
  --font-mono: "Consolas", "Monaco", monospace;
  --brand-charcoal: #343735;
  --brand-orange: #F28A2E;
  --brand-orange-hover: #D96F18;
  --brand-orange-soft: #FFF1E6;
  --color-on-charcoal: #F6F7F4;
  --bg:          #F6F7F4;
  --surface:     #FFFFFF;
  --surface-2:   #F1F4F0;
  --border:      #DDE2D8;
  --border-strong: #C6D0C3;
  --text:        #111816;
  --text-muted:  #66726B;
  --text-subtle: #98A39B;
  --accent:      var(--brand-orange);
  --accent-soft: var(--brand-orange-soft);
  --accent-hover:var(--brand-orange-hover);
  --green:       #1E7355;
  --green-soft:  #EAF6EF;
  --warn:        #D97706;
  --warn-soft:   #FFFBEB;
  --danger:      #DC2626;
  --danger-soft: #FEF2F2;
  --shadow-sm:   0 1px 2px rgba(17,24,22,0.04);
  --shadow:      0 6px 18px rgba(17,24,22,0.055);
  --shadow-lg:   0 12px 28px rgba(17,24,22,0.07);
  --radius-sm:   4px;
  --radius:      6px;
  --radius-lg:   8px;
  --sidebar-w:   264px;
  --type-body-size: 14px;
  --type-body-line: 1.5;
  --type-body-small-size: 13px;
  --type-caption-size: 12px;
  --type-label-size: 11px;
  --type-label-weight: 600;
  --type-label-tracking: 0.04em;
  --type-title-tracking: 0;
  --type-workspace-title-size: 28px;
  --type-workspace-title-line: 1.12;
  --type-workspace-title-weight: 600;
  --type-page-title-size: 22px;
  --type-page-title-weight: 600;
  --type-section-title-size: 16px;
  --type-section-title-weight: 600;
  --type-card-title-size: 14px;
  --type-card-title-weight: 600;
  --type-control-size: 13px;
  --type-control-weight: 500;
  --type-button-size: 13px;
  --type-button-weight: 500;
  --type-button-strong-weight: 500;
  --type-topbar-title-size: 15px;
  --type-topbar-title-weight: 500;
  --type-login-title-size: 22px;
  --type-login-title-weight: 500;
  --platform-icon-filter: grayscale(1) saturate(0) contrast(0.95);
  --topbar-bg: #D8D8D8;
  --topbar-fg: var(--brand-charcoal);
  --topbar-border: var(--border);
  --topbar-soft-border: var(--border-strong);
  --topbar-accent: var(--brand-orange);
  --topbar-accent-hover: var(--brand-orange-hover);
  --topbar-muted: #A4AAA6;
  --topbar-h: 36px;
  --topbar-logo-w: 34px;
  --topbar-logo-h: 23px;
  --workspace-main-bg: var(--brand-charcoal);
  --workspace-sidebar-bg: #3F4340;
  --workspace-sidebar-border: #545955;
  --workspace-sidebar-text: #F1F3EF;
  --workspace-sidebar-muted: #C0C6BF;
  --workspace-sidebar-control-bg: #D8D8D8;
  --workspace-card-bg: #BEBEBE;
  --workspace-top-card-bg: #AFAFAF;
  --workspace-card-button-bg: #D8D8D8;
  --designer-card-bg: var(--platform-designer-card-bg);
  --designer-card-border: var(--platform-designer-card-border);
  --designer-card-button-bg: var(--platform-designer-button-bg);
  --designer-card-button-bg-hover: var(--platform-designer-button-bg-hover);
  --designer-card-button-border: var(--platform-designer-button-border);
  --designer-card-control-bg: var(--platform-designer-control-bg);
  --designer-card-control-bg-disabled: var(--platform-designer-control-bg-disabled);
  --designer-card-selected-bg: var(--platform-designer-selected-bg);
  --designer-card-selected-border: var(--platform-designer-selected-border);
  --designer-card-divider: var(--platform-designer-divider);
  --osm-tile-filter: grayscale(0.9) saturate(0.18) contrast(0.9) brightness(1.03);
  --selected-border: var(--accent);
  --selected-ring: 0 0 0 3px var(--accent-soft);
}

.constructor-kits {
  display: grid;
  gap: 16px;
  margin-top: 16px;
}

.constructor-kit-card .card-header {
  align-items: center;
  gap: 12px;
}

.constructor-day-package-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
  gap: 10px;
}

.constructor-day-package {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
}

.constructor-day-package.is-selected {
  border-color: var(--accent);
  background: rgba(36, 91, 254, 0.04);
}

.constructor-day-package.is-disabled {
  opacity: 0.75;
}

.constructor-day-package-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-muted);
  font-size: 11px;
}

.constructor-day-package-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.constructor-day-package-head strong {
  font-size: 13px;
  line-height: 1.2;
}

.constructor-day-package-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.constructor-day-package .summary-chip {
  padding: 3px 7px;
  font-size: 11px;
}

.constructor-package-lines {
  display: grid;
  gap: 16px;
}

.constructor-package-line-card .card-header {
  align-items: flex-start;
  gap: 12px;
}

.constructor-gantt-shell {
  overflow-x: auto;
  padding-bottom: 4px;
}

.constructor-gantt-track {
  display: flex;
  align-items: stretch;
  gap: 8px;
  width: max-content;
  min-width: 100%;
}

.constructor-gantt-entry {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  gap: 5px;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
  color: inherit;
  text-decoration: none;
  width: fit-content;
  min-width: 104px;
  max-width: 152px;
  min-height: 102px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.constructor-gantt-entry:hover {
  border-color: var(--border-strong);
  background: var(--surface-2);
}

.constructor-gantt-entry.is-active {
  border-color: var(--accent);
  background: rgba(36, 91, 254, 0.04);
  box-shadow: inset 0 0 0 1px rgba(36, 91, 254, 0.08);
}

.constructor-gantt-day {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.constructor-gantt-date {
  font-size: 14px;
  line-height: 1.2;
}

.constructor-gantt-pieces {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-hover);
  font-size: 11px;
  font-weight: 600;
}

.constructor-gantt-stages {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}

.construction-project-planner-card {
  overflow: hidden;
}

.construction-project-planner-header {
  align-items: flex-start;
  gap: 16px;
}

.construction-project-sequence-page {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - var(--topbar-h));
  background: var(--bg);
}

.construction-sequence-topbar {
  position: sticky;
  top: var(--topbar-h);
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--border);
  background: rgba(247, 248, 244, 0.92);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.construction-sequence-topbar-left,
.construction-sequence-topbar-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.construction-sequence-topbar-actions {
  justify-content: flex-end;
}

.construction-sequence-warning-button {
  gap: 7px;
}

.construction-sequence-warning-button span {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text-muted);
  font-size: 11px;
}

.construction-sequence-warning-button.has-warning span {
  border-color: rgba(217, 119, 6, 0.45);
  background: var(--warn-soft);
  color: var(--warn);
}

.construction-project-sequence-page .construction-project-planner-card {
  flex: 1;
  min-height: 0;
  border-right: none;
  border-bottom: none;
  border-left: none;
  border-radius: 0;
}

.construction-project-planner-card.is-chrome-minimal > .card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 12px;
  padding: 12px 16px 16px;
}

.construction-project-sequence-page .construction-schedule-layout {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.construction-project-sequence-page .construction-schedule-main {
  overflow: auto;
}

.construction-project-sequence-page .construction-schedule-side-panel {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
}

.construction-project-sequence-page .construction-schedule-side-panel section {
  min-height: 118px;
}

.construction-sequence-launch-card {
  overflow: hidden;
}

.construction-sequence-launch-header {
  align-items: flex-start;
  gap: 16px;
}

.construction-sequence-launch-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.construction-sequence-scope-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
}

.construction-sequence-scope-heading,
.construction-sequence-house-identity {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.construction-sequence-scope-heading span,
.construction-sequence-house-identity span,
.construction-sequence-scope-label {
  color: var(--muted);
  font-size: 0.82rem;
}

.construction-sequence-house-list {
  display: grid;
  margin-bottom: 14px;
}

.construction-sequence-house-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 58px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
}

.construction-sequence-house-actions {
  flex-wrap: nowrap;
}

.construction-sequence-house-actions .btn {
  min-width: 54px;
  justify-content: center;
}

.construction-sequence-topbar-left {
  gap: 10px;
  align-items: center;
}

.construction-schedule-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 14px;
}

.construction-schedule-zoom {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
}

.construction-schedule-select-control {
  cursor: default;
  white-space: nowrap;
}

.construction-schedule-zoom > span {
  padding: 0 7px;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.construction-schedule-zoom-button {
  min-height: 26px;
  padding: 4px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

.construction-schedule-zoom-select {
  min-height: 26px;
  max-width: 150px;
  padding: 4px 28px 4px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
}

.construction-schedule-zoom-button:hover,
.construction-schedule-zoom-button.is-active {
  border-color: rgba(36, 91, 254, 0.22);
  background: rgba(36, 91, 254, 0.1);
  color: var(--accent-hover);
}

.construction-schedule-rule-toggle {
  border-color: rgba(21, 26, 24, 0.12);
  background: var(--surface);
}

.construction-schedule-rule-toggle.is-active {
  border-color: rgba(21, 128, 61, 0.36);
  background: rgba(220, 252, 231, 0.82);
  color: #166534;
}

.construction-schedule-detail-toggle {
  background: #F8FAFC;
}

.construction-schedule-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
}

.construction-schedule-main {
  overflow-x: auto;
  padding-bottom: 8px;
}

.construction-schedule-main.is-middle-panning,
.construction-schedule-board.is-middle-panning,
body.is-construction-schedule-panning,
body.is-construction-schedule-panning * {
  cursor: grabbing !important;
  user-select: none;
}

body.is-construction-schedule-column-resizing,
body.is-construction-schedule-column-resizing * {
  cursor: col-resize !important;
  user-select: none;
}

.construction-schedule-board {
  position: relative;
  min-width: calc(var(--construction-schedule-left-column-width, 230px) + var(--construction-schedule-grid-width, 126px));
}

.construction-schedule-marquee {
  position: absolute;
  z-index: 12;
  border: 1px solid var(--platform-selected-border, rgba(245, 119, 52, 0.82));
  border-radius: var(--platform-radius-sm, 2px);
  background: color-mix(in srgb, var(--platform-selected-bg, rgba(245, 119, 52, 0.18)) 72%, transparent);
  box-shadow: none;
  pointer-events: none;
}

.construction-schedule-marquee.is-window {
  border-style: solid;
  background: color-mix(in srgb, var(--platform-selected-bg, rgba(245, 119, 52, 0.18)) 58%, transparent);
}

.construction-schedule-marquee.is-crossing {
  border-color: color-mix(in srgb, var(--platform-muted, #8b8b8b) 76%, var(--platform-selected-border, rgba(245, 119, 52, 0.82)) 24%);
  border-style: dashed;
  background: color-mix(in srgb, var(--platform-control-bg, rgba(120, 120, 120, 0.22)) 42%, transparent);
}

.construction-schedule-dependency-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.construction-schedule-edge-snap-guide {
  position: absolute;
  z-index: 13;
  width: 0;
  border-left: 1px solid var(--platform-selected-border, rgba(245, 119, 52, 0.9));
  background: transparent;
  pointer-events: none;
}

.construction-schedule-edge-snap-guide::before,
.construction-schedule-edge-snap-guide::after {
  content: "";
  position: absolute;
  left: -3px;
  width: 5px;
  height: 5px;
  border-radius: var(--platform-radius-sm, 2px);
  background: var(--platform-selected-border, rgba(245, 119, 52, 0.9));
}

.construction-schedule-edge-snap-guide::before {
  top: 0;
}

.construction-schedule-edge-snap-guide::after {
  bottom: 0;
}

.construction-schedule-dependency-path {
  fill: none;
  stroke: rgba(36, 91, 254, 0.58);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  filter: drop-shadow(0 1px 2px rgba(21, 26, 24, 0.12));
}

.construction-schedule-dependency-hitbox {
  fill: none;
  stroke: rgba(255, 255, 255, 0);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 16;
  cursor: pointer;
  pointer-events: stroke;
}

.construction-schedule-dependency-path.is-selectable {
  pointer-events: none;
}

.construction-schedule-dependency-path.is-selected {
  stroke: #1442BE;
  stroke-width: 3.25;
  filter: drop-shadow(0 3px 7px rgba(36, 91, 254, 0.28));
}

.construction-schedule-dependency-hitbox:focus + .construction-schedule-dependency-path {
  stroke: #1442BE;
  stroke-width: 3.25;
}

.construction-schedule-dependency-path.has-warning {
  stroke: rgba(217, 119, 6, 0.72);
  stroke-dasharray: 8 5;
}

.construction-schedule-dependency-path.is-selected.has-warning {
  stroke: #EA580C;
}

.construction-schedule-dependency-path.is-preview {
  stroke: var(--green);
  stroke-dasharray: 7 5;
  stroke-width: 2.5;
}

.construction-schedule-dependency-path.is-preview.is-valid {
  stroke-dasharray: none;
}

.construction-schedule-dependency-marker {
  fill: context-stroke;
}

.construction-schedule-axis,
.construction-schedule-row {
  display: grid;
  grid-template-columns: var(--construction-schedule-left-column-width, 230px) minmax(0, 1fr);
}

.construction-schedule-house-axis,
.construction-schedule-house-cell {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--surface);
}

.construction-schedule-house-axis {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-right: none;
  border-radius: var(--radius) 0 0 0;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.construction-schedule-day-axis,
.construction-schedule-track {
  display: grid;
  grid-template-columns: var(--construction-schedule-grid-template, repeat(var(--construction-schedule-days, 1), var(--construction-schedule-day-width, 126px)));
}

.construction-schedule-day-axis {
  border: 1px solid var(--border);
  border-radius: 0 var(--radius) 0 0;
  background: var(--surface-2);
}

.construction-schedule-day-cell {
  position: relative;
  min-width: 0;
  padding: 8px 9px;
  border-left: 1px solid rgba(21, 26, 24, 0.06);
}

.construction-schedule-day-resize {
  position: absolute;
  top: 6px;
  right: -4px;
  bottom: 6px;
  z-index: 4;
  width: 8px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  cursor: col-resize;
}

.construction-schedule-day-resize::after {
  content: "";
  position: absolute;
  top: 6px;
  right: 3px;
  bottom: 6px;
  width: 2px;
  border-radius: 999px;
  background: rgba(36, 91, 254, 0.18);
  opacity: 0;
  transition: opacity 0.12s ease, background 0.12s ease;
}

.construction-schedule-day-cell:hover .construction-schedule-day-resize::after,
.construction-schedule-day-resize:hover::after {
  background: rgba(36, 91, 254, 0.5);
  opacity: 1;
}

.construction-schedule-day-cell.is-optional-weekend {
  border-left-color: rgba(75, 85, 99, 0.2);
  background: rgba(229, 231, 235, 0.5);
}

.construction-schedule-day-cell.is-blocked-day {
  border-left-color: rgba(75, 85, 99, 0.24);
  background: rgba(209, 213, 219, 0.58);
}

.construction-schedule-day-cell.is-sunday {
  border-left-color: rgba(75, 85, 99, 0.28);
  background: rgba(156, 163, 175, 0.38);
}

.construction-schedule-day-cell:first-child {
  border-left: none;
}

.construction-schedule-day-cell strong,
.construction-schedule-day-cell span,
.construction-schedule-day-cell small {
  display: block;
  white-space: nowrap;
}

.construction-schedule-day-main {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 4px;
}

.construction-schedule-day-main strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.construction-schedule-day-cell strong {
  color: var(--text);
  font-size: 11px;
}

.construction-schedule-day-cell span {
  color: var(--text-muted);
  font-size: 10px;
}

.construction-schedule-day-cell small {
  margin-top: 2px;
  overflow: hidden;
  color: #B91C1C;
  font-size: 9px;
  text-overflow: ellipsis;
}

.construction-schedule-weather-row {
  display: flex;
  min-height: 19px;
  margin: -2px 0 4px;
  align-items: center;
}

.construction-schedule-weather-badge {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  gap: 5px;
  padding: 2px 7px 2px 5px;
  border: 1px solid rgba(21, 26, 24, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 800;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-schedule-weather-badge::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #94A3B8;
  box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.14);
}

.construction-schedule-weather-badge.is-sunny {
  border-color: rgba(217, 119, 6, 0.18);
  background: rgba(255, 251, 235, 0.82);
  color: #92400E;
}

.construction-schedule-weather-badge.is-sunny::before {
  background: #F59E0B;
  box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.16);
}

.construction-schedule-weather-badge.is-cloudy {
  border-color: rgba(71, 85, 105, 0.16);
  background: rgba(241, 245, 249, 0.82);
  color: #475569;
}

.construction-schedule-weather-badge.is-cloudy::before {
  background: #94A3B8;
  box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.18);
}

.construction-schedule-weather-badge.is-rain {
  border-color: rgba(37, 99, 235, 0.2);
  background: rgba(219, 234, 254, 0.86);
  color: #1D4ED8;
}

.construction-schedule-weather-badge.is-rain::before {
  background: #2563EB;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.16);
}

.construction-schedule-weather-badge.is-unavailable {
  border-color: rgba(100, 116, 139, 0.18);
  background: rgba(248, 250, 252, 0.84);
  color: #64748B;
}

.construction-schedule-weather-badge.is-unavailable::before {
  background: #CBD5E1;
  box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.14);
}

.construction-schedule-day-cell.is-optional-weekend strong {
  color: #374151;
}

.construction-schedule-day-cell.is-optional-weekend span {
  color: #4B5563;
}

.construction-schedule-day-cell.is-blocked-day strong,
.construction-schedule-day-cell.is-blocked-day span {
  color: #374151;
}

.construction-schedule-day-cell.is-sunday strong {
  color: #1F2937;
}

.construction-schedule-day-cell.is-sunday span {
  color: #374151;
}

.construction-schedule-day-cell .construction-schedule-weather-badge.is-sunny {
  color: #92400E;
}

.construction-schedule-day-cell .construction-schedule-weather-badge.is-cloudy {
  color: #475569;
}

.construction-schedule-day-cell .construction-schedule-weather-badge.is-rain {
  color: #1D4ED8;
}

.construction-schedule-day-cell .construction-schedule-weather-badge.is-unavailable {
  color: #64748B;
}

.construction-schedule-row {
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  min-height: calc((var(--construction-row-lanes, 1) * var(--construction-row-lane-height, 48px)) + 24px);
}

.construction-schedule-row.is-house-selected .construction-schedule-house-cell {
  border-right-color: rgba(36, 91, 254, 0.28);
  background: linear-gradient(135deg, rgba(36, 91, 254, 0.12), rgba(36, 91, 254, 0.04)), var(--surface);
  box-shadow: 0 10px 24px rgba(36, 91, 254, 0.08);
}

.construction-schedule-house-cell {
  display: flex;
  flex-direction: column;
  gap: 5px;
  justify-content: center;
  padding: 12px;
  border-right: 1px solid var(--border);
}

.construction-schedule-house-cell strong {
  font-size: 14px;
  line-height: 1.2;
}

.construction-schedule-house-cell span {
  color: var(--text-muted);
  font-size: 11px;
}

.construction-schedule-house-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.construction-schedule-house-actions .btn {
  min-height: 26px;
  padding: 4px 8px;
  font-size: 11px;
}

.construction-schedule-track {
  position: relative;
  grid-template-rows: repeat(var(--construction-row-lanes, 1), var(--construction-row-lane-height, 48px));
  gap: 8px 0;
  align-content: center;
  padding: 12px 0;
  overflow: hidden;
}

.construction-schedule-track-grid {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: grid;
  grid-template-columns: var(--construction-schedule-grid-template, repeat(var(--construction-schedule-days, 1), var(--construction-schedule-day-width, 126px)));
  width: var(--construction-schedule-grid-width, 100%);
  pointer-events: none;
}

.construction-schedule-track-grid-cell {
  min-width: 0;
  border-left: 1px solid rgba(21, 26, 24, 0.06);
}

.construction-schedule-track-grid-cell.is-first {
  border-left: none;
}

.construction-schedule-track-grid-cell.is-optional-weekend {
  border-left-color: rgba(75, 85, 99, 0.16);
  background: rgba(229, 231, 235, 0.3);
}

.construction-schedule-track-grid-cell.is-blocked-day {
  border-left-color: rgba(75, 85, 99, 0.18);
  background: rgba(209, 213, 219, 0.34);
}

.construction-schedule-track-grid-cell.is-sunday {
  border-left-color: rgba(75, 85, 99, 0.22);
  background: rgba(156, 163, 175, 0.28);
}

.construction-phase-block {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  margin: 0 5px;
  padding: 8px 8px 8px 10px;
  border: 1px solid rgba(36, 91, 254, 0.26);
  border-radius: var(--radius);
  background: linear-gradient(135deg, #F7FAFF, #ECF3FF);
  color: var(--text);
  box-shadow: var(--shadow-sm);
  cursor: grab;
  user-select: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.construction-phase-block::before {
  content: "";
  position: absolute;
  top: -7px;
  left: -7px;
  z-index: 2;
  width: 15px;
  height: 15px;
  border: 2px solid var(--surface);
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 4px 12px rgba(36, 91, 254, 0.32);
  opacity: 0;
  transform: scale(0.65);
  transition: opacity 0.15s ease, transform 0.15s ease;
  pointer-events: none;
}

.construction-phase-block:hover {
  border-color: rgba(36, 91, 254, 0.48);
  box-shadow: var(--shadow);
  transform: translateY(-1px);
}

.construction-phase-block.is-dragging-preview,
.construction-component-block.is-dragging-preview {
  z-index: 8;
  border-color: var(--accent);
  box-shadow: 0 18px 34px rgba(36, 91, 254, 0.22), var(--shadow);
  cursor: grabbing;
  opacity: 0.92;
  pointer-events: none;
  transform: translate3d(var(--construction-drag-x, 0), 0, 0);
  transition: transform 0.14s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.12s ease, border-color 0.12s ease;
  will-change: transform;
}

.construction-phase-block.is-drag-source-hidden,
.construction-component-block.is-drag-source-hidden {
  opacity: 0;
  pointer-events: none;
}

.construction-phase-block.is-drag-ghost,
.construction-component-block.is-drag-ghost {
  z-index: 9;
}

.construction-phase-block.is-dragging-preview::after,
.construction-component-block.is-dragging-preview::after {
  content: attr(data-drag-day-offset);
  position: absolute;
  top: -22px;
  right: 6px;
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 2px 7px;
  border: 1px solid rgba(36, 91, 254, 0.24);
  border-radius: 999px;
  background: var(--surface);
  color: var(--accent-hover);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  box-shadow: var(--shadow-sm);
}

.construction-phase-block.is-dragging-preview:not([data-drag-day-offset])::after,
.construction-component-block.is-dragging-preview:not([data-drag-day-offset])::after {
  display: none;
}

.construction-phase-block.is-selected {
  z-index: 7;
  border-color: rgba(20, 66, 190, 0.92);
  outline: 2px solid rgba(36, 91, 254, 0.72);
  outline-offset: 2px;
  background: linear-gradient(135deg, #EAF1FF, #DCE9FF);
  box-shadow: 0 0 0 6px rgba(36, 91, 254, 0.14), 0 16px 32px rgba(36, 91, 254, 0.18), inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.construction-phase-block.is-marquee-preview {
  z-index: 6;
  border-color: rgba(36, 91, 254, 0.7);
  outline: 2px dashed rgba(36, 91, 254, 0.45);
  outline-offset: 2px;
  box-shadow: 0 0 0 5px rgba(36, 91, 254, 0.1), var(--shadow-sm);
}

.construction-phase-block.is-selected::before {
  opacity: 1;
  transform: scale(1);
}

.construction-phase-block.is-selected .construction-phase-main strong {
  color: #123A9D;
}

.construction-phase-block.is-selected .construction-phase-main span,
.construction-phase-block.is-selected .construction-phase-main small {
  color: #245BFE;
}

.construction-phase-block.is-dependency-source {
  border-color: var(--green);
  background: linear-gradient(135deg, #F3FCF8, #E5F7EF);
}

.construction-phase-block.is-dependency-target {
  border-color: var(--green);
  box-shadow: inset 0 0 0 2px rgba(21, 128, 61, 0.22), 0 14px 26px rgba(21, 128, 61, 0.16), var(--shadow-sm);
}

.construction-phase-block.has-warning {
  border-color: rgba(217, 119, 6, 0.55);
  background: linear-gradient(135deg, #FFFBEB, #FFF7D6);
}

.construction-phase-block.is-bridged-start,
.construction-component-block.is-bridged-start {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.construction-phase-block.is-bridged-middle,
.construction-component-block.is-bridged-middle {
  border-radius: 0;
}

.construction-phase-block.is-bridged-end,
.construction-component-block.is-bridged-end {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.construction-phase-block.has-sequence-warning,
.construction-component-block.has-sequence-warning {
  border-color: rgba(214, 163, 0, 0.55);
}

.construction-sequence-warning-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border-right: 5px solid transparent;
  border-bottom: 9px solid #D6A300;
  border-left: 5px solid transparent;
  filter: drop-shadow(0 1px 1px rgba(21, 26, 24, 0.24));
}

.construction-phase-block.is-overtime {
  border-color: rgba(194, 65, 12, 0.72);
  background: linear-gradient(135deg, #FFF1D6, #FED7AA);
  box-shadow: 0 12px 26px rgba(194, 65, 12, 0.14), inset 0 0 0 1px rgba(255, 255, 255, 0.64);
}

.construction-phase-block.is-overtime .construction-phase-main strong {
  color: #7C2D12;
}

.construction-phase-block.is-overtime .construction-phase-main span,
.construction-phase-block.is-overtime .construction-phase-main small {
  color: #9A3412;
}

.construction-phase-block.is-blocked-time {
  border-color: rgba(185, 28, 28, 0.72);
  background: linear-gradient(135deg, #FEE2E2, #FECACA);
  box-shadow: 0 12px 26px rgba(185, 28, 28, 0.16), inset 0 0 0 1px rgba(255, 255, 255, 0.64);
}

.construction-phase-block.is-blocked-time .construction-phase-main strong,
.construction-phase-block.is-blocked-time .construction-phase-main span,
.construction-phase-block.is-blocked-time .construction-phase-main small {
  color: #7F1D1D;
}

.construction-component-block.is-blocked-time {
  border-color: rgba(185, 28, 28, 0.72);
  background: #FEE2E2;
  color: #7F1D1D;
}

.construction-phase-block.is-selected.has-warning,
.construction-phase-block.is-selected.is-dependency-source:not(.is-overtime) {
  border-color: rgba(20, 66, 190, 0.92);
  background: linear-gradient(135deg, #EAF1FF, #DCE9FF);
}

.construction-phase-block.is-selected.is-overtime,
.construction-phase-block.is-selected.has-warning.is-overtime,
.construction-phase-block.is-selected.is-dependency-source.is-overtime {
  border-color: rgba(194, 65, 12, 0.86);
  outline-color: rgba(234, 88, 12, 0.74);
  background: linear-gradient(135deg, #FFE8C2, #FDBA74);
  box-shadow: 0 0 0 6px rgba(234, 88, 12, 0.16), 0 16px 32px rgba(194, 65, 12, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.construction-phase-block.is-selected.is-overtime::before {
  background: #EA580C;
  box-shadow: 0 4px 12px rgba(234, 88, 12, 0.34);
}

.construction-phase-block.is-selected.is-overtime .construction-phase-main strong {
  color: #7C2D12;
}

.construction-phase-block.is-selected.is-overtime .construction-phase-main span,
.construction-phase-block.is-selected.is-overtime .construction-phase-main small {
  color: #C2410C;
}

.construction-day-block {
  min-height: 48px;
  border-style: solid;
  background: linear-gradient(135deg, #F9FBF7, #EEF7E7);
}

.construction-day-block .construction-phase-main small {
  max-width: 100%;
  overflow: hidden;
  color: var(--text-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-phase-block.is-expanded {
  z-index: 9;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: column;
  gap: 8px;
  min-height: 112px;
  cursor: grab;
}

.construction-phase-block.is-expanded .construction-phase-main {
  padding-right: 28px;
}

.construction-phase-block.is-expanded .construction-dependency-handle {
  position: absolute;
  top: 8px;
  right: 8px;
}

.construction-inline-detail {
  display: grid;
  gap: 5px;
  max-height: 72px;
  overflow: auto;
  padding: 7px;
  border: 1px solid rgba(21, 26, 24, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.68);
}

.construction-inline-phase-list,
.construction-inline-component-list {
  display: grid;
  gap: 4px;
}

.construction-phase-component-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.construction-phase-component-toolbar,
.construction-phase-component-toolbar label {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 600;
}

.construction-phase-component-toolbar label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.construction-phase-component-list {
  display: grid;
  gap: 4px;
}

.construction-phase-component-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 72px auto;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 4px 6px;
  border-radius: 8px;
  background: rgba(248, 250, 252, 0.82);
}

.construction-phase-component-row.is-dragging {
  opacity: 0.55;
}

.construction-component-drag-handle {
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  cursor: grab;
}

.construction-component-main {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.construction-component-title-row {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.construction-component-title-row a,
.construction-component-title-row span {
  min-width: 0;
}

.construction-component-main a,
.construction-component-main span,
.construction-component-main small,
.construction-component-duration-input,
.construction-phase-component-row strong {
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-component-main small,
.construction-component-duration-input,
.construction-phase-component-row strong {
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 500;
}

.construction-component-duration-input {
  display: grid;
  gap: 2px;
}

.construction-component-duration-input input {
  width: 100%;
  min-height: 22px;
  padding: 2px 4px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.construction-component-consumables {
  grid-column: 2 / -1;
  display: grid;
  gap: 5px;
  min-width: 0;
}

.construction-component-consumable-list,
.construction-component-consumable-editor {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.construction-component-consumable-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 22px;
  padding: 2px 5px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
}

.construction-component-consumable-chip span,
.construction-component-consumable-chip small {
  max-width: 140px;
  overflow: hidden;
  color: inherit;
  font-size: 9px;
  font-weight: 500;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-component-consumable-chip small {
  color: var(--text-muted);
  font-size: 8px;
}

.construction-component-consumable-chip button {
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  font: inherit;
  cursor: pointer;
}

.construction-component-consumable-editor input {
  width: 96px;
  min-height: 22px;
  padding: 2px 5px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.construction-component-consumable-editor input[type="number"] {
  width: 68px;
}

.construction-component-consumable-editor .btn {
  min-height: 22px;
  padding: 2px 7px;
  font-size: 9px;
}

.construction-inline-phase-row,
.construction-inline-component-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 4px 6px;
  border-radius: 8px;
  background: rgba(248, 250, 252, 0.82);
}

.construction-inline-phase-row span,
.construction-inline-component-row span {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-inline-phase-row strong,
.construction-inline-component-row strong,
.construction-inline-detail-more,
.construction-inline-detail-empty {
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
}

.construction-inline-detail-more,
.construction-inline-detail-empty {
  padding: 2px 6px;
}

.construction-component-block {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
  margin: 0 3px;
  padding: 4px 6px;
  border: 1px solid rgba(36, 91, 254, 0.2);
  border-radius: 999px;
  background: #F8FBFF;
  color: var(--text);
  box-shadow: 0 5px 12px rgba(21, 26, 24, 0.06);
  user-select: none;
}

.construction-component-block strong {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #123A9D;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-component-block span {
  flex: 0 0 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--text-muted);
  font-size: 9px;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-component-block.is-selected {
  z-index: 7;
  border-color: rgba(20, 66, 190, 0.92);
  outline: 2px solid rgba(36, 91, 254, 0.62);
  outline-offset: 1px;
  background: #EAF1FF;
  box-shadow: 0 0 0 4px rgba(36, 91, 254, 0.12), 0 10px 20px rgba(36, 91, 254, 0.14);
}

.construction-component-block.is-marquee-preview {
  z-index: 6;
  border-color: rgba(36, 91, 254, 0.66);
  outline: 1px dashed rgba(36, 91, 254, 0.5);
  outline-offset: 1px;
  background: #EEF5FF;
}

.construction-component-block.is-overtime {
  border-color: rgba(194, 65, 12, 0.66);
  background: #FFE8C2;
}

.construction-component-block.has-warning {
  border-color: rgba(217, 119, 6, 0.48);
}

.construction-schedule-board[data-construction-schedule-detail-mode="component"] .construction-schedule-track {
  gap: 4px 0;
  padding-top: 10px;
  padding-bottom: 10px;
}

.construction-schedule-block-inspector {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(21, 26, 24, 0.08);
  border-radius: calc(var(--radius) + 4px);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(248, 250, 252, 0.94)),
    var(--surface);
  box-shadow: var(--shadow-sm);
}

.construction-schedule-block-inspector.is-empty {
  align-items: flex-start;
  padding: 18px;
}

.construction-schedule-block-inspector h4,
.construction-schedule-block-inspector h5 {
  margin: 0;
}

.construction-block-inspector-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.construction-block-inspector-head strong,
.construction-block-inspector-head span {
  display: block;
}

.construction-block-inspector-head h4 {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.construction-block-inspector-head strong {
  margin-top: 3px;
  color: var(--text);
  font-size: 18px;
  line-height: 1.18;
}

.construction-block-inspector-head span {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 12px;
}

.construction-block-inspector-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.construction-block-inspector-badges span {
  margin: 0;
  padding: 5px 9px;
  border: 1px solid rgba(36, 91, 254, 0.14);
  border-radius: 999px;
  background: rgba(36, 91, 254, 0.07);
  color: var(--accent-hover);
  font-size: 11px;
  font-weight: 700;
}

.construction-block-inspector-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) repeat(2, minmax(240px, 1fr));
  gap: 12px;
}

.construction-block-inspector-panel {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(21, 26, 24, 0.08);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.7);
}

.construction-block-inspector-panel h5 {
  margin-bottom: 9px;
  color: var(--text);
  font-size: 12px;
}

.construction-block-phase-list,
.construction-block-resource-list,
.construction-block-consumable-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.construction-block-component-groups {
  display: grid;
  gap: 8px;
  max-height: 300px;
  overflow: auto;
  padding-right: 4px;
}

.construction-block-component-group {
  border: 1px solid rgba(21, 26, 24, 0.08);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.72);
  overflow: hidden;
}

.construction-block-component-group summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  cursor: pointer;
  list-style: none;
}

.construction-block-component-group summary::-webkit-details-marker {
  display: none;
}

.construction-block-component-group summary::before {
  content: "v";
  color: var(--text-muted);
  font-size: 10px;
  transition: transform 0.15s ease;
}

.construction-block-component-group:not([open]) summary::before {
  transform: rotate(-90deg);
}

.construction-block-component-group summary strong {
  min-width: 0;
  flex: 1;
  color: var(--text);
  font-size: 12px;
}

.construction-block-component-group summary span {
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
}

.construction-block-component-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 5px;
  padding: 0 8px 8px;
}

.construction-block-component-summary-list {
  max-height: 300px;
  overflow: auto;
  padding: 0 4px 4px 0;
}

.construction-block-phase-row,
.construction-block-component-row,
.construction-block-resource-row {
  gap: 8px;
  min-width: 0;
  padding: 6px 8px;
  border: 1px solid rgba(21, 26, 24, 0.07);
  border-radius: 10px;
  background: #FFFFFF;
}

.construction-block-phase-row,
.construction-block-resource-row {
  display: flex;
}

.construction-block-phase-row {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.construction-block-component-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 0;
  color: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

button.construction-block-component-row {
  width: 100%;
  font: inherit;
}

.construction-block-component-panel {
  grid-column: 1 / -1;
}

.construction-block-phase-row strong,
.construction-block-component-row strong,
.construction-block-resource-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 12px;
  line-height: 1.15;
}

.construction-block-phase-row span,
.construction-block-component-row span,
.construction-block-component-row small,
.construction-block-resource-row small {
  max-width: 100%;
  min-width: 0;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.2;
  overflow-wrap: anywhere;
  white-space: normal;
}

.construction-block-component-row span {
  justify-self: end;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(36, 91, 254, 0.08);
  color: var(--accent-hover);
  font-size: 10px;
  font-weight: 800;
}

.construction-block-resource-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: start;
  cursor: pointer;
}

.construction-block-resource-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 1px 0 0;
  padding: 0;
  border-radius: 4px;
  box-shadow: none;
  accent-color: var(--accent);
}

.construction-block-resource-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.construction-block-resource-row.is-partial {
  border-color: rgba(217, 119, 6, 0.28);
  background: rgba(255, 251, 235, 0.72);
}

.construction-block-resource-assignment-row,
.construction-block-consumable-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 6px 8px;
  border: 1px solid rgba(21, 26, 24, 0.07);
  border-radius: 10px;
  background: #FFFFFF;
}

.construction-block-consumable-row {
  grid-template-columns: minmax(0, 1fr) 72px 64px auto;
}

.construction-block-resource-assignment-row > div,
.construction-block-consumable-row > div,
.construction-block-resource-assignment-row label,
.construction-block-consumable-row label {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.construction-block-resource-assignment-row strong,
.construction-block-consumable-row strong,
.construction-block-resource-assignment-row span,
.construction-block-consumable-row span {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-block-resource-assignment-row span,
.construction-block-consumable-row span,
.construction-block-resource-assignment-row label span,
.construction-block-consumable-row label span {
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 500;
}

.construction-block-resource-assignment-row input,
.construction-block-consumable-row input,
.construction-block-consumable-picker input {
  min-height: 26px;
  width: 100%;
  padding: 3px 6px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.construction-block-consumable-picker {
  display: grid;
  grid-template-columns: minmax(86px, 1fr) 72px 58px auto;
  gap: 6px;
  align-items: center;
  margin-bottom: 7px;
}

.construction-block-component-row.is-focused {
  border-color: rgba(36, 91, 254, 0.48);
  background: #EAF1FF;
  box-shadow: none;
}

.construction-phase-main {
  min-width: 0;
}

.construction-phase-main strong,
.construction-phase-main span,
.construction-phase-main small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-phase-main strong {
  font-size: 12px;
  line-height: 1.15;
}

.construction-phase-main span,
.construction-phase-main small {
  color: var(--text-muted);
  font-size: 10px;
}

.construction-card-time {
  flex: 1 0 100%;
  display: grid;
  gap: 1px;
  min-width: 0;
  margin-top: 3px;
}

.construction-card-time small {
  display: block;
  overflow: hidden;
  color: var(--text-muted);
  font-size: 8px;
  font-weight: 500;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-time-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-top: 7px;
}

.construction-time-facts div {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 5px 6px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
}

.construction-time-facts span,
.construction-time-facts strong {
  overflow: hidden;
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 500;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.construction-time-facts strong {
  color: var(--text);
  font-size: 10px;
}

.construction-dependency-handle {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(21, 26, 24, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--text);
  cursor: crosshair;
}

.construction-schedule-side-panel {
  display: grid;
  align-content: start;
  gap: 14px;
}

.construction-schedule-side-panel section {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.construction-schedule-side-panel h4 {
  margin: 0 0 10px;
  font-size: 12px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.construction-schedule-warning-list,
.construction-schedule-resource-list,
.construction-schedule-dependency-list {
  display: grid;
  gap: 8px;
}

.construction-schedule-warning,
.construction-schedule-resource,
.construction-schedule-dependency {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  font-size: 11px;
}

.construction-schedule-warning strong,
.construction-schedule-resource strong {
  font-size: 11px;
}

.construction-schedule-warning span,
.construction-schedule-resource span,
.construction-schedule-dependency span {
  color: var(--text-muted);
  line-height: 1.35;
}

.construction-schedule-resource.has-conflict,
.construction-schedule-dependency.has-warning {
  border-color: rgba(217, 119, 6, 0.42);
  background: var(--warn-soft);
}

.construction-schedule-dependency.is-selected {
  border-color: rgba(20, 66, 190, 0.68);
  background: #EAF1FF;
  box-shadow: 0 0 0 3px rgba(36, 91, 254, 0.12);
}

.construction-schedule-dependency {
  grid-template-columns: 1fr;
  align-items: center;
}

.construction-schedule-dependency-title {
  font-weight: 650;
}

.construction-schedule-dependency-controls {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) 72px auto;
  align-items: end;
  gap: 6px;
}

.construction-schedule-dependency-controls label {
  display: grid;
  gap: 3px;
  min-width: 0;
  color: var(--text-muted);
  font-size: 9px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.construction-schedule-dependency-controls select,
.construction-schedule-dependency-controls input {
  width: 100%;
  min-height: 26px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font-size: 11px;
}

.construction-schedule-dependency-controls input {
  padding-inline: 7px;
}

.construction-schedule-dependency .btn {
  min-height: 24px;
  padding: 3px 7px;
  font-size: 11px;
}

.constructor-calendar-shell {
  overflow-x: auto;
  padding-bottom: 6px;
}

.constructor-calendar-board {
  display: grid;
  gap: 10px;
  min-width: max-content;
}

.constructor-calendar-axis,
.constructor-calendar-row {
  display: grid;
  grid-template-columns: minmax(220px, 240px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.constructor-calendar-axis-label {
  display: flex;
  align-items: center;
  min-height: 48px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.constructor-calendar-axis-track,
.constructor-calendar-track {
  display: grid;
  grid-template-columns: repeat(var(--constructor-calendar-days, 1), minmax(110px, 1fr));
  gap: 8px;
}

.constructor-calendar-axis-day {
  display: grid;
  justify-items: center;
  gap: 2px;
  padding: 6px 8px;
  border: 1px solid var(--platform-divider, var(--border));
  border-radius: var(--platform-radius-sm, var(--radius-sm));
  background: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 82%, white 18%);
}

.constructor-calendar-axis-day strong {
  font-size: 13px;
  line-height: 1;
}

.constructor-calendar-axis-day small {
  color: var(--text-muted);
  font-size: 11px;
  text-transform: capitalize;
}

.constructor-calendar-row {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.constructor-calendar-row:first-of-type {
  padding-top: 0;
  border-top: 0;
}

.constructor-calendar-project {
  display: grid;
  gap: 4px;
  padding: 10px 0 0;
}

.constructor-calendar-project strong {
  font-size: 14px;
  line-height: 1.2;
}

.constructor-calendar-project span {
  color: var(--text-muted);
  font-size: 12px;
}

.constructor-calendar-track {
  align-items: start;
  min-height: 88px;
}

.constructor-calendar-bar {
  display: grid;
  gap: 3px;
  min-height: 74px;
  padding: 10px 12px;
  border: 1px solid var(--platform-divider, var(--border));
  border-radius: var(--platform-radius-sm, var(--radius-sm));
  background: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 78%, white 22%);
  color: inherit;
  text-decoration: none;
  box-shadow: none;
}

.constructor-calendar-bar:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow);
  transform: translateY(-1px);
}

.constructor-calendar-bar span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.constructor-calendar-bar strong {
  font-size: 13px;
  line-height: 1.25;
}

.constructor-calendar-bar small,
.constructor-calendar-empty-track {
  color: var(--text-muted);
  font-size: 12px;
}

.constructor-calendar-empty-track {
  display: flex;
  align-items: center;
  min-height: 74px;
  padding: 10px 12px;
  border: 1px dashed var(--platform-divider, var(--border));
  border-radius: var(--platform-radius-sm, var(--radius-sm));
  background: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 84%, white 16%);
}

.constructor-package-sticky-card {
  position: sticky;
  top: 64px;
  z-index: 20;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px;
  margin-bottom: 14px;
  background:
    linear-gradient(135deg, rgba(36, 91, 254, 0.08), rgba(17, 132, 91, 0.04)),
    var(--surface);
  box-shadow: var(--shadow);
}

.constructor-package-sticky-main,
.constructor-package-sticky-side {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.constructor-package-sticky-main {
  min-width: 0;
  flex: 1 1 auto;
}

.constructor-package-sticky-side {
  align-items: flex-end;
  flex: 0 0 auto;
}

.constructor-package-detail-stack {
  display: grid;
  gap: 14px;
}

.constructor-package-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.constructor-provider-priority-list {
  display: grid;
  gap: 10px;
  margin-top: 2px;
}

.constructor-provider-priority-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 90px;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.constructor-provider-priority-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.constructor-provider-priority-toggle span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.constructor-transport-layout {
  display: grid;
  gap: 14px;
}

.constructor-transport-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.constructor-transport-truck-list {
  display: grid;
  gap: 14px;
}

.constructor-transport-stack-list,
.constructor-transport-item-list {
  display: grid;
  gap: 10px;
}

.constructor-transport-stack {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.constructor-transport-stack-head,
.constructor-transport-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.constructor-transport-stack-head {
  align-items: baseline;
  margin-bottom: 6px;
}

.constructor-transport-item {
  flex-wrap: wrap;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  background: rgba(36, 91, 254, 0.05);
  color: var(--text-muted);
  font-size: 13px;
}

.constructor-transport-item-title {
  color: var(--text);
  font-weight: 600;
}

.constructor-safety-warning-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.constructor-safety-warning {
  display: grid;
  gap: 3px;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
  font-size: 12px;
}

.constructor-safety-warning strong {
  color: var(--text);
}

.constructor-safety-warning span {
  color: var(--text-muted);
}

/* ── Reset ──────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  min-height: 100%;
  scrollbar-gutter: stable;
  color: var(--text);
  background: var(--bg);
  font-family: var(--font-ui);
  font-size: var(--type-body-size);
  line-height: var(--type-body-line);
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font-family: var(--font-ui);
}

.type-workspace-title {
  font-size: var(--type-workspace-title-size);
  line-height: var(--type-workspace-title-line);
  font-weight: var(--type-workspace-title-weight);
  letter-spacing: var(--type-title-tracking);
  color: var(--text);
}

.type-page-title {
  font-size: var(--type-page-title-size);
  font-weight: var(--type-page-title-weight);
  letter-spacing: var(--type-title-tracking);
  color: var(--text);
}

.type-section-title {
  font-size: var(--type-section-title-size);
  font-weight: var(--type-section-title-weight);
  letter-spacing: var(--type-title-tracking);
  color: var(--text);
}

.type-card-title {
  font-size: var(--type-card-title-size);
  font-weight: var(--type-card-title-weight);
  color: var(--text);
}

.type-body-small {
  font-size: var(--type-body-small-size);
  color: var(--text-muted);
}

.type-caption {
  font-size: var(--type-caption-size);
  color: var(--text-muted);
}

.type-label {
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  letter-spacing: var(--type-label-tracking);
  text-transform: uppercase;
  color: var(--text-muted);
}

/* ── App shell ──────────────────────────────────────────────────────── */
.app-root {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  transition: background 0.16s ease;
}

.app-root.context-organization-manager {
  --bg: #F3FAF6;
  --accent: #11845B;
  --accent-soft: #ECF8F2;
  --accent-hover: #0B6B49;
}

.app-root.context-employee {
  --bg: #FFFBEB;
  --accent: #D97706;
  --accent-soft: #FFF4D6;
  --accent-hover: #B45309;
}

/* ── Top navbar ─────────────────────────────────────────────────────── */
.navbar {
  background: var(--topbar-bg);
  border-bottom: 1px solid var(--topbar-border);
  color: var(--topbar-fg);
  padding: 0 18px;
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: none;
  font-family: var(--font-ui);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.navbar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  min-width: 0;
}

.workspace-menu {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 100%;
  flex-shrink: 0;
}

.workspace-menu summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  list-style: none;
}

.workspace-menu summary::-webkit-details-marker {
  display: none;
}

.workspace-menu-trigger {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  padding: 0;
  border: 1px solid var(--topbar-soft-border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--topbar-fg);
  cursor: pointer;
}

.workspace-menu-trigger:hover {
  border-color: var(--topbar-accent);
  background: #E3E3E3;
}

.workspace-menu-bars {
  width: 14px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 2px;
}

.workspace-menu-bars span {
  display: block;
  height: 1.5px;
  border-radius: 999px;
  background: var(--topbar-fg);
}

.workspace-menu-panel {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  display: grid;
  gap: 6px;
  width: min(280px, calc(100vw - 24px));
  max-height: min(70vh, 620px);
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
  box-shadow: 0 14px 32px rgba(17, 24, 22, 0.13);
  font-family: var(--font-ui);
  z-index: 250;
}

.workspace-menu-section {
  display: grid;
  gap: 6px;
}

.workspace-menu-section + .workspace-menu-section {
  margin-top: 0;
  padding-top: 6px;
  border-top: 1px solid var(--border);
}

.workspace-menu-user {
  margin: 0;
  padding: 8px 9px;
  border-bottom: 1px solid var(--border);
  color: var(--brand-charcoal);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-menu-heading {
  padding: 4px 11px 7px;
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: var(--type-label-tracking);
}

.workspace-context-item small {
  color: var(--accent-hover);
}

.workspace-menu-item {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  cursor: pointer;
  display: flex;
  align-items: center;
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 300;
  min-height: 34px;
  padding: 7px 9px;
  text-align: left;
}

.workspace-menu-item:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
}

.workspace-menu-item.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  color: var(--brand-charcoal);
  box-shadow: none;
}

.workspace-menu-item span {
  font-size: var(--type-control-size);
  font-weight: 300;
  letter-spacing: var(--type-title-tracking);
}

.workspace-menu-item.active span {
  color: var(--brand-charcoal);
}

.workspace-menu-item small {
  display: none;
}

.workspace-menu-item-muted span {
  color: var(--text-muted);
}

.workspace-context-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0;
}

.workspace-context-chip {
  min-height: 28px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: #FFFFFF;
  color: var(--text);
  cursor: pointer;
  font-size: var(--type-caption-size);
  font-weight: var(--type-control-weight);
  line-height: 1.1;
  padding: 5px 7px;
  text-align: left;
}

.workspace-context-chip:hover,
.workspace-context-chip.active {
  border-color: var(--selected-border);
  background: var(--surface);
  color: var(--brand-charcoal);
  box-shadow: var(--selected-ring);
}

.navbar-logo {
  width: var(--topbar-logo-w);
  height: var(--topbar-logo-h);
  background: transparent;
  border: 0;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 var(--topbar-logo-w);
  overflow: visible;
}

.navbar-logo-centered {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.brand-logo-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.navbar-logo .brand-logo-img {
  filter: none;
  opacity: 1;
}

.navbar-title {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  font-size: var(--type-topbar-title-size);
  font-weight: var(--type-topbar-title-weight);
  color: var(--topbar-fg);
  letter-spacing: var(--type-title-tracking);
  line-height: 1;
}

.navbar-title-link {
  color: inherit;
  text-decoration: none;
  min-width: 0;
  max-width: min(34vw, 420px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.navbar-right {
  display: flex;
  align-items: center;
  height: 100%;
  gap: 12px;
}

.user-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 9px;
  border-radius: var(--radius-sm);
  background: transparent;
  border: 0;
  color: var(--topbar-fg);
}

.user-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--topbar-fg);
  color: var(--topbar-bg);
  font-size: 10px;
  font-weight: var(--type-button-strong-weight);
  font-family: var(--font-ui);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.user-name {
  font-size: var(--type-control-size);
  font-weight: var(--type-control-weight);
  color: var(--topbar-fg);
}

.context-badge {
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--border));
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-hover);
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  line-height: 1;
  padding: 4px 7px;
  white-space: nowrap;
}

.navbar .lang-btn {
  min-height: 28px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--topbar-muted);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: var(--type-control-weight);
  line-height: 1;
  align-items: center;
  justify-content: center;
  letter-spacing: var(--type-title-tracking);
}

.navbar .lang-btn:hover {
  background: transparent;
  color: var(--topbar-fg);
}

.navbar #logoutBtn {
  min-height: 28px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--topbar-muted);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: var(--type-button-strong-weight);
  line-height: 1;
  align-items: center;
  justify-content: center;
  padding: 0 2px;
}

.navbar #logoutBtn:hover {
  border-color: transparent;
  background: transparent;
  color: var(--topbar-fg);
}

/* ── Main layout ─────────────────────────────────────────────────────── */
.workspace {
  flex: 1;
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
  min-height: calc(100vh - var(--topbar-h));
  background: var(--workspace-main-bg);
}

.workspace-owner {
  grid-template-columns: 320px minmax(0, 1fr);
}

.workspace-constructor-sequence {
  grid-template-columns: minmax(0, 1fr);
}

.workspace-sidebarless {
  grid-template-columns: minmax(0, 1fr);
}

/* ── Sidebar ─────────────────────────────────────────────────────────── */
.sidebar {
  background: var(--workspace-sidebar-bg);
  border-right: 1px solid var(--workspace-sidebar-border);
  color: var(--workspace-sidebar-text);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overflow-anchor: none;
  position: sticky;
  top: var(--topbar-h);
  height: calc(100vh - var(--topbar-h));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sidebar-scroll {
  flex: 1;
  overflow-y: auto;
  padding-bottom: 16px;
}

.sidebar-section {
  padding: 16px 12px 10px;
}

.sidebar-label {
  font-family: var(--font-ui);
  font-size: var(--type-label-size);
  font-weight: var(--type-control-weight);
  text-transform: uppercase;
  letter-spacing: var(--type-label-tracking);
  color: var(--workspace-sidebar-muted);
  padding: 0 4px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sidebar-new-btn {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  color: var(--workspace-sidebar-muted);
  background: none;
  border: 1px solid transparent;
  cursor: pointer;
  padding: 0;
  border-radius: var(--radius-sm);
  transition: color 0.15s, background 0.15s, border-color 0.15s;
}

.sidebar-new-btn:hover {
  color: var(--brand-charcoal);
  background: var(--workspace-card-button-bg);
  border-color: var(--selected-border);
  box-shadow: var(--selected-ring);
}

.project-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.sidebar-home-list {
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--workspace-sidebar-border);
}

.sidebar-tools {
  padding: 0 4px 10px;
}

.sidebar-sort {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-family: var(--font-ui);
  font-size: var(--type-label-size);
  font-weight: var(--type-control-weight);
  color: var(--workspace-sidebar-muted);
  text-transform: uppercase;
  letter-spacing: 0;
}

.sidebar-sort-controls {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 6px;
}

.sidebar-sort select {
  min-width: 104px;
  border: 1px solid var(--workspace-sidebar-border);
  border-radius: var(--radius);
  background: var(--workspace-sidebar-control-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: var(--type-control-weight);
  padding: 5px 8px;
}

.sidebar-sort-direction {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  padding: 0;
  border-color: var(--workspace-sidebar-border);
  background: var(--workspace-sidebar-control-bg);
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 400;
  line-height: 0;
}

.sidebar-sort-direction-icon {
  width: 18px;
  height: 18px;
  display: block;
  fill: currentColor;
  filter: var(--platform-icon-filter);
  transform-origin: center;
}

.sidebar-sort-direction.is-ascending .sidebar-sort-direction-icon {
  transform: scaleY(-1);
}

.sidebar-sort-direction:hover {
  border-color: var(--selected-border);
  background: var(--accent-soft);
  color: var(--accent-hover);
}

.sidebar-project-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sidebar-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sidebar-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0;
}

.sidebar-section-shared {
  margin-top: 8px;
  border-top: 1px solid var(--workspace-sidebar-border);
  padding-top: 16px;
}

.project-item {
  width: 100%;
  text-align: left;
  background: none;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  padding: 9px 10px;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, box-shadow 0.12s, color 0.12s;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.project-item:hover {
  background: var(--workspace-sidebar-control-bg);
  border-color: var(--selected-border);
  box-shadow: none;
}

.project-item.active {
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  border-color: var(--accent);
  color: var(--brand-charcoal);
  box-shadow: none;
}

.project-item.active:hover {
  background: color-mix(in srgb, var(--workspace-card-button-bg) 82%, var(--accent) 18%);
  border-color: var(--accent);
}

.project-item:hover .project-item-name {
  color: var(--brand-charcoal);
}

.project-item-name {
  font-size: var(--type-control-size);
  font-weight: var(--type-control-weight);
  color: var(--workspace-sidebar-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.project-item.active .project-item-name {
  color: var(--brand-charcoal);
}

.project-item:hover .project-item-meta,
.project-item:hover .project-item-meta .badge,
.project-item.active .project-item-meta,
.project-item.active .project-item-meta .badge {
  color: var(--text-muted);
}

.project-item-meta {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  color: var(--workspace-sidebar-muted);
}

.project-item-meta .badge {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--workspace-sidebar-muted);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.2;
}

.workspace-designer .project-list {
  gap: 6px;
}

.workspace-designer .project-item {
  min-height: 34px;
  padding: 6px 9px;
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  box-shadow: none;
}

.workspace-designer .project-item:hover {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-button-bg-hover);
  color: var(--text);
  box-shadow: none;
}

.workspace-designer .project-item.active,
.workspace-designer .project-item.active:hover {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-selected-bg);
  color: var(--text);
  box-shadow: none;
}

.workspace-designer .project-item-name {
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: 400;
  letter-spacing: 0;
}

.workspace-designer .project-item:hover .project-item-name,
.workspace-designer .project-item.active .project-item-name {
  color: var(--text);
}

.workspace-designer .project-item-meta,
.workspace-designer .project-item-meta .badge,
.workspace-designer .project-item:hover .project-item-meta,
.workspace-designer .project-item:hover .project-item-meta .badge,
.workspace-designer .project-item.active .project-item-meta,
.workspace-designer .project-item.active .project-item-meta .badge {
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0;
}

.workspace-designer .sidebar-new-btn,
.workspace-designer .sidebar-sort select,
.workspace-designer .sidebar-sort-direction {
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
  box-shadow: none;
}

.workspace-designer .sidebar-new-btn:hover,
.workspace-designer .sidebar-sort select:hover,
.workspace-designer .sidebar-sort-direction:hover {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-button-bg-hover);
  color: var(--text);
  box-shadow: none;
}

.empty-note {
  font-size: 12px;
  color: var(--workspace-sidebar-muted);
  padding: 6px 4px;
  line-height: 1.5;
}

/* ── Main content area ───────────────────────────────────────────────── */
.main-content {
  padding: 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 1180px;
  background: var(--workspace-main-bg);
}

.main-content-wide {
  max-width: none;
  padding-inline: 28px;
}

.designer-home-main {
  padding-top: 16px;
}

.constructor-sequence-main-content {
  gap: 0;
  min-height: calc(100vh - var(--topbar-h));
  padding: 0;
}

.main-content.design-sync-page-dirty {
  background: var(--workspace-main-bg);
}

.main-content.design-sync-page-pending {
  background: var(--workspace-main-bg);
}

.main-content.design-sync-page-processing {
  background: var(--workspace-main-bg);
}

.design-sync-banner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
  box-shadow: none;
  text-align: center;
}

.design-sync-banner strong {
  display: block;
  color: var(--text);
  font-size: var(--type-control-size);
  font-weight: var(--type-control-weight);
  margin: 0;
}

.design-sync-banner p {
  margin: 0;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.45;
}

.design-sync-banner-dirty {
  border-color: var(--brand-orange);
  background: var(--brand-orange);
  color: #FFFFFF;
}

.design-sync-banner-pending {
  border-color: var(--selected-border);
  background: var(--workspace-card-bg);
}

.design-sync-banner-processing {
  border-color: var(--selected-border);
  background: var(--workspace-card-bg);
}

.design-sync-banner-dirty strong,
.design-sync-banner-dirty p {
  color: #FFFFFF;
}

.design-sync-banner-dirty .project-action-button {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.46);
  color: #FFFFFF;
}

.design-sync-banner-dirty .project-action-button:hover {
  background: rgba(255, 255, 255, 0.26);
  border-color: #FFFFFF;
  box-shadow: none;
}

.discipline-send-banner {
  border-color: #E5B867;
  background: #FFF7E6;
}

.discipline-send-banner strong {
  color: #8A5A0A;
}

.discipline-send-banner p {
  color: #6F5A30;
}

.professional-production-banner {
  width: 100%;
  margin: 0 0 8px;
}

.professional-production-grid {
  margin-top: 8px;
}

.eett-assigned-editor-notice {
  display: grid;
  gap: 3px;
  margin: 0 0 10px;
}

.eett-assigned-editor-notice strong {
  color: inherit;
}

.eett-assigned-editor-notice span {
  color: inherit;
  line-height: 1.4;
}

.job-progress-card {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 34px;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
  box-shadow: none;
}

.job-progress-card strong {
  flex: 0 0 auto;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 400;
}

.job-progress-stage {
  flex: 0 1 220px;
  min-width: 80px;
  overflow: hidden;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-progress-percent {
  flex: 0 0 auto;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 400;
}

.job-progress-dismiss {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 400;
  padding: 2px 4px;
}

.job-progress-dismiss:hover {
  color: var(--text);
}

.job-progress-track {
  flex: 1 1 220px;
  min-width: 120px;
  height: 8px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--designer-card-button-bg-hover);
  border: 1px solid var(--designer-card-button-border);
}

.job-progress-fill {
  height: 100%;
  border-radius: 3px;
  background: var(--brand-orange);
  transition: width 900ms linear;
}

.job-progress-card-failed,
.job-progress-card-cancelled,
.job-progress-card-canceled {
  border-color: color-mix(in srgb, var(--danger) 34%, var(--designer-card-button-border));
  background: var(--designer-card-button-bg);
}

.job-progress-card-failed strong,
.job-progress-card-cancelled strong,
.job-progress-card-canceled strong,
.job-progress-card-failed .job-progress-percent,
.job-progress-card-cancelled .job-progress-percent,
.job-progress-card-canceled .job-progress-percent {
  color: var(--danger);
}

.job-progress-card-failed .job-progress-fill,
.job-progress-card-cancelled .job-progress-fill,
.job-progress-card-canceled .job-progress-fill {
  background: var(--danger);
}

.workspace-admin,
.workspace-admin .admin-main-content,
.workspace-admin .admin-sidebar {
  --admin-card-bg: var(--designer-card-bg);
  --admin-card-border: var(--designer-card-border);
  --admin-button-bg: var(--designer-card-button-bg);
  --admin-button-bg-hover: var(--designer-card-button-bg-hover);
  --admin-button-border: var(--designer-card-button-border);
  --admin-control-bg: var(--designer-card-control-bg);
  --admin-control-bg-disabled: var(--designer-card-control-bg-disabled);
  --admin-selected-bg: var(--designer-card-selected-bg);
  --admin-selected-border: var(--designer-card-selected-border);
  --admin-divider: var(--designer-card-divider);
  --admin-text: var(--text);
  --admin-muted: var(--text-muted);
}

.admin-main-content {
  background: var(--workspace-main-bg);
}

.admin-sidebar {
  background: var(--workspace-sidebar-bg);
}

.admin-sidebar-nav {
  gap: 6px;
}

.admin-nav-item {
  padding: 9px 10px;
  border: 1px solid transparent;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.admin-nav-item:hover {
  border-color: var(--border);
  background: var(--surface);
}

.admin-nav-item.active {
  border-color: #B8C7FF;
  background: var(--surface);
}

.admin-sidebar-link {
  text-decoration: none;
  color: inherit;
}

.admin-shell {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.admin-hero {
  align-items: flex-start;
  padding-bottom: 14px;
}

.admin-main-content .workspace-panel-head p,
.admin-main-content .workspace-subtitle {
  display: none;
}

.admin-source-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 520px;
}

.summary-chip-muted {
  background: var(--workspace-card-button-bg);
  color: var(--text-muted);
}

.summary-chip-attention {
  background: var(--workspace-card-button-bg);
  color: var(--brand-charcoal);
  border-color: var(--border);
}

.summary-chip-warning {
  background: var(--workspace-card-button-bg);
  color: var(--brand-charcoal);
  border-color: var(--border);
}

.badge-high {
  background: var(--danger-soft);
  color: var(--danger);
}

.badge-medium {
  background: var(--warn-soft);
  color: var(--warn);
}

.badge-low {
  background: var(--green-soft);
  color: var(--green);
}

.admin-filter-bar {
  padding: 13px 14px;
}

.admin-filter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 240px));
  gap: 10px;
}

.admin-filter-grid-producers {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.admin-filter-grid-components {
  grid-template-columns: repeat(3, minmax(0, 240px));
}

.admin-network-filter-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.admin-shell > .admin-kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.admin-kpi-card {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.admin-body-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(280px, 0.9fr);
  gap: 16px;
  align-items: start;
}

.admin-section-stack,
.admin-rail-stack {
  display: grid;
  gap: 12px;
}

.admin-section-stack {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-rail-stack {
  grid-template-columns: 1fr;
}

.admin-section-stack-wide {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-component-dashboard-panel {
  grid-column: 1 / -1;
}

.admin-components-board {
  grid-column: 1 / -1;
}

.admin-asset-control-center {
  display: grid;
  gap: 16px;
  width: 100%;
  max-width: 1600px;
  margin-bottom: 34px;
  color: var(--brand-charcoal);
}

.admin-asset-control-center.is-loading,
.admin-asset-control-empty {
  min-height: 180px;
  place-items: center;
  border: 1px solid rgba(201, 226, 212, 0.24);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.05);
}

.admin-asset-control-loading,
.admin-asset-control-empty {
  display: grid;
  gap: 10px;
  justify-items: center;
  color: #f5fbf7;
}

.admin-asset-control-loading span {
  width: 28px;
  height: 28px;
  border: 3px solid rgba(255, 255, 255, 0.24);
  border-top-color: #d9f4e4;
  border-radius: 999px;
  animation: admin-asset-library-spin 0.9s linear infinite;
}

@keyframes admin-asset-library-spin { to { transform: rotate(360deg); } }

.admin-asset-control-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 26px;
  border: 1px solid rgba(202, 235, 216, 0.23);
  border-radius: 18px;
  background:
    radial-gradient(circle at 90% 10%, rgba(136, 204, 164, 0.18), transparent 38%),
    linear-gradient(135deg, #102d21, #183c2c);
  box-shadow: 0 18px 42px rgba(4, 20, 12, 0.2);
  color: #f3fbf6;
}

.admin-asset-control-header h2 {
  margin: 5px 0 7px;
  color: inherit;
  font-size: clamp(23px, 2.4vw, 34px);
  line-height: 1.08;
}

.admin-asset-control-header p {
  max-width: 780px;
  margin: 0;
  color: rgba(243, 251, 246, 0.7);
  font-size: 13px;
  line-height: 1.55;
}

.admin-asset-control-kicker {
  color: #a9d8bb;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.admin-asset-control-statuses {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 7px;
  max-width: 420px;
}

.admin-asset-status {
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
  color: rgba(243, 251, 246, 0.78);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.admin-asset-status.is-ok {
  border-color: rgba(116, 224, 160, 0.3);
  background: rgba(63, 166, 106, 0.17);
  color: #caf0d9;
}

.admin-asset-status.is-warn,
.admin-asset-status.is-error {
  border-color: rgba(255, 192, 116, 0.34);
  background: rgba(173, 92, 36, 0.18);
  color: #ffdfba;
}

.admin-asset-control-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(270px, 0.65fr);
  gap: 14px;
}

.admin-asset-config-panel,
.admin-asset-inventory-panel,
.admin-asset-browser-panel,
.admin-asset-migration-panel {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 10px 28px rgba(12, 28, 20, 0.07);
}

.admin-asset-config-panel,
.admin-asset-inventory-panel {
  padding: 19px;
}

.admin-asset-panel-heading,
.admin-asset-browser-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-asset-panel-heading > div > span {
  display: block;
  margin-bottom: 3px;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-asset-panel-heading h3 {
  margin: 0;
  color: var(--brand-charcoal);
  font-size: 18px;
}

.admin-asset-config-panel > .field {
  margin-top: 15px;
}

.admin-asset-config-panel .field small {
  display: block;
  margin-top: 5px;
  color: var(--text-muted);
  font-size: 10px;
  line-height: 1.4;
}

.admin-asset-config-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 11px;
}

.admin-asset-structure-details {
  margin-top: 13px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-subtle, #f7f8f6);
}

.admin-asset-structure-details summary {
  cursor: pointer;
  color: var(--brand-charcoal);
  font-size: 12px;
  font-weight: 800;
}

.admin-asset-form-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 14px;
}

.admin-asset-checkbox {
  margin-right: auto;
  color: var(--text-muted);
  font-size: 11px;
}

.admin-asset-checkbox input {
  width: auto;
  margin-right: 4px;
}

.admin-asset-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 16px 0 12px;
}

.admin-asset-kpis > div {
  display: grid;
  gap: 2px;
  padding: 11px 9px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-subtle, #f7f8f6);
}

.admin-asset-kpis strong {
  color: var(--brand-charcoal);
  font-size: 16px;
}

.admin-asset-kpis span,
.admin-asset-extension-list small {
  color: var(--text-muted);
  font-size: 9px;
}

.admin-asset-extension-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-asset-extension-list > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border-radius: 6px;
  background: #edf4ef;
  color: #315b43;
  font-size: 10px;
}

.admin-asset-extension-list small { color: #688675; }

.admin-asset-warning,
.admin-asset-browser-errors {
  color: #8a4b1d;
  font-size: 10px;
}

.admin-asset-uri-card {
  display: grid;
  gap: 5px;
  margin-top: 16px;
  padding: 13px;
  border-radius: 10px;
  background: #102d21;
  color: #eaf8ef;
}

.admin-asset-uri-card span,
.admin-asset-uri-card small {
  color: rgba(234, 248, 239, 0.64);
  font-size: 9px;
}

.admin-asset-uri-card code {
  overflow-wrap: anywhere;
  color: #c7efd6;
  font-size: 12px;
}

.admin-asset-browser-panel {
  overflow: hidden;
}

.admin-asset-browser-toolbar {
  padding: 13px 15px;
  border-bottom: 1px solid var(--border);
}

.admin-asset-browser-toolbar > div {
  display: flex;
  gap: 7px;
}

.admin-asset-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.admin-asset-breadcrumb button {
  appearance: none;
  padding: 3px 5px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #315b43;
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
}

.admin-asset-breadcrumb button:hover { background: #edf4ef; }
.admin-asset-breadcrumb span { color: var(--text-muted); font-size: 10px; }

.admin-asset-browser-head,
.admin-asset-browser-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(120px, 0.34fr) 110px 100px;
  align-items: center;
  gap: 10px;
}

.admin-asset-browser-head {
  padding: 8px 15px;
  background: var(--surface-subtle, #f7f8f6);
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admin-asset-browser-row {
  min-height: 44px;
  padding: 7px 15px;
  border: 0;
  border-top: 1px solid var(--border);
  background: var(--surface);
  color: var(--brand-charcoal);
  text-align: left;
}

.admin-asset-browser-list > :first-child { border-top: 0; }

.admin-asset-browser-row:hover { background: #f7faf8; }

.admin-asset-browser-row > a,
.admin-asset-browser-row > button,
.admin-asset-browser-row.is-parent > span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #234b36;
  cursor: pointer;
  font-size: 11px;
  font-weight: 750;
  text-decoration: none;
}

.admin-asset-browser-row > a span,
.admin-asset-browser-row > button span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-asset-browser-row > small {
  overflow: hidden;
  color: var(--text-muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-asset-browser-actions {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
}

.admin-asset-browser-actions button {
  width: 27px;
  height: 27px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: #315b43;
  cursor: pointer;
}

.admin-asset-browser-actions button:hover { border-color: #315b43; }
.admin-asset-browser-empty { padding: 28px; color: var(--text-muted); font-size: 12px; text-align: center; }
.admin-asset-browser-errors { padding: 8px 15px; border-top: 1px solid #eed6c5; background: #fff7f1; }
.admin-asset-browser-errors p { margin: 3px 0; }

.admin-asset-migration-panel {
  overflow: hidden;
}

.admin-asset-migration-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 17px;
  cursor: pointer;
  list-style: none;
}

.admin-asset-migration-panel > summary::-webkit-details-marker { display: none; }
.admin-asset-migration-panel > summary > span:first-child { display: grid; gap: 3px; }
.admin-asset-migration-panel > summary b { color: var(--brand-charcoal); font-size: 13px; }
.admin-asset-migration-panel > summary small { color: var(--text-muted); font-size: 10px; }

.admin-asset-migration-panel form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 16px 17px;
  border-top: 1px solid var(--border);
  background: var(--surface-subtle, #f7f8f6);
}

.admin-asset-migration-panel form .admin-asset-form-actions { grid-column: 1 / -1; margin-top: 2px; }

.admin-asset-migration-plan {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 0 17px 15px;
  background: var(--surface-subtle, #f7f8f6);
}

.admin-asset-migration-plan span {
  padding: 7px 9px;
  border: 1px solid #cfe0d5;
  border-radius: 7px;
  background: #edf4ef;
  color: #315b43;
  font-size: 10px;
}

.admin-asset-migration-plan span.has-warning { border-color: #ebc69f; background: #fff5e9; color: #84491e; }
.admin-asset-migration-plan b { margin-right: 4px; }
.admin-asset-last-migration { margin: 0; padding: 10px 17px; border-top: 1px solid var(--border); color: var(--text-muted); font-size: 10px; }

@media (max-width: 1080px) {
  .admin-asset-control-overview { grid-template-columns: 1fr; }
  .admin-asset-control-header { align-items: start; flex-direction: column; }
  .admin-asset-control-statuses { justify-content: start; }
}

@media (max-width: 760px) {
  .admin-asset-config-grid,
  .admin-asset-migration-panel form { grid-template-columns: 1fr; }
  .admin-asset-browser-head { display: none; }
  .admin-asset-browser-row { grid-template-columns: minmax(0, 1fr) auto; gap: 5px; }
  .admin-asset-browser-row > small { display: none; }
  .admin-asset-browser-toolbar { align-items: flex-start; flex-direction: column; }
}

.admin-asset-library {
  display: grid;
  gap: 24px;
  width: 100%;
  max-width: 1600px;
}

.admin-asset-library-intro {
  max-width: 760px;
}

.admin-asset-library-intro > span {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-transform: uppercase;
}

.admin-asset-library-page .admin-hero .workspace-title,
.admin-asset-library-intro h2 {
  color: #f7f7f3;
}

.admin-asset-library-intro > span {
  color: rgba(247, 247, 243, 0.58);
}

.admin-asset-library-intro h2 {
  margin: 7px 0 8px;
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.1;
}

.admin-asset-library-intro p {
  margin: 0;
  color: rgba(247, 247, 243, 0.72);
  font-size: 14px;
  line-height: 1.55;
}

.admin-asset-library-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.admin-asset-library-card {
  min-height: 214px;
  padding: 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: inherit;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  text-decoration: none;
}

.admin-asset-library-card h3 {
  margin: 0 0 8px;
  color: var(--brand-charcoal);
  font-size: 20px;
  line-height: 1.15;
}

.admin-asset-library-card p {
  margin: 0 0 24px;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.5;
}

.admin-asset-library-card-action {
  margin-top: auto;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
}

.admin-asset-library-card-actions {
  display: grid;
  gap: 6px;
  margin-top: auto;
}

.admin-asset-library-editor-link {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-subtle, var(--surface));
  color: var(--brand-charcoal);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
}

.admin-asset-library-editor-link b {
  flex: 0 0 auto;
  font-size: 13px;
}

.admin-asset-library-editor-link:hover,
.admin-asset-library-editor-link:focus-visible {
  border-color: var(--brand-charcoal);
  background: var(--surface);
  transform: translateX(2px);
  outline: none;
}

.admin-asset-library-card.has-actions {
  border-color: var(--brand-charcoal);
}

.admin-asset-library-card.is-active {
  border-color: var(--brand-charcoal);
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.admin-asset-library-card.is-active .admin-asset-library-card-action {
  color: var(--brand-charcoal);
}

.admin-asset-library-card.is-active:hover {
  border-color: var(--brand-charcoal);
  box-shadow: 0 12px 28px rgba(20, 26, 36, 0.09);
  transform: translateY(-2px);
}

.admin-asset-library-card.is-active:focus-visible {
  outline: 3px solid rgba(56, 103, 214, 0.24);
  outline-offset: 3px;
}

@media (max-width: 980px) {
  .admin-asset-library-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .admin-asset-library-grid {
    grid-template-columns: 1fr;
  }

  .admin-asset-library-card {
    min-height: 190px;
  }
}

.admin-operational-profile-panel {
  grid-column: 1 / -1;
}

.admin-thermal-component-panel {
  grid-column: 1 / -1;
}

.admin-thermal-component-list {
  display: grid;
  gap: 7px;
  margin-bottom: 12px;
}

.admin-thermal-component-row {
  display: grid;
  grid-template-columns:
    minmax(92px, 0.7fr)
    minmax(120px, 0.85fr)
    minmax(110px, 0.8fr)
    minmax(150px, 1.2fr)
    minmax(130px, 1fr)
    minmax(90px, 0.6fr)
    minmax(90px, 0.6fr)
    minmax(180px, 1.5fr)
    minmax(180px, 1.5fr)
    auto
    32px;
  gap: 7px;
  align-items: end;
  padding: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.admin-thermal-component-row label {
  display: grid;
  gap: 3px;
  min-width: 0;
  color: var(--text-muted);
  font-size: 10px;
}

.admin-thermal-component-row input,
.admin-thermal-component-row select {
  width: 100%;
  min-width: 0;
}

.admin-thermal-component-active {
  display: flex !important;
  align-items: center;
  align-self: center;
  gap: 5px !important;
  padding-top: 14px;
}

.admin-thermal-component-active input {
  width: auto;
}

.admin-thermal-component-remove {
  width: 32px;
  height: 32px;
  padding: 0;
  align-self: end;
}

.admin-operational-profile-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.85fr) minmax(420px, 1.15fr);
  gap: 12px;
  align-items: start;
}

.admin-operational-profile-form {
  display: grid;
  gap: 10px;
}

@media (max-width: 1500px) {
  .admin-thermal-component-row {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
  }

  .admin-thermal-component-active,
  .admin-thermal-component-remove {
    align-self: end;
  }
}

.admin-form-section {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.admin-form-section h3 {
  margin: 0;
  font-size: 13px;
}

.admin-form-section label {
  display: grid;
  gap: 4px;
  font-size: 12px;
  color: var(--text-muted);
}

.admin-form-section input,
.admin-form-section select,
.admin-form-section textarea {
  width: 100%;
}

.admin-operational-actions,
.admin-operational-profile-toolbar,
.admin-operational-chip-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.admin-operational-profile-toolbar {
  justify-content: space-between;
  margin-bottom: 8px;
}

.admin-operational-profile-list {
  display: grid;
  gap: 2px;
  max-height: 520px;
  overflow: auto;
  padding-right: 4px;
}

.admin-operational-profile-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.admin-operational-profile-row:hover {
  background: var(--surface-muted);
}

.admin-operational-profile-row.is-selected {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.admin-operational-profile-row strong,
.admin-operational-profile-row small {
  display: block;
  overflow-wrap: anywhere;
}

.admin-operational-profile-row small {
  color: var(--text-muted);
  font-size: 11px;
}

.admin-operational-chip {
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
  background: var(--surface-muted);
  color: var(--text-muted);
}

.admin-operational-chip.complete {
  background: var(--green-soft);
  color: var(--green);
}

.admin-operational-chip.missing {
  background: var(--warn-soft);
  color: var(--warn);
}

.admin-overview-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-overview-column {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
}

.admin-overview-board .admin-panel-split {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.admin-pipeline-graph-panel {
  grid-column: 1 / -1;
}

.admin-log-board {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
}

.admin-panel-span-2 {
  grid-column: 1 / -1;
}

.admin-bar-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.admin-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(120px, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.admin-bar-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.admin-bar-copy strong,
.admin-table-primary strong,
.admin-source-row strong,
.admin-link-row strong {
  font-size: 13px;
  color: var(--text);
  overflow-wrap: anywhere;
}

.admin-bar-copy span,
.admin-table-primary span,
.admin-source-row span,
.admin-link-row span {
  font-size: 12px;
  color: var(--text-muted);
  overflow-wrap: anywhere;
}

.admin-bar-track {
  height: 7px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
}

.admin-bar-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.admin-bar-value {
  font-size: 13px;
  font-weight: 650;
  color: var(--text);
}

.admin-rate-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-rate-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

.admin-rate-head,
.admin-alert-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.admin-rate-head {
  align-items: flex-start;
  flex-direction: column;
}

.admin-rate-head strong {
  overflow-wrap: anywhere;
}

.admin-rate-status,
.admin-rate-value {
  display: block;
  font-size: 12px;
  font-weight: 650;
  color: var(--text-muted);
}

.admin-rate-value {
  color: var(--text);
}

.admin-rate-metrics,
.admin-panel-split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}

.admin-rate-card .admin-rate-metrics {
  grid-template-columns: 1fr;
}

.admin-pipeline-flow {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.admin-pipeline-system-head,
.admin-pipeline-inspector {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
}

.admin-pipeline-system-head strong {
  display: block;
  margin-top: 3px;
  font-size: 24px;
  line-height: 1.05;
  color: var(--text);
}

.admin-pipeline-system-metrics,
.admin-pipeline-inspector-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px 16px;
  font-size: 12px;
  color: var(--text-muted);
}

.admin-pipeline-system-metrics span,
.admin-pipeline-inspector-metrics span {
  white-space: nowrap;
}

.admin-pipeline-system-metrics strong,
.admin-pipeline-inspector-metrics strong {
  color: var(--text);
  font-size: 14px;
}

.admin-pipeline-system-map {
  position: relative;
  min-width: 0;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(248,250,252,0.95));
}

.admin-pipeline-map-inner {
  position: relative;
  min-width: 880px;
  height: 300px;
}

.admin-pipeline-map-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.admin-pipeline-flow-segments {
  filter: drop-shadow(0 10px 14px rgba(15, 23, 42, 0.08));
}

.admin-pipeline-blob-bridge-base,
.admin-pipeline-blob-bridge {
  stroke: none;
}

.admin-pipeline-blob-bridge-base {
  fill: rgba(148, 163, 184, 0.12);
}

.admin-pipeline-blob-bridge {
  fill: rgba(15, 118, 110, calc(0.16 + 0.5 * var(--stage-intensity)));
}

.admin-pipeline-blob-bridge.idle {
  fill: rgba(148, 163, 184, 0.16);
}

.admin-pipeline-node {
  position: absolute;
  left: var(--node-x);
  top: var(--node-y);
  width: var(--node-size);
  height: var(--node-size);
  transform: translate(-50%, -50%);
  border: 1px solid color-mix(in srgb, var(--accent) calc(38% * var(--stage-intensity)), var(--border));
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--text);
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 0;
  box-shadow: 0 10px 26px rgba(15, 23, 42, calc(0.06 + 0.08 * var(--stage-intensity)));
  cursor: pointer;
  z-index: 2;
}

.admin-pipeline-node:hover,
.admin-pipeline-node:focus-visible,
.admin-pipeline-node.selected {
  border-color: var(--accent);
  box-shadow: 0 0 0 4px rgba(15, 118, 110, 0.12), 0 14px 30px rgba(15, 23, 42, 0.12);
  outline: none;
}

.admin-pipeline-node.approval {
  border-color: rgba(22, 163, 74, 0.58);
}

.admin-pipeline-node.idle:not(.selected) {
  color: var(--text-muted);
  border-color: var(--border);
  box-shadow: none;
}

.admin-pipeline-node-index {
  display: block;
  font-size: 10px;
  font-weight: 750;
  color: var(--text-muted);
}

.admin-pipeline-node strong {
  display: block;
  font-size: 17px;
  line-height: 1;
}

.admin-pipeline-node-label {
  position: absolute;
  left: var(--node-x);
  top: calc(var(--node-y) + (var(--node-size) / 2) + 13px);
  width: 96px;
  transform: translateX(-50%);
  z-index: 1;
  font-size: 11px;
  line-height: 1.25;
  font-weight: 650;
  text-align: center;
  color: var(--text-muted);
}

.admin-pipeline-node-label.selected {
  color: var(--text);
}

.admin-pipeline-inspector {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.admin-pipeline-inspector strong {
  display: block;
  margin-top: 2px;
  font-size: 16px;
  color: var(--text);
}

.admin-pipeline-inspector p {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--text-muted);
}

.admin-rate-metrics div,
.admin-mini-stat {
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.admin-rate-metrics span,
.admin-mini-stat span {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--text-muted);
}

.admin-rate-metrics strong,
.admin-mini-stat strong {
  display: block;
  margin-top: 6px;
  font-size: 21px;
  line-height: 1.05;
  letter-spacing: 0;
}

.admin-subhead {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--text-muted);
}

.admin-table,
.admin-alert-list,
.admin-link-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.admin-source-list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(190px, 1fr);
  grid-template-rows: repeat(2, minmax(44px, auto));
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.admin-table-row,
.admin-alert-row,
.admin-source-row,
.admin-link-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  min-width: 0;
}

.admin-table-row-stack {
  align-items: stretch;
  flex-direction: column;
}

.admin-material-row {
  width: 100%;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.admin-material-row.active {
  border-color: var(--selected-border);
  background: var(--surface);
  color: var(--brand-charcoal);
  box-shadow: var(--selected-ring);
}

.admin-table-compact {
  gap: 6px;
}

.admin-demand-row {
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
}

.admin-demand-row > strong,
.admin-demand-link,
.admin-component-succinct-row > strong,
.admin-breach-row > strong {
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  overflow-wrap: anywhere;
}

.admin-component-succinct-row {
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
}

.admin-linked-metric-row > strong {
  flex-shrink: 0;
  font-size: 13px;
  color: var(--text);
}

.admin-bottleneck-row {
  align-items: flex-start;
}

.admin-bottleneck-row > strong {
  color: var(--text);
}

.admin-bottleneck-row.admin-alert-row-high .admin-demand-link {
  color: var(--danger);
}

.admin-bottleneck-row.admin-alert-row-medium .admin-demand-link {
  color: #92400e;
}

.admin-source-row {
  display: block;
  padding: 7px 9px;
}

.admin-source-row > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.admin-source-row strong {
  font-size: 12px;
}

.admin-source-row span {
  font-size: 11px;
}

.admin-source-row-ok {
  border-color: rgba(22, 163, 74, 0.24);
  background: rgba(240, 253, 244, 0.68);
}

.admin-source-row-warning {
  border-color: rgba(202, 138, 4, 0.28);
  background: rgba(254, 252, 232, 0.72);
}

.admin-source-row-danger {
  border-color: rgba(220, 38, 38, 0.3);
  background: rgba(254, 242, 242, 0.76);
}

.admin-ecosystem-person-row .admin-table-metrics {
  justify-content: space-between;
}

.admin-breach-row {
  align-items: center;
}

.admin-breach-row > span {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
}

.admin-demand-link {
  text-decoration: none;
}

.admin-demand-link:hover {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.admin-table-primary,
.admin-alert-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.admin-table-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.admin-table-metrics span {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--surface-2);
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
}

.admin-row-note,
.admin-alert-copy p {
  margin: 0;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.5;
}

.admin-alert-count {
  font-size: 19px;
  letter-spacing: 0;
}

.admin-alert-row-high {
  border-color: rgba(220, 38, 38, 0.28);
  background: var(--danger-soft);
}

.admin-alert-row-medium {
  border-color: rgba(217, 119, 6, 0.28);
  background: var(--warn-soft);
}

.admin-alert-row-low {
  background: var(--surface);
}

.admin-link-row {
  color: inherit;
  text-decoration: none;
}

.admin-link-row:hover {
  border-color: #B8C7FF;
  background: var(--accent-soft);
}

.admin-sidebar .sidebar-label strong {
  font-size: 11px;
  color: var(--text);
}

.admin-filter-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.producer-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.producer-item {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  text-align: left;
  background: none;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 9px 10px;
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s, color 0.12s;
  display: flex;
  flex-direction: column;
  gap: 7px;
  overflow: hidden;
  white-space: normal;
}

.producer-item:hover {
  border-color: var(--border-strong);
  background: var(--surface-2);
}

.producer-item.active {
  border-color: #B8C7FF;
  background: var(--surface);
}

.producer-item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}

.producer-item-head > div {
  min-width: 0;
  max-width: 100%;
}

.producer-item-head strong {
  display: block;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.producer-rank-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted);
}

.producer-item-location {
  font-size: 12px;
  color: var(--text-muted);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.producer-item-meta {
  font-size: 12px;
  color: var(--text-muted);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.producer-item-caps {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.admin-producers-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.producer-map-panel {
  padding: 14px;
}

.producer-filter-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.producer-filter-stats {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

.warehouse-filter-grid {
  grid-template-columns: minmax(280px, 1.4fr) minmax(220px, 0.8fr);
}

.producer-map-panel-full .producer-map-canvas {
  min-height: 620px;
}

.warehouse-map-list-grid,
.producer-map-list-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
  gap: 12px;
  align-items: stretch;
}

.warehouse-map-panel .producer-map-canvas,
.producer-map-side-panel .producer-map-canvas {
  min-height: 0;
}

.warehouse-map-panel,
.warehouse-list-panel,
.producer-map-side-panel,
.producer-list-panel {
  height: 620px;
  max-height: 620px;
}

.warehouse-map-panel,
.producer-map-side-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.warehouse-map-panel .producer-map-stage,
.producer-map-side-panel .producer-map-stage {
  flex: 1;
  min-height: 0;
}

.warehouse-map-panel .producer-map-canvas,
.producer-map-side-panel .producer-map-canvas {
  flex: 1;
}

.warehouse-detail-wide,
.producer-detail-wide {
  height: auto;
  max-height: none;
  min-height: 0;
}

.producer-catalog-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.95fr);
  gap: 16px;
  align-items: start;
}

.admin-network-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 620px;
}

.admin-network-list-panel {
  padding: 12px;
  max-height: 280px;
  overflow: auto;
}

.warehouse-map-list-grid .warehouse-list-panel,
.producer-map-list-grid .producer-list-panel {
  height: 620px;
  max-height: 620px;
  overflow: auto;
}

.admin-network-list-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}

.admin-network-list-copy h3 {
  margin: 0;
  font-size: 14px;
  color: var(--text);
}

.admin-network-list-copy p {
  margin: 0;
  font-size: 12px;
  color: var(--text-muted);
}

.producer-map-stage {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.producer-map-canvas {
  min-height: 620px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  background: #EEF3FF;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}

.admin-network-map {
  min-height: 520px;
}

.producer-map-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-size: 12px;
  color: var(--text-muted);
}

.producer-map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.producer-map-legend i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.admin-legend-dot {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.95);
  box-shadow: 0 0 0 1px rgba(15,23,42,0.18);
}

.admin-legend-dot-producer {
  background: #1D4ED8;
}

.admin-legend-dot-warehouse-live,
.admin-legend-dot-warehouse-candidate {
  border-radius: 3px !important;
}

.admin-legend-dot-warehouse-live {
  background: #EA580C;
  border-color: #FED7AA;
}

.admin-legend-dot-warehouse-candidate {
  background: #FDE68A;
  border-color: #B45309;
}

.admin-network-marker-shell {
  background: transparent;
  border: none;
}

.admin-network-marker {
  display: block;
  width: 16px;
  height: 16px;
  box-shadow: 0 0 0 1px rgba(15,23,42,0.2), 0 2px 6px rgba(15,23,42,0.18);
}

.admin-network-marker-warehouse {
  border-radius: 3px;
}

.admin-network-marker-warehouse-live {
  background: #EA580C;
  border: 2px solid #FED7AA;
}

.admin-network-marker-warehouse-candidate {
  background: #FDE68A;
  border: 2px solid #B45309;
}

.admin-network-marker-selected {
  transform: scale(1.12);
  box-shadow: 0 0 0 1px rgba(15,23,42,0.22), 0 4px 10px rgba(15,23,42,0.24);
}

/* Admin workspace follows the same neutral/orange system used by the designer space. */
.workspace-admin,
.workspace-admin * {
  font-family: var(--font-ui);
  letter-spacing: 0;
}

.workspace-admin {
  background: var(--workspace-main-bg);
  color: var(--admin-text);
}

.workspace-admin .admin-main-content {
  background: var(--workspace-main-bg);
  color: var(--admin-text);
}

.workspace-admin .sidebar,
.workspace-admin .admin-sidebar {
  background: var(--workspace-sidebar-bg);
  border-color: var(--workspace-sidebar-border);
  color: var(--workspace-sidebar-text);
}

.workspace-admin .sidebar-scroll {
  scrollbar-color: color-mix(in srgb, var(--workspace-sidebar-bg) 78%, white 22%) var(--workspace-main-bg);
}

.workspace-admin .sidebar-section {
  padding-inline: 12px;
}

.workspace-admin .sidebar-label,
.workspace-admin .admin-sidebar .sidebar-label strong {
  color: var(--workspace-sidebar-muted);
  font-size: var(--type-label-size);
  font-weight: 400;
  text-transform: uppercase;
}

.workspace-admin .admin-sidebar-nav,
.workspace-admin .project-list {
  gap: 6px;
}

.workspace-admin .project-item,
.workspace-admin .admin-nav-item {
  min-height: 34px;
  padding: 6px 9px;
  border-color: var(--admin-button-border);
  border-radius: var(--radius-sm);
  background: var(--admin-button-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .project-item:hover,
.workspace-admin .admin-nav-item:hover {
  border-color: var(--admin-selected-border);
  background: var(--admin-button-bg-hover);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .project-item.active,
.workspace-admin .project-item.active:hover,
.workspace-admin .admin-nav-item.active,
.workspace-admin .admin-nav-item.active:hover {
  border-color: var(--admin-selected-border);
  background: var(--admin-selected-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .project-item-name,
.workspace-admin .project-item:hover .project-item-name,
.workspace-admin .project-item.active .project-item-name {
  color: var(--admin-text);
  font-size: var(--type-button-size);
  font-weight: 400;
}

.workspace-admin .project-item-meta,
.workspace-admin .project-item-meta .badge,
.workspace-admin .project-item:hover .project-item-meta,
.workspace-admin .project-item:hover .project-item-meta .badge,
.workspace-admin .project-item.active .project-item-meta,
.workspace-admin .project-item.active .project-item-meta .badge {
  color: var(--admin-muted);
  font-size: 10px;
  font-weight: 400;
}

.workspace-admin .workspace-hero,
.workspace-admin .workspace-panel,
.workspace-admin .workspace-disclosure,
.workspace-admin .admin-kpi-card,
.workspace-admin .admin-rate-card,
.workspace-admin .admin-pipeline-inspector,
.workspace-admin .admin-rate-metrics div,
.workspace-admin .admin-mini-stat,
.workspace-admin .admin-table-row,
.workspace-admin .admin-alert-row,
.workspace-admin .admin-source-row,
.workspace-admin .admin-link-row,
.workspace-admin .admin-filter-bar,
.workspace-admin .admin-network-list-panel,
.workspace-admin .producer-inspector,
.workspace-admin .producer-detail-section,
.workspace-admin .producer-map-panel,
.workspace-admin .producer-filter-panel,
.workspace-admin .producer-list-panel,
.workspace-admin .producer-map-side-panel,
.workspace-admin .warehouse-list-panel,
.workspace-admin .warehouse-map-panel,
.workspace-admin .producer-info-cell,
.workspace-admin .producer-score-card,
.workspace-admin .producer-label-card,
.workspace-admin .producer-family-card,
.workspace-admin .producer-component-row,
.workspace-admin .producer-history-row,
.workspace-admin .producer-review-note,
.workspace-admin .producer-delete-panel,
.workspace-admin .producer-contact-note,
.workspace-admin .producer-route-row {
  border-color: var(--admin-card-border);
  border-radius: var(--radius);
  background: var(--admin-card-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .admin-kpi-card,
.workspace-admin .admin-rate-card,
.workspace-admin .admin-pipeline-inspector,
.workspace-admin .admin-rate-metrics div,
.workspace-admin .admin-mini-stat,
.workspace-admin .admin-table-row,
.workspace-admin .admin-alert-row,
.workspace-admin .admin-source-row,
.workspace-admin .admin-link-row,
.workspace-admin .producer-info-cell,
.workspace-admin .producer-score-card,
.workspace-admin .producer-label-card,
.workspace-admin .producer-family-card,
.workspace-admin .producer-component-row,
.workspace-admin .producer-history-row,
.workspace-admin .producer-route-row {
  background: var(--admin-button-bg);
}

.workspace-admin .workspace-hero,
.workspace-admin .admin-hero {
  padding: 0;
  background: transparent;
  border: 0;
}

.workspace-admin .workspace-title,
.workspace-admin .workspace-panel-head h2,
.workspace-admin .admin-kpi-card .stat-value,
.workspace-admin .admin-bar-value,
.workspace-admin .admin-rate-value,
.workspace-admin .admin-pipeline-system-head strong,
.workspace-admin .admin-pipeline-inspector strong,
.workspace-admin .admin-rate-metrics strong,
.workspace-admin .admin-mini-stat strong,
.workspace-admin .admin-alert-count,
.workspace-admin .producer-title,
.workspace-admin .producer-info-cell strong,
.workspace-admin .producer-score-card strong,
.workspace-admin .producer-label-card strong,
.workspace-admin .producer-family-card strong,
.workspace-admin .producer-component-row strong,
.workspace-admin .producer-history-row strong,
.workspace-admin .producer-route-head strong {
  color: var(--admin-text);
  font-family: var(--font-ui);
  font-weight: 400;
  letter-spacing: 0;
}

.workspace-admin .workspace-title {
  font-size: var(--type-page-title-size);
  line-height: 1.15;
}

.workspace-admin .workspace-panel-head h2,
.workspace-admin .admin-subhead,
.workspace-admin .admin-network-list-copy h3 {
  font-size: var(--type-card-title-size);
  font-weight: 400;
  text-transform: none;
}

.workspace-admin .workspace-panel-head p,
.workspace-admin .workspace-panel-intro,
.workspace-admin .workspace-disclosure summary small,
.workspace-admin .field-help,
.workspace-admin .stat-label,
.workspace-admin .admin-bar-copy span,
.workspace-admin .admin-table-primary span,
.workspace-admin .admin-source-row span,
.workspace-admin .admin-link-row span,
.workspace-admin .admin-rate-status,
.workspace-admin .admin-row-note,
.workspace-admin .admin-alert-copy p,
.workspace-admin .admin-network-list-copy p,
.workspace-admin .producer-subtitle,
.workspace-admin .producer-item-location,
.workspace-admin .producer-item-meta,
.workspace-admin .producer-component-meta,
.workspace-admin .producer-history-row span,
.workspace-admin .producer-route-stats,
.workspace-admin .producer-contact-note,
.workspace-admin .producer-review-note {
  color: var(--admin-muted);
  font-weight: 400;
}

.workspace-admin strong,
.workspace-admin b,
.workspace-admin .field-label,
.workspace-admin .stat-label,
.workspace-admin .admin-rate-metrics span,
.workspace-admin .admin-mini-stat span,
.workspace-admin .admin-demand-row > strong,
.workspace-admin .admin-demand-link,
.workspace-admin .admin-component-succinct-row > strong,
.workspace-admin .admin-breach-row > strong,
.workspace-admin .admin-linked-metric-row > strong,
.workspace-admin .admin-bottleneck-row > strong {
  font-weight: 400;
}

.workspace-admin .field-label {
  color: var(--admin-text);
  font-size: var(--type-caption-size);
  text-transform: none;
}

.workspace-admin input:not([type="checkbox"]):not([type="radio"]),
.workspace-admin select,
.workspace-admin textarea {
  min-height: 34px;
  border-color: var(--admin-button-border);
  border-radius: var(--radius-sm);
  background: var(--admin-control-bg);
  color: var(--admin-text);
  font-size: var(--type-control-size);
  font-weight: 400;
  box-shadow: none;
}

.workspace-admin input:not([type="checkbox"]):not([type="radio"]):hover,
.workspace-admin select:hover,
.workspace-admin textarea:hover,
.workspace-admin input:not([type="checkbox"]):not([type="radio"]):focus,
.workspace-admin select:focus,
.workspace-admin textarea:focus {
  border-color: var(--admin-selected-border);
  box-shadow: none;
}

.workspace-admin input:disabled,
.workspace-admin select:disabled,
.workspace-admin textarea:disabled {
  background: var(--admin-control-bg-disabled);
  color: var(--admin-muted);
}

.workspace-admin .btn,
.workspace-admin button:not(.admin-pipeline-node),
.workspace-admin .download-link {
  min-height: 34px;
  border-color: var(--admin-button-border);
  border-radius: var(--radius-sm);
  background: var(--admin-button-bg);
  color: var(--admin-text);
  font-size: var(--type-button-size);
  font-weight: 400;
  box-shadow: none;
}

.workspace-admin .btn.primary,
.workspace-admin button.primary,
.workspace-admin .btn.secondary,
.workspace-admin button.secondary,
.workspace-admin .btn.ghost,
.workspace-admin button.ghost,
.workspace-admin .download-link.primary,
.workspace-admin .download-link.secondary {
  border-color: var(--admin-button-border);
  background: var(--admin-button-bg);
  color: var(--admin-text);
}

.workspace-admin .btn:hover,
.workspace-admin button:not(.admin-pipeline-node):hover,
.workspace-admin .download-link:hover,
.workspace-admin .btn.primary:hover,
.workspace-admin button.primary:hover,
.workspace-admin .btn.secondary:hover,
.workspace-admin button.secondary:hover,
.workspace-admin .btn.ghost:hover,
.workspace-admin button.ghost:hover {
  border-color: var(--admin-selected-border);
  background: var(--admin-button-bg-hover);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .check-pill,
.workspace-admin .summary-chip,
.workspace-admin .badge,
.workspace-admin .admin-table-metrics span,
.workspace-admin .producer-rank-chip {
  border-color: var(--admin-button-border);
  border-radius: var(--radius-sm);
  background: var(--admin-button-bg);
  color: var(--admin-muted);
  font-weight: 400;
  box-shadow: none;
}

.workspace-admin .check-pill:has(input:checked),
.workspace-admin .admin-material-row.active,
.workspace-admin .producer-item.active,
.workspace-admin .producer-route-row.active,
.workspace-admin .admin-link-row:hover {
  border-color: var(--admin-selected-border);
  background: var(--admin-selected-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .workspace-disclosure summary {
  min-height: 46px;
  border-color: var(--admin-divider);
  background: var(--admin-card-bg);
  color: var(--admin-text);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.workspace-admin .workspace-disclosure summary::after {
  border-color: var(--admin-muted);
}

.workspace-admin .workspace-disclosure[open] summary::after {
  border-color: var(--brand-orange);
}

.workspace-admin .workspace-disclosure-body,
.workspace-admin .status-row + .status-row,
.workspace-admin .project-overview-row + .project-overview-row,
.workspace-admin .producer-component-row + .producer-component-row,
.workspace-admin .producer-history-row + .producer-history-row {
  border-color: var(--admin-divider);
}

.workspace-admin .admin-bar-track {
  height: 8px;
  border: 1px solid var(--admin-button-border);
  border-radius: 3px;
  background: var(--admin-button-bg);
}

.workspace-admin .admin-bar-track span {
  border-radius: 3px;
  background: var(--brand-orange);
}

.workspace-admin .admin-source-row-ok,
.workspace-admin .admin-source-row-warning,
.workspace-admin .admin-source-row-danger,
.workspace-admin .admin-alert-row-high,
.workspace-admin .admin-alert-row-medium,
.workspace-admin .admin-alert-row-low {
  border-color: var(--admin-card-border);
  background: var(--admin-button-bg);
}

.workspace-admin .admin-pipeline-system-map,
.workspace-admin .producer-map-canvas {
  border-color: var(--admin-card-border);
  border-radius: var(--radius);
  background: var(--admin-button-bg);
  box-shadow: none;
}

.workspace-admin .admin-pipeline-blob-bridge-base {
  fill: color-mix(in srgb, var(--admin-button-bg) 78%, var(--workspace-main-bg) 22%);
}

.workspace-admin .admin-pipeline-blob-bridge {
  fill: color-mix(in srgb, var(--brand-orange) calc(28% * var(--stage-intensity)), var(--admin-button-bg));
}

.workspace-admin .admin-pipeline-blob-bridge.idle {
  fill: var(--admin-button-bg);
}

.workspace-admin .admin-pipeline-flow-segments {
  filter: none;
}

.workspace-admin .admin-pipeline-node {
  border-color: var(--admin-button-border);
  background: var(--admin-button-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .admin-pipeline-node:hover,
.workspace-admin .admin-pipeline-node:focus-visible,
.workspace-admin .admin-pipeline-node.selected {
  border-color: var(--admin-selected-border);
  background: var(--admin-selected-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .admin-pipeline-node.approval,
.workspace-admin .admin-pipeline-node.idle:not(.selected) {
  border-color: var(--admin-button-border);
  background: var(--admin-button-bg);
  color: var(--admin-muted);
  box-shadow: none;
}

.workspace-admin .admin-pipeline-node-index,
.workspace-admin .admin-pipeline-node strong,
.workspace-admin .admin-pipeline-node-label {
  color: inherit;
  font-weight: 400;
}

.workspace-admin .producer-item {
  border-color: var(--admin-button-border);
  background: var(--admin-button-bg);
  color: var(--admin-text);
  box-shadow: none;
}

.workspace-admin .producer-item:hover {
  border-color: var(--admin-selected-border);
  background: var(--admin-button-bg-hover);
}

.workspace-admin .producer-map-legend,
.workspace-admin .producer-map-legend span {
  color: var(--admin-muted);
  font-weight: 400;
}

.workspace-admin ::placeholder {
  color: var(--admin-muted);
  opacity: 1;
}

.producer-inspector {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  min-height: 620px;
  max-height: 720px;
  overflow: auto;
}

.producer-inspector-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 14px;
}

.producer-inspector-empty {
  display: flex;
  min-height: 620px;
  align-items: center;
  justify-content: center;
  padding: 24px;
  color: var(--text-subtle);
  text-align: center;
}

.producer-inspector-head {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.producer-title {
  font-size: 22px;
  line-height: 1.15;
}

.producer-subtitle {
  max-width: none;
}

.producer-head-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.producer-detail-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.producer-review-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.producer-review-note {
  font-size: 12px;
  color: var(--text-muted);
}

.producer-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.producer-delete-panel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}

.producer-review-link {
  color: var(--accent);
  text-decoration: none;
  word-break: break-word;
}

.producer-review-link:hover {
  text-decoration: underline;
}

.producer-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.producer-info-cell,
.producer-score-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
  padding: 11px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.producer-info-cell strong,
.producer-score-card strong {
  font-size: 16px;
  color: var(--text);
  letter-spacing: 0;
}

.producer-contact-note {
  font-size: 12px;
  color: var(--text-muted);
}

.producer-score-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.producer-score-grid-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.producer-signal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.producer-label-card-grid,
.producer-family-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.producer-label-card,
.producer-family-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
  padding: 9px 10px;
  min-width: 0;
}

.producer-label-card strong,
.producer-family-card strong {
  display: block;
  font-size: 13px;
  line-height: 1.25;
  color: var(--text);
  overflow-wrap: anywhere;
}

.producer-family-card span {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
}

.producer-component-list,
.producer-route-list,
.producer-history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.producer-route-list {
  gap: 6px;
}

.producer-route-row {
  width: 100%;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: inherit;
  font: inherit;
  padding: 7px 9px;
  display: flex;
  flex-direction: column;
  gap: 0;
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}

.producer-route-row:hover {
  border-color: var(--border-strong);
  background: var(--surface-2);
}

.producer-route-row.active {
  border-color: #B8C7FF;
  background: var(--surface);
}

.producer-route-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.producer-route-head strong {
  font-size: 13px;
  line-height: 1.25;
}

.producer-route-stats {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  font-size: 12px;
  color: var(--text-muted);
  white-space: nowrap;
}

.producer-route-stats strong {
  font-size: 13px;
  color: var(--text);
}

.producer-component-row,
.producer-history-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
}

.producer-component-row + .producer-component-row,
.producer-history-row + .producer-history-row {
  border-top: 1px solid var(--border);
}

.producer-component-meta,
.producer-history-row span {
  font-size: 12px;
  color: var(--text-muted);
}

.producer-component-stats {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  font-size: 12px;
  color: var(--text-muted);
  white-space: nowrap;
}

.producer-section {
  margin-top: 16px;
}

.producer-main-content {
  overflow-x: hidden;
}

.producer-page {
  display: grid;
  gap: 16px;
  width: 100%;
  max-width: 1280px;
}

.producer-page-head h1 {
  margin: 0;
  color: var(--text);
  font-size: 26px;
  line-height: 1.15;
}

.producer-page-head p {
  margin: 4px 0 0;
  color: var(--text-muted);
  font-size: 14px;
}

.producer-page-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.producer-workspace-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  gap: 16px;
  align-items: start;
}

.producer-left-column,
.producer-right-column {
  display: grid;
  gap: 16px;
}

.producer-workspace-board,
.producer-signals-board {
  margin-top: 16px;
}

.product-provider-admin-page { display: grid; gap: 16px; }
.product-provider-admin-summary { display: grid; gap: 14px; }
.product-provider-admin-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.product-provider-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.product-provider-kpis .is-warning { border-color: color-mix(in srgb, var(--warning, #f59f00) 58%, var(--platform-border, #3c4541)); }
.product-provider-kpis .is-warning .stat-value { color: var(--warning, #f59f00); }
.product-provider-filter-grid { grid-template-columns: minmax(240px, 1.5fr) minmax(190px, .7fr); }
.product-provider-filter-grid .field { margin: 0; }
.product-provider-admin-layout { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 2fr); gap: 16px; align-items: start; }
.product-provider-admin-list-panel { position: sticky; top: 12px; max-height: calc(100vh - 118px); overflow: hidden; }
.product-provider-admin-list { display: grid; gap: 5px; max-height: calc(100vh - 210px); overflow: auto; padding-right: 3px; }
.product-provider-admin-list-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; width: 100%; padding: 9px 10px; border: 1px solid var(--platform-border, #3c4541); border-radius: 5px; background: var(--platform-card-bg, #2d312f); color: var(--platform-text, #f2f4f2); text-align: left; cursor: pointer; }
.product-provider-admin-list-row:hover, .product-provider-admin-list-row:focus-visible, .product-provider-admin-list-row.is-active { border-color: var(--platform-accent, #67b487); background: var(--platform-selected-bg, #243b30); outline: none; }
.product-provider-admin-list-row > span { display: grid; min-width: 0; gap: 3px; }
.product-provider-admin-list-row strong, .product-provider-admin-list-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-provider-admin-list-row strong { font-size: 12px; font-weight: 600; }
.product-provider-admin-list-row small { color: var(--platform-muted, #aab4ae); font-size: 10px; }
.product-provider-admin-list-row em { display: inline-grid; min-width: 24px; height: 24px; place-items: center; border-radius: 999px; font-size: 9px; font-style: normal; font-weight: 700; }
.product-provider-admin-list-row em.is-incomplete { background: color-mix(in srgb, var(--warning, #f59f00) 18%, transparent); color: var(--warning, #f59f00); }
.product-provider-admin-list-row em.is-complete { background: color-mix(in srgb, var(--success, #40c057) 16%, transparent); color: var(--success, #40c057); }
.product-provider-admin-form { display: grid; gap: 18px; }
.product-provider-admin-form > section { display: grid; gap: 10px; padding-top: 16px; border-top: 1px solid var(--platform-border, #3c4541); }
.product-provider-admin-form > section h3 { margin: 0; color: var(--platform-text, #f2f4f2); font-size: 13px; font-weight: 600; }
.product-provider-completion-warning { display: grid; gap: 8px; padding: 11px 12px; border: 1px solid color-mix(in srgb, var(--warning, #f59f00) 62%, var(--platform-border, #3c4541)); border-radius: 6px; background: color-mix(in srgb, var(--warning, #f59f00) 9%, var(--platform-card-bg, #2d312f)); }
.product-provider-completion-warning strong { color: var(--warning, #f59f00); font-size: 11px; }
.product-provider-completion-warning > div { display: flex; flex-wrap: wrap; gap: 5px; }
.product-provider-completion-warning span { padding: 4px 7px; border: 1px solid color-mix(in srgb, var(--warning, #f59f00) 40%, transparent); border-radius: 999px; color: var(--platform-text, #f2f4f2); font-size: 9px; }
.product-provider-completion-ok { width: max-content; padding: 6px 9px; border: 1px solid color-mix(in srgb, var(--success, #40c057) 55%, transparent); border-radius: 999px; color: var(--success, #40c057); font-size: 10px; font-weight: 650; }
.product-provider-admin-form textarea { resize: vertical; }
.product-provider-source-products a { text-decoration: none; }

@media (max-width: 1100px) {
  .product-provider-admin-layout { grid-template-columns: 1fr; }
  .product-provider-admin-list-panel { position: static; max-height: none; }
  .product-provider-admin-list { max-height: 320px; }
}

@media (max-width: 720px) {
  .product-provider-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-provider-filter-grid { grid-template-columns: 1fr; }
}

.producer-gantt-scroll {
  overflow-x: auto;
}

.producer-gantt-range {
  color: var(--text-muted);
  font-size: 12px;
  margin-bottom: 8px;
}

.producer-gantt-board {
  display: grid;
  gap: 10px;
  min-width: 920px;
}

.producer-gantt-lane {
  display: grid;
  grid-template-columns: 180px minmax(680px, 1fr);
  gap: 10px;
  align-items: stretch;
}

.producer-gantt-lane-label {
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px;
  background: var(--surface);
}

.producer-gantt-lane-label strong,
.producer-gantt-lane-label span {
  display: block;
}

.producer-gantt-lane-label span {
  color: var(--text-muted);
  font-size: 12px;
  margin-top: 2px;
}

.producer-gantt-track {
  position: relative;
  min-height: 58px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-subtle);
  overflow: hidden;
}

.producer-gantt-day-marker {
  position: absolute;
  inset-block: 0;
  border-left: 1px solid rgba(120, 130, 150, 0.22);
  color: var(--text-muted);
  font-size: 10px;
  padding-left: 3px;
  pointer-events: none;
}

.producer-gantt-event {
  position: absolute;
  top: 10px;
  min-width: 14px;
  max-width: 100%;
  height: 38px;
  border-radius: 5px;
  padding: 5px 6px;
  overflow: hidden;
  background: #3178c6;
  color: white;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18);
}

.producer-gantt-event strong,
.producer-gantt-event span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-gantt-event span {
  font-size: 10px;
  opacity: 0.88;
}

.producer-gantt-event-hold {
  background: #b7791f;
}

.producer-gantt-event-blockage {
  background: #6b7280;
}

.producer-gantt-status-accepted,
.producer-gantt-status-scheduled,
.producer-gantt-status-in_production {
  background: #15803d;
}

.producer-gantt-shell {
  display: grid;
  gap: 10px;
}

.producer-gantt-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  margin-bottom: 10px;
  padding: 8px;
  border: 1px solid var(--platform-border, var(--border));
  border-radius: var(--platform-radius, 6px);
  background: var(--platform-card-bg, var(--surface));
  overflow-x: auto;
  scrollbar-color: var(--platform-control-bg, var(--surface-subtle)) var(--platform-card-bg, var(--surface));
}

.producer-gantt-tool-group {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--platform-border, var(--border));
  border-radius: var(--platform-radius-sm, 4px);
  background: var(--platform-control-bg, var(--surface-subtle));
}

.producer-gantt-tool-group > span {
  color: var(--platform-muted, var(--text-muted));
  font-size: 10px;
  font-weight: var(--platform-type-weight, 400);
}

.producer-gantt-tool-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 28px;
  min-width: 28px;
  height: 28px;
  padding: 4px;
  border: 1px solid var(--platform-border, var(--border));
  border-radius: var(--platform-radius-sm, 4px);
  background: var(--platform-control-bg, var(--surface-subtle));
  color: var(--platform-text, var(--text));
  cursor: pointer;
}

.producer-gantt-tool-button:hover,
.producer-gantt-tool-button.is-active {
  border-color: var(--platform-selected-border, var(--selected-border));
  background: var(--platform-selected-bg, rgba(245, 119, 52, 0.14));
}

.producer-gantt-snap-menu {
  position: relative;
  flex: 0 0 auto;
}

.producer-gantt-snap-menu > summary {
  list-style: none;
}

.producer-gantt-snap-menu > summary::-webkit-details-marker {
  display: none;
}

.producer-gantt-snap-popover {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 90;
  display: grid;
  gap: 2px;
  width: max-content;
  min-width: 96px;
  padding: 6px;
  border: 1px solid var(--platform-border, var(--border));
  border-radius: var(--platform-radius-sm, 4px);
  background: var(--platform-card-bg, var(--surface));
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.18);
}

.producer-gantt-snap-option {
  min-height: 24px;
  justify-content: flex-start;
  padding: 3px 8px;
  border: 1px solid transparent;
  border-radius: var(--platform-radius-sm, 4px);
  background: transparent;
  color: var(--platform-text, var(--text));
  font-size: var(--platform-button-font-size, 11px);
  font-weight: var(--platform-type-weight, 400);
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}

.producer-gantt-snap-option:hover,
.producer-gantt-snap-option.is-active {
  border-color: var(--platform-selected-border, var(--selected-border));
  background: var(--platform-selected-bg, rgba(245, 119, 52, 0.14));
}

.producer-gantt-main {
  position: relative;
  height: clamp(260px, 42vh, 520px);
  overflow: auto;
  padding-bottom: 8px;
  scrollbar-color: var(--platform-control-bg, var(--surface-subtle)) var(--platform-page-bg, var(--bg));
}

.producer-gantt-board {
  display: block;
  min-width: calc(var(--construction-schedule-left-column-width, 300px) + var(--construction-schedule-grid-width, 126px));
  overflow: visible;
  border: 1px solid var(--platform-border, var(--border));
  border-radius: var(--platform-radius-sm, 4px);
  background: var(--platform-card-bg, var(--surface));
  isolation: isolate;
}

.producer-gantt-axis,
.producer-gantt-row {
  display: grid;
  grid-template-columns: var(--construction-schedule-left-column-width, 300px) minmax(0, 1fr);
}

.producer-gantt-axis {
  position: sticky;
  top: 0;
  z-index: 58;
}

.producer-gantt-line-axis,
.producer-gantt-lane-label {
  position: sticky;
  left: 0;
  z-index: 18;
  background: var(--platform-card-bg, var(--surface));
  color: var(--platform-text, var(--text));
  box-shadow: 1px 0 0 var(--platform-divider, var(--border)), 10px 0 14px rgba(0, 0, 0, 0.1);
}

.producer-gantt-line-axis {
  z-index: 60;
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 8px;
  border-right: 1px solid var(--platform-divider, var(--border));
  border-bottom: 1px solid var(--platform-divider, var(--border));
  font-size: 10px;
  font-weight: var(--platform-type-weight, 400);
}

.producer-gantt-day-axis,
.producer-gantt-track {
  display: grid;
  grid-template-columns: var(--construction-schedule-grid-template, repeat(var(--construction-schedule-days, 1), var(--construction-schedule-day-width, 72px)));
  width: var(--construction-schedule-grid-width, 100%);
}

.producer-gantt-day-axis {
  border-bottom: 1px solid var(--platform-divider, var(--border));
  background: var(--platform-card-bg, var(--surface));
}

.producer-gantt-day-cell {
  display: grid;
  align-content: center;
  gap: 1px;
  min-height: 32px;
  padding: 3px 6px;
  border-left: 1px solid var(--platform-divider, var(--border));
  background: var(--platform-card-bg, var(--surface));
  text-align: center;
}

.producer-gantt-day-main {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.producer-gantt-day-cell strong {
  min-width: 0;
  overflow: hidden;
  color: var(--platform-text, var(--text));
  font-size: 10px;
  font-weight: var(--platform-type-weight, 400);
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-gantt-day-cell span {
  overflow: hidden;
  color: var(--platform-muted, var(--text-muted));
  font-size: 8.5px;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-gantt-day-cell.is-blocked-day {
  background: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 78%, var(--platform-page-bg, var(--bg)) 22%);
}

.producer-gantt-day-cell.is-today {
  box-shadow: inset 0 2px 0 var(--platform-accent, var(--accent));
}

.producer-gantt-row {
  min-height: 48px;
  border-bottom: 1px solid var(--platform-divider, var(--border));
  background: var(--producer-row-bg, var(--platform-card-bg, var(--surface)));
  --producer-row-track-bg: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 78%, var(--platform-control-bg, var(--surface-subtle)) 22%);
  --producer-row-blocked-bg: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 72%, var(--platform-page-bg, var(--bg)) 28%);
}

.producer-gantt-row.is-alt {
  --producer-row-bg: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 90%, var(--platform-control-bg, var(--surface-subtle)) 10%);
  --producer-row-track-bg: color-mix(in srgb, var(--platform-card-bg, var(--surface)) 72%, var(--platform-control-bg, var(--surface-subtle)) 28%);
}

.producer-gantt-lane-label {
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 4px 8px;
  border: 0;
  border-right: 1px solid var(--platform-divider, var(--border));
  border-radius: 0;
  background: var(--producer-row-bg, var(--platform-card-bg, var(--surface)));
}

.producer-gantt-lane-label strong {
  overflow: hidden;
  color: var(--platform-text, var(--text));
  font-size: 13px;
  font-weight: var(--platform-type-weight-medium, 500);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-gantt-lane-label span {
  overflow: hidden;
  margin-top: 0;
  color: var(--platform-muted, var(--text-muted));
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-gantt-track {
  position: relative;
  min-height: 48px;
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

.producer-gantt-track-grid-cell {
  grid-row: 1;
  border-left: 1px solid var(--platform-divider, var(--border));
  background: var(--producer-row-track-bg);
}

.producer-gantt-track-grid-cell.is-blocked-day,
.producer-gantt-track-grid-cell.is-sunday {
  background: var(--producer-row-blocked-bg);
}

.producer-gantt-track-grid-cell.is-today {
  box-shadow: inset 1px 0 0 var(--platform-accent, var(--accent));
}

.producer-gantt-event {
  position: relative;
  top: auto;
  z-index: 2;
  grid-row: 1;
  align-self: center;
  justify-self: start;
  width: calc(var(--producer-block-width, 100%) - 2px);
  max-width: calc(100% - var(--producer-block-offset, 0%) - 2px);
  min-width: 18px;
  min-height: 32px;
  height: auto;
  margin-left: var(--producer-block-offset, 0%);
  display: grid;
  align-content: center;
  gap: 1px;
  padding: 3px 7px;
  border: 1px solid var(--platform-border, var(--border));
  border-radius: var(--platform-radius-sm, 4px);
  background: var(--platform-control-bg, var(--surface-subtle));
  color: var(--platform-text, var(--text));
  box-shadow: none;
  text-align: left;
  cursor: pointer;
}

.producer-gantt-event:hover,
.producer-gantt-event:focus-visible {
  border-color: var(--platform-selected-border, var(--selected-border));
  background: var(--platform-control-bg-hover, #e3e3e3);
  outline: 0;
}

.producer-gantt-event strong,
.producer-gantt-event span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-gantt-event strong {
  font-size: 11px;
  font-weight: var(--platform-type-weight-medium, 500);
}

.producer-gantt-event span {
  color: var(--platform-muted, var(--text-muted));
  font-size: 9px;
  opacity: 1;
}

.producer-gantt-event-hold {
  border-color: color-mix(in srgb, var(--warn, #b7791f) 55%, var(--platform-border, var(--border)) 45%);
  background: color-mix(in srgb, var(--warn-soft, #fff7ed) 70%, var(--platform-control-bg, var(--surface-subtle)) 30%);
}

.producer-gantt-event-blockage {
  border-color: color-mix(in srgb, var(--platform-muted, #6b7280) 60%, var(--platform-border, var(--border)) 40%);
  background: color-mix(in srgb, var(--platform-muted, #6b7280) 18%, var(--platform-control-bg, var(--surface-subtle)) 82%);
}

.producer-gantt-status-accepted,
.producer-gantt-status-scheduled,
.producer-gantt-status-in_production {
  border-color: color-mix(in srgb, var(--success, #15803d) 52%, var(--platform-border, var(--border)) 48%);
  background: color-mix(in srgb, var(--success-soft, #ecfdf5) 68%, var(--platform-control-bg, var(--surface-subtle)) 32%);
}

.producer-gantt-empty {
  grid-column: 1 / -1;
  grid-row: 1;
  align-self: center;
  padding-left: 10px;
  color: var(--platform-muted, var(--text-muted));
  font-size: 11px;
}

.producer-kpi-card .subtle {
  display: block;
  margin-top: 4px;
}

.producer-evidence-form {
  display: grid;
  gap: 44px;
}

.producer-selection-criteria-form {
  gap: 44px;
}

.producer-storage-form {
  gap: 44px;
}

.producer-criteria-grid,
.producer-component-offer-list {
  display: grid;
  gap: 10px;
}

.producer-criteria-section {
  display: grid;
  gap: 8px;
}

.producer-criteria-section h3 {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  line-height: 1.25;
}

.producer-criteria-section-list {
  display: grid;
  gap: 8px;
}

.producer-criteria-row,
.producer-component-offer-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(160px, 0.7fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-criteria-row {
  grid-template-columns: 170px minmax(180px, 1.1fr) minmax(160px, 0.9fr) minmax(150px, 0.7fr);
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
}

.producer-criteria-row-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.producer-criteria-row-head strong,
.producer-criteria-row-head span {
  display: block;
}

.producer-criteria-row-head strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.25;
}

.producer-criteria-remove,
.producer-evidence-remove,
.producer-evidence-add {
  min-width: 24px;
  height: 24px;
  padding: 0;
  font-size: 16px;
  line-height: 1;
}

.producer-criteria-add-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
}

.producer-evidence-list {
  display: grid;
  gap: 4px;
}

.producer-evidence-cell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px;
  align-items: start;
}

.producer-evidence-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 4px;
  align-items: center;
}

.producer-evidence-item input,
.producer-criterion-value-cell input {
  min-height: 28px;
  padding: 5px 8px;
  font-size: 12px;
}

.producer-evidence-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-muted);
  font-size: 12px;
  text-decoration: none;
}

.producer-evidence-open:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.producer-evidence-open-placeholder {
  visibility: hidden;
  pointer-events: none;
}

.producer-criteria-row input[type="file"] {
  max-width: 100%;
  font-size: 11px;
}

.producer-component-offer-row {
  grid-template-columns: minmax(220px, 1.35fr) minmax(92px, 0.42fr) minmax(92px, 0.42fr) minmax(130px, 0.5fr) minmax(160px, 0.75fr) minmax(220px, 1fr);
  min-width: 930px;
}

.producer-component-offer-row > label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-self: start;
}

.producer-component-offer-main {
  display: grid;
  gap: 4px;
  min-width: 0;
  position: relative;
  padding-right: 30px;
}

.producer-component-remove {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 26px;
  height: 26px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
}

.producer-component-name-link {
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
}

.producer-component-name-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

.producer-component-offer-row label,
.producer-criteria-row label {
  min-width: 0;
}

.producer-component-lines {
  display: grid;
  gap: 4px;
  min-width: 0;
  align-self: start;
}

.producer-component-sale-modes {
  display: grid;
  gap: 6px;
  min-width: 0;
  align-self: start;
}

.producer-component-sale-mode-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.producer-component-sale-mode-pill {
  padding: 6px 9px;
  white-space: nowrap;
}

.producer-component-lines-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px;
  min-height: 0;
  position: relative;
  padding-right: 30px;
}

.producer-component-line-list {
  display: grid;
  gap: 5px;
}

.producer-component-line-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 26px;
  gap: 5px;
  align-items: center;
}

.producer-component-line-row select {
  min-width: 0;
}

.producer-component-line-add,
.producer-component-line-remove {
  min-width: 26px;
  height: 26px;
  padding: 0;
  font-size: 16px;
  line-height: 1;
}

.producer-component-line-add {
  position: absolute;
  top: -7px;
  right: 0;
}

.producer-component-stock-batches {
  grid-column: span 3;
}

.producer-component-stock-batches textarea {
  min-height: 58px;
  resize: vertical;
}

.producer-criteria-row textarea {
  grid-column: span 3;
  min-height: 52px;
  resize: vertical;
}

.producer-form-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}

.producer-components-form {
  display: grid;
  gap: 44px;
}

.producer-components-form .producer-sticky-save-card {
  margin-bottom: 0;
}

.producer-capacity-board,
.producer-resource-list {
  display: grid;
  gap: 14px;
}

.producer-calendar-scroll {
  width: 100%;
  overflow-x: auto;
  padding: 2px 0 10px;
  margin-bottom: 12px;
}

.producer-calendar-track {
  display: flex;
  gap: 8px;
  min-width: max-content;
}

.producer-calendar-day {
  flex: 0 0 132px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 8px;
  min-height: 154px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-calendar-day.is-today {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px rgba(36, 91, 254, 0.1);
}

.producer-calendar-day.is-closed {
  background: var(--surface-2);
}

.producer-calendar-day.is-collapsed {
  flex-basis: 30px;
  min-height: 154px;
  padding: 6px 3px;
  opacity: 0.78;
}

.producer-calendar-day-head {
  display: grid;
  gap: 1px;
}

.producer-calendar-day-head span,
.producer-calendar-day-head small {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.1;
  text-transform: capitalize;
}

.producer-calendar-day-head strong {
  color: var(--text);
  font-size: 22px;
  line-height: 1.05;
}

.producer-calendar-day.is-collapsed .producer-calendar-day-head {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  justify-items: center;
  align-items: center;
}

.producer-calendar-day.is-collapsed .producer-calendar-day-head strong {
  font-size: 13px;
}

.producer-calendar-day-body {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
}

.producer-calendar-event {
  display: grid;
  gap: 1px;
  padding: 6px 7px;
  border-radius: 6px;
  background: rgba(36, 91, 254, 0.08);
}

.producer-calendar-event strong,
.producer-calendar-event span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-calendar-event strong {
  font-size: 12px;
}

.producer-calendar-event span,
.producer-calendar-empty {
  color: var(--text-muted);
  font-size: 11px;
}

.producer-resource-row {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-storage-row {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-resource-row-head {
  display: grid;
  grid-template-columns: minmax(220px, 1.3fr) minmax(130px, 0.65fr) auto auto;
  gap: 10px;
  align-items: end;
}

.producer-resource-detail {
  border-top: 1px solid var(--border);
  padding-top: 10px;
}

.producer-resource-detail summary {
  cursor: pointer;
  color: var(--accent);
  font-weight: 700;
  list-style: none;
}

.producer-resource-detail summary::-webkit-details-marker {
  display: none;
}

.producer-resource-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.producer-resource-weekdays .checkbox-grid {
  gap: 6px;
}

.producer-weekday-pill {
  min-width: 38px;
  justify-content: center;
}

.producer-family-checkboxes {
  align-items: flex-start;
}

.producer-family-button-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.producer-family-toggle,
.producer-line-component-toggle {
  border-radius: var(--platform-radius-sm, 2px);
  cursor: pointer;
}

.producer-family-toggle input,
.producer-line-component-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.producer-family-toggle.is-active,
.producer-family-toggle:has(input:checked),
.producer-line-component-toggle.is-active,
.producer-line-component-toggle:has(input:checked) {
  border-color: var(--platform-selected-border, var(--accent));
  background: var(--platform-selected-bg, rgba(245, 119, 52, 0.14));
  color: var(--platform-text, var(--text));
}

.producer-line-component-matrix {
  display: grid;
  gap: 8px;
}

.producer-line-family-group {
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-subtle);
}

.producer-line-family-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  cursor: pointer;
  list-style: none;
}

.producer-line-family-head::-webkit-details-marker {
  display: none;
}

.producer-line-component-list {
  display: grid;
  gap: 6px;
  padding: 0 10px 10px;
}

.producer-line-component-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(120px, 0.7fr) 96px 94px;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--surface);
}

.producer-materials-summary {
  margin-top: 0;
}

.producer-material-component-list,
.producer-material-part-list {
  display: grid;
  gap: 8px;
}

.producer-material-component {
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-subtle);
}

.producer-material-component > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 10px;
  cursor: pointer;
  list-style: none;
}

.producer-material-component > summary::-webkit-details-marker {
  display: none;
}

.producer-material-component > summary span,
.producer-line-family-head span {
  min-width: 0;
}

.producer-material-component > summary small,
.producer-line-family-head small {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  margin-top: 2px;
}

.producer-material-part-list {
  padding: 0 10px 10px;
}

.producer-material-part-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(140px, 0.8fr) 72px;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--surface);
}

.producer-resource-active {
  align-self: center;
}

.producer-resource-remove {
  min-width: 28px;
  height: 28px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
}

.producer-mini-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.producer-calendar-exception-list {
  display: grid;
  gap: 8px;
}

.producer-calendar-exception-row {
  display: grid;
  grid-template-columns: minmax(130px, 0.8fr) auto minmax(110px, 0.55fr) minmax(160px, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.producer-capacity-actions {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) auto;
  gap: 8px;
  align-items: end;
  width: min(320px, 100%);
}

.producer-sticky-save-card {
  position: sticky;
  top: 64px;
  z-index: 30;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow-soft);
}

.producer-sticky-save-card + .workspace-panel,
.producer-sticky-save-card + .producer-catalog-add-panel,
.producer-sticky-save-card + .producer-business-two-col {
  margin-top: 12px;
}

.producer-sticky-save-card strong,
.producer-sticky-save-card span {
  display: block;
}

.producer-sticky-save-card span {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 12px;
}

.producer-pricing-scheme {
  display: grid;
  gap: 10px;
}

.producer-subsection-head {
  margin-bottom: 0;
}

.producer-pricing-bar-wrap {
  display: grid;
  gap: 10px;
}

.producer-pricing-bar {
  display: flex;
  min-height: 94px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-pricing-production-rail {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}

.producer-pricing-segment {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  overflow: hidden;
  color: #151A18;
  user-select: none;
}

.producer-pricing-segment strong {
  overflow: hidden;
  font-size: 13px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-pricing-segment small {
  margin-top: 2px;
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-pricing-percent-display {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.74);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.producer-pricing-percent-editor {
  display: none;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid rgba(21, 26, 24, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
}

.producer-pricing-percent-editor input {
  width: 54px;
  max-width: 100%;
  padding: 4px 2px 4px 8px;
  border: 0;
  background: transparent;
  font-size: 12px;
}

.producer-pricing-percent-editor span {
  padding-right: 8px;
  font-size: 12px;
  font-weight: 700;
}

.producer-pricing-segment.is-editing .producer-pricing-percent-display {
  display: none;
}

.producer-pricing-segment.is-editing .producer-pricing-percent-editor {
  display: inline-flex;
}

.producer-pricing-segment-stock {
  flex: 0 0 112px;
  background: #BAE6FD;
}

.producer-pricing-segment-urgent {
  background: #FCA5A5;
}

.producer-pricing-segment-standard {
  background: #FDE68A;
}

.producer-pricing-segment-planned {
  flex: 0 0 112px;
  background: #A7F3D0;
}

.producer-pricing-handle {
  position: relative;
  align-self: stretch;
  flex: 0 0 16px;
  z-index: 3;
  width: 16px;
  min-width: 0;
  margin: 0 -8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: col-resize;
  overflow: visible;
}

.producer-pricing-handle::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 50%;
  width: 2px;
  border-radius: 999px;
  background: rgba(21, 26, 24, 0.56);
  transform: translateX(-50%);
}

.producer-pricing-handle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 22px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(21, 26, 24, 0.22);
  transform: translate(-50%, -50%);
}

.producer-pricing-handle-nudge::after {
  width: 14px;
}

.producer-component-add-row,
.producer-component-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(220px, 320px);
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.producer-component-add-row {
  grid-template-columns: minmax(280px, 1fr) auto;
  align-items: center;
}

.producer-component-add-row strong,
.producer-component-add-row span {
  display: block;
}

.producer-component-add-row label,
.producer-component-toolbar label {
  width: 100%;
}

.producer-sort-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  gap: 6px;
  align-items: center;
}

.producer-sort-direction-btn {
  min-width: 34px;
  height: 34px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
}

.producer-sort-direction-btn[data-producer-sort-direction="desc"] {
  color: var(--accent);
  border-color: var(--accent-soft);
  background: var(--accent-soft);
}

.producer-catalog-toolbar {
  grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px) minmax(180px, 240px);
}

.producer-catalog-list-wrap,
.producer-catalog-list {
  display: grid;
  gap: 8px;
}

.producer-catalog-family-group {
  display: grid;
  gap: 8px;
}

.producer-catalog-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(420px, 1.6fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-catalog-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.producer-catalog-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(58px, 1fr));
  gap: 6px;
}

.producer-catalog-metrics span {
  display: grid;
  gap: 1px;
  min-width: 0;
  padding: 6px 7px;
  border-radius: 6px;
  background: var(--surface-2);
}

.producer-catalog-metrics strong,
.producer-catalog-metrics small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-catalog-metrics strong {
  font-size: 13px;
}

.producer-catalog-metrics small {
  color: var(--text-muted);
  font-size: 10px;
}

.producer-catalog-add-panel {
  scroll-margin-top: 90px;
}

.producer-catalog-add-btn {
  white-space: nowrap;
}

.producer-component-family-group {
  display: grid;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.producer-component-family-group:first-child {
  padding-top: 0;
  border-top: 0;
}

.producer-component-family-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  list-style: none;
}

.producer-component-family-head::-webkit-details-marker {
  display: none;
}

.producer-component-family-head::after {
  content: "Mostrar/ocultar";
  color: var(--text-muted);
  font-size: 11px;
}

.producer-component-family-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  line-height: 1.25;
}

.producer-component-family-head span {
  color: var(--text-muted);
  font-size: 12px;
  white-space: nowrap;
}

.producer-component-family-rows {
  display: grid;
  gap: 8px;
}

.producer-team-list {
  display: grid;
  gap: 8px;
}

.producer-team-member-row,
.producer-pipeline-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px 0;
  border-top: 1px solid var(--border);
}

.producer-team-member-row:first-child,
.producer-pipeline-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.producer-role-chip-list {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.producer-team-add {
  margin-top: 12px;
}

.producer-team-add summary {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
}

.producer-plus-button {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 18px;
  line-height: 1;
}

.producer-team-form {
  margin-top: 14px;
}

.producer-company-map {
  min-height: 240px;
  margin-top: 4px;
}

.producer-partner-list {
  display: grid;
  gap: 10px;
}

.producer-assignment-list {
  display: grid;
  gap: 10px;
}

.producer-assignment-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(150px, 0.55fr) minmax(220px, 0.8fr);
  gap: 12px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-assignment-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--text-muted);
  font-size: 12px;
}

.producer-partner-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.producer-components-page .producer-component-offer-list {
  overflow-x: auto;
  padding-bottom: 4px;
}

.producer-pipeline-list {
  display: grid;
  gap: 8px;
}

.producer-pipeline-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  color: var(--text-muted);
  font-size: 12px;
}

.producer-business-page {
  align-items: stretch;
}

.producer-business-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.producer-business-grid-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.producer-business-metric {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.producer-business-metric span,
.producer-business-metric strong,
.producer-business-metric small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.producer-business-metric span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.producer-business-metric strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1.15;
}

.producer-business-metric small {
  color: var(--text-muted);
  font-size: 12px;
}

.producer-business-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: 14px;
  align-items: start;
}

.producer-business-cost-list {
  display: grid;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--surface);
}

.producer-business-cost-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-top: 1px solid var(--border);
  font-size: 13px;
}

.producer-business-cost-row:first-child {
  border-top: 0;
}

.producer-business-cost-row span {
  color: var(--text-muted);
}

.producer-business-cost-row strong {
  color: var(--text);
  text-align: right;
  white-space: nowrap;
}

.producer-business-cost-row.is-total {
  background: var(--surface-2);
}

.producer-business-cost-row.is-total span,
.producer-business-cost-row.is-total strong {
  color: var(--text);
  font-weight: 800;
}

.provider-review-pin-wrap {
  background: transparent;
  border: 0;
}

.provider-review-pin {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: var(--provider-marker-color, #1D4ED8);
  border: 3px solid #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.22);
}

.designer-home {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 1120px;
}

.workspace-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0 18px;
  border-bottom: 1px solid var(--border);
}

.workspace-hero-copy {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.workspace-eyebrow {
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  letter-spacing: var(--type-label-tracking);
  text-transform: uppercase;
  color: var(--workspace-sidebar-muted);
}

.workspace-title {
  margin: 0;
  font-size: var(--type-workspace-title-size);
  line-height: var(--type-workspace-title-line);
  letter-spacing: var(--type-title-tracking);
  color: var(--text);
  font-weight: var(--type-workspace-title-weight);
}

.workspace-subtitle {
  max-width: 620px;
  margin: 0;
  font-size: var(--type-body-size);
  color: var(--text-muted);
  line-height: 1.55;
}

.workspace-role-pill,
.role-switcher {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.workspace-role-pill {
  font-size: var(--type-caption-size);
  font-weight: var(--type-control-weight);
  color: var(--text);
}

.role-switcher span {
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  text-transform: uppercase;
  letter-spacing: var(--type-label-tracking);
  color: var(--text-muted);
}

.role-switcher select {
  min-width: 170px;
  border: none;
  padding: 0;
  box-shadow: none;
  background: transparent;
  font-size: var(--type-control-size);
  font-weight: var(--type-control-weight);
}

.stats-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.designer-home .stats-strip {
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--workspace-card-bg);
}

.stat-block {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.designer-home .stat-block {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 8px 12px;
}

.designer-home .stat-block + .stat-block {
  border-left: 1px solid var(--border);
}

.stat-label {
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  text-transform: uppercase;
  letter-spacing: var(--type-label-tracking);
  color: var(--text-muted);
}

.stat-value {
  font-size: 24px;
  line-height: 1;
  letter-spacing: var(--type-title-tracking);
  color: var(--text);
  font-weight: var(--type-workspace-title-weight);
}

.designer-home .stat-value {
  font-size: var(--type-workspace-title-size);
  font-weight: var(--type-workspace-title-weight);
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.workspace-panel {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
  padding: 16px;
}

.designer-home .workspace-panel,
.designer-home .workspace-disclosure {
  border-color: var(--border);
  background: var(--workspace-card-bg);
}

.designer-home .workspace-panel {
  padding: 8px 12px;
}

.workspace-panel-empty {
  max-width: 720px;
  border-color: var(--border);
  background: var(--workspace-card-bg);
}

.workspace-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.designer-home .workspace-panel-head {
  margin-bottom: 8px;
}

.workspace-panel-head h2 {
  margin: 0;
  font-size: var(--type-section-title-size);
  letter-spacing: var(--type-title-tracking);
  overflow-wrap: anywhere;
  font-weight: var(--type-section-title-weight);
}

.designer-home .workspace-panel-head h2 {
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  text-transform: uppercase;
  letter-spacing: var(--type-label-tracking);
  color: var(--text-muted);
  line-height: 1.2;
}

.workspace-panel-head p,
.workspace-panel-intro {
  margin: 4px 0 0;
  font-size: var(--type-body-small-size);
  color: var(--text-muted);
}

.status-list,
.project-overview-list {
  display: flex;
  flex-direction: column;
}

.status-row,
.project-overview-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
}

.status-row + .status-row,
.project-overview-row + .project-overview-row {
  border-top: 1px solid var(--border);
}

.project-overview-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.workspace-disclosure {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
  overflow: hidden;
}

.workspace-disclosure summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  font-size: var(--type-card-title-size);
  font-weight: var(--type-card-title-weight);
}

.workspace-disclosure summary::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--text-subtle);
  border-bottom: 1.5px solid var(--text-subtle);
  transform: rotate(45deg);
  transition: transform 0.16s ease, border-color 0.16s ease;
  flex: 0 0 auto;
}

.workspace-disclosure[open] summary::after {
  transform: rotate(225deg);
  border-color: var(--accent);
}

.workspace-disclosure summary::-webkit-details-marker {
  display: none;
}

.workspace-disclosure summary small {
  font-size: var(--type-caption-size);
  font-weight: var(--type-control-weight);
  color: var(--text-muted);
}

.workspace-disclosure-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
}

.workspace-disclosure-body {
  border-top: 1px solid var(--border);
  padding: 16px;
}

.profile-identity {
  padding: 9px 10px;
  border-radius: var(--radius);
  background: var(--surface-2);
  border: 1px solid var(--border);
  font-size: var(--type-body-small-size);
  font-weight: var(--type-control-weight);
}

.membership-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.defaults-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  border-top: 0;
}

.designer-home .defaults-action {
  position: relative;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 36px;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.25;
}

.designer-home .defaults-action::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 20;
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  box-shadow: none;
  color: var(--text);
  font-size: var(--type-caption-size);
  font-weight: 400;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
  opacity: 0;
  pointer-events: none;
  text-align: left;
  transform: translateY(4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
}

.designer-home .defaults-action:hover::after,
.designer-home .defaults-action:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}

.defaults-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  min-height: 138px;
  padding: 16px 18px 4px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.defaults-block + .defaults-block {
  border-left: 1px solid var(--border);
  padding-left: 18px;
}

.defaults-block h3 {
  margin: 0;
  font-size: 14px;
  line-height: 1.25;
  color: var(--text);
}

.defaults-block p {
  margin: 0;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.5;
}

.designer-home .btn.home-action-button,
.designer-home button.home-action-button {
  margin-top: auto;
  background: var(--workspace-card-button-bg);
  color: var(--text);
  border-color: var(--border);
}

.designer-home .btn.home-action-button:hover,
.designer-home button.home-action-button:hover {
  background: #E3E3E3;
  border-color: var(--selected-border);
  box-shadow: none;
}

/* ── Page header ─────────────────────────────────────────────────────── */
.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.page-header-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.page-title {
  font-size: var(--type-page-title-size);
  font-weight: var(--type-page-title-weight);
  letter-spacing: var(--type-title-tracking);
  color: var(--text);
  margin: 0;
}

.main-content > .page-header .page-title {
  color: var(--color-on-charcoal);
}

.page-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.page-header-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
}

/* ── Cards ───────────────────────────────────────────────────────────── */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: none;
}

.card-header {
  padding: 13px 15px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.card-title {
  font-size: var(--type-card-title-size);
  font-weight: var(--type-card-title-weight);
  color: var(--text);
  margin: 0;
}

.card-body {
  padding: 15px;
}

.constructor-collapsible-card {
  overflow: hidden;
}

.constructor-collapsible-card > summary.card-header {
  cursor: pointer;
  list-style: none;
}

.constructor-collapsible-card > summary.card-header::-webkit-details-marker {
  display: none;
}

.constructor-card-toggle {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  transition: transform 0.16s ease;
}

.constructor-collapsible-card[open] > summary .constructor-card-toggle {
  transform: rotate(180deg);
}

.constructor-collapsible-card.is-muted {
  background: color-mix(in srgb, var(--surface) 72%, var(--border) 28%);
  border-color: color-mix(in srgb, var(--border) 72%, var(--muted) 28%);
}

.constructor-collapsible-card.is-muted .card-title,
.constructor-collapsible-card.is-muted .field-help,
.constructor-collapsible-card.is-muted .empty-note {
  color: var(--muted);
}

.constructor-muted-card-stack {
  display: grid;
  gap: 12px;
  margin-top: 4px;
}

.constructor-card-action-row,
.constructor-muted-card-action,
.constructor-muted-card-meta {
  margin-bottom: 12px;
}

.constructor-project-resource-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.constructor-project-resource-card {
  width: 100%;
}

.constructor-date-inline-form {
  display: grid;
  grid-template-columns: minmax(180px, 240px) auto;
  gap: 10px;
  align-items: center;
  justify-content: start;
}

.constructor-project-resource-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}

.constructor-resource-list {
  display: grid;
  gap: 10px;
}

.constructor-resource-list.compact {
  gap: 8px;
}

.constructor-resource-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) - 2px);
  background: var(--surface);
}

.constructor-task-default-grid {
  display: grid;
  grid-template-columns: minmax(180px, 240px) auto;
  align-items: end;
  gap: 12px;
  margin-bottom: 14px;
}

.constructor-task-rule-list {
  display: grid;
  gap: 10px;
}

.constructor-task-rule-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 10px 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) - 2px);
  background: var(--surface);
}

.constructor-task-material-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.constructor-task-material-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 58px;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.55);
}

.constructor-task-material-row span {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.constructor-task-material-row strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.constructor-task-material-row small {
  color: var(--muted);
  font-size: 11px;
}

.constructor-resource-row-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.card-grid-account {
  align-items: start;
}

.workspace-account {
  background: var(--workspace-main-bg);
}

.workspace-account,
.workspace-account * {
  font-family: var(--font-ui);
}

.workspace-account .sidebar {
  background: #575A56;
  border-right-color: #545955;
}

.workspace-account .sidebar-scroll {
  scrollbar-color: #545955 #575A56;
}

.account-sidebar .sidebar-scroll {
  padding: 16px 10px;
}

.account-sidebar-section {
  display: grid;
  gap: 10px;
  padding: 0;
}

.account-sidebar-label {
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 0 4px;
}

.account-sidebar-count {
  color: color-mix(in srgb, var(--workspace-sidebar-muted) 84%, white);
  font-size: 10px;
  font-weight: 300;
  line-height: 1.25;
  text-align: right;
  text-transform: none;
}

.account-sidebar-space-list {
  display: grid;
  gap: 6px;
}

.account-sidebar-space-item {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--workspace-sidebar-control-bg) 74%, transparent);
  color: var(--workspace-sidebar-text);
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.account-sidebar-space-item:hover {
  border-color: var(--selected-border);
  background: var(--workspace-sidebar-control-bg);
}

.account-sidebar-space-item.module-card-disabled {
  cursor: default;
  opacity: 0.62;
}

.account-sidebar-space-main {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.account-sidebar-space-check {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
}

.account-sidebar-space-check input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: var(--accent);
}

.account-sidebar-space-title {
  min-width: 0;
  color: inherit;
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.25;
  overflow: hidden;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-sidebar-space-title:hover {
  color: var(--brand-charcoal);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.account-sidebar-space-status {
  color: var(--workspace-sidebar-muted);
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 300;
  line-height: 1.25;
  padding-left: 26px;
}

.account-main-content {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 24px 32px 40px;
}

.account-main-content > .card {
  display: grid;
  gap: 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.account-main-content .card,
.account-main-content .card-inner,
.account-collapsible-card,
.account-profile-form > .card,
.account-kind-section,
.account-organization-setup {
  background: var(--workspace-card-bg);
}

.account-main-content > .card > .card-header {
  align-items: flex-start;
  min-height: 124px;
  padding: 22px 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--workspace-top-card-bg);
}

.account-main-content > .card > .card-header .card-title {
  max-width: 560px;
  font-size: 28px;
  line-height: 1.1;
  font-weight: 400;
}

.account-main-content > .card > .card-header .subtle {
  max-width: 520px;
  color: var(--text-muted);
  font-size: 14px;
  line-height: 1.45;
  text-align: right;
}

.account-main-content > .card > .card-body {
  display: grid;
  gap: 16px;
  padding: 0;
}

.account-main-content > .card > .card-body > div[style*="margin-top:16px"] {
  margin-top: 0 !important;
}

.account-main-content .card-grid-account {
  grid-template-columns: minmax(520px, 1.18fr) minmax(360px, 0.82fr);
  gap: 16px;
  margin-top: 0 !important;
}

.account-main-content .card-grid-account + .card-grid-account {
  grid-template-columns: repeat(2, minmax(260px, 1fr));
}

.account-main-content .card-inner {
  min-width: 0;
  background: var(--workspace-card-bg);
  border-color: var(--border);
}

.account-main-content .card-inner > .card-header {
  min-height: 56px;
}

.account-main-content .card-title,
.account-collapsible-title .card-title,
.account-main-content .card-inner > .card-header .card-title {
  font-weight: 400;
}

.account-main-content .check-pill {
  border-radius: var(--radius);
}

.account-settings-shell {
  display: grid;
  gap: 16px;
  width: 100%;
}

.account-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 4px 8px;
}

.platform-action-icon {
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
}

.platform-action-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

:where(
  .platform-action-icon,
  .platform-action-icon svg,
  .platform-inline-icon,
  button svg:not(.admin-pipeline-map-svg),
  .btn svg:not(.admin-pipeline-map-svg),
  .message > svg,
  .construction-sequence-warning-icon,
  .empty-state-icon,
  img[class*="icon"],
  svg[class*="icon"],
  .sidebar-sort-direction-icon,
  .marketplace-sort-direction-icon,
  .marketplace-item-detail-icon,
  .marketplace-cart-add-icon svg
) {
  filter: var(--platform-icon-filter);
}

.platform-action-svg.is-undo-redo {
  fill: currentColor;
  stroke: none;
}

.platform-action-svg.is-undo-redo .platform-action-icon-shade {
  opacity: 0.74;
}

.platform-action-svg.is-save-site {
  filter: var(--platform-icon-filter);
}

.platform-action-svg.is-download {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.platform-action-svg.is-lock-tool,
.platform-action-svg.is-unlock-tool {
  fill: currentColor;
  stroke: none;
}

.platform-action-svg.is-lock-tool .lock-body,
.platform-action-svg.is-unlock-tool .lock-body {
  opacity: 0.9;
}

.platform-action-svg.is-lock-tool .lock-highlight,
.platform-action-svg.is-unlock-tool .lock-highlight {
  opacity: 0.36;
}

.account-kind-topbar {
  overflow: hidden;
}

.account-kind-topbar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 56px;
  padding: 12px 14px;
  border-bottom: 0;
}

.account-kind-topbar-left,
.account-kind-topbar-actions {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.account-kind-topbar-left {
  flex: 1 1 auto;
  gap: 12px;
}

.account-kind-topbar-left .card-title {
  flex: 0 0 auto;
}

.account-kind-topbar-actions {
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: 8px;
}

.account-main-content button,
.account-main-content .btn,
.account-main-content .download-link {
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: var(--type-button-weight);
  box-shadow: none;
}

.account-main-content button:hover,
.account-main-content .btn:hover,
.account-main-content .download-link:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--text);
  box-shadow: none;
}

.account-main-content button.primary,
.account-main-content .btn.primary,
.account-main-content .btn-primary,
.account-main-content .download-link.primary {
  border-color: var(--accent);
  background: var(--workspace-card-button-bg);
  color: var(--text);
}

.account-main-content button.primary:hover,
.account-main-content .btn.primary:hover,
.account-main-content .btn-primary:hover,
.account-main-content .download-link.primary:hover {
  border-color: var(--accent-hover);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  color: var(--text);
}

.account-main-content button.ghost,
.account-main-content .btn.ghost,
.account-main-content .btn-ghost {
  border-color: transparent;
  background: transparent;
  color: var(--text-muted);
}

.account-main-content input,
.account-main-content select,
.account-main-content textarea {
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  box-shadow: none;
}

.account-main-content input:hover,
.account-main-content select:hover,
.account-main-content textarea:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
}

.account-main-content input:focus,
.account-main-content select:focus,
.account-main-content textarea:focus {
  outline: none;
  border-color: var(--selected-border);
  background: #E3E3E3;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 16%, transparent);
}

.account-main-content input:disabled,
.account-main-content select:disabled,
.account-main-content textarea:disabled {
  background: color-mix(in srgb, var(--workspace-card-button-bg) 82%, var(--workspace-card-bg));
  color: var(--text-muted);
}

.account-collapsible-card {
  min-width: 0;
  overflow: hidden;
}

.account-collapsible-card > summary.account-collapsible-summary {
  cursor: pointer;
  list-style: none;
  min-height: 52px;
}

.account-collapsible-card > summary.account-collapsible-summary::-webkit-details-marker {
  display: none;
}

.account-collapsible-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.account-collapsible-title .card-title {
  line-height: 1.2;
  font-weight: 400;
}

.account-card-summary-text {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 300;
  line-height: 1.35;
}

.account-collapsible-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.account-card-toggle {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  transition: transform 0.16s ease;
}

.account-collapsible-card[open] > summary .account-card-toggle {
  transform: rotate(180deg);
}

.account-kind-select {
  width: min(240px, 100%);
  min-width: 190px;
  max-width: 240px;
  height: 34px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: var(--type-button-weight);
  line-height: 1.2;
  box-shadow: none;
}

select.account-kind-select {
  padding: 5px 28px 5px 10px;
}

.account-kind-select:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--text);
}

.account-kind-select:focus {
  outline: none;
  border-color: var(--selected-border);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 16%, transparent);
}

.account-kind-current {
  display: inline-flex;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--border));
  border-radius: var(--radius-sm);
  background: var(--accent-soft);
  color: var(--accent-hover);
  font-weight: 700;
  padding-inline: 10px;
}

.account-kind-compact .card-body {
  padding-block: 10px;
}

.account-kind-copy {
  margin: 0;
}

.account-profile-form {
  display: grid;
  gap: 16px;
}

.account-profile-form > .card,
.account-kind-section,
.account-organization-setup {
  width: 100%;
}

.account-username-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.account-username-row .btn {
  height: 36px;
  white-space: nowrap;
}

.account-username-check-result {
  min-height: 16px;
}

.account-username-check-result.is-success {
  color: #12613F;
}

.account-username-check-result.is-error {
  color: var(--danger);
}

.account-billing-grid {
  display: grid;
  grid-template-columns: minmax(340px, 0.88fr) minmax(420px, 1.12fr);
  gap: 16px;
  align-items: start;
}

.account-billing-block {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.account-billing-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.account-billing-heading strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.3;
}

.account-billing-heading-compact {
  margin-top: 2px;
}

.account-payment-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-payment-actions {
  align-items: center;
  gap: 10px;
}

.account-payment-result {
  min-height: 16px;
}

.account-payment-result.is-success {
  color: #12613F;
}

.account-payment-result.is-error {
  color: var(--danger);
}

.account-payment-security-note {
  margin: 0;
}

.account-payment-method-list {
  display: grid;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.account-payment-method-row,
.account-transaction-row {
  min-width: 0;
  padding: 10px 0;
  border-top: 1px solid var(--border);
}

.account-payment-method-row:first-of-type,
.account-transaction-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.account-payment-method-row div,
.account-transaction-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.account-payment-method-row strong,
.account-transaction-main strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.account-payment-method-row span,
.account-transaction-main span {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.account-billing-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.account-billing-kpi {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.account-billing-kpi span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: uppercase;
}

.account-billing-kpi strong {
  color: var(--text);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.account-transaction-list {
  display: grid;
  gap: 0;
  max-height: 340px;
  overflow: auto;
  padding-right: 4px;
}

.account-transaction-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.account-transaction-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  text-align: right;
}

.account-transaction-side strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  white-space: nowrap;
}

.account-organization-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

.account-organization-row .info-value {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.account-organization-admin-block,
.account-employee-apply-block {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

.account-admin-heading,
.account-member-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.account-admin-heading > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.account-employee-admin-form,
.account-employee-apply-form {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.account-role-checkbox-grid {
  gap: 8px;
}

.account-role-pill {
  border-radius: var(--radius);
}

.account-member-list,
.account-invitation-list,
.account-employee-current-list {
  display: grid;
  gap: 8px;
}

.account-member-row {
  min-width: 0;
  padding: 10px 0;
  border-top: 1px solid var(--border);
}

.account-member-row:first-child {
  border-top: 0;
}

.account-member-actions {
  justify-content: flex-end;
}

.account-invitation-row {
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
}

.account-main-content .account-secondary-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-space-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.account-space-grid .module-card {
  display: flex;
  min-height: 0;
  flex-direction: column;
  background: var(--workspace-card-bg);
  border-color: var(--border);
}

.account-space-card-openable {
  cursor: pointer;
}

.account-space-card-openable:hover {
  border-color: var(--selected-border);
}

.account-space-card .module-card-head h3 {
  color: var(--text);
  font-weight: 400;
}

.account-space-card .module-card-head h3 a,
.account-space-card .module-card-head h3 span {
  color: inherit;
  text-decoration: none;
}

.account-space-card .module-card-head h3 a:hover {
  color: var(--accent-hover);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.account-space-card-designer .module-card-head h3 {
  color: var(--brand-charcoal);
}

.account-space-status,
.account-space-card .module-card-meta span {
  background: transparent;
  border: 0;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 300;
  line-height: 1.35;
  padding: 0;
}

.account-space-card .module-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}

.account-space-grid .module-card-actions {
  margin-top: auto;
}

.account-space-visibility {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
}

.account-space-visibility input {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
}

.transactions-main-content {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 24px 32px 40px;
}

.workspace-transactions {
  background: var(--bg);
}

.transactions-shell {
  display: grid;
  gap: 16px;
  width: 100%;
}

.transactions-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.transactions-kpi-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.transactions-kpi-card span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: uppercase;
}

.transactions-kpi-card strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.transactions-layout {
  display: grid;
  grid-template-columns: minmax(330px, 0.82fr) minmax(0, 1.18fr);
  gap: 16px;
  align-items: start;
}

.transactions-payment-card {
  min-width: 0;
}

.transactions-payment-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.34fr);
  gap: 14px;
  align-items: start;
}

.transactions-payment-form {
  grid-template-columns: minmax(170px, 1fr) minmax(230px, 1.2fr) repeat(3, minmax(110px, 0.7fr)) minmax(150px, 0.8fr);
  align-items: end;
}

.transactions-payment-button-field {
  justify-content: end;
}

.transactions-payment-button-field .btn {
  width: 100%;
}

.transactions-payment-methods {
  padding-top: 0;
  border-top: 0;
  border-left: 1px solid var(--border);
  padding-left: 14px;
}

.transactions-ledger-card,
.transaction-detail-card {
  min-width: 0;
}

.transactions-ledger-card > .card-header {
  gap: 12px;
}

.transactions-filter {
  width: auto;
  min-width: 164px;
}

.transaction-ledger-list {
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 246px);
  overflow: auto;
}

.transaction-ledger-row {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  text-align: left;
}

.transaction-ledger-row:hover,
.transaction-ledger-row.active {
  border-color: var(--selected-border);
  background: var(--surface);
}

.transaction-ledger-row.active {
  color: var(--brand-charcoal);
  box-shadow: var(--selected-ring);
}

.transaction-ledger-main,
.transaction-ledger-side,
.transaction-line-row span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.transaction-ledger-main strong,
.transaction-line-row strong {
  overflow-wrap: anywhere;
}

.transaction-ledger-main small,
.transaction-ledger-side small,
.transaction-line-row small {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}

.transaction-ledger-side {
  justify-items: end;
  text-align: right;
}

.transaction-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.transaction-detail-body {
  display: grid;
  gap: 16px;
}

.transaction-stage-rail {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.transaction-stage {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.transaction-stage-dot {
  width: 10px;
  height: 10px;
  margin-top: 3px;
  border-radius: 999px;
  background: var(--muted);
}

.transaction-stage strong,
.transaction-detail-section h4 {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.25;
}

.transaction-stage span:not(.transaction-stage-dot) {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.transaction-stage-complete .transaction-stage-dot {
  background: #12613F;
}

.transaction-stage-active .transaction-stage-dot {
  background: #B45309;
}

.transaction-stage-warning .transaction-stage-dot {
  background: var(--danger);
}

.transaction-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.transaction-detail-section {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.transaction-line-list,
.transaction-money-list {
  display: grid;
  gap: 0;
}

.transaction-line-row,
.transaction-money-list div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-top: 1px solid var(--border);
}

.transaction-line-row:first-child,
.transaction-money-list div:first-child {
  border-top: 0;
  padding-top: 0;
}

.transaction-money-list span {
  color: var(--text-muted);
  font-size: 12px;
}

.transaction-trace-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.transaction-trace-grid div {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
}

.transaction-trace-grid strong {
  color: var(--text);
  font-size: 15px;
}

.transaction-trace-grid span {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.25;
}

.card-inner {
  border-radius: var(--radius);
  box-shadow: none;
}

.project-form-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.main-content:has(> .project-form-stack) {
  align-items: stretch;
  gap: 12px;
}

.main-content:has(> .project-form-stack) > .project-form-stack,
.main-content:has(> .project-form-stack) > .workspace-disclosure,
.main-content:has(> .project-form-stack) > .card-grid {
  width: 100%;
  max-width: 100%;
}

.main-content:has(> .project-form-stack) > .card-grid {
  gap: 12px;
}

.project-form-stack .workspace-disclosure,
.project-form-stack .card,
.project-form-stack .card-inner {
  border-color: var(--designer-card-border);
  background: var(--designer-card-bg);
  box-shadow: none;
}

.project-form-stack .workspace-disclosure summary,
.project-form-stack .card-header {
  background: var(--designer-card-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.project-form-stack .workspace-disclosure summary > span,
.project-form-stack .card-header .card-title,
.project-form-stack .workspace-disclosure summary small {
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.project-form-stack > .workspace-disclosure > summary {
  height: 46px;
  min-height: 46px;
  padding: 6px 14px;
}

.project-form-stack > .workspace-disclosure > summary > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-form-stack > .workspace-disclosure > summary .workspace-disclosure-actions {
  min-height: 30px;
}

.project-form-stack > .workspace-disclosure > summary .btn,
.project-form-stack > .workspace-disclosure > summary .download-all-action {
  min-height: 30px;
  padding: 4px 10px;
  font-weight: 400;
}

.project-header-action-card {
  overflow: hidden;
}

.project-header-action-summary {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 46px;
  min-height: 46px;
  padding: 6px 14px;
  background: var(--designer-card-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.project-header-action-summary::after {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  margin-left: 0;
}

.project-processing-scope {
  display: grid;
  gap: 10px;
}

.project-processing-scope-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  color: var(--text);
  font-family: var(--font-ui);
}

.project-processing-scope-head span {
  font-size: var(--type-card-title-size);
  font-weight: 500;
}

.project-processing-scope-head small {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 400;
}

.project-processing-scope-grid {
  display: grid;
  gap: 6px;
}

.project-processing-scope-group {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
}

.project-processing-scope-group > summary {
  cursor: pointer;
  list-style-position: inside;
}

.project-processing-scope-group > summary::-webkit-details-marker {
  color: var(--text-muted);
}

.project-processing-scope-group-body {
  display: grid;
  gap: 0;
  min-width: 0;
}

.project-processing-scope-group-body > .project-processing-scope-row {
  border: 0;
  border-top: 1px solid var(--designer-card-divider);
  border-radius: 0;
  background: transparent;
}

.project-processing-scope-houses-group {
  margin: 0 8px 8px 22px;
  border-color: var(--designer-card-divider);
  border-radius: var(--radius-xs);
}

.project-processing-scope-houses-group > summary {
  border: 0;
  border-radius: 0;
}

.project-processing-scope-houses-body > .project-processing-scope-row {
  padding-left: 18px;
}

.project-processing-scope-row {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
}

.project-processing-scope-house {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 400;
}

.project-processing-scope-toggles {
  display: grid;
  grid-template-columns: repeat(3, minmax(96px, 1fr));
  align-items: center;
  gap: 6px;
  width: min(100%, 390px);
}

.project-processing-scope-toggle {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  user-select: none;
}

.project-processing-scope-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  opacity: 0;
  pointer-events: none;
}

.project-processing-scope-toggle span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-xs);
  background: color-mix(in srgb, var(--designer-card-bg) 72%, var(--designer-card-button-bg) 28%);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 400;
}

.project-processing-scope-toggle input:checked + span {
  border-color: rgba(230, 108, 35, 0.45);
  background: rgba(230, 108, 35, 0.14);
  color: var(--brand-charcoal);
}

.project-processing-scope-column-toggle {
  min-height: 30px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-xs);
  background: color-mix(in srgb, var(--designer-card-bg) 72%, var(--designer-card-button-bg) 28%);
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}

.project-processing-scope-column-toggle.active {
  border-color: rgba(230, 108, 35, 0.55);
  background: rgba(230, 108, 35, 0.18);
  color: var(--brand-charcoal);
}

.project-processing-scope-column-toggle.is-mixed {
  border-color: rgba(230, 108, 35, 0.34);
  color: color-mix(in srgb, var(--brand-orange) 72%, var(--text) 28%);
}

.project-processing-scope-column-toggle:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.project-processing-scope-bulk-row {
  border-style: dashed;
  background: color-mix(in srgb, var(--designer-card-button-bg) 78%, var(--designer-card-bg) 22%);
}

.project-processing-scope-group > .project-processing-scope-bulk-row {
  border: 0;
  border-radius: 0;
}

.project-processing-scope-empty {
  margin: 2px 10px 0;
}

.project-processing-scope-toggle input:disabled + span {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (max-width: 700px) {
  .project-processing-scope-head,
  .project-processing-scope-row {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .project-processing-scope-head {
    display: grid;
  }

  .project-processing-scope-toggles {
    width: 100%;
  }

  .project-processing-scope-houses-group {
    margin-left: 10px;
  }
}

.project-delete-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--danger) 42%, var(--designer-card-button-border));
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--danger-soft) 68%, var(--designer-card-bg) 32%);
}

.project-delete-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.project-delete-copy strong {
  color: var(--danger);
  font-size: var(--type-card-title-size);
  font-weight: 500;
}

.project-delete-copy span {
  color: color-mix(in srgb, var(--danger) 72%, var(--text) 28%);
  font-size: 12px;
  line-height: 1.35;
}

.project-delete-card .project-action-button {
  flex: 0 0 auto;
}

.project-header-action-summary > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 400;
}

.project-header-action-button,
[data-disclosure-id="project-downloads"] .download-all-action {
  width: 148px;
  min-width: 148px;
  justify-content: center;
  text-align: center;
  font-weight: 400;
}

.project-form-disclosure .workspace-disclosure-body {
  background: var(--designer-card-bg);
}

.project-procurement-card {
  border-color: var(--designer-card-border);
  background: var(--designer-card-bg);
}

.project-procurement-card-header,
.project-procurement-results-header {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 14px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.project-procurement-card-body {
  padding: 0;
  border-top-color: var(--designer-card-divider);
}

.project-procurement-card-body > .workspace-disclosure {
  border: 0;
  border-bottom: 1px solid var(--designer-card-divider);
  border-radius: 0;
  background: transparent;
}

.project-procurement-card-body > .workspace-disclosure > summary {
  min-height: 42px;
  padding: 6px 14px;
  background: transparent;
  font-size: 13px;
}

.project-procurement-card-body > .workspace-disclosure > .workspace-disclosure-body {
  padding: 14px;
  border-top-color: var(--designer-card-divider);
}

.project-procurement-results {
  background: transparent;
}

.project-procurement-results-header {
  align-items: baseline;
  border-bottom: 1px solid var(--designer-card-divider);
}

.project-procurement-results-header small {
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  font-weight: 300;
}

.project-procurement-results > .workspace-disclosure-body {
  padding: 14px;
  border-top: 0;
  background: var(--designer-card-bg);
}

[data-disclosure-id="project-downloads"],
[data-disclosure-id="project-bom"],
[data-disclosure-id="project-eett"],
[data-disclosure-id="project-procurement-logistics"],
[data-disclosure-id="project-share"],
[data-disclosure-id="project-results"] {
  border-color: var(--designer-card-border);
  background: var(--designer-card-bg);
  box-shadow: none;
}

[data-disclosure-id="project-downloads"] summary,
[data-disclosure-id="project-bom"] summary,
[data-disclosure-id="project-eett"] summary,
[data-disclosure-id="project-procurement-logistics"] summary,
[data-disclosure-id="project-share"] summary,
[data-disclosure-id="project-results"] summary {
  background: var(--designer-card-bg);
  height: 46px;
  min-height: 46px;
  padding: 6px 14px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

[data-disclosure-id="project-downloads"] summary > span,
[data-disclosure-id="project-bom"] summary > span,
[data-disclosure-id="project-eett"] summary > span,
[data-disclosure-id="project-procurement-logistics"] summary > span,
[data-disclosure-id="project-share"] summary > span,
[data-disclosure-id="project-results"] summary > span,
[data-disclosure-id="project-downloads"] summary small,
[data-disclosure-id="project-bom"] summary small,
[data-disclosure-id="project-eett"] summary small,
[data-disclosure-id="project-procurement-logistics"] summary small,
[data-disclosure-id="project-share"] summary small,
[data-disclosure-id="project-results"] summary small {
  font-weight: 400;
}

[data-disclosure-id="project-downloads"] .workspace-disclosure-body,
[data-disclosure-id="project-bom"] .workspace-disclosure-body,
[data-disclosure-id="project-eett"] .workspace-disclosure-body,
[data-disclosure-id="project-procurement-logistics"] .workspace-disclosure-body,
[data-disclosure-id="project-share"] .workspace-disclosure-body,
[data-disclosure-id="project-results"] .workspace-disclosure-body {
  background: var(--designer-card-bg);
}

[data-disclosure-id="project-bom"] .empty-note {
  color: var(--text);
}

[data-disclosure-id="project-latest-job"],
[data-disclosure-id="project-notes"] {
  display: none;
}

[data-disclosure-id="project-results"] {
  grid-column: 1 / -1;
  width: 100%;
}

.project-results-job-block {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-results-subtitle {
  margin: 0 0 8px;
  color: var(--text);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.project-form-stack input,
.project-form-stack select,
.project-form-stack textarea {
  background: var(--designer-card-control-bg);
  border-color: var(--designer-card-button-border);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.project-form-stack input:focus,
.project-form-stack select:focus,
.project-form-stack textarea:focus {
  border-color: var(--selected-border);
  box-shadow: none;
}

.project-form-stack input:disabled,
.project-form-stack select:disabled,
.project-form-stack textarea:disabled {
  background: var(--designer-card-control-bg-disabled);
  color: var(--text-muted);
}

.project-form-stack .field-label,
.project-form-stack .workspace-panel-intro,
.project-form-stack .field-help {
  font-family: var(--font-ui);
  font-weight: 400;
  letter-spacing: 0;
}

.project-form-stack .divider,
[data-disclosure-id="project-results"] .divider,
.account-main-content .divider {
  border-top-color: var(--designer-card-divider);
}

.project-form-stack .info-row + .info-row,
[data-disclosure-id="project-results"] .info-row + .info-row,
.account-main-content .info-row + .info-row {
  border-top-color: var(--designer-card-divider);
}

.project-form-stack .btn.secondary,
.project-form-stack button.secondary,
.project-form-stack .download-link.secondary {
  background: var(--designer-card-button-bg);
  border-color: var(--designer-card-button-border);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
  box-shadow: none;
}

.project-form-stack .btn.secondary:hover,
.project-form-stack button.secondary:hover,
.project-form-stack .download-link.secondary:hover {
  background: var(--designer-card-button-bg-hover);
  border-color: var(--designer-card-selected-border);
}

.compact-disclosure summary {
  padding: 11px 13px;
  font-size: 13px;
}

.compact-disclosure .workspace-disclosure-body {
  padding: 13px;
}

/* ── Form ────────────────────────────────────────────────────────────── */
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 14px;
}

.field-span-2 { grid-column: 1 / -1; }

.field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.checkbox-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.check-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}

.check-pill input {
  width: auto;
  margin: 0;
  padding: 0;
  border: none;
  box-shadow: none;
  background: transparent;
}

.field-label {
  font-size: var(--type-caption-size);
  font-weight: var(--type-label-weight);
  color: var(--text);
  letter-spacing: var(--type-title-tracking);
}

.field-help {
  font-size: var(--type-label-size);
  color: var(--text-muted);
  line-height: 1.4;
}

input, select, textarea {
  width: 100%;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 7px 9px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: var(--type-control-size);
  transition: border-color 0.15s, box-shadow 0.15s;
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 13%, transparent);
}

input:disabled, select:disabled, textarea:disabled {
  background: var(--surface-2);
  color: var(--text-muted);
  cursor: not-allowed;
}

select.multi-select {
  min-height: 132px;
  padding-block: 6px;
}

textarea {
  min-height: 84px;
  resize: vertical;
}

.processing-panel {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(180deg, rgba(239,246,255,0.75), rgba(255,255,255,0.98)),
    var(--surface);
}

.processing-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.processing-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.processing-group-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.processing-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.processing-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255,255,255,0.86);
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}

.processing-card.active {
  border-color: #93C5FD;
  box-shadow: 0 0 0 3px rgba(29,78,216,0.08);
  background: #FFFFFF;
}

.processing-toggle {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 12px 8px;
  cursor: pointer;
}

.processing-toggle input {
  width: auto;
  margin-top: 2px;
  padding: 0;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.processing-toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.processing-toggle-copy strong {
  font-size: 13px;
  color: var(--text);
}

.processing-toggle-copy small {
  color: var(--text-muted);
  line-height: 1.45;
}

.processing-card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 12px 12px;
}

.module-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.module-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255,255,255,0.9);
  padding: 12px;
}

.project-form-stack .module-card {
  border-color: var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.project-form-stack .module-card-head h3,
.project-form-stack .module-card-head p,
.project-form-stack .module-card-meta,
.project-form-stack .module-card-actions {
  font-family: var(--font-ui);
  font-weight: 400;
}

.module-card-disabled {
  opacity: 0.7;
}

.module-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.module-card-head h3 {
  margin: 0;
  font-size: 14px;
  letter-spacing: 0;
}

.module-card-head p {
  margin: 4px 0 0;
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.4;
}

.module-card-meta,
.module-card-actions {
  margin-top: 10px;
}

.project-processing-mode-shell {
  display: grid;
  gap: 8px;
}

.project-processing-mode-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.project-processing-package-card {
  display: flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 8px;
  background: var(--designer-card-button-bg);
  border-color: var(--designer-card-button-border);
  cursor: pointer;
  font-family: var(--font-graphik);
  font-weight: 400;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.project-processing-package-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-top: 0;
}

.project-processing-package-card span {
  font-family: var(--font-graphik);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
}

#processing_mode_architecture:checked ~ .project-processing-package-grid label[for="processing_mode_architecture"],
#processing_mode_construction:checked ~ .project-processing-package-grid label[for="processing_mode_construction"],
#processing_mode_analysis:checked ~ .project-processing-package-grid label[for="processing_mode_analysis"] {
  border-color: var(--designer-card-selected-border);
  box-shadow: none;
  background: var(--designer-card-selected-bg);
  color: var(--brand-charcoal);
}

.project-processing-mode-panel {
  display: none;
  gap: 8px;
}

#processing_mode_architecture:checked ~ .project-processing-mode-panels [data-processing-panel="architecture"],
#processing_mode_construction:checked ~ .project-processing-mode-panels [data-processing-panel="construction"],
#processing_mode_analysis:checked ~ .project-processing-mode-panels [data-processing-panel="analysis"] {
  display: grid;
}

.project-processing-actions {
  margin-top: 4px;
}

.project-sheets-actions {
  grid-template-columns: minmax(0, 1fr);
}

.project-processing-service-shell {
  display: grid;
  gap: 9px;
}

.project-processing-service-shell[data-processing-package="architecture"] {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.8fr);
  align-items: start;
}

.project-processing-service-shell-included {
  opacity: 0.92;
}

.project-processing-service-group {
  display: grid;
  gap: 5px;
  padding-top: 8px;
  border-top: 1px solid color-mix(in srgb, var(--designer-card-bg) 76%, var(--brand-charcoal) 24%);
}

.project-processing-service-group:first-child {
  padding-top: 0;
  border-top: 0;
}

.project-processing-service-shell[data-processing-package="architecture"] .project-processing-service-group {
  padding-top: 0;
  border-top: 0;
}

.project-processing-service-shell[data-processing-package="architecture"] .project-processing-service-group + .project-processing-service-group {
  padding-left: 10px;
  border-left: 1px solid color-mix(in srgb, var(--designer-card-bg) 76%, var(--brand-charcoal) 24%);
}

.project-processing-service-group h4 {
  margin: 0;
  color: var(--brand-charcoal);
  font-family: var(--font-graphik);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
}

.project-processing-service-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding-left: 8px;
}

.project-processing-service-option {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 8px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--brand-charcoal);
  font-family: var(--font-graphik);
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.project-processing-service-option span {
  line-height: 1.15;
}

.project-processing-service-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.project-processing-service-included {
  cursor: default;
  opacity: 0.82;
}

.project-processing-included-grid {
  pointer-events: none;
}

.project-processing-service-option:has(input:checked) {
  border-color: var(--designer-card-selected-border);
  box-shadow: none;
  background: var(--designer-card-selected-bg);
  color: var(--brand-charcoal);
}

.project-processing-service-option.is-disabled {
  opacity: 0.44;
  cursor: not-allowed;
}

.project-processing-service-option.is-disabled:has(input:checked) {
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
}

.project-processing-estimate {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
}

.project-processing-estimate-head h4 {
  margin: 0;
  color: var(--brand-charcoal);
  font-family: var(--font-graphik);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
}

.project-processing-estimate-table {
  display: grid;
  gap: 0;
}

.project-processing-estimate-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, max-content);
  gap: 10px;
  padding: 3px 0;
  border-top: 1px solid var(--designer-card-button-border);
  color: var(--brand-charcoal);
  font-family: var(--font-graphik);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
}

.project-processing-estimate-row span:last-child {
  text-align: right;
}

.project-processing-estimate-row-head {
  color: var(--text-muted);
  font-size: 12px;
  padding-bottom: 4px;
}

.project-processing-estimate-category {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid color-mix(in srgb, var(--designer-card-button-bg) 72%, var(--brand-charcoal) 28%);
  color: var(--brand-charcoal);
  font-family: var(--font-graphik);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
}

.project-processing-estimate-category + .project-processing-estimate-row {
  border-top: 0;
}

.project-processing-estimate-category + .project-processing-estimate-row,
.project-processing-estimate-category + .project-processing-estimate-row + .project-processing-estimate-row,
.project-processing-estimate-row:not(.project-processing-estimate-row-head):not(.project-processing-estimate-total) {
  padding-left: 8px;
  font-size: 12px;
}

.project-processing-estimate-total {
  font-weight: 400;
  margin-top: 4px;
  padding-top: 5px;
}

.marketplace-shell {
  display: grid;
  gap: 14px;
}

.marketplace-shell,
.marketplace-sidebar {
  --marketplace-card-bg: var(--designer-card-bg);
  --marketplace-card-border: var(--designer-card-border);
  --marketplace-button-bg: var(--designer-card-button-bg);
  --marketplace-button-bg-hover: var(--designer-card-button-bg-hover);
  --marketplace-button-border: var(--designer-card-button-border);
  --marketplace-selected-bg: var(--designer-card-selected-bg);
  --marketplace-selected-border: var(--designer-card-selected-border);
  --marketplace-divider: var(--designer-card-divider);
  --marketplace-control-bg: var(--designer-card-control-bg);
  --marketplace-control-bg-hover: var(--designer-card-button-bg-hover);
  --marketplace-control-border: var(--designer-card-button-border);
  --marketplace-control-border-hover: var(--designer-card-selected-border);
  --marketplace-control-radius: var(--radius-sm);
  --marketplace-control-color: var(--text);
  --marketplace-control-font: var(--font-ui);
  --marketplace-control-size: var(--type-control-size);
  --marketplace-control-weight: 400;
}

.marketplace-shell,
.marketplace-shell *,
.marketplace-sidebar,
.marketplace-sidebar * {
  font-family: var(--font-ui);
}

.marketplace-shell .field-label,
.marketplace-shell label,
.marketplace-shell input,
.marketplace-shell select,
.marketplace-shell textarea,
.marketplace-shell button,
.marketplace-sidebar .field-label,
.marketplace-sidebar label,
.marketplace-sidebar input,
.marketplace-sidebar select,
.marketplace-sidebar textarea,
.marketplace-sidebar button {
  font-weight: 400;
}

.marketplace-shell .field-label,
.marketplace-sidebar .field-label {
  color: var(--text);
  font-size: var(--type-caption-size);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.25;
}

.marketplace-context-panel,
.marketplace-catalog-toolbar,
.marketplace-cart-panel {
  background: var(--workspace-card-bg);
  border-color: var(--border);
}

.marketplace-context-grid {
  display: grid;
  grid-template-columns: minmax(150px, 0.85fr) minmax(160px, 0.9fr) minmax(280px, 1.35fr);
  gap: 12px;
  align-items: end;
}

.marketplace-shell [data-disclosure-id="marketplace-address"] summary {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.marketplace-shell [data-disclosure-id="marketplace-address"] summary > span,
.marketplace-shell [data-disclosure-id="marketplace-address"] summary small {
  font-weight: 400;
}

.marketplace-segmented {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.marketplace-fulfillment-options .check-pill {
  min-height: 34px;
  padding: 6px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  line-height: 1.15;
}

.marketplace-fulfillment-options .check-pill input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.marketplace-fulfillment-options .check-pill:has(input:checked) {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  color: var(--text);
}

.marketplace-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.marketplace-main {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.marketplace-tab-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.marketplace-tab {
  width: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  min-height: 34px;
  padding: 6px 11px;
  font-size: var(--type-control-size);
  font-weight: 400;
}

.marketplace-tab.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  color: var(--text);
}

.marketplace-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  align-items: end;
}

.marketplace-search-field {
  min-width: 0;
}

.marketplace-catalog-count {
  align-self: end;
  justify-self: end;
  min-width: 54px;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  font-weight: 400;
  text-align: center;
}

.marketplace-map-picker {
  height: 280px;
  margin-top: 12px;
}

.marketplace-map-coords {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.marketplace-locate-action {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.marketplace-locate-action .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 148px;
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  min-height: 34px;
  font-size: var(--type-control-size);
  font-weight: 400;
}

.marketplace-model-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr);
  align-items: end;
  gap: 12px;
}

.marketplace-filter-card {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.marketplace-filter-card-date {
  grid-template-columns: minmax(180px, 1fr) minmax(120px, 0.45fr);
  align-items: end;
}

.marketplace-restriction-filters {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.marketplace-filter-card-head {
  grid-column: 1 / -1;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  color: var(--brand-charcoal);
  font-size: var(--type-caption-size);
  font-weight: 400;
}

.marketplace-add-filter-btn {
  width: auto;
  min-width: 148px;
  justify-content: center;
}

.marketplace-additional-filter-list {
  display: grid;
  gap: 8px;
}

.marketplace-filter-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) 34px;
  gap: 7px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
}

.marketplace-filter-threshold {
  display: grid;
  grid-template-columns: minmax(72px, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.marketplace-filter-threshold small {
  color: var(--text-muted);
  font-size: var(--type-label-size);
}

.marketplace-filter-remove {
  width: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  justify-content: center;
}

.marketplace-criteria-form {
  display: grid;
  gap: 12px;
}

.marketplace-criteria-form > .workspace-disclosure {
  background: var(--workspace-card-bg);
  border-color: var(--border);
}

.marketplace-criteria-form > .workspace-disclosure > summary {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.marketplace-catalog-toolbar-embedded {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--workspace-card-bg) 78%, var(--brand-charcoal) 22%);
  background: transparent;
}

.marketplace-catalog-selector-label {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: 400;
  line-height: 1.2;
}

.marketplace-catalog-toolbar-embedded .marketplace-tab-row {
  margin-bottom: 0;
  padding-bottom: 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--workspace-card-bg) 78%, var(--brand-charcoal) 22%);
}

.marketplace-procurement-grid {
  padding-top: 0;
  border-top: 0;
}

.marketplace-fulfillment-field {
  min-width: 0;
}

.marketplace-template-actions {
  display: flex;
  align-items: end;
  min-height: 34px;
}

.marketplace-template-actions .template-download-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.marketplace-sort-field {
  min-width: 0;
}

.marketplace-sort-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  gap: 6px;
  align-items: center;
}

.marketplace-sort-direction-btn {
  min-width: 34px;
  width: 34px;
  min-height: 34px;
  height: 34px;
  padding: 0;
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--brand-charcoal);
  line-height: 0;
  justify-content: center;
}

.marketplace-sort-direction-icon {
  width: 34px;
  height: 34px;
  display: block;
  fill: currentColor;
  filter: var(--platform-icon-filter);
  transform-origin: center;
  transform: scale(2.2);
}

.marketplace-sort-direction-btn.is-ascending .marketplace-sort-direction-icon {
  transform: scale(2.2) scaleY(-1);
}

.marketplace-sort-direction-btn:hover {
  border-color: var(--selected-border);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  color: var(--accent-hover);
}

.marketplace-catalog-panel {
  display: grid;
  gap: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.marketplace-catalog-heading {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.marketplace-catalog-heading h2 {
  margin: 0;
  color: var(--workspace-sidebar-muted);
  font-family: var(--font-ui);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
}

.marketplace-catalog-panel .empty-note {
  color: var(--brand-charcoal);
}

.marketplace-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 8px;
}

.marketplace-catalog-groups .marketplace-catalog-grid {
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 8px;
}

.marketplace-catalog-groups {
  display: grid;
  gap: 18px;
}

.marketplace-catalog-family-section {
  display: grid;
  gap: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
  overflow: hidden;
}

.marketplace-catalog-family-section + .marketplace-catalog-family-section {
  margin-top: 0;
}

.marketplace-catalog-family-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  padding: 0 14px;
  border-bottom: 0;
  background: var(--workspace-card-button-bg);
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
  cursor: pointer;
  list-style: none;
}

.marketplace-catalog-family-head::-webkit-details-marker,
.marketplace-catalog-subgroup-head::-webkit-details-marker {
  display: none;
}

.marketplace-catalog-family-head::after,
.marketplace-catalog-subgroup-head::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--text-subtle);
  border-bottom: 1.5px solid var(--text-subtle);
  transform: rotate(45deg);
  transition: transform 0.16s ease, border-color 0.16s ease;
  flex: 0 0 auto;
}

.marketplace-catalog-family-section[open] > .marketplace-catalog-family-head::after,
.marketplace-catalog-subgroup-section[open] > .marketplace-catalog-subgroup-head::after {
  transform: rotate(225deg);
  border-color: var(--accent);
}

.marketplace-catalog-family-section[open] > .marketplace-catalog-family-head,
.marketplace-catalog-subgroup-section[open] > .marketplace-catalog-subgroup-head {
  border-bottom: 1px solid var(--border);
}

.marketplace-catalog-family-head span {
  min-width: 0;
  overflow: hidden;
  font-size: var(--type-card-title-size);
  line-height: 1.25;
  font-weight: 400;
  color: var(--brand-charcoal);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.marketplace-catalog-family-head small,
.marketplace-catalog-subgroup-head small {
  display: none;
}

.marketplace-catalog-family-body {
  padding: 10px;
}

.marketplace-catalog-family-section:not([open]) > .marketplace-catalog-family-body,
.marketplace-catalog-subgroup-section:not([open]) > .marketplace-catalog-subgroup-body {
  display: none;
}

.marketplace-catalog-subgroups {
  display: grid;
  gap: 8px;
}

.marketplace-catalog-subgroup-section {
  display: grid;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
  overflow: hidden;
}

.marketplace-catalog-subgroup-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  padding: 0 14px;
  border-bottom: 0;
  background: var(--workspace-card-button-bg);
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
  cursor: pointer;
  list-style: none;
}

.marketplace-catalog-subgroup-head span {
  min-width: 0;
  overflow: hidden;
  font-size: var(--type-card-title-size);
  line-height: 1.25;
  font-weight: 400;
  color: var(--brand-charcoal);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.marketplace-catalog-subgroup-body {
  padding: 8px;
}

.marketplace-item-card {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 220px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
}

.marketplace-item-card.is-draggable {
  cursor: grab;
}

.marketplace-item-card.is-dragging {
  opacity: 0.68;
  cursor: grabbing;
}

.marketplace-item-card.is-compact {
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 6px;
  min-height: 0;
  padding: 8px;
}

.marketplace-item-card.is-selected {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--workspace-card-bg) 92%, var(--accent) 8%);
  box-shadow: none;
}

.marketplace-item-card.is-unavailable {
  opacity: 0.56;
  background: var(--workspace-card-bg);
}

.marketplace-item-detail-link {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 2;
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  text-decoration: none;
  cursor: pointer;
}

.marketplace-item-detail-link:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  text-decoration: none;
}

.marketplace-item-detail-icon {
  display: block;
  width: 19px;
  height: 19px;
  filter: var(--platform-icon-filter);
  pointer-events: none;
}

.marketplace-item-main {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
}

.marketplace-item-card.is-compact .marketplace-item-main {
  grid-template-columns: 1fr;
  justify-items: center;
  gap: 5px;
  text-align: center;
}

.marketplace-item-preview {
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  overflow: hidden;
  text-decoration: none;
  cursor: inherit;
}

.marketplace-item-preview:hover {
  text-decoration: none;
}

.marketplace-item-card.is-compact .marketplace-item-preview {
  width: 84px;
  height: 84px;
}

.marketplace-item-image {
  width: 100%;
  height: 100%;
  background: transparent;
  object-fit: contain;
}

.marketplace-inline-svg-preview {
  width: 100%;
  height: 100%;
  display: block;
  background: transparent;
}

.marketplace-inline-svg-preview,
.marketplace-inline-svg-preview * {
  color: #000000;
  stroke: #000000 !important;
  stroke-width: 0.4px !important;
  vector-effect: non-scaling-stroke;
}

.marketplace-inline-svg-preview [fill]:not([fill="none"]) {
  fill: none !important;
}

.marketplace-inline-svg-preview rect[fill="white"],
.marketplace-inline-svg-preview rect[fill="#fff"],
.marketplace-inline-svg-preview rect[fill="#ffffff"],
.marketplace-inline-svg-preview rect[fill="rgb(255,255,255)"],
.marketplace-inline-svg-preview rect[fill="rgb(255, 255, 255)"] {
  fill: transparent !important;
}

.marketplace-item-fallback {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: transparent;
  color: var(--text-muted);
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
}

.marketplace-item-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.marketplace-item-card.is-compact .marketplace-item-copy {
  align-items: center;
  gap: 2px;
  width: 100%;
  text-align: center;
}

.marketplace-item-title {
  color: var(--text);
  font-size: var(--type-control-size);
  font-weight: 400;
  line-height: 1.25;
  text-decoration: none;
  overflow-wrap: anywhere;
  cursor: inherit;
}

.marketplace-item-card.is-compact .marketplace-item-title {
  display: block;
  font-size: var(--type-caption-size);
  font-weight: 400;
  line-height: 1.18;
  text-align: center;
}

.marketplace-item-meta {
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.marketplace-item-lines {
  display: grid;
  gap: 2px;
  min-width: 0;
  font-size: var(--type-label-size);
  line-height: 1.25;
}

.marketplace-item-line {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  white-space: nowrap;
}

.marketplace-item-line-price {
  color: var(--text);
  font-weight: 400;
}

.marketplace-item-line-stock {
  color: var(--text-muted);
}

.marketplace-item-actions {
  display: grid;
  gap: 6px;
  align-items: end;
}

.marketplace-item-actions-component {
  grid-template-columns: minmax(96px, 1fr) 60px 76px;
}

.marketplace-item-actions-simple {
  grid-template-columns: minmax(60px, 72px) 76px;
  justify-content: end;
}

.marketplace-item-card.is-compact .marketplace-item-actions-simple {
  grid-template-columns: minmax(46px, 1fr) 30px;
  gap: 5px;
  justify-content: stretch;
}

.marketplace-item-card.is-compact .field-label {
  margin-bottom: 2px;
  font-size: var(--type-label-size);
  line-height: 1.1;
}

.marketplace-qty-field {
  min-width: 0;
}

.marketplace-qty-field input {
  min-height: 34px;
}

.marketplace-item-card.is-compact .marketplace-qty-field input {
  width: 100%;
  border: 1px solid var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  min-height: 26px;
  height: 26px;
  padding: 2px 5px;
  font-size: var(--type-label-size);
  font-weight: 400;
  box-shadow: none;
}

.marketplace-item-card.is-compact .marketplace-qty-field input {
  text-align: center;
}

.marketplace-cart-add-button {
  display: inline-flex;
  align-items: center;
  width: 100%;
  min-height: 34px;
  padding: 6px 8px;
  font-size: var(--type-caption-size);
  font-weight: 400;
  justify-content: center;
  white-space: nowrap;
}

.marketplace-cart-add-icon {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  line-height: 1;
}

.marketplace-cart-add-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  filter: var(--platform-icon-filter);
}

.marketplace-cart-add-button.is-unavailable {
  align-items: center;
  justify-content: center;
}

.marketplace-cart-unavailable-icon {
  display: inline-grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
  line-height: 1;
}

.marketplace-item-card.is-compact .marketplace-cart-add-button {
  width: 100%;
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  min-height: 26px;
  height: 26px;
  padding: 2px 4px;
  font-size: var(--type-label-size);
  font-weight: 400;
  box-shadow: none;
}

.marketplace-item-card.is-compact .marketplace-cart-add-button:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--text);
}

.marketplace-cart-panel {
  position: sticky;
  top: 72px;
  display: grid;
  gap: 12px;
  max-height: calc(100vh - 92px);
  overflow-x: hidden;
  overflow-y: auto;
}

.marketplace-cart-panel.is-drop-target {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent);
}

.marketplace-sidebar .sidebar-scroll {
  padding: 12px 10px 16px;
}

.marketplace-sidebar-workspace,
.marketplace-sidebar-upload {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px;
  border: 1px solid var(--workspace-sidebar-border);
  border-radius: var(--radius-sm);
  background: var(--workspace-sidebar-bg);
}

.marketplace-sidebar-workspace .sidebar-label,
.marketplace-sidebar-upload .sidebar-label {
  margin: 0;
  padding: 0;
}

.marketplace-sidebar-workspace-action {
  justify-self: center;
  width: calc(100% - 12px);
  min-height: 34px;
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  justify-content: center;
}

.marketplace-sidebar-workspace-action:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--text);
}

.marketplace-sidebar-upload-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  width: calc(100% - 12px);
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-sidebar-control-bg);
  color: var(--text);
  cursor: pointer;
}

.marketplace-sidebar-upload-link:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
}

.marketplace-sidebar-upload-link span {
  font-size: var(--type-control-size);
  font-weight: 400;
  line-height: 1.25;
}

.marketplace-sidebar-upload-link small {
  color: var(--text-muted);
  font-size: var(--type-label-size);
  font-weight: 400;
  line-height: 1.25;
}

.marketplace-sidebar-upload-action {
  justify-self: center;
  width: calc(100% - 12px);
  min-height: 34px;
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  justify-content: center;
}

.marketplace-sidebar-upload-action:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--text);
}

.marketplace-sidebar .marketplace-cart-sidebar-panel {
  position: static;
  max-height: none;
  overflow: visible;
  gap: 10px;
  padding: 10px;
  border-color: var(--workspace-sidebar-border);
  background: var(--workspace-sidebar-bg);
  color: var(--workspace-sidebar-text);
}

.marketplace-sidebar .workspace-panel-head {
  margin-bottom: 0;
}

.marketplace-sidebar .workspace-panel-head h2 {
  color: var(--workspace-sidebar-text);
}

.marketplace-sidebar .workspace-panel-head p,
.marketplace-sidebar .empty-note,
.marketplace-sidebar .field-label,
.marketplace-sidebar .marketplace-cart-row-main span,
.marketplace-sidebar .marketplace-analysis-summary span {
  color: var(--workspace-sidebar-muted);
}

.marketplace-sidebar .marketplace-cart-row,
.marketplace-sidebar .marketplace-date-criterion,
.marketplace-sidebar .marketplace-provider-row,
.marketplace-sidebar .marketplace-criterion-row,
.marketplace-sidebar .marketplace-analysis-summary {
  background: var(--workspace-card-bg);
  border-color: var(--workspace-sidebar-border);
  border-radius: var(--radius-sm);
}

.marketplace-sidebar .marketplace-cart-section-title {
  color: var(--workspace-sidebar-muted);
}

.marketplace-sidebar input,
.marketplace-sidebar select,
.marketplace-sidebar textarea,
.marketplace-sidebar .btn {
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
}

.marketplace-cart-list,
.marketplace-analysis-form {
  display: grid;
  gap: 10px;
}

.marketplace-cart-section {
  display: grid;
  gap: 5px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
}

.marketplace-cart-section.is-drop-target {
  border-color: var(--selected-border);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
}

.marketplace-cart-section-title {
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: var(--type-label-size);
  font-weight: 400;
  line-height: 1.15;
}

.marketplace-cart-section-list {
  display: grid;
  gap: 5px;
  min-height: 8px;
}

.marketplace-cart-section-empty {
  min-height: 8px;
  border-radius: var(--radius-sm);
}

.marketplace-cart-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  cursor: grab;
}

.marketplace-cart-row.is-dragging {
  opacity: 0.45;
}

.marketplace-cart-row.is-drop-target {
  border-color: var(--selected-border);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
}

.marketplace-cart-row.is-unavailable {
  opacity: 0.55;
  border-color: var(--border);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, #888 14%);
}

.marketplace-cart-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
}

.marketplace-cart-remove-button {
  position: static;
  display: inline-grid;
  place-items: center;
  width: 27px;
  min-width: 27px;
  height: 27px;
  min-height: 27px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
}

.marketplace-cart-remove-button:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--accent);
}

.marketplace-cart-row-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.marketplace-cart-row-main strong,
.marketplace-cart-row-main span {
  overflow-wrap: anywhere;
  font-weight: 400;
}

.marketplace-cart-row-main strong {
  color: var(--text);
  font-size: var(--type-label-size);
  line-height: 1.15;
}

.marketplace-cart-row-main span {
  color: var(--text-muted);
  font-size: var(--type-caption-size);
}

.marketplace-cart-row-main .marketplace-cart-lock {
  color: var(--accent);
  font-size: var(--type-label-size);
  font-weight: 400;
}

.marketplace-cart-row-main .marketplace-cart-unavailable-note {
  color: var(--accent);
  font-size: var(--type-caption-size);
  font-weight: 400;
}

.marketplace-cart-row {
  cursor: pointer;
}

.marketplace-cart-qty {
  width: 42px;
  min-height: 27px;
  height: 27px;
  min-width: 0;
  padding: 0 5px;
  font-size: var(--type-label-size);
  line-height: 1;
  text-align: center;
}

.marketplace-cart-qty.is-unavailable {
  color: var(--accent);
  font-weight: 600;
}

.marketplace-analysis-form .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.marketplace-analysis-form .field-span-2,
.marketplace-analysis-form .project-procurement-criteria-editor,
.marketplace-analysis-form .project-procurement-criteria-list,
.marketplace-analysis-form .marketplace-date-criterion-editor,
.marketplace-analysis-form .marketplace-criteria-editor,
.marketplace-analysis-form .marketplace-criteria-list,
.marketplace-analysis-form .marketplace-provider-editor,
.marketplace-analysis-form .marketplace-procurement-scope-note {
  grid-column: 1 / -1;
  min-width: 0;
}

.marketplace-procurement-scope-note {
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border) 66%);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--accent) 8%, var(--workspace-card-bg) 92%);
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  line-height: 1.35;
}

.marketplace-analysis-form input,
.marketplace-analysis-form select,
.marketplace-analysis-form textarea {
  max-width: 100%;
  min-width: 0;
  border-color: var(--marketplace-control-border);
  background: var(--marketplace-control-bg);
  color: var(--marketplace-control-color);
  border-radius: var(--marketplace-control-radius);
  font-family: var(--marketplace-control-font);
  accent-color: var(--accent);
}

.marketplace-date-picker {
  position: relative;
  display: grid;
  gap: 6px;
  min-width: 0;
}

.marketplace-date-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  gap: 6px;
  align-items: center;
}

.marketplace-date-control input[readonly] {
  cursor: pointer;
}

.marketplace-date-toggle,
.marketplace-date-nav {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  width: 34px;
  min-height: 34px;
  height: 34px;
  padding: 0;
}

.marketplace-date-picker-panel {
  display: grid;
  gap: 7px;
  width: min(282px, 100%);
  padding: 8px;
  border: 1px solid var(--marketplace-button-border);
  border-radius: var(--radius-sm);
  background: var(--marketplace-button-bg);
}

.marketplace-date-picker-head {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  gap: 6px;
  align-items: center;
}

.marketplace-date-picker-head strong {
  min-width: 0;
  color: var(--text);
  font-size: var(--type-control-size);
  font-weight: 400;
  line-height: 1.2;
  text-align: center;
  text-transform: capitalize;
}

.marketplace-date-weekdays,
.marketplace-date-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
}

.marketplace-date-weekdays span {
  color: var(--text-muted);
  font-size: var(--type-label-size);
  text-align: center;
}

.marketplace-date-day {
  display: inline-grid;
  place-items: center;
  min-width: 0;
  min-height: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font-size: var(--type-label-size);
  font-weight: 400;
}

.marketplace-date-day:not(.is-empty):hover,
.marketplace-date-day.is-selected {
  border-color: var(--marketplace-selected-border);
  background: var(--marketplace-selected-bg);
  color: var(--text);
}

.marketplace-date-day.is-empty {
  min-height: 28px;
}

.marketplace-date-clear {
  width: 100%;
}

.marketplace-analysis-form input[type="date"] {
  color-scheme: light;
  font-family: var(--font-ui);
}

.marketplace-analysis-form input[type="date"]:focus {
  border-color: var(--selected-border);
  outline: 0;
  box-shadow: none;
}

.marketplace-analysis-form input[type="date"]::-webkit-calendar-picker-indicator {
  filter: var(--platform-icon-filter);
  opacity: 0.85;
  cursor: pointer;
}

.marketplace-analysis-form input[type="date"]:focus::-webkit-calendar-picker-indicator,
.marketplace-analysis-form input[type="date"]:hover::-webkit-calendar-picker-indicator {
  filter: var(--platform-icon-filter);
  opacity: 1;
}

.marketplace-shell input,
.marketplace-shell select,
.marketplace-shell textarea,
.marketplace-shell .btn,
.marketplace-shell button,
.marketplace-sidebar input,
.marketplace-sidebar select,
.marketplace-sidebar textarea,
.marketplace-sidebar .btn,
.marketplace-sidebar button {
  font-family: var(--font-ui);
}

.marketplace-shell input,
.marketplace-shell select,
.marketplace-shell textarea,
.marketplace-sidebar input,
.marketplace-sidebar select,
.marketplace-sidebar textarea {
  border-color: var(--marketplace-control-border, var(--border));
  background: var(--marketplace-control-bg, var(--workspace-card-button-bg));
  color: var(--marketplace-control-color, var(--text));
  border-radius: var(--marketplace-control-radius, var(--radius-sm));
  font-size: var(--marketplace-control-size, var(--type-button-size));
  font-weight: var(--marketplace-control-weight, var(--type-button-weight));
}

.marketplace-shell input:focus,
.marketplace-shell select:focus,
.marketplace-shell textarea:focus,
.marketplace-sidebar input:focus,
.marketplace-sidebar select:focus,
.marketplace-sidebar textarea:focus {
  border-color: var(--selected-border);
  outline: 0;
  box-shadow: none;
}

.marketplace-shell select,
.marketplace-sidebar select,
.marketplace-shell select option,
.marketplace-sidebar select option {
  background: var(--marketplace-control-bg, var(--workspace-card-button-bg));
  color: var(--marketplace-control-color, var(--text));
}

.marketplace-shell .btn,
.marketplace-shell button,
.marketplace-sidebar .btn,
.marketplace-sidebar button {
  border: 1px solid var(--marketplace-control-border, var(--border));
  background: var(--marketplace-control-bg, var(--workspace-card-button-bg));
  color: var(--marketplace-control-color, var(--text));
  border-radius: var(--marketplace-control-radius, var(--radius-sm));
  font-size: var(--marketplace-control-size, var(--type-button-size));
  font-weight: var(--marketplace-control-weight, var(--type-button-weight));
  box-shadow: none;
  min-height: 34px;
}

.marketplace-shell .btn:hover,
.marketplace-shell button:hover,
.marketplace-sidebar .btn:hover,
.marketplace-sidebar button:hover {
  border-color: var(--marketplace-control-border-hover, var(--selected-border));
  background: var(--marketplace-control-bg-hover, #E3E3E3);
  color: var(--marketplace-control-color, var(--text));
}

.marketplace-shell .workspace-panel {
  background: var(--workspace-card-bg);
  border-color: var(--border);
}

.marketplace-shell .summary-chip,
.marketplace-shell .processing-chip,
.marketplace-sidebar .summary-chip,
.marketplace-sidebar .processing-chip {
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  padding: 0;
  font-weight: 400;
}

.marketplace-date-criterion,
.marketplace-provider-list,
.marketplace-criteria-list {
  display: grid;
  gap: 8px;
}

.marketplace-date-criterion {
  grid-template-columns: minmax(0, 1fr) minmax(105px, 0.45fr);
  align-items: end;
  margin-bottom: 10px;
}

.marketplace-inline-unit,
.marketplace-criterion-margin {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.marketplace-inline-unit small,
.marketplace-criterion-margin small {
  color: var(--text-muted);
  font-size: var(--type-label-size);
  white-space: nowrap;
}

.marketplace-provider-row,
.marketplace-criterion-row {
  display: grid;
  gap: 7px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
}

.marketplace-provider-row {
  grid-template-columns: 30px minmax(0, 1fr) auto;
}

.marketplace-criterion-row {
  grid-template-columns: 30px minmax(0, 1fr) minmax(86px, 0.6fr) auto;
}

.marketplace-criterion-row select[data-project-criterion-value],
.marketplace-criterion-row select[data-project-criterion-required] {
  grid-column: span 2;
}

.marketplace-criterion-row .btn {
  min-height: 34px;
}

.marketplace-analysis-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-size: var(--type-caption-size);
}

.marketplace-analysis-summary span {
  color: var(--text-muted);
}

.marketplace-cart-actions {
  justify-content: stretch;
}

.marketplace-cart-actions .btn {
  width: 100%;
}

.warning-chip {
  border-color: var(--border);
  color: var(--brand-charcoal);
  background: var(--workspace-card-button-bg);
}

.processing-meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.processing-meta-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.processing-meta-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.processing-chip-row,
.summary-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.processing-chip,
.summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--brand-charcoal);
  font-size: 11px;
  font-weight: 600;
}

.processing-format-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  color: var(--text);
}

.processing-format-pill.disabled {
  opacity: 0.5;
}

.processing-format-pill input {
  width: auto;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.processing-scale-select {
  display: inline-flex;
  align-items: center;
}

.processing-scale-select select {
  min-width: 92px;
  padding: 6px 10px;
}

.processing-note {
  font-size: 11px;
  color: var(--warn);
  background: var(--warn-soft);
  border: 1px solid #FCD34D;
  border-radius: var(--radius);
  padding: 6px 8px;
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.button-row-inline {
  margin-top: 8px;
  padding-top: 0;
  border-top: none;
  justify-content: flex-start;
}

.project-inline-actions {
  margin-top: 6px;
}

.project-site-house-grid {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}

.project-editor-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.project-editor-column {
  display: grid;
  grid-template-rows: repeat(4, 42px);
  gap: 6px;
  min-width: 0;
}

.project-editor-grid .project-site-house-card {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  height: 42px;
}

.project-editor-grid .project-site-house-status:empty {
  display: none;
}

.project-site-house-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(105px, 24%) auto;
  align-items: center;
  gap: 10px;
  min-height: 32px;
  padding: 5px 8px 5px 10px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
}

.project-site-house-link {
  color: inherit;
  text-decoration: none;
}

.project-site-house-main {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.project-site-house-button {
  width: 100%;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.project-site-house-link:hover,
.project-site-house-link:focus-visible,
.project-site-house-button:hover,
.project-site-house-button:focus-visible {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-selected-bg);
  outline: none;
}

.project-site-house-card.is-dirty {
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
}

.project-site-house-card.is-review-pending {
  border-color: color-mix(in srgb, var(--brand-orange) 46%, var(--designer-card-button-border) 54%);
  background: color-mix(in srgb, var(--brand-orange) 8%, var(--designer-card-button-bg) 92%);
}

.project-site-house-card.is-review-pending .project-site-house-status {
  color: var(--brand-orange);
  font-weight: 500;
}

.structural-send-house-card.is-pending-send {
  border-color: color-mix(in srgb, var(--brand-orange) 54%, var(--designer-card-button-border) 46%);
  background: color-mix(in srgb, var(--brand-orange) 10%, var(--designer-card-button-bg) 90%);
}

.structural-send-house-action {
  min-height: 28px;
  padding: 5px 10px;
}

.project-site-house-card strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--brand-charcoal);
  font-size: var(--type-control-size);
  font-weight: var(--type-control-weight);
}

.project-house-editor-card {
  grid-template-columns: minmax(90px, 0.32fr) minmax(150px, 1fr) auto;
}

.project-editor-grid .project-house-editor-card {
  grid-template-columns: minmax(68px, 0.28fr) minmax(92px, 1fr) auto;
}

.project-house-editor-heading {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.project-house-editor-card .project-site-house-status {
  max-width: none;
}

.project-house-editor-select {
  width: 100%;
  min-width: 0;
  min-height: 28px;
  padding: 3px 7px;
  font-size: var(--type-caption-size);
}

.project-house-editor-link {
  text-decoration: none;
}

.project-house-editor-link.is-disabled {
  cursor: default;
  opacity: 0.55;
}

@media (max-width: 900px) {
  .project-editor-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .project-editor-column {
    grid-template-rows: repeat(4, minmax(42px, auto));
  }

  .project-house-editor-card {
    grid-template-columns: 1fr;
  }

  .project-editor-grid .project-house-editor-card {
    grid-template-columns: 1fr;
    height: auto;
  }
}

.project-details-section {
  display: grid;
  gap: 12px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-details-section > h3 {
  margin: 0;
  color: var(--text);
  font: 500 14px/1.25 var(--font-ui);
}

.project-details-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr);
  gap: 14px;
  align-items: stretch;
}

.project-details-data-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.project-details-column {
  display: grid;
  align-content: start;
  gap: 7px;
  min-width: 0;
}

.project-details-column > h3,
.project-window-u-inputs > h3 {
  margin: 0;
  color: var(--text);
  font: 500 13px/1.2 var(--font-ui);
}

.project-details-column .field {
  gap: 3px;
  min-width: 0;
}

.project-details-column input,
.project-details-column select {
  width: 100%;
  min-width: 0;
  min-height: 32px;
}

.project-details-typology-help {
  margin: -2px 0 1px;
  font-size: 10px;
}

.project-window-u-inputs {
  display: grid;
  gap: 7px;
  margin-top: 5px;
  padding-top: 9px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-window-u-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.project-details-map-pane {
  display: grid;
  grid-template-rows: minmax(460px, 1fr) auto;
  gap: 8px;
  min-width: 0;
  min-height: 100%;
}

.project-details-map-pane .project-location-map-picker {
  width: 100%;
  height: 100%;
  min-height: 460px;
  border-color: var(--designer-card-divider);
  border-radius: var(--radius-sm);
}

.project-location-map-actions {
  display: flex;
  justify-content: flex-start;
}

.project-location-map-actions .btn {
  min-height: 32px;
}

.project-single-editor-action {
  display: flex;
  justify-content: flex-start;
}

.project-sheet-preview {
  position: relative;
  width: 100%;
  min-height: 520px;
  height: clamp(520px, 72vh, 840px);
  overflow: hidden;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--designer-card-bg) 90%, var(--platform-page-bg, #343735) 10%);
}

.project-sheet-preview-frame {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
  background: transparent;
}

.project-sheet-preview-frame.is-loading {
  visibility: hidden;
}

.project-sheet-preview-status {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  padding: 20px;
  color: var(--text-muted);
  font-size: var(--type-body-small-size);
  text-align: center;
}

.project-sheet-preview-status[hidden] {
  display: none;
}

@media (max-width: 760px) {
  .project-sheet-preview {
    min-height: 440px;
    height: 68vh;
  }
}

.project-3d-viewer-stack {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
}

.project-3d-viewer-group {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
  padding: 7px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--designer-card-bg) 90%, var(--designer-card-button-bg) 10%);
}

.project-3d-viewer-group:first-child {
  padding-top: 7px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-3d-viewer-group h4 {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font: 500 13px/1.25 var(--font-ui);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-3d-viewer-list {
  display: grid;
  gap: 0;
}

.project-3d-viewer-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
  align-items: center;
  min-height: 30px;
  padding: 3px 0;
  border-bottom: 1px solid var(--designer-card-divider);
  color: var(--text);
  font-size: 11px;
}

.project-3d-viewer-row:last-child {
  border-bottom: 0;
}

.project-3d-viewer-row .btn,
.project-3d-viewer-row .viewer-link {
  min-height: 24px;
  padding: 3px 7px;
  font-size: 10px;
}

@media (max-width: 1180px) {
  .project-3d-viewer-stack {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .project-3d-viewer-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .project-3d-viewer-stack {
    grid-template-columns: 1fr;
  }
}

.project-regulatory-card {
  display: grid;
  gap: 12px;
}

.project-regulatory-warning {
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, #d97706 42%, var(--designer-card-button-border) 58%);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, #d97706 10%, var(--designer-card-bg) 90%);
  color: var(--text);
  font-size: 12px;
  line-height: 1.35;
}

.project-regulatory-section {
  display: grid;
  gap: 9px;
  padding-top: 10px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-regulatory-section h4 {
  margin: 0;
  color: var(--text);
  font: 500 13px/1.2 var(--font-ui);
}

.project-regulatory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.project-regulatory-field-wide {
  grid-column: span 2;
}

.project-regulatory-field input,
.project-regulatory-field select {
  min-height: 34px;
}

.project-regulatory-choice-group {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  min-height: 34px;
  align-items: center;
}

.project-regulatory-choice,
.project-regulatory-not-required {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text);
  font-size: 12px;
  line-height: 1.2;
}

.project-regulatory-choice {
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
}

.project-regulatory-choice input,
.project-regulatory-not-required input {
  width: auto;
  flex: 0 0 auto;
  min-height: auto;
  margin: 0;
}

.project-regulatory-section-heading,
.project-regulatory-street-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.project-regulatory-streets {
  display: grid;
  gap: 10px;
}

.project-regulatory-street {
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--designer-card-bg) 94%, var(--text) 6%);
}

.project-regulatory-street-header h5 {
  margin: 0;
  color: var(--text);
  font: 500 12px/1.2 var(--font-ui);
}

.project-regulatory-street-measurement {
  align-content: start;
}

.project-regulatory-not-required {
  margin-top: 4px;
}

.project-regulatory-street-measurement input:disabled {
  opacity: 0.56;
}

.project-regulatory-card textarea {
  min-height: 78px;
  resize: vertical;
}

@media (max-width: 1180px) {
  .project-details-layout {
    grid-template-columns: 1fr;
  }

  .project-details-map-pane {
    grid-template-rows: minmax(340px, 42vw) auto;
  }

  .project-details-map-pane .project-location-map-picker {
    min-height: 340px;
  }
}

@media (max-width: 920px) {
  .project-regulatory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .project-details-data-grid {
    grid-template-columns: 1fr;
  }

  .project-regulatory-grid {
    grid-template-columns: 1fr;
  }

  .project-regulatory-field-wide {
    grid-column: span 1;
  }
}

.project-site-house-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 3px 8px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--brand-charcoal);
  font-size: var(--type-caption-size);
  font-weight: 400;
  line-height: 1.1;
  white-space: nowrap;
}

.professional-document-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.professional-document-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
}

.professional-document-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.professional-document-main small,
.professional-document-main .subtle {
  overflow-wrap: anywhere;
}

.professional-document-title-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.professional-document-title-row strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.professional-document-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.professional-document-upload {
  cursor: pointer;
}

@media (max-width: 720px) {
  .professional-document-row {
    grid-template-columns: 1fr;
  }

  .professional-document-actions {
    justify-content: flex-start;
  }
}

.electrical-review-grid {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.project-revisions-stack {
  display: grid;
  gap: 10px;
}

.project-revision-section {
  display: grid;
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-bg);
}

.project-revision-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--designer-card-divider);
}

.project-revision-section-head h3 {
  margin: 0;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  line-height: 1.2;
}

.project-revision-section-head small {
  color: var(--text-muted);
  font-size: var(--type-label-size);
  font-weight: 400;
  line-height: 1.2;
  text-align: right;
}

.project-revision-section .electrical-review-grid {
  margin-top: 0;
}

.electrical-review-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 6px 10px;
  padding: 7px 8px;
}

.electrical-review-card-main {
  min-width: 0;
}

.structural-review-change-list {
  grid-column: 1 / -1;
  display: grid;
  gap: 2px;
  padding-top: 5px;
  border-top: 1px solid color-mix(in srgb, var(--workspace-card-border) 72%, var(--workspace-bg));
  font-size: 11px;
  line-height: 1.25;
}

.structural-review-muted-line {
  color: var(--text-muted);
}

.structural-review-added-line {
  color: var(--brand-orange);
  font-weight: 500;
}

.structural-review-status {
  justify-self: end;
  align-self: start;
  display: inline-flex;
  align-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--brand-orange);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
}

.structural-review-status.badge-submitted,
.structural-review-status.badge-public_review,
.structural-review-status.badge-approved {
  background: transparent;
  border: 0;
}

.structural-review-status.badge-submitted,
.structural-review-status.badge-public_review {
  color: var(--brand-orange);
}

.structural-review-status.badge-approved {
  color: var(--green);
}

.structural-review-status.badge-draft {
  background: transparent;
  border: 0;
  color: var(--text-muted);
}

.electrical-review-notes {
  grid-column: 1 / -1;
  min-height: 64px;
}

.electrical-review-actions {
  grid-column: 1 / -1;
  margin-top: 0;
}

.structural-suggestion-body {
  grid-column: 1 / -1;
  display: grid;
  gap: 6px;
  min-width: 0;
}

.structural-suggestion-body .info-row {
  min-width: 0;
}

.structural-suggestion-body .info-value {
  overflow-wrap: anywhere;
}

.project-site-house-status {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  justify-self: start;
  min-height: 16px;
  max-width: 46%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--brand-charcoal);
  font-size: 10px;
  font-weight: var(--type-control-weight);
  line-height: 1.1;
  white-space: nowrap;
}

.project-certification-editor,
.project-qualification-editor,
.project-provider-editor,
.project-procurement-criteria-editor {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.project-procurement-mode-grid {
  display: grid;
  grid-template-columns: minmax(180px, 0.55fr) minmax(280px, 1.45fr);
  gap: 12px 14px;
  align-items: start;
}

.project-certification-controls,
.project-provider-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.project-provider-row select,
.project-certification-row select,
.project-qualification-row select {
  flex: 1 1 220px;
}

.project-procurement-criterion-row select,
.project-fixed-criterion {
  flex: 0 0 240px;
  width: 240px;
}

.project-certification-list,
.project-qualification-list,
.project-provider-list,
.project-procurement-criteria-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.project-certification-row,
.project-qualification-row,
.project-provider-row,
.project-procurement-criterion-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius);
  background: var(--designer-card-button-bg);
}

.project-procurement-criterion-row.is-disabled {
  opacity: 0.48;
  background: var(--designer-card-button-bg);
}

.project-provider-actions .btn.secondary,
.project-provider-row .btn.secondary,
.project-certification-row .btn.secondary,
.project-qualification-row .btn.secondary,
.project-procurement-criterion-row .btn.secondary,
.project-row-drag {
  background: var(--designer-card-button-bg);
  border-color: var(--designer-card-button-border);
  color: var(--text);
}

.project-provider-row select,
.project-certification-row select,
.project-qualification-row select,
.project-procurement-criterion-row select,
.project-procurement-criterion-row input,
.project-fixed-criterion {
  background: var(--designer-card-button-bg-hover);
  border-color: var(--designer-card-button-border);
  color: var(--text);
}

#projectProviderAddBtn,
#projectProcurementCriterionAddBtn,
#projectProcurementAdvancedBtn {
  width: 198px;
  justify-content: center;
}

.project-procurement-advanced-panel {
  display: block;
  overflow-x: auto;
  padding: 10px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius);
  background: var(--surface);
}

.project-procurement-advanced-panel[hidden] {
  display: none;
}

.project-procurement-family-grid {
  display: grid;
  grid-template-columns: minmax(132px, 1.1fr) 72px 84px 104px 104px 120px minmax(150px, 1fr) minmax(150px, 1fr);
  gap: 1px;
  min-width: 980px;
  border: 1px solid var(--designer-card-button-border);
  background: var(--designer-card-button-border);
}

.project-procurement-family-rule-row {
  display: contents;
}

.project-procurement-family-grid-head,
.project-procurement-family-rule {
  min-height: 38px;
  padding: 7px 8px;
  background: var(--designer-card-button-bg);
}

.project-procurement-family-grid-head {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: var(--type-control-weight);
  text-transform: uppercase;
}

.project-procurement-family-rule {
  display: flex;
  align-items: center;
  min-width: 0;
}

.project-procurement-family-rule strong {
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  font-weight: var(--type-control-weight);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-procurement-family-rule input[type="number"],
.project-procurement-family-rule input[type="text"] {
  width: 100%;
  min-width: 0;
}

.project-procurement-family-check {
  justify-content: center;
}

.project-procurement-family-pieces {
  gap: 6px;
}

.project-provider-actions .btn.secondary:hover,
.project-provider-row .btn.secondary:hover,
.project-certification-row .btn.secondary:hover,
.project-qualification-row .btn.secondary:hover,
.project-procurement-criterion-row .btn.secondary:hover {
  background: var(--designer-card-button-bg-hover);
  border-color: var(--designer-card-selected-border);
  box-shadow: none;
}

.project-row-drag:hover {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.project-procurement-criterion-row.is-disabled select,
.project-procurement-criterion-row.is-disabled input,
.project-procurement-criterion-row.is-disabled .project-row-drag {
  cursor: not-allowed;
}

.project-fixed-criterion {
  flex: 0 0 240px;
  width: 240px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 6px 9px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius);
  background: var(--designer-card-button-bg-hover);
  color: var(--text);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.project-procurement-criteria-editor > .field-help {
  display: none;
}

.project-certification-name {
  flex: 0 1 180px;
  font-weight: 600;
  color: var(--text);
}

.project-certification-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text-muted);
  font-size: 13px;
}

.project-certification-toggle input {
  margin: 0;
}

.project-plate-length-field {
  align-self: end;
  justify-content: flex-end;
}

.project-plate-length-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

.project-plate-length-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
  transition: background-color 0.12s ease, border-color 0.12s ease;
}

.project-plate-length-toggle:hover {
  border-color: var(--border-strong);
  background: var(--surface-2);
}

.project-plate-length-toggle:has(input:checked) {
  border-color: var(--text);
  background: var(--surface-2);
}

.project-plate-length-toggle:has(input:disabled) {
  cursor: default;
  opacity: 0.78;
}

.project-plate-length-toggle input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--text);
}

.project-certification-remove,
.project-qualification-remove,
.project-provider-remove,
.project-procurement-criterion-remove {
  margin-left: auto;
}

.project-provider-row .btn,
.project-certification-row .btn,
.project-qualification-row .btn,
.project-procurement-criterion-row .btn {
  flex: 0 0 auto;
}

.project-procurement-criterion-row input[type="number"] {
  flex: 0 0 110px;
}

.project-criterion-margin {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 600;
}

.project-criterion-margin input[type="number"] {
  width: 86px;
}

.project-criterion-margin small {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.project-criterion-no-margin {
  flex: 0 1 240px;
  min-height: 18px;
}

.project-criterion-unit {
  flex: 0 0 72px;
  align-self: center;
}

.project-row-drag {
  flex: 0 0 auto;
  width: 30px;
  min-width: 30px;
  height: 30px;
  border: 1px solid transparent;
  border-radius: var(--radius);
  background: transparent;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: grab;
  padding: 0;
}

.project-row-drag:active {
  cursor: grabbing;
}

.project-top-actions {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.project-config-button-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.project-config-button-row > .btn,
.project-config-button-row > button,
.project-config-button-row > label {
  width: 100%;
  justify-content: center;
}

.template-download-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}

.file-input-hidden {
  display: none !important;
}

.org-card {
  margin-top: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px;
  background: var(--surface-2);
}

.org-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.org-memberships {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.org-member-form {
  margin-top: 10px;
}

.sticky-project-actions {
  position: sticky;
  top: 64px;
  z-index: 30;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 0;
  margin-bottom: 4px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 24px rgba(21, 26, 24, 0.07);
  backdrop-filter: blur(12px);
  align-items: center;
  justify-content: space-between;
}

.project-sticky-actions {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  background: var(--workspace-top-card-bg);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}

.project-sticky-actions .design-sync-banner {
  width: fit-content;
  max-width: 100%;
  margin: 0;
  box-shadow: none;
}

.sticky-project-actions-copy {
  display: grid;
  gap: 2px;
}

.sticky-project-actions-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.project-sticky-actions .sticky-project-actions-buttons {
  flex-wrap: nowrap;
  justify-content: flex-end;
  margin-left: auto;
}

.sticky-project-actions-buttons button[type="submit"] {
  background: var(--designer-card-button-bg);
  border-color: var(--designer-card-button-border);
  color: var(--text);
  font-weight: 400;
}

.sticky-project-actions-buttons button[type="submit"]:hover {
  background: var(--designer-card-button-bg-hover);
  border-color: var(--designer-card-selected-border);
  box-shadow: none;
}

/* ── Buttons ─────────────────────────────────────────────────────────── */
button, .btn, .download-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  padding: 6px 11px;
  font: inherit;
  font-size: var(--type-button-size);
  font-weight: var(--type-button-weight);
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s, opacity 0.15s, color 0.15s;
  white-space: nowrap;
}

button.primary, .btn.primary, .btn-primary, .download-link.primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

button.primary:hover, .btn.primary:hover, .btn-primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}

button.secondary, .btn.secondary, .btn-secondary, .download-link.secondary {
  background: var(--surface);
  color: var(--text);
  border-color: var(--border);
}

button.secondary:hover, .btn.secondary:hover, .btn-secondary:hover {
  background: var(--surface-2);
  border-color: var(--border-strong);
}

.btn.project-action-button,
button.project-action-button {
  background: var(--designer-card-button-bg);
  color: var(--text);
  border-color: var(--designer-card-button-border);
  font-family: var(--font-ui);
  font-weight: 400;
}

.btn.project-action-button:hover,
button.project-action-button:hover {
  background: var(--designer-card-button-bg-hover);
  border-color: var(--designer-card-selected-border);
  box-shadow: none;
}

.btn.project-action-button.site-planner-action,
button.project-action-button.site-planner-action {
  background: var(--brand-orange);
  border-color: var(--brand-orange);
  color: #FFFFFF;
}

.btn.project-action-button.site-planner-action:hover,
button.project-action-button.site-planner-action:hover {
  background: var(--brand-orange-hover);
  border-color: var(--brand-orange-hover);
  color: #FFFFFF;
}

.project-secondary-processing-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.btn.project-action-button.project-processing-secondary-action,
button.project-action-button.project-processing-secondary-action {
  background: rgba(36, 91, 254, 0.1);
  border-color: rgba(36, 91, 254, 0.28);
  color: var(--brand-charcoal);
}

.btn.project-action-button.project-processing-secondary-action:hover,
button.project-action-button.project-processing-secondary-action:hover {
  background: rgba(36, 91, 254, 0.16);
  border-color: rgba(36, 91, 254, 0.42);
  color: var(--brand-charcoal);
}

.btn.project-action-button.project-processing-debug-toggle,
button.project-action-button.project-processing-debug-toggle {
  position: relative;
  padding-left: 34px;
  min-width: 126px;
}

.btn.project-action-button.project-processing-debug-toggle::before,
button.project-action-button.project-processing-debug-toggle::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  transform: translateY(-50%);
  background: var(--surface);
  border: 1px solid var(--border-strong);
}

.btn.project-action-button.project-processing-debug-toggle.active,
button.project-action-button.project-processing-debug-toggle.active {
  background: rgba(13, 148, 136, 0.12);
  border-color: rgba(13, 148, 136, 0.38);
}

.btn.project-action-button.project-processing-debug-toggle.active::before,
button.project-action-button.project-processing-debug-toggle.active::before {
  background: rgb(13, 148, 136);
  border-color: rgb(13, 148, 136);
}

.btn.project-compact-button,
button.project-compact-button {
  padding: 5px 10px;
  font-size: var(--type-caption-size);
}

button.ghost, .btn.ghost, .btn-ghost {
  background: transparent;
  color: var(--text-muted);
  border-color: transparent;
}

button.ghost:hover, .btn.ghost:hover, .btn-ghost:hover {
  background: rgba(21, 26, 24, 0.05);
  color: var(--text);
}

.marketplace-shell .btn,
.marketplace-shell button,
.marketplace-sidebar .btn,
.marketplace-sidebar button {
  background: var(--workspace-card-button-bg);
  border-color: var(--border);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  box-shadow: none;
}

.marketplace-shell .btn.primary,
.marketplace-shell button.primary,
.marketplace-shell .btn.secondary,
.marketplace-shell button.secondary,
.marketplace-shell .btn.ghost,
.marketplace-shell button.ghost,
.marketplace-sidebar .btn.primary,
.marketplace-sidebar button.primary,
.marketplace-sidebar .btn.secondary,
.marketplace-sidebar button.secondary,
.marketplace-sidebar .btn.ghost,
.marketplace-sidebar button.ghost {
  background: var(--workspace-card-button-bg);
  border-color: var(--border);
  color: var(--text);
  font-weight: 400;
}

.marketplace-shell .btn:hover,
.marketplace-shell button:hover,
.marketplace-sidebar .btn:hover,
.marketplace-sidebar button:hover,
.marketplace-shell .btn.primary:hover,
.marketplace-shell button.primary:hover,
.marketplace-shell .btn.secondary:hover,
.marketplace-shell button.secondary:hover,
.marketplace-shell .btn.ghost:hover,
.marketplace-shell button.ghost:hover,
.marketplace-sidebar .btn.primary:hover,
.marketplace-sidebar button.primary:hover,
.marketplace-sidebar .btn.secondary:hover,
.marketplace-sidebar button.secondary:hover,
.marketplace-sidebar .btn.ghost:hover,
.marketplace-sidebar button.ghost:hover {
  background: #E3E3E3;
  border-color: var(--selected-border);
  color: var(--text);
  box-shadow: none;
}

.marketplace-shell .marketplace-cart-remove-button,
.marketplace-sidebar .marketplace-cart-remove-button {
  width: 27px;
  min-width: 27px;
  height: 27px;
  min-height: 27px;
  padding: 0;
  font-size: 13px;
  line-height: 1;
}

.marketplace-shell .marketplace-cart-qty,
.marketplace-sidebar .marketplace-cart-qty {
  width: 42px;
  min-height: 27px;
  height: 27px;
  padding: 0 5px;
  font-size: var(--type-label-size);
}

.marketplace-item-card.is-context-restored {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Marketplace follows the designer-space card and button language. */
.marketplace-shell,
.marketplace-sidebar {
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  letter-spacing: 0;
}

.marketplace-shell *,
.marketplace-sidebar * {
  font-family: var(--font-ui);
  letter-spacing: 0;
}

.marketplace-context-panel,
.marketplace-catalog-toolbar,
.marketplace-cart-panel,
.marketplace-shell .workspace-panel,
.marketplace-criteria-form > .workspace-disclosure,
.marketplace-catalog-family-section,
.marketplace-catalog-subgroup-section,
.marketplace-item-card,
.marketplace-sidebar-upload,
.marketplace-sidebar .marketplace-cart-sidebar-panel {
  border-color: var(--marketplace-card-border);
  background: var(--marketplace-card-bg);
  color: var(--text);
  box-shadow: none;
}

.marketplace-shell .workspace-disclosure summary,
.marketplace-shell [data-disclosure-id="marketplace-address"] summary,
.marketplace-criteria-form > .workspace-disclosure > summary,
.marketplace-catalog-family-head,
.marketplace-catalog-subgroup-head {
  min-height: 46px;
  border-color: var(--marketplace-divider);
  background: var(--marketplace-card-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-card-title-size);
  font-weight: 400;
}

.marketplace-shell .workspace-disclosure summary > span,
.marketplace-shell .workspace-disclosure summary small,
.marketplace-catalog-family-head span,
.marketplace-catalog-subgroup-head span,
.marketplace-catalog-heading h2,
.marketplace-sidebar .workspace-panel-head h2 {
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.marketplace-shell .field-label,
.marketplace-sidebar .field-label,
.marketplace-catalog-selector-label,
.marketplace-filter-card-head,
.marketplace-cart-section-title,
.marketplace-sidebar .sidebar-label {
  color: var(--text);
  font-size: var(--type-caption-size);
  font-weight: 400;
  text-transform: none;
}

.marketplace-shell input,
.marketplace-shell select,
.marketplace-shell textarea,
.marketplace-sidebar input,
.marketplace-sidebar select,
.marketplace-sidebar textarea {
  min-height: 34px;
  border-color: var(--marketplace-control-border);
  background: var(--marketplace-control-bg);
  color: var(--marketplace-control-color);
  border-radius: var(--marketplace-control-radius);
  font-size: var(--marketplace-control-size);
  font-weight: var(--marketplace-control-weight);
  box-shadow: none;
}

.marketplace-shell input:focus,
.marketplace-shell select:focus,
.marketplace-shell textarea:focus,
.marketplace-sidebar input:focus,
.marketplace-sidebar select:focus,
.marketplace-sidebar textarea:focus {
  border-color: var(--marketplace-control-border-hover);
  box-shadow: none;
}

.marketplace-shell .btn,
.marketplace-shell button,
.marketplace-sidebar .btn,
.marketplace-sidebar button,
.marketplace-sidebar-upload-link,
.marketplace-fulfillment-options .check-pill,
.marketplace-tab,
.marketplace-catalog-count,
.marketplace-sort-direction-btn,
.marketplace-locate-action .btn,
.marketplace-cart-row,
.marketplace-filter-row,
.marketplace-provider-row,
.marketplace-criterion-row,
.marketplace-analysis-summary,
.marketplace-item-detail-link,
.marketplace-item-card.is-compact .marketplace-qty-field input,
.marketplace-item-card.is-compact .marketplace-cart-add-button,
.marketplace-cart-remove-button {
  border-color: var(--marketplace-button-border);
  background: var(--marketplace-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  box-shadow: none;
}

.marketplace-shell .btn:hover,
.marketplace-shell button:hover,
.marketplace-sidebar .btn:hover,
.marketplace-sidebar button:hover,
.marketplace-sidebar-upload-link:hover,
.marketplace-tab:hover,
.marketplace-sort-direction-btn:hover,
.marketplace-locate-action .btn:hover,
.marketplace-item-detail-link:hover,
.marketplace-item-card.is-compact .marketplace-cart-add-button:hover,
.marketplace-cart-remove-button:hover {
  border-color: var(--marketplace-control-border-hover);
  background: var(--marketplace-button-bg-hover);
  color: var(--text);
  box-shadow: none;
}

.marketplace-tab.active,
.marketplace-fulfillment-options .check-pill:has(input:checked),
.marketplace-item-card.is-selected,
.marketplace-cart-panel.is-drop-target,
.marketplace-cart-section.is-drop-target,
.marketplace-cart-row.is-drop-target {
  border-color: var(--marketplace-selected-border);
  background: var(--marketplace-selected-bg);
  color: var(--text);
  box-shadow: none;
}

.marketplace-shell .marketplace-cart-row.is-unavailable,
.marketplace-sidebar .marketplace-cart-row.is-unavailable {
  opacity: 0.55;
  border-color: var(--marketplace-button-border);
  background: color-mix(in srgb, var(--marketplace-button-bg) 84%, #888 16%);
}

.marketplace-catalog-toolbar-embedded,
.marketplace-catalog-toolbar-embedded .marketplace-tab-row,
.marketplace-catalog-panel,
.marketplace-catalog-family-section[open] > .marketplace-catalog-family-head,
.marketplace-catalog-subgroup-section[open] > .marketplace-catalog-subgroup-head {
  border-color: var(--marketplace-divider);
}

.marketplace-catalog-family-head::after,
.marketplace-catalog-subgroup-head::after {
  border-color: var(--text-muted);
}

.marketplace-catalog-family-section[open] > .marketplace-catalog-family-head::after,
.marketplace-catalog-subgroup-section[open] > .marketplace-catalog-subgroup-head::after {
  border-color: var(--accent);
}

.marketplace-catalog-grid,
.marketplace-catalog-groups .marketplace-catalog-grid {
  gap: 8px;
}

.marketplace-catalog-groups {
  gap: 12px;
}

.marketplace-item-title,
.marketplace-item-card.is-compact .marketplace-item-title,
.marketplace-cart-row-main strong {
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.marketplace-item-meta,
.marketplace-item-lines,
.marketplace-item-line-stock,
.marketplace-cart-row-main span,
.marketplace-sidebar .workspace-panel-head p,
.marketplace-sidebar .empty-note,
.marketplace-sidebar .marketplace-cart-row-main span,
.marketplace-sidebar .marketplace-analysis-summary span,
.marketplace-analysis-summary span,
.marketplace-catalog-panel .empty-note {
  color: var(--text-muted);
  font-weight: 400;
}

.marketplace-sidebar .marketplace-cart-row,
.marketplace-sidebar .marketplace-date-criterion,
.marketplace-sidebar .marketplace-provider-row,
.marketplace-sidebar .marketplace-criterion-row,
.marketplace-sidebar .marketplace-analysis-summary {
  border-color: var(--marketplace-button-border);
  background: var(--marketplace-button-bg);
}

.marketplace-shell .marketplace-cart-section-title,
.marketplace-sidebar .marketplace-cart-section-title {
  color: var(--brand-charcoal);
}

.marketplace-shell .marketplace-cart-row .marketplace-cart-qty,
.marketplace-sidebar .marketplace-cart-row .marketplace-cart-qty,
.marketplace-shell .marketplace-cart-row .marketplace-cart-remove-button,
.marketplace-sidebar .marketplace-cart-row .marketplace-cart-remove-button {
  background: transparent;
  color: var(--brand-charcoal);
}

.marketplace-shell .marketplace-cart-row .marketplace-cart-qty.is-unavailable,
.marketplace-sidebar .marketplace-cart-row .marketplace-cart-qty.is-unavailable {
  color: var(--accent);
  opacity: 1;
}

.marketplace-shell .marketplace-cart-row .marketplace-cart-qty:focus,
.marketplace-sidebar .marketplace-cart-row .marketplace-cart-qty:focus {
  background: transparent;
}

.marketplace-shell .marketplace-cart-row .marketplace-cart-remove-button:hover,
.marketplace-sidebar .marketplace-cart-row .marketplace-cart-remove-button:hover {
  background: transparent;
  color: var(--accent);
}

.marketplace-sidebar-upload-link,
.marketplace-sidebar-upload-action {
  width: calc(100% - 12px);
  justify-self: center;
}

.marketplace-map-picker,
.marketplace-shell .map-picker {
  border-color: var(--brand-charcoal);
  border-radius: var(--radius-sm);
}

.marketplace-procurement-scope-note {
  border-color: var(--marketplace-button-border);
  background: var(--marketplace-button-bg);
  color: var(--text-muted);
}

button.danger, .btn.danger, .btn-danger {
  background: var(--surface);
  color: var(--danger);
  border-color: #FCA5A5;
}

button.danger:hover, .btn.danger:hover {
  background: var(--danger-soft);
}

button.success, .btn.success, .btn-success {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}

button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* ── Status badges ───────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0;
  white-space: nowrap;
}

/* Project workflow status */
.badge-draft           { background: #F1F3F1; color: #59645E; }
.badge-shared_engineers { background: #EEF3FF; color: #245BFE; }
.badge-submitted       { background: #EEF3FF; color: #245BFE; }
.badge-shared_constructor { background: #ECF8F2; color: #11845B; }
.badge-quoted          { background: #F1F0FF; color: #5347A8; }
.badge-disclosed       { background: #F7F0FA; color: #735082; }
.badge-public_review   { background: #FFF7E6; color: #9A630F; }
.badge-pending-send    { background: #FFF7E6; color: #9A630F; border: 1px solid #E5B867; }
.badge-approved        { background: #ECF8F2; color: #12613F; }
.badge-purchased       { background: #EAF8F6; color: #0F766E; }
.badge-in_fabrication  { background: #FFF4EC; color: #A84E17; }
.badge-in_consolidation { background: #FEF8DE; color: #85620C; }
.badge-kit_ready       { background: #F2F9E8; color: #4D7C0F; }
.badge-in_construction { background: #ECF8F2; color: #0F6A48; }
.badge-inspected       { background: #ECF8F2; color: #12613F; }
.badge-delivered       { background: #ECF8F2; color: #14532D; }

/* Job status */
.badge-queued, .badge-running { background: #FFFBEB; color: #B45309; }
.badge-succeeded               { background: #ECF8F2; color: #12613F; }
.badge-failed, .badge-cancelled { background: var(--danger-soft); color: var(--danger); }

/* Role badge */
.badge-role {
  background: var(--accent-soft);
  color: var(--accent);
  border: 1px solid #C9D6FF;
}

/* Shared badge */
.badge-shared {
  background: #F7F0FA;
  color: #735082;
  border: 1px solid #E5D7EA;
}

.project-list-row-badges {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

/* ── Divider ─────────────────────────────────────────────────────────── */
.divider {
  border: none;
  border-top: 1px solid var(--border);
  margin: 0;
}

/* ── Info row / stat ─────────────────────────────────────────────────── */
.info-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
}

.info-row + .info-row { border-top: 1px solid var(--border); }

.info-label {
  color: var(--text-muted);
  font-weight: 500;
}

.info-value {
  color: var(--text);
  font-weight: 600;
  text-align: right;
}

.info-row-stack {
  align-items: flex-start;
  gap: 12px;
}

.procurement-cost-table {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
}

.procurement-cost-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, auto) 76px;
  gap: 12px;
  align-items: center;
  padding: 9px 11px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 94%, #FCD34D 6%);
  font-size: 13px;
  font-weight: 300;
}

.procurement-cost-row:first-child {
  border-top: 0;
}

.procurement-cost-row > span:first-child {
  color: var(--text-muted);
  font-weight: 300;
}

.procurement-cost-row > strong,
.procurement-cost-row > span:last-child {
  font-weight: 400;
  text-align: right;
}

.procurement-cost-row-head {
  background: var(--workspace-sidebar-bg);
  color: var(--workspace-sidebar-text);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.construction-schedule-left-resize {
  position: absolute;
  top: 0;
  right: -4px;
  bottom: 0;
  z-index: 2;
  width: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: col-resize;
}

.construction-schedule-left-resize::after {
  content: "";
  position: absolute;
  top: 8px;
  right: 3px;
  bottom: 8px;
  width: 1px;
  border-radius: 999px;
  background: var(--border);
  opacity: 0.72;
}

.construction-schedule-left-resize:hover::after,
.construction-schedule-left-resize:focus-visible::after {
  right: 2px;
  width: 2px;
  background: var(--accent);
  opacity: 0.95;
}

.procurement-cost-row-head > span:first-child {
  color: var(--workspace-sidebar-text);
}

.procurement-cost-row-total {
  background: color-mix(in srgb, var(--workspace-card-button-bg) 90%, #FCD34D 10%);
  font-weight: 400;
}

.procurement-cost-row-total > span:first-child {
  color: var(--text);
}

/* ── Download list ───────────────────────────────────────────────────── */
.download-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.download-output-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.download-group-stack {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

@media (max-width: 1180px) {
  .download-group-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .download-group-stack {
    grid-template-columns: 1fr;
  }
}

.download-output-toolbar,
.download-group-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.download-group {
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-bg);
  overflow: hidden;
}

.download-group-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 6px 8px;
  cursor: pointer;
  list-style: none;
  background: var(--designer-card-bg);
}

.download-group-summary::-webkit-details-marker {
  display: none;
}

.download-group-summary::before {
  content: ">";
  color: var(--text-muted);
  font-size: 11px;
  transition: transform 0.12s ease;
}

.download-group[open] .download-group-summary::before {
  transform: rotate(90deg);
}

.download-group-title {
  flex: 1;
  min-width: 0;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.house-download-summary .download-group-title {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.download-group-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.download-group-meta span,
.download-section-label {
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: 400;
  line-height: 1;
  padding: 0;
}

.download-group-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 8px 8px;
  background: var(--designer-card-bg);
}

.download-section-label {
  align-self: flex-start;
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.download-list-compact {
  gap: 6px;
}

.download-list-compact .download-item {
  padding: 6px 0;
}

.download-list-compact .download-item-info strong {
  font-size: var(--type-control-size);
}

.download-list-compact .download-item-info small {
  font-size: var(--type-caption-size);
}

.download-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 6px;
  padding: 7px 0;
  border: 0;
  border-top: 1px solid var(--designer-card-divider);
  border-radius: 0;
  background: var(--designer-card-bg);
}

.download-item:first-child {
  border-top: 0;
}

.download-item:hover {
  background: var(--designer-card-bg);
}

.download-item-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
  align-items: center;
  justify-content: stretch;
  gap: 6px;
}

.download-item-info strong {
  font-size: var(--type-control-size);
  font-family: var(--font-ui);
  font-weight: 400;
  color: var(--text);
}

.download-item-info {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}

.download-item-info small {
  color: var(--brand-charcoal);
  font-size: var(--type-caption-size);
  font-family: var(--font-ui);
  font-weight: 400;
  text-transform: uppercase;
}

.download-link.viewer-link {
  background: var(--designer-card-button-bg);
  color: var(--text);
  border-color: var(--designer-card-button-border);
  font-weight: 400;
}

.download-item-actions .btn,
.download-item-actions .download-link,
.house-download-format-actions .btn,
.house-download-format-actions .download-link,
.download-group-summary .btn,
.workspace-disclosure-actions .download-all-action {
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: 400;
  box-shadow: none;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.1;
}

.download-item-actions .btn,
.download-item-actions .download-link,
.house-download-format-actions .btn,
.house-download-format-actions .download-link {
  width: 100%;
  min-width: 0;
}

.download-link.viewer-link:hover {
  background: var(--designer-card-button-bg-hover);
  border-color: var(--designer-card-selected-border);
}

.download-item-actions .btn:hover,
.download-item-actions .download-link:hover,
.house-download-format-actions .btn:hover,
.house-download-format-actions .download-link:hover,
.download-group-summary .btn:hover,
.workspace-disclosure-actions .download-all-action:hover {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-button-bg-hover);
  color: var(--text);
}

.download-group-all-action,
.download-all-action {
  flex: 0 0 auto;
  min-height: 30px;
}

/* EETT editor */
[data-disclosure-id="project-eett"] {
  --eett-card-bg: var(--designer-card-bg);
  --eett-panel-bg: var(--designer-card-button-bg);
  --eett-panel-bg-hover: var(--designer-card-button-bg-hover);
  --eett-field-bg: var(--designer-card-control-bg);
  --eett-field-bg-disabled: var(--designer-card-control-bg-disabled);
  --eett-border: var(--designer-card-button-border);
  --eett-divider: color-mix(in srgb, var(--designer-card-bg) 76%, var(--brand-charcoal) 24%);
  --eett-selected-bg: var(--designer-card-selected-bg);
  --eett-selected-border: var(--designer-card-selected-border);
  --eett-text: var(--brand-charcoal);
  --eett-muted: color-mix(in srgb, var(--brand-charcoal) 82%, var(--designer-card-bg) 18%);
  --eett-subtle: color-mix(in srgb, var(--brand-charcoal) 66%, var(--designer-card-bg) 34%);
}

.eett-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: var(--eett-text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.eett-shell :where(strong, summary, label, span, small, code, pre, input, textarea, button) {
  font-family: var(--font-ui);
  font-weight: 400;
  letter-spacing: 0;
}

.eett-toolbar,
.eett-summary-chips,
.eett-field-head,
.eett-field-actions,
.eett-section-editor-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.eett-toolbar {
  justify-content: space-between;
  align-items: flex-start;
}

.eett-toolbar-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.eett-toolbar-copy span,
.eett-field-label,
.eett-section-editor small {
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  font-weight: 400;
}

.eett-toolbar-actions,
.eett-field-chips {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.eett-summary-chips {
  flex-wrap: wrap;
}

.eett-chip {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 6px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  font-weight: 400;
  line-height: 1.2;
}

.eett-chip-strong {
  color: var(--text);
}

.eett-chip-warn {
  color: var(--warn);
  border-color: color-mix(in srgb, var(--warn) 40%, var(--designer-card-divider));
}

.eett-validation {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--text);
  font-weight: 400;
}

.eett-validation.is-warning {
  border-color: color-mix(in srgb, var(--warn) 40%, var(--designer-card-divider));
}

.eett-validation.is-ok {
  border-color: color-mix(in srgb, var(--green) 35%, var(--designer-card-divider));
}

.eett-subpanel,
.eett-field-group,
.eett-section-group {
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.eett-subpanel > summary,
.eett-field-group > summary,
.eett-section-group > summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px;
  cursor: pointer;
  color: var(--text);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.eett-field-group-stack,
.eett-section-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 8px 8px;
}

.eett-field-grid,
.eett-table-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 0 8px 8px;
}

.eett-field-row,
.eett-section-editor {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.eett-field-row.is-missing {
  border-color: color-mix(in srgb, var(--warn) 45%, var(--designer-card-divider));
}

.eett-field-head,
.eett-section-editor-head {
  justify-content: space-between;
  align-items: flex-start;
}

.eett-field-head code {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 400;
  background: transparent;
  border: 0;
  padding: 0;
}

.eett-field-input,
.eett-section-body-input {
  width: 100%;
  min-width: 0;
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-control-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.eett-input-wrap {
  position: relative;
  display: flex;
  min-width: 0;
}

.eett-input-wrap .eett-field-input,
.eett-input-wrap .eett-section-body-input {
  padding-right: 38px;
}

.eett-reset-btn {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 28px;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
}

.eett-override-button {
  flex: 0 0 auto;
  min-height: 28px;
  padding: 4px 8px;
  white-space: nowrap;
}

.eett-field-label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.eett-json-input,
.eett-section-body-input,
.eett-preview {
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.eett-override-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-muted);
  font-size: var(--type-caption-size);
  font-weight: 400;
}

.eett-small-btn {
  min-height: 28px;
  padding: 4px 8px;
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: 400;
}

.eett-preview {
  max-height: 520px;
  margin: 0 8px 8px;
  padding: 10px;
  overflow: auto;
  white-space: pre-wrap;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  color: var(--text);
}

.eett-pdf-preview {
  width: 100%;
  height: min(76vh, 860px);
  min-height: 520px;
  border: 0;
  overflow: auto;
}

.eett-pdf-preview-wrap {
  display: grid;
  gap: 8px;
  padding: 0 8px 8px;
}

.eett-pdf-preview-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.eett-pdf-page {
  box-sizing: border-box;
  max-width: 820px;
  min-height: 100%;
  margin: 0 auto;
  padding: 28px;
}

.eett-pdf-page > :first-child {
  margin-top: 0;
}

.eett-pdf-page p,
.eett-pdf-page blockquote {
  margin: 0 0 10px;
}

.eett-pdf-page blockquote {
  padding-left: 12px;
  border-left: 3px solid;
}

.eett-pdf-table {
  width: 100%;
  margin: 8px 0 12px;
  border-collapse: collapse;
  table-layout: fixed;
}

.eett-pdf-table th,
.eett-pdf-table td {
  padding: 6px;
  border: 1px solid;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.eett-missing-note {
  margin: -4px 0 0;
}

.workspace-eett-editor {
  --eett-required: #b45309;
  --eett-bg: #3f4340;
  --eett-rail-bg: #575a56;
  --eett-rail-border: #545955;
  --eett-rail-text: #f1f3ef;
  --eett-rail-muted: #c0c6bf;
  --eett-stage: #d8d8d8;
  --eett-paper: #f7f7f5;
  --eett-accent: #f28a2e;
  --eett-accent-soft: rgba(242, 138, 46, 0.18);
  --eett-scroll-thumb: rgba(255, 255, 255, 0.18);
  --eett-scroll-track: rgba(0, 0, 0, 0.08);
  min-height: 0;
  background: var(--eett-bg);
}

.app-eett-editor-root {
  position: relative;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
  background: #f1f2ef;
}

.eett-editor-topbar {
  flex: 0 0 var(--topbar-h);
  padding-inline: 10px;
  gap: 12px;
}

.eett-editor-topbar .navbar-brand {
  flex: 1 1 0;
  min-width: 0;
  gap: 12px;
}

.eett-editor-topbar .navbar-right {
  flex: 1 1 0;
  justify-content: flex-end;
  min-width: 0;
  gap: 8px;
}

.eett-editor-topbar .eett-navbar-actions {
  border: 0;
  background: transparent;
  padding: 0;
}

.eett-editor-topbar .eett-navbar-icon-button {
  border-color: var(--topbar-soft-border);
  background: var(--workspace-card-button-bg);
}

.eett-editor-topbar .eett-navbar-icon-button:hover:not(:disabled),
.eett-editor-topbar .eett-navbar-icon-button:focus-visible {
  border-color: var(--topbar-accent);
  background: #E3E3E3;
}

.eett-topbar-back {
  flex: 0 0 auto;
  min-height: 28px;
  padding: 4px 10px;
  white-space: nowrap;
}

.eett-navbar-project {
  min-width: 0;
  overflow: hidden;
  padding-left: 12px;
  border-left: 1px solid var(--topbar-soft-border);
  color: rgba(52, 55, 53, 0.76);
  font-family: var(--font-ui);
  font-size: var(--type-topbar-title-size);
  font-weight: var(--type-topbar-title-weight);
  letter-spacing: 0;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eett-topbar-message {
  max-width: min(28vw, 360px);
  overflow: hidden;
  color: rgba(52, 55, 53, 0.7);
  font-size: 11px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eett-topbar-message.is-success {
  color: #2f6b3c;
}

.eett-topbar-message.is-warning,
.eett-topbar-message.is-warn {
  color: #9a5b13;
}

.eett-topbar-message.is-error {
  color: #9f2f2f;
}

.eett-navbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--topbar-soft-border);
  border-radius: var(--radius-sm);
  background: #fff;
}

.eett-navbar-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  min-width: 30px;
  height: 28px;
  padding: 3px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--brand-charcoal);
  cursor: pointer;
}

.eett-navbar-icon-button:hover:not(:disabled),
.eett-navbar-icon-button:focus-visible {
  border-color: color-mix(in srgb, var(--brand-orange) 44%, var(--topbar-soft-border));
  background:
    linear-gradient(rgba(242, 138, 46, 0.1), rgba(242, 138, 46, 0.1)),
    #fff;
  outline: none;
}

.eett-navbar-icon-button:disabled {
  cursor: default;
  opacity: 0.38;
}

.eett-navbar-icon-button .platform-action-icon {
  width: 21px;
  height: 21px;
}

.eett-navbar-save-button .platform-action-icon {
  width: 22px;
  height: 22px;
}

.eett-navbar-pdf-button .platform-action-icon {
  width: 21px;
  height: 21px;
}

.eett-author-toggle.is-active {
  border-color: color-mix(in srgb, var(--brand-orange) 48%, var(--topbar-soft-border));
  background:
    linear-gradient(rgba(242, 138, 46, 0.12), rgba(242, 138, 46, 0.12)),
    rgba(255, 255, 255, 0.06);
}

.eett-author-toggle-icon {
  display: grid;
  grid-template-columns: repeat(3, 5px);
  gap: 3px;
  align-items: end;
  height: 18px;
}

.eett-author-toggle-icon span {
  display: block;
  width: 5px;
  border-radius: 999px;
}

.eett-author-toggle-icon span:nth-child(1) {
  height: 11px;
  background: #d76a03;
}

.eett-author-toggle-icon span:nth-child(2) {
  height: 16px;
  background: #2563eb;
}

.eett-author-toggle-icon span:nth-child(3) {
  height: 8px;
  background: #0f766e;
}

.eett-editor-main {
  min-height: 0;
  min-width: 0;
  padding: 10px;
  overflow: hidden;
  background: var(--eett-bg);
  color: var(--text);
}

.eett-editor-layout {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: minmax(250px, 292px) minmax(620px, 1fr) minmax(290px, 360px);
  gap: 10px;
  align-items: stretch;
  min-height: 0;
  overflow: hidden;
}

.app-eett-editor-root .workspace-eett-editor {
  flex: 1 1 auto;
  height: calc(100vh - var(--topbar-h));
  min-height: 0;
  overflow: hidden;
}

.workspace-eett-editor,
.workspace-eett-editor * {
  scrollbar-color: var(--eett-scroll-thumb) transparent;
  scrollbar-width: thin;
}

.workspace-eett-editor ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.workspace-eett-editor ::-webkit-scrollbar-track {
  background: transparent;
}

.workspace-eett-editor ::-webkit-scrollbar-thumb {
  border-radius: 999px;
  border: 2px solid transparent;
  background: var(--eett-scroll-thumb);
  background-clip: padding-box;
}

.eett-editor-nav,
.eett-editor-side,
.eett-editor-canvas {
  height: 100%;
  min-height: 0;
  min-width: 0;
  border-radius: 8px;
}

.eett-editor-nav,
.eett-editor-side {
  position: relative;
  top: auto;
  max-height: none;
  overflow: auto;
}

.eett-editor-nav {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--eett-rail-border);
  background: var(--eett-rail-bg);
  color: var(--eett-rail-text);
}

.eett-editor-tools-head {
  display: grid;
  gap: 2px;
  padding-bottom: 2px;
}

.eett-editor-tools-head span,
.eett-editor-nav-title {
  color: var(--eett-rail-muted);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.eett-editor-tools-head strong {
  color: var(--eett-rail-text);
  font-size: 14px;
  letter-spacing: 0;
}

.eett-editor-nav-group {
  border-top: 1px solid var(--eett-rail-border);
}

.eett-editor-nav-group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 2px;
  cursor: pointer;
  color: var(--eett-rail-text);
  list-style: none;
  text-align: left;
}

.eett-editor-nav-group > summary::-webkit-details-marker {
  display: none;
}

.eett-editor-nav-group > summary::before {
  content: "";
  width: 0;
  height: 0;
  margin-right: 2px;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 5px solid var(--eett-rail-muted);
  transform-origin: center;
  transition: transform 120ms ease;
}

.eett-editor-nav-group[open] > summary::before {
  transform: rotate(90deg);
}

.eett-editor-nav-group > summary span {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eett-editor-nav-group > summary small {
  flex: 0 0 auto;
  color: var(--eett-rail-muted);
}

.eett-editor-nav-list,
.eett-editor-side,
.eett-editor-side-section,
.eett-comment-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.eett-editor-nav-list {
  padding: 0 0 8px 14px;
}

.eett-editor-tools .eett-toolbar-actions {
  display: flex;
  gap: 6px;
}

.eett-editor-tools .btn {
  min-height: 30px;
}

.eett-editor-tools .btn.secondary {
  border-color: var(--eett-rail-border);
  background: rgba(255, 255, 255, 0.06);
  color: var(--eett-rail-text);
}

.eett-editor-tools .btn.secondary:hover {
  border-color: rgba(242, 138, 46, 0.36);
  background:
    linear-gradient(rgba(242, 138, 46, 0.14), rgba(242, 138, 46, 0.14)),
    rgba(255, 255, 255, 0.06);
}

.eett-editor-tools .eett-editor-side-section {
  border-color: var(--eett-rail-border);
  background: rgba(0, 0, 0, 0.1);
  color: var(--eett-rail-text);
}

.eett-editor-tools .eett-editor-side-head strong {
  color: var(--eett-rail-text);
}

.eett-editor-tools .eett-editor-side-section select {
  width: 100%;
  min-width: 0;
}

.eett-lock-icon-button {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.eett-lock-icon-button[aria-pressed="true"],
.eett-hidden-chars-toggle.is-active {
  border-color: rgba(242, 138, 46, 0.38);
  background:
    linear-gradient(rgba(242, 138, 46, 0.15), rgba(242, 138, 46, 0.15)),
    rgba(255, 255, 255, 0.06);
}

.eett-lock-icon-button .platform-action-icon,
.eett-lock-icon-button .eett-planner-lock-icon {
  width: 22px;
  height: 22px;
}

.eett-lock-icon-button .eett-planner-lock-icon {
  filter: grayscale(1) saturate(0);
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

.eett-view-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--eett-rail-border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.1);
}

.eett-view-switch-button {
  min-height: 30px;
  justify-content: center;
  border-color: transparent;
  background: transparent;
  color: var(--eett-rail-muted);
  box-shadow: none;
}

.eett-view-switch-button:hover,
.eett-view-switch-button.is-active {
  border-color: rgba(242, 138, 46, 0.34);
  background:
    linear-gradient(rgba(242, 138, 46, 0.16), rgba(242, 138, 46, 0.16)),
    rgba(255, 255, 255, 0.04);
  color: var(--eett-rail-text);
  box-shadow: none;
}

.eett-editor-nav-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 7px;
  row-gap: 1px;
  align-items: baseline;
  width: 100%;
  min-height: 34px;
  padding: 5px 7px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.02);
  color: var(--eett-rail-text);
  text-align: left;
}

.eett-editor-nav-item.is-depth-1 {
  padding-left: 19px;
}

.eett-editor-nav-item.is-depth-2 {
  padding-left: 31px;
}

.eett-editor-nav-item.is-depth-3 {
  padding-left: 43px;
}

.eett-editor-nav-item.is-depth-4 {
  padding-left: 55px;
}

.eett-editor-nav-item:hover,
.eett-editor-nav-item.is-active {
  border-color: rgba(242, 138, 46, 0.36);
  background:
    linear-gradient(rgba(242, 138, 46, 0.16), rgba(242, 138, 46, 0.16)),
    rgba(255, 255, 255, 0.04);
}

.eett-editor-nav-item.is-author-tracked {
  border-color: color-mix(in srgb, var(--eett-author-color) 42%, transparent);
  background:
    linear-gradient(color-mix(in srgb, var(--eett-author-color) 18%, transparent), color-mix(in srgb, var(--eett-author-color) 18%, transparent)),
    rgba(255, 255, 255, 0.03);
}

.eett-editor-nav-item.is-author-tracked::before {
  content: "";
  align-self: center;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--eett-author-color);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--eett-author-color) 18%, transparent);
}

.eett-editor-nav-item.is-author-tracked > strong,
.eett-editor-nav-item.is-author-tracked > span,
.eett-editor-nav-item.is-author-tracked > small {
  grid-column: 2;
}

.eett-editor-nav-item strong {
  color: var(--eett-rail-text);
  font-size: 11px;
  line-height: 1.25;
}

.eett-editor-nav-item span,
.eett-editor-nav-item small {
  min-width: 0;
  overflow: hidden;
  color: var(--eett-rail-muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eett-editor-nav-item small {
  grid-column: 2;
}

.eett-comment-row span {
  color: var(--text-muted);
  font-size: var(--type-caption-size);
}

.eett-editor-canvas {
  padding: 10px;
  overflow: auto;
  border: 1px solid var(--eett-rail-border);
  background: var(--eett-stage);
}

.eett-editor-section-head,
.eett-editor-side-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.eett-editor-section-head {
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 8px;
}

.eett-editor-section-head h1 {
  margin: 4px 0 0;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 0;
}

.eett-rich-toolbar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: end;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--eett-rail-border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.1);
}

.eett-rich-toolbar-plain {
  grid-template-columns: auto;
  justify-content: start;
  gap: 8px;
}

.eett-rich-toolbar label {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.eett-rich-toolbar label span {
  color: var(--eett-rail-muted);
  font-size: 11px;
}

.eett-toolbar-field-style,
.eett-toolbar-field-font,
.eett-toolbar-field-align {
  grid-column: span 2;
}

.eett-style-name {
  display: flex;
  align-items: center;
  min-height: 28px;
  padding: 0 8px;
  border: 1px solid var(--eett-rail-border);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.05);
  color: var(--eett-rail-text);
  font-size: 12px;
  line-height: 1.2;
}

.eett-toolbar-field-weight,
.eett-toolbar-field-size,
.eett-toolbar-field-color,
.eett-toolbar-field-margin,
.eett-toolbar-field-space,
.eett-toolbar-field-italic {
  grid-column: span 1;
}

.eett-hidden-chars-toggle {
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.eett-hidden-chars-toggle > span {
  display: grid;
  place-items: center;
  width: 23px;
  height: 23px;
}

.eett-rich-toolbar select,
.eett-rich-toolbar input {
  width: 100%;
  min-width: 0;
  min-height: 28px;
  padding-inline: 6px;
  font-size: 12px;
}

.eett-rich-toolbar input[type="color"] {
  padding: 2px;
}

.eett-toolbar-button-row {
  display: flex;
  gap: 6px;
}

.eett-icon-btn {
  width: 28px;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  font-weight: 700;
}

.eett-rich-toolbar > [data-action="reset-eett-rich-format"] {
  grid-column: span 2;
  min-height: 28px;
  padding: 0 8px;
  font-size: 12px;
}

.eett-document-page {
  width: 100%;
  max-width: 900px;
  min-height: 760px;
  margin: 10px auto 0;
  padding: 30px;
  border: 1px solid var(--designer-card-divider);
  background: var(--eett-paper);
  color: #111;
  box-shadow: none;
}

.eett-editor-canvas-final {
  padding-block: 12px;
}

.eett-final-document {
  display: grid;
  gap: 16px;
  min-height: 960px;
  margin-top: 0;
  padding: 34px 38px 42px;
}

.eett-final-section {
  display: grid;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid rgba(17, 24, 22, 0.12);
}

.eett-final-section.is-author-tracked {
  margin-inline: -10px;
  padding: 8px 10px 6px;
  border-left: 0;
  background: color-mix(in srgb, var(--eett-author-color) 5%, transparent);
}

.eett-final-section.is-author-tracked .eett-rich-block {
  color: color-mix(in srgb, var(--eett-author-color) 82%, #111 18%) !important;
}

.eett-final-section.is-author-tracked .eett-variable-chip {
  color: inherit;
}

.eett-final-section.is-author-tracked .eett-variable-chip.is-missing {
  color: #8a3f0b;
}

.eett-final-section.is-scroll-target {
  background:
    linear-gradient(rgba(242, 138, 46, 0.12), rgba(242, 138, 46, 0.12)),
    transparent;
  outline: 1px solid rgba(242, 138, 46, 0.28);
  outline-offset: 4px;
}

.eett-final-section:first-child,
.eett-final-chapter:first-child {
  padding-top: 0;
  border-top: 0;
}

.eett-final-chapter {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid rgba(17, 24, 22, 0.24);
  color: #111;
}

.eett-final-chapter span {
  color: rgba(17, 24, 22, 0.64);
  font-size: 10pt;
  font-weight: 700;
}

.eett-final-chapter h1 {
  margin: 0;
  color: #111;
  font-size: 13pt;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.eett-final-section-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 2px;
  color: #111;
}

.eett-final-section-head span {
  color: rgba(17, 24, 22, 0.62);
  font-size: 8pt;
  font-weight: 700;
}

.eett-final-section-head h2 {
  margin: 0;
  color: #111;
  font-size: 9.5pt;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
}

.eett-plain-editor-shell {
  display: grid;
  min-height: 760px;
  margin-top: 10px;
  border: 1px solid var(--designer-card-divider);
  background: #eceeeb;
}

.eett-plain-editor-shell.is-author-tracked {
  border-color: color-mix(in srgb, var(--eett-author-color) 26%, var(--designer-card-divider));
  background:
    linear-gradient(color-mix(in srgb, var(--eett-author-color) 5%, transparent), color-mix(in srgb, var(--eett-author-color) 5%, transparent)),
    #eceeeb;
}

.eett-plain-editor {
  width: 100%;
  min-height: 760px;
  overflow: auto;
  padding: 24px 28px;
  border: 1px solid rgba(17, 24, 22, 0.08);
  border-radius: 0;
  background: #eceeeb;
  color: #111816;
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.55;
  white-space: pre-wrap;
}

.eett-plain-editor:hover {
  border-color: rgba(88, 94, 89, 0.18);
  background: #eceeeb;
}

.eett-plain-editor-shell.is-author-tracked .eett-plain-editor {
  background: transparent;
  color: color-mix(in srgb, var(--eett-author-color) 82%, #111816 18%);
}

.eett-plain-editor:focus {
  outline: 0.5px solid rgba(72, 78, 74, 0.36);
  outline-offset: -1px;
  background: #eceeeb;
}

.eett-author-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: max-content;
  max-width: 100%;
  margin-top: 5px;
  color: color-mix(in srgb, var(--eett-author-color) 82%, #111 18%);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
}

.eett-author-tag > span {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--eett-author-color);
}

.eett-rich-block {
  min-height: 18px;
  padding: 2px 0;
  border-radius: 2px;
  outline: 1px solid transparent;
  outline-offset: 2px;
  white-space: pre-wrap;
}

.eett-rich-block:hover {
  outline-color: rgba(72, 78, 74, 0.14);
  background: transparent;
}

.eett-variable-chip {
  display: inline;
  padding: 0;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: #7f4a16;
  cursor: pointer;
  font: inherit;
  line-height: inherit;
  white-space: normal;
}

.eett-variable-chip:hover,
.eett-variable-chip:focus {
  outline: 0.5px solid rgba(72, 78, 74, 0.3);
  outline-offset: 1px;
  background: transparent;
  color: #643a12;
}

.eett-variable-chip.is-missing {
  padding: 1px 4px;
  border: 1px solid rgba(180, 83, 9, 0.34);
  border-radius: 4px;
  background:
    linear-gradient(rgba(242, 138, 46, 0.18), rgba(242, 138, 46, 0.18)),
    rgba(255, 255, 255, 0.36);
  color: #8a3f0b;
  white-space: nowrap;
}

.eett-variable-chip.is-missing:hover,
.eett-variable-chip.is-missing:focus {
  outline-color: rgba(242, 138, 46, 0.58);
  background:
    linear-gradient(rgba(242, 138, 46, 0.28), rgba(242, 138, 46, 0.28)),
    rgba(255, 255, 255, 0.42);
  color: #71340a;
}

.eett-hidden-char {
  position: relative;
  display: inline-block;
  width: 0;
  max-width: 0;
  height: 0;
  overflow: visible;
  font-size: 0;
  line-height: 0;
  vertical-align: baseline;
  pointer-events: none;
  user-select: none;
}

.eett-hidden-char::after {
  content: attr(data-eett-hidden-glyph);
  position: absolute;
  left: 0;
  bottom: 0.05em;
  color: rgba(180, 83, 9, 0.72);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
}

.eett-hidden-tab::after {
  left: 1px;
}

.eett-hidden-break::after {
  left: 2px;
  bottom: 0;
}

.eett-rich-block:focus {
  outline: 0.5px solid rgba(72, 78, 74, 0.38);
  background: transparent;
}

.eett-plain-editor::selection,
.eett-rich-block::selection,
.eett-plain-editor *::selection,
.eett-rich-block *::selection {
  background: rgba(95, 101, 96, 0.18);
  color: inherit;
}

.eett-editor-side {
  padding: 8px;
  border: 1px solid var(--eett-rail-border);
  background: #cfd2ce;
}

.eett-editor-side-section {
  padding: 8px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
}

.eett-editor-side-head {
  justify-content: space-between;
}

.eett-variable-table {
  display: grid;
  gap: 6px;
}

.eett-variable-insert-controls {
  display: grid;
  gap: 6px;
  margin-bottom: 8px;
}

.eett-variable-insert-select {
  display: grid;
  gap: 3px;
}

.eett-variable-insert-select span {
  color: var(--text-muted);
  font-size: 11px;
}

.eett-variable-insert-select select,
.eett-variable-filter {
  width: 100%;
  min-width: 0;
}

.eett-variable-insert-controls .btn {
  width: 100%;
  justify-content: center;
}

.eett-variable-filter {
  margin-bottom: 8px;
}

.eett-variable-row {
  display: grid;
  grid-template-columns: minmax(96px, 0.8fr) minmax(120px, 1fr) auto;
  gap: 6px;
  align-items: center;
  padding: 6px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-bg);
}

.eett-variable-row.is-required-missing {
  border-color: rgba(180, 83, 9, 0.32);
  background:
    linear-gradient(rgba(180, 83, 9, 0.13), rgba(180, 83, 9, 0.13)),
    var(--designer-card-bg);
}

.eett-variable-row.is-required-missing label {
  color: var(--eett-required);
}

.eett-variable-row.is-variable-target {
  border-color: rgba(242, 138, 46, 0.72);
  background:
    linear-gradient(rgba(242, 138, 46, 0.18), rgba(242, 138, 46, 0.18)),
    var(--designer-card-bg);
}

.eett-author-legend-list {
  display: grid;
  gap: 6px;
}

.eett-author-legend-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  padding: 5px 6px;
  border: 1px solid color-mix(in srgb, var(--eett-author-color) 34%, var(--designer-card-divider));
  border-radius: var(--radius-sm);
  background:
    linear-gradient(color-mix(in srgb, var(--eett-author-color) 10%, transparent), color-mix(in srgb, var(--eett-author-color) 10%, transparent)),
    var(--designer-card-bg);
}

.eett-author-legend-row > span {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--eett-author-color);
}

.eett-author-legend-row strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: var(--type-caption-size);
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eett-author-legend-row small {
  color: var(--text-muted);
  font-size: 11px;
  white-space: nowrap;
}

.eett-variable-row label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--type-caption-size);
}

.eett-variable-row .eett-field-input {
  min-height: 30px;
}

.eett-variable-row .eett-override-button {
  min-height: 30px;
  padding: 3px 6px;
}

.eett-comment-row {
  display: grid;
  gap: 2px;
  padding: 6px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: var(--designer-card-bg);
}

.eett-comment-row p {
  margin: 0;
}

.workspace-eett-editor .eett-editor-tools .eett-editor-nav-item {
  appearance: none;
  -webkit-appearance: none;
  justify-content: start;
  background-color: rgba(255, 255, 255, 0.02);
  background-image: none;
  color: var(--eett-rail-text);
}

.workspace-eett-editor .eett-editor-tools .eett-editor-nav-item:hover,
.workspace-eett-editor .eett-editor-tools .eett-editor-nav-item.is-active {
  background-color: rgba(255, 255, 255, 0.04);
  background-image: linear-gradient(rgba(242, 138, 46, 0.16), rgba(242, 138, 46, 0.16));
  color: var(--eett-rail-text);
}

.eett-compact-shell .eett-toolbar {
  margin-bottom: 8px;
}

@media (max-width: 1100px) {
  .eett-editor-layout {
    grid-template-columns: 1fr;
  }

  .eett-editor-nav,
  .eett-editor-side {
    position: static;
    max-height: none;
  }

  .eett-document-page {
    min-height: 520px;
    padding: 20px;
  }
}

[data-disclosure-id="project-eett"],
[data-disclosure-id="project-eett"] .workspace-disclosure-body,
.eett-shell {
  background: var(--eett-card-bg);
  color: var(--eett-text);
}

.eett-shell :where(p, span, small, label, strong, summary, code, pre, a, button, input, select, textarea) {
  color: inherit;
}

.eett-toolbar {
  padding: 8px;
  border: 1px solid var(--eett-divider);
  border-radius: var(--radius-sm);
  background: var(--eett-panel-bg);
}

.eett-toolbar-copy strong,
.eett-section-editor-head strong,
.eett-validation strong {
  color: var(--eett-text);
}

.eett-toolbar-copy span,
.eett-field-label,
.eett-section-editor small,
.eett-field-head code,
.eett-override-toggle,
.eett-shell .empty-note,
.eett-missing-note {
  color: var(--eett-muted);
}

.eett-field-label small {
  color: var(--warn);
}

.eett-chip,
.eett-shell .summary-chip,
.eett-shell .badge {
  border-color: var(--eett-border);
  background: var(--eett-panel-bg);
  color: var(--eett-muted);
}

.eett-chip-strong {
  color: var(--eett-text);
}

.eett-chip-warn {
  color: color-mix(in srgb, var(--warn) 78%, var(--brand-charcoal) 22%);
  border-color: color-mix(in srgb, var(--warn) 42%, var(--eett-border));
}

.eett-validation,
.eett-subpanel,
.eett-field-group,
.eett-section-group,
.eett-field-row,
.eett-section-editor,
.eett-preview,
.eett-pdf-preview,
.eett-pdf-page,
.eett-shell .message {
  border-color: var(--eett-divider);
  background: var(--eett-panel-bg);
  color: var(--eett-text);
  box-shadow: none;
}

.eett-validation.is-warning,
.eett-field-row.is-missing,
.eett-shell .message.warning,
.eett-shell .message.warn {
  border-color: color-mix(in srgb, var(--warn) 46%, var(--eett-divider));
  background: color-mix(in srgb, var(--eett-panel-bg) 88%, var(--warn) 12%);
  color: var(--eett-text);
}

.eett-validation.is-ok,
.eett-shell .message.success {
  border-color: color-mix(in srgb, var(--green) 34%, var(--eett-divider));
  background: color-mix(in srgb, var(--eett-panel-bg) 92%, var(--green) 8%);
  color: var(--eett-text);
}

.eett-shell .message.error {
  border-color: color-mix(in srgb, var(--danger) 42%, var(--eett-divider));
  background: color-mix(in srgb, var(--eett-panel-bg) 88%, var(--danger) 12%);
  color: color-mix(in srgb, var(--danger) 78%, var(--brand-charcoal) 22%);
}

.eett-pdf-preview {
  border: 1px solid;
  border-radius: var(--radius-sm);
}

.eett-pdf-page {
  border: 1px solid;
  border-radius: var(--radius-sm);
}

.eett-subpanel > summary,
.eett-field-group > summary,
.eett-section-group > summary {
  border-bottom: 1px solid transparent;
  color: var(--eett-text);
}

.eett-subpanel[open] > summary,
.eett-field-group[open] > summary,
.eett-section-group[open] > summary {
  border-bottom-color: var(--eett-divider);
}

.eett-field-input,
.eett-section-body-input,
.eett-json-input,
.eett-shell input,
.eett-shell select,
.eett-shell textarea {
  border-color: var(--eett-border);
  background: var(--eett-field-bg);
  color: var(--eett-text);
  box-shadow: none;
}

.eett-field-input:hover,
.eett-section-body-input:hover,
.eett-shell input:hover,
.eett-shell select:hover,
.eett-shell textarea:hover,
.eett-field-input:focus,
.eett-section-body-input:focus,
.eett-shell input:focus,
.eett-shell select:focus,
.eett-shell textarea:focus {
  border-color: var(--eett-selected-border);
  box-shadow: none;
}

.eett-field-input:disabled,
.eett-section-body-input:disabled,
.eett-shell input:disabled,
.eett-shell select:disabled,
.eett-shell textarea:disabled {
  background: var(--eett-field-bg-disabled);
  color: var(--eett-muted);
  -webkit-text-fill-color: var(--eett-muted);
  opacity: 1;
}

.eett-field-input option,
.eett-shell select option {
  background: var(--eett-field-bg);
  color: var(--eett-text);
}

.eett-shell .btn,
.eett-shell button,
.eett-shell .project-action-button {
  border-color: var(--eett-border);
  background: var(--eett-panel-bg);
  color: var(--eett-text);
  font-weight: 400;
  box-shadow: none;
}

.eett-shell .btn:hover,
.eett-shell button:hover,
.eett-shell .project-action-button:hover {
  border-color: var(--eett-selected-border);
  background: var(--eett-panel-bg-hover);
  color: var(--eett-text);
  box-shadow: none;
}

.eett-shell .btn:disabled,
.eett-shell button:disabled {
  opacity: 0.72;
}

.eett-override-button[aria-pressed="true"] {
  border-color: var(--eett-selected-border);
  background: var(--eett-selected-bg);
  color: var(--eett-text);
}

.eett-reset-btn {
  display: inline-grid;
  place-items: center;
  justify-content: center;
  align-items: center;
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
  line-height: 1;
  text-align: center;
  font-size: 12px;
}

.eett-input-wrap .eett-field-input,
.eett-input-wrap .eett-section-body-input {
  padding-right: 40px;
}

@media (max-width: 900px) {
  .eett-toolbar {
    flex-direction: column;
  }

  .eett-toolbar-actions {
    justify-content: flex-start;
  }

  .eett-field-grid,
  .eett-table-editor-grid {
    grid-template-columns: 1fr;
  }
}

.house-download-body {
  gap: 10px;
}

.house-download-package {
  display: grid;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--designer-card-divider);
}

.house-download-package:first-child {
  padding-top: 0;
  border-top: 0;
}

.house-download-package h4 {
  margin: 0;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.house-download-format-list {
  display: grid;
  gap: 4px;
}

.house-download-format-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 30px;
}

.house-download-format-title {
  min-width: 0;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.house-download-format-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(62px, 1fr));
  gap: 6px;
}

.download-link.is-disabled,
.download-link.is-disabled:hover {
  opacity: 0.45;
  cursor: not-allowed;
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
  color: var(--text-muted);
}

.constructor-manual-output-list {
  margin-bottom: 12px;
}

.constructor-manual-output {
  border-style: dashed;
}

.constructor-manual-output.is-available {
  background: #EFF6FF;
  border-color: #BFDBFE;
}

.constructor-manual-output.is-available:hover {
  background: #DBEAFE;
}

.constructor-manual-output.is-pending {
  background: #F8FAFC;
  border-color: #CBD5E1;
  opacity: 0.78;
}

.constructor-manual-output-help {
  color: var(--text-muted);
  font-size: 12px;
}

/* ── Toast / inline message ──────────────────────────────────────────── */
.message {
  padding: 9px 11px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--surface-2);
  font-size: 13px;
}

.message.error {
  background: var(--danger-soft);
  border-color: #FCA5A5;
  color: var(--danger);
}

.message.success {
  background: var(--workspace-card-bg);
  border-color: var(--border);
  color: var(--brand-charcoal);
}

.message.warn {
  background: var(--warn-soft);
  border-color: #FCD34D;
  color: var(--warn);
}

.message.warning {
  background: var(--warn-soft);
  border-color: #FCD34D;
  color: var(--warn);
}

.message.info {
  background: var(--workspace-card-bg);
  border-color: var(--border);
  color: var(--brand-charcoal);
}

.platform-floating-message {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 2200;
  width: max-content;
  max-width: min(420px, calc(100vw - 36px));
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18);
  pointer-events: none;
  animation: platform-floating-message-hide 4.8s ease forwards;
}

@keyframes platform-floating-message-hide {
  0%,
  72% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    transform: translateY(6px);
  }
}

.main-content > .message:not(.error):not(.warn):not(.warning):not(.info) {
  background: var(--workspace-card-bg);
  border-color: var(--border);
  color: var(--brand-charcoal);
}

.auth-mode-toggle {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}

/* ── Share panel ─────────────────────────────────────────────────────── */
.share-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.share-row + .share-row {
  border-top: 1px solid var(--designer-card-divider);
}

.share-user-info {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-start;
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
}

#sharingPanel {
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

#sharingPanel .divider {
  border-top-color: var(--designer-card-divider);
}

#sharingPanel .field-label {
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: 400;
  letter-spacing: 0;
}

#sharingPanel input,
#sharingPanel select {
  min-height: 34px;
  background: var(--designer-card-control-bg);
  border-color: var(--designer-card-button-border);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  letter-spacing: 0;
  box-shadow: none;
}

#sharingPanel select option {
  background: var(--designer-card-control-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

#shareRole,
#shareDirectorySelect,
#shareUsername {
  background: var(--designer-card-control-bg);
  border-color: var(--designer-card-button-border);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
}

#sharingPanel input:focus,
#sharingPanel select:focus {
  border-color: var(--designer-card-selected-border);
  box-shadow: none;
}

.share-row .user-avatar {
  display: none;
}

.share-user-info > div:not(.share-access-inline) {
  display: contents;
}

.share-user-info > div:not(.share-access-inline) .subtle {
  display: none;
}

.share-user-info > div:not(.share-access-inline) > div:first-child,
.share-access-inline {
  color: var(--brand-charcoal);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.share-access-inline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  white-space: nowrap;
}

.share-access-inline span {
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 400;
}

.share-user-name,
.share-history-recipient {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-control-size);
  font-weight: 400;
  letter-spacing: 0;
}

.share-row-actions,
.share-history-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.share-resend-button {
  white-space: nowrap;
}

#sharingPanel .btn.secondary,
#sharingPanel button.secondary,
#sharingPanel .share-row-actions .btn,
#sharingPanel .share-row-actions button,
#sharingPanel .share-history-actions .btn,
#sharingPanel .share-history-actions button {
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: 400;
  box-shadow: none;
}

#sharingPanel .btn.secondary:hover,
#sharingPanel button.secondary:hover,
#sharingPanel .share-row-actions .btn:hover,
#sharingPanel .share-row-actions button:hover,
#sharingPanel .share-history-actions .btn:hover,
#sharingPanel .share-history-actions button:hover {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-button-bg-hover);
  color: var(--text);
}

.share-history-actions .btn,
.share-history-actions .share-resend-button,
.share-history-actions .share-remove-button {
  border-color: var(--designer-card-button-border);
  background: var(--designer-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: 400;
  box-shadow: none;
}

.share-history-actions .btn:hover,
.share-history-actions .share-resend-button:hover,
.share-history-actions .share-remove-button:hover {
  border-color: var(--designer-card-selected-border);
  background: var(--designer-card-button-bg-hover);
  color: var(--text);
}

.share-add-form {
  display: grid;
  grid-template-columns: minmax(150px, 0.8fr) minmax(220px, 1.2fr) minmax(220px, 1.2fr) auto;
  gap: 8px;
  align-items: end;
}

.share-add-form.with-discipline {
  grid-template-columns: 1fr auto auto auto auto;
}

.share-history-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}

.share-history-disclosure {
  margin-top: 16px;
}

.share-history-disclosure .share-history-list {
  margin-top: 0;
}

@media (max-width: 980px) {
  .project-config-button-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.share-history-row {
  padding: 10px 12px;
  border: 1px solid var(--designer-card-button-border);
  border-radius: var(--radius-sm);
  background: var(--designer-card-button-bg);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.share-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.share-history-head > div:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  min-width: 0;
  text-align: center;
}

.share-history-head > div:first-child > div {
  color: var(--brand-charcoal);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.share-history-head > div:first-child > div[style] {
  font-size: var(--type-control-size) !important;
  font-weight: 400 !important;
}

.share-history-head > div:first-child .subtle {
  color: var(--text-muted);
}

.share-history-version {
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── Login screen ────────────────────────────────────────────────────── */
.login-outer {
  --login-highlight: var(--brand-orange);
  --login-highlight-hover: var(--brand-orange-hover);
  --login-highlight-soft: var(--brand-orange-soft);
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--brand-charcoal);
  font-family: var(--font-ui);
  padding: 48px 24px 32px;
  position: relative;
}

.login-outer > .lang-btn {
  position: fixed;
  top: 10px;
  right: 16px;
  z-index: 10;
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #C4CBC5;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.login-outer > .lang-btn:hover {
  background: transparent;
  color: var(--login-highlight);
}

.login-stack {
  display: grid;
  gap: 12px;
  width: 100%;
  max-width: 400px;
}

.login-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: none;
  padding: 36px 34px;
  width: 100%;
  text-align: center;
}

.login-logo {
  width: 128px;
  height: 90px;
  background: transparent;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.login-logo .brand-logo-img {
  width: 100%;
  height: 100%;
}

.login-title {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-login-title-size);
  font-weight: var(--type-login-title-weight);
  letter-spacing: var(--type-title-tracking);
  line-height: 1.2;
  margin: 0 0 28px;
  text-align: center;
}

.login-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin: 0 0 28px;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-family: var(--font-ui);
  text-align: left;
}

.login-card .field-label {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: 400;
}

.login-card input,
.login-card select,
.login-card textarea {
  font-family: var(--font-ui);
}

.login-card input:focus,
.login-card select:focus,
.login-card textarea:focus {
  border-color: var(--login-highlight);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--login-highlight) 18%, transparent);
}

.login-card input[type="checkbox"] {
  accent-color: var(--login-highlight);
}

.login-action-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
}

.login-submit-button {
  width: 100%;
  justify-content: center;
  min-height: 36px;
}

.login-card .btn.primary,
.login-card button.primary {
  background: var(--login-highlight);
  border-color: var(--login-highlight);
  color: #fff;
  font-family: var(--font-ui);
  font-weight: var(--type-button-strong-weight);
}

.login-card .btn.primary:hover,
.login-card button.primary:hover {
  background: var(--login-highlight-hover);
  border-color: var(--login-highlight-hover);
}

.login-side-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 36px;
  padding: 6px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: #FFFFFF;
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-button-size);
  font-weight: var(--type-button-strong-weight);
  box-shadow: none;
}

.login-side-action:hover {
  background: var(--login-highlight-soft);
  border-color: color-mix(in srgb, var(--login-highlight) 45%, var(--border));
  color: var(--login-highlight-hover);
}

.quick-access-panel {
  border-top: 1px solid var(--border);
  margin-top: 4px;
  padding-top: 14px;
}

.quick-access-card {
  width: 100%;
  padding: 16px 34px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: none;
}

.quick-access-title {
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: var(--type-button-strong-weight);
  letter-spacing: var(--type-title-tracking);
  margin-bottom: 8px;
}

.quick-access-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.quick-access-card .quick-access-button {
  justify-content: center;
  width: 100%;
  color: var(--brand-charcoal);
  font-family: var(--font-ui);
  font-weight: 400;
}

.quick-access-card .quick-access-link {
  text-decoration: none;
}

.quick-access-card .quick-access-button:hover {
  background: var(--login-highlight-soft);
  border-color: color-mix(in srgb, var(--login-highlight) 45%, var(--border));
  color: var(--login-highlight-hover);
}

@media (max-width: 520px) {
  .quick-access-grid {
    grid-template-columns: 1fr;
  }
}

.admin-asset-library-editor-link > span {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.admin-asset-library-editor-link > small {
  flex: 0 1 102px;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 600;
  text-align: right;
  white-space: normal;
}

.admin-editor-storage {
  margin-bottom: 24px;
  overflow: hidden;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel, #fff) 96%, #e6f3ef);
  box-shadow: 0 18px 42px rgb(20 48 41 / 8%);
}

.admin-editor-storage-head {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 24px;
  border-bottom: 1px solid var(--admin-card-border, var(--border));
  background:
    radial-gradient(circle at 88% 0, rgb(36 151 123 / 14%), transparent 34%),
    linear-gradient(135deg, rgb(17 84 69 / 5%), transparent 56%);
}

.admin-editor-storage-head h2 {
  margin: 5px 0 7px;
  font-size: clamp(22px, 2.1vw, 31px);
  letter-spacing: -0.035em;
}

.admin-editor-storage-head p {
  max-width: 850px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.admin-editor-storage-kicker {
  color: #14775f;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.admin-editor-storage-loading,
.admin-editor-storage-empty {
  padding: 42px 24px;
  color: var(--muted);
  text-align: center;
}

.admin-editor-storage-roots {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 18px 24px 0;
}

.admin-editor-storage-root {
  display: grid;
  min-width: 0;
  gap: 4px;
  padding: 13px 15px 14px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-left: 4px solid #aeb9b5;
  border-radius: 11px;
  background: var(--panel, #fff);
}

.admin-editor-storage-root.is-available {
  border-left-color: #24977b;
}

.admin-editor-storage-root > span {
  font-size: 12px;
  font-weight: 750;
}

.admin-editor-storage-root code,
.admin-editor-storage-route > code,
.admin-editor-storage-location code {
  overflow: hidden;
  color: #126c57;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-root small,
.admin-editor-storage-route > small,
.admin-editor-storage-location small {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 18px 24px 0;
  overflow: hidden;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 11px;
  background: var(--panel, #fff);
}

.admin-editor-storage-summary > span {
  min-width: 0;
  padding: 12px 14px;
  border-right: 1px solid var(--admin-card-border, var(--border));
  color: var(--muted);
  font-size: 12px;
}

.admin-editor-storage-summary > span:last-child {
  border-right: 0;
}

.admin-editor-storage-summary b {
  margin-right: 5px;
  color: var(--text);
  font-size: 17px;
}

.admin-editor-storage-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 18px 24px;
}

.admin-editor-storage-toolbar input,
.admin-editor-storage-toolbar select,
.admin-editor-storage-config input,
.admin-editor-storage-config select {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 8px;
  background: var(--panel, #fff);
  color: var(--text);
}

.admin-editor-storage-toolbar > label:first-child input {
  padding-inline: 13px;
}

.admin-editor-storage-toolbar > label:nth-child(2) {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
}

.admin-editor-storage-toolbar > label:nth-child(2) select {
  width: auto;
  min-width: 132px;
}

.admin-editor-storage-toolbar > small {
  color: var(--muted);
  white-space: nowrap;
}

.admin-editor-storage-groups {
  display: grid;
  gap: 18px;
  padding: 0 24px 24px;
}

.admin-editor-storage-group {
  min-width: 0;
}

.admin-editor-storage-group > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 9px;
}

.admin-editor-storage-group > header h3 {
  margin: 0;
  font-size: 14px;
  letter-spacing: -0.01em;
}

.admin-editor-storage-group > header span {
  display: grid;
  min-width: 28px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: rgb(36 151 123 / 11%);
  color: #14775f;
  font-size: 11px;
  font-weight: 800;
}

.admin-editor-storage-group > div {
  display: grid;
  gap: 10px;
}

.admin-editor-storage-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 13px;
  background: var(--panel, #fff);
}

.admin-editor-storage-card > header {
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  padding: 16px 17px 13px;
}

.admin-editor-storage-card-title {
  display: flex;
  min-width: 0;
  gap: 12px;
  align-items: center;
}

.admin-editor-storage-card-mark {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgb(36 151 123 / 22%);
  border-radius: 10px;
  background: rgb(36 151 123 / 9%);
  color: #14775f;
  font-weight: 850;
}

.admin-editor-storage-card h4 {
  margin: 0 0 3px;
  font-size: 15px;
}

.admin-editor-storage-card header p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.admin-editor-storage-route {
  display: grid;
  min-width: 0;
  gap: 5px;
  margin: 0 17px 13px;
  padding: 13px 14px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel, #fff) 94%, #edf7f4);
}

.admin-editor-storage-route.is-missing {
  background: color-mix(in srgb, var(--panel, #fff) 95%, #fff0df);
}

.admin-editor-storage-route-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-bottom: 3px;
  font-size: 11px;
}

.admin-editor-storage-route-heading > b {
  font-size: 12px;
}

.admin-editor-storage-route-heading > span:not(.admin-editor-storage-scope) {
  color: var(--muted);
}

.admin-editor-storage-route-heading .admin-editor-storage-custom {
  color: #8e5f11;
  font-weight: 750;
}

.admin-editor-storage-scope {
  padding: 3px 7px;
  border-radius: 999px;
  background: #e5f5f0;
  color: #126c57;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.admin-editor-storage-scope.is-workspace {
  background: #eef0f8;
  color: #4b5681;
}

.admin-editor-storage-naming {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
}

.admin-editor-storage-naming code,
.admin-editor-storage-naming strong {
  color: var(--text);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 11px;
}

.admin-editor-storage-route-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-top: 7px;
}

.admin-editor-storage-route-actions .btn,
.admin-editor-storage-form-actions .btn {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 11px;
}

.admin-editor-storage-missing-note {
  color: #9a6419;
  font-size: 11px;
}

.admin-editor-storage-current,
.admin-editor-storage-config {
  border-top: 1px solid var(--admin-card-border, var(--border));
}

.admin-editor-storage-current > summary,
.admin-editor-storage-config > summary {
  display: flex;
  cursor: pointer;
  list-style: none;
  align-items: center;
  justify-content: space-between;
  padding: 11px 17px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.admin-editor-storage-current > summary::-webkit-details-marker,
.admin-editor-storage-config > summary::-webkit-details-marker {
  display: none;
}

.admin-editor-storage-current > summary b {
  display: grid;
  min-width: 24px;
  height: 21px;
  place-items: center;
  border-radius: 999px;
  background: var(--soft, #f2f4f4);
  color: var(--text);
  font-size: 10px;
}

.admin-editor-storage-location-list {
  display: grid;
  gap: 7px;
  padding: 0 17px 14px;
}

.admin-editor-storage-location {
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr) auto 30px;
  gap: 9px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel, #fff) 97%, #f0f5f3);
}

.admin-editor-storage-location-state {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #b8c1be;
}

.admin-editor-storage-location.is-available .admin-editor-storage-location-state {
  background: #24977b;
  box-shadow: 0 0 0 3px rgb(36 151 123 / 12%);
}

.admin-editor-storage-location > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.admin-editor-storage-location b {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  font-size: 11px;
}

.admin-editor-storage-location-relation {
  display: inline-flex;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgb(82 103 167 / 10%);
  color: #5267a7;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.admin-editor-storage-location-relation.is-active {
  background: rgb(36 151 123 / 12%);
  color: #14775f;
}

.admin-editor-storage-location-relation.is-preserved,
.admin-editor-storage-location-relation.is-legacy {
  background: rgb(200 127 22 / 12%);
  color: #8a5810;
}

.admin-editor-storage-location-relation.is-managed {
  background: rgb(84 98 171 / 12%);
  color: #4657a2;
}

.admin-editor-storage-count {
  color: var(--muted);
  font-size: 10px;
  white-space: nowrap;
}

.admin-editor-storage-icon-button {
  width: 29px;
  height: 29px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 7px;
  background: var(--panel, #fff);
  color: #126c57;
  cursor: pointer;
}

.admin-editor-storage-config form {
  padding: 2px 17px 16px;
}

.admin-editor-storage-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
}

.admin-editor-storage-form-grid .field {
  min-width: 0;
}

.admin-editor-storage-form-grid .field small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
}

.admin-editor-storage-field-wide {
  grid-column: span 2;
}

.admin-editor-storage-form-actions {
  display: grid;
  grid-template-columns: auto 1fr auto auto auto;
  gap: 8px;
  align-items: center;
  margin-top: 13px;
}

.admin-editor-storage-new-location-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
  gap: 14px;
  align-items: center;
  margin: 14px 15px 0;
  padding: 12px 13px;
  border: 1px dashed rgb(65 92 160 / 35%);
  border-radius: 9px;
  background: rgb(65 92 160 / 5%);
}

.admin-editor-storage-new-location-head h4 {
  margin: 2px 0 3px;
  font-size: 13px;
}

.admin-editor-storage-new-location-head p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}

.admin-editor-storage-new-location-head code {
  overflow: hidden;
  color: #5267a7;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-migration-plan {
  margin: 0 15px 16px;
  overflow: hidden;
  border: 1px solid rgb(36 151 123 / 32%);
  border-radius: 10px;
  background: rgb(36 151 123 / 5%);
}

.admin-editor-storage-migration-status {
  margin: 0 15px 16px;
  overflow: hidden;
  border: 1px solid rgb(56 102 184 / 32%);
  border-radius: 10px;
  background: rgb(56 102 184 / 6%);
}

.admin-editor-storage-migration-status.is-completed {
  border-color: rgb(36 151 123 / 38%);
  background: rgb(36 151 123 / 6%);
}

.admin-editor-storage-migration-status.is-failed {
  border-color: rgb(191 69 69 / 38%);
  background: rgb(191 69 69 / 6%);
}

.admin-editor-storage-migration-status > header {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 13px 9px;
}

.admin-editor-storage-migration-status > header span,
.admin-editor-storage-migration-status > small {
  color: var(--muted);
  font-size: 9px;
}

.admin-editor-storage-migration-status > header h4 {
  margin: 2px 0 0;
  font-size: 13px;
}

.admin-editor-storage-migration-status > header > b {
  color: #315da5;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-editor-storage-migration-status.is-completed > header > b {
  color: #14775f;
}

.admin-editor-storage-migration-status.is-failed > header > b,
.admin-editor-storage-migration-status.is-failed > p {
  color: #9b3333;
}

.admin-editor-storage-migration-progress {
  height: 6px;
  margin: 0 13px;
  overflow: hidden;
  border-radius: 999px;
  background: rgb(56 102 184 / 13%);
}

.admin-editor-storage-migration-progress > span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #3866b8;
}

.admin-editor-storage-migration-progress.is-indeterminate > span {
  width: 36%;
  animation: admin-editor-storage-migration-progress 1.1s ease-in-out infinite;
}

.admin-editor-storage-migration-status.is-completed .admin-editor-storage-migration-progress > span {
  background: #24977b;
}

.admin-editor-storage-migration-status.is-failed .admin-editor-storage-migration-progress > span {
  background: #bf4545;
}

.admin-editor-storage-migration-status > p {
  margin: 10px 13px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.admin-editor-storage-migration-status > small {
  display: block;
  padding: 0 13px 11px;
}

.admin-editor-storage-migration-result-locations {
  display: grid;
  gap: 6px;
  padding: 0 12px 11px;
}

.admin-editor-storage-migration-result-locations > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 9px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 7px;
  background: var(--panel, #fff);
}

.admin-editor-storage-migration-result-locations span {
  font-size: 9px;
  font-weight: 800;
}

.admin-editor-storage-migration-result-locations code {
  overflow: hidden;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-migration-result-locations .btn {
  min-height: 28px;
  padding: 5px 8px;
  font-size: 9px;
}

@keyframes admin-editor-storage-migration-progress {
  from {
    transform: translateX(-105%);
  }

  to {
    transform: translateX(285%);
  }
}

.admin-editor-storage-migration-plan.has-collision {
  border-color: rgb(190 126 30 / 38%);
  background: rgb(190 126 30 / 6%);
}

.admin-editor-storage-migration-plan > header {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 13px;
  border-bottom: 1px solid var(--admin-card-border, var(--border));
}

.admin-editor-storage-migration-plan > header h4 {
  margin: 2px 0 0;
  font-size: 13px;
}

.admin-editor-storage-migration-plan > header > b {
  padding: 4px 8px;
  border-radius: 999px;
  background: rgb(36 151 123 / 13%);
  color: #14775f;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-editor-storage-migration-plan.has-collision > header > b {
  background: rgb(190 126 30 / 13%);
  color: #8d5c13;
}

.admin-editor-storage-migration-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--admin-card-border, var(--border));
}

.admin-editor-storage-migration-summary > span {
  padding: 10px 11px;
  border-right: 1px solid var(--admin-card-border, var(--border));
  color: var(--muted);
  font-size: 9px;
}

.admin-editor-storage-migration-summary > span:last-child {
  border-right: 0;
}

.admin-editor-storage-migration-summary b {
  display: block;
  margin-bottom: 2px;
  color: var(--text);
  font-size: 14px;
}

.admin-editor-storage-migration-pairs {
  display: grid;
  gap: 6px;
  padding: 11px 12px;
}

.admin-editor-storage-migration-pairs > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 9px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 7px;
  background: var(--panel, #fff);
}

.admin-editor-storage-migration-pairs span {
  padding: 3px 6px;
  border-radius: 999px;
  background: var(--soft, #f2f4f4);
  font-size: 8px;
  font-weight: 800;
}

.admin-editor-storage-migration-pairs code {
  overflow: hidden;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-migration-pairs strong {
  color: #8d5c13;
  font-size: 8px;
}

.admin-editor-storage-migration-warnings {
  padding: 0 12px 10px;
}

.admin-editor-storage-migration-warnings p {
  margin: 4px 0 0;
  color: #8d5c13;
  font-size: 9px;
}

.admin-editor-storage-migration-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  padding: 11px 12px;
  border-top: 1px solid var(--admin-card-border, var(--border));
}

.admin-editor-storage-form-actions > label {
  color: var(--muted);
  font-size: 11px;
}

@media (max-width: 900px) {
  .admin-editor-storage-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-editor-storage-summary > span:nth-child(2) {
    border-right: 0;
  }

  .admin-editor-storage-summary > span:nth-child(-n + 2) {
    border-bottom: 1px solid var(--admin-card-border, var(--border));
  }

  .admin-editor-storage-toolbar {
    grid-template-columns: 1fr auto;
  }

  .admin-editor-storage-toolbar > label:first-child {
    grid-column: 1 / -1;
  }

  .admin-editor-storage-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 650px) {
  .admin-editor-storage-head,
  .admin-editor-storage-card > header {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-editor-storage-roots,
  .admin-editor-storage-summary,
  .admin-editor-storage-form-grid {
    grid-template-columns: 1fr;
  }

  .admin-editor-storage-summary > span {
    border-right: 0;
    border-bottom: 1px solid var(--admin-card-border, var(--border));
  }

  .admin-editor-storage-summary > span:last-child {
    border-bottom: 0;
  }

  .admin-editor-storage-field-wide {
    grid-column: auto;
  }

  .admin-editor-storage-location {
    grid-template-columns: 9px minmax(0, 1fr) 30px;
  }

  .admin-editor-storage-count {
    display: none;
  }

  .admin-editor-storage-form-actions {
    grid-template-columns: 1fr 1fr;
  }

  .admin-editor-storage-new-location-head,
  .admin-editor-storage-migration-summary {
    grid-template-columns: 1fr;
  }

  .admin-editor-storage-new-location-head code {
    text-align: left;
  }

  .admin-editor-storage-migration-summary > span {
    border-right: 0;
    border-bottom: 1px solid var(--admin-card-border, var(--border));
  }

  .admin-editor-storage-migration-pairs > div {
    grid-template-columns: 1fr;
  }

  .admin-editor-storage-form-actions > label,
  .admin-editor-storage-form-actions > span {
    grid-column: 1 / -1;
  }
}

.admin-asset-per-asset-notice {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgb(36 151 123 / 24%);
  border-radius: 10px;
  background: rgb(36 151 123 / 7%);
}

.admin-asset-per-asset-notice > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 9px;
  background: rgb(36 151 123 / 14%);
  color: #126c57;
  font-weight: 850;
}

.admin-asset-per-asset-notice b {
  display: block;
  margin-bottom: 3px;
  font-size: 12px;
}

.admin-asset-per-asset-notice p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.admin-editor-storage-master-detail-layout {
  display: grid;
  grid-template-columns: minmax(245px, 0.34fr) minmax(0, 1fr);
  min-height: 660px;
  border-top: 1px solid var(--admin-card-border, var(--border));
}

.admin-editor-storage-nav {
  min-width: 0;
  padding: 15px;
  border-right: 1px solid var(--admin-card-border, var(--border));
  background: color-mix(in srgb, var(--panel, #fff) 95%, #eef5f2);
}

.admin-editor-storage-nav-group + .admin-editor-storage-nav-group {
  margin-top: 16px;
}

.admin-editor-storage-nav-group h4 {
  margin: 0 8px 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-editor-storage-nav-item {
  display: grid;
  width: 100%;
  grid-template-columns: 31px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 8px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  text-align: left;
}

.admin-editor-storage-nav-item + .admin-editor-storage-nav-item {
  margin-top: 3px;
}

.admin-editor-storage-nav-item:hover,
.admin-editor-storage-nav-item:focus-visible {
  border-color: rgb(36 151 123 / 24%);
  background: var(--panel, #fff);
  outline: none;
}

.admin-editor-storage-nav-item.is-active {
  border-color: rgb(36 151 123 / 33%);
  background: var(--panel, #fff);
  box-shadow: 0 5px 15px rgb(20 48 41 / 7%);
}

.admin-editor-storage-nav-mark {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border-radius: 8px;
  background: rgb(36 151 123 / 10%);
  color: #14775f;
  font-size: 11px;
  font-weight: 850;
}

.admin-editor-storage-nav-item > span:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.admin-editor-storage-nav-item b,
.admin-editor-storage-nav-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-nav-item b {
  font-size: 11px;
}

.admin-editor-storage-nav-item small {
  color: var(--muted);
  font-size: 9px;
}

.admin-editor-storage-nav-scheme {
  color: #126c57;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
}

.admin-editor-storage-detail {
  min-width: 0;
  padding: 21px;
}

.admin-editor-storage-detail-head {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
}

.admin-editor-storage-detail-head > div > span,
.admin-editor-storage-current-paths header span,
.admin-editor-storage-route-editor > header span {
  color: #14775f;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-editor-storage-detail-head h3 {
  margin: 3px 0 5px;
  font-size: 24px;
  letter-spacing: -0.025em;
}

.admin-editor-storage-detail-head p {
  max-width: 650px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.admin-editor-storage-availability {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 16px;
  padding: 13px 14px;
  border: 1px solid rgb(36 151 123 / 25%);
  border-radius: 10px;
  background: rgb(36 151 123 / 7%);
}

.admin-editor-storage-availability.is-typology {
  border-color: rgb(65 92 160 / 22%);
  background: rgb(65 92 160 / 7%);
}

.admin-editor-storage-availability > span {
  display: grid;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  background: #24977b;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.admin-editor-storage-availability.is-typology > span {
  background: #5267a7;
}

.admin-editor-storage-availability b {
  font-size: 12px;
}

.admin-editor-storage-availability p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.admin-editor-storage-current-paths,
.admin-editor-storage-route-editor {
  overflow: hidden;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 11px;
  background: var(--panel, #fff);
}

.admin-editor-storage-route-editor {
  margin-top: 14px;
}

.admin-editor-storage-current-paths > header,
.admin-editor-storage-route-editor > header {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 13px 15px;
  border-bottom: 1px solid var(--admin-card-border, var(--border));
}

.admin-editor-storage-current-paths h4,
.admin-editor-storage-route-editor h4 {
  margin: 2px 0 0;
  font-size: 13px;
}

.admin-editor-storage-current-paths > header > b {
  display: grid;
  min-width: 26px;
  height: 23px;
  place-items: center;
  border-radius: 999px;
  background: rgb(36 151 123 / 10%);
  color: #14775f;
  font-size: 10px;
}

.admin-editor-storage-current-paths .admin-editor-storage-location-list {
  padding: 12px 14px 14px;
}

.admin-editor-storage-location-context {
  color: #5267a7;
  font-size: 9px;
  font-weight: 750;
}

.admin-editor-storage-route-preview {
  display: grid;
  min-width: 0;
  gap: 5px;
  margin: 13px 15px 0;
  padding: 12px 13px;
  border: 1px solid rgb(36 151 123 / 22%);
  border-radius: 9px;
  background: rgb(36 151 123 / 6%);
}

.admin-editor-storage-route-preview > span {
  color: #14775f;
  font-size: 10px;
  font-weight: 800;
}

.admin-editor-storage-organization {
  display: grid;
  gap: 4px;
  margin-top: 5px;
  padding: 9px 10px;
  border: 1px solid rgb(82 103 167 / 17%);
  border-radius: 7px;
  background: rgb(82 103 167 / 5%);
}

.admin-editor-storage-organization > span {
  color: #5267a7;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.admin-editor-storage-organization > code,
.admin-editor-storage-organization > small {
  overflow-wrap: anywhere;
}

.admin-editor-storage-route-preview > code,
.admin-editor-storage-route-preview > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-editor-storage-route-preview > code {
  color: #126c57;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 12px;
}

.admin-editor-storage-route-preview > small {
  color: var(--muted);
  font-size: 10px;
}

.admin-editor-storage-route-preview > div:not(.admin-editor-storage-route-actions) {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
}

.admin-editor-storage-route-preview strong {
  color: var(--text);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 11px;
}

.admin-editor-storage-route-editor form {
  padding: 14px 15px 16px;
}

@media (max-width: 930px) {
  .admin-editor-storage-master-detail-layout {
    grid-template-columns: 1fr;
  }

  .admin-editor-storage-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    border-right: 0;
    border-bottom: 1px solid var(--admin-card-border, var(--border));
  }
}

@media (max-width: 650px) {
  .admin-asset-per-asset-notice,
  .admin-editor-storage-nav {
    grid-template-columns: 1fr;
  }

  .admin-asset-per-asset-notice > span {
    display: none;
  }

  .admin-editor-storage-detail {
    padding: 15px;
  }

  .admin-editor-storage-detail-head {
    align-items: stretch;
    flex-direction: column;
  }
}

.demo-hint {
  margin-top: 16px;
  padding: 10px 12px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 12px;
  color: var(--text-muted);
}

/* ── Empty states ────────────────────────────────────────────────────── */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
  text-align: center;
  gap: 12px;
}

.empty-state-icon {
  font-size: 36px;
  opacity: 0.3;
}

.empty-state h3 {
  font-size: var(--type-card-title-size);
  font-weight: var(--type-card-title-weight);
  margin: 0;
  color: var(--text);
}

.empty-state p {
  font-size: var(--type-body-small-size);
  color: var(--text-muted);
  margin: 0;
  max-width: 260px;
}

/* ── Muted text ──────────────────────────────────────────────────────── */
.muted { color: var(--text-muted); }
.subtle { color: var(--text-subtle); font-size: var(--type-caption-size); }

code {
  font-family: var(--font-mono);
  font-size: var(--type-caption-size);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 5px;
}

/* ── Language toggle ─────────────────────────────────────────────────── */
.lang-btn {
  font-size: var(--type-caption-size);
  font-weight: var(--type-label-weight);
  letter-spacing: var(--type-label-tracking);
  padding: 5px 10px;
  border-radius: var(--radius);
  border: 1px solid var(--border-strong);
  background: var(--surface);
  color: var(--text-muted);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.lang-btn:hover { background: var(--accent-soft); color: var(--accent); }

/* ── Map picker ──────────────────────────────────────────────────────── */
.map-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.map-coord-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px 14px;
  align-items: end;
}

.map-picker {
  height: 280px;
  border-radius: var(--radius);
  border: 1px solid var(--brand-charcoal);
  overflow: hidden;
  background: var(--surface-2);
  z-index: 0;
}

.project-thermal-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.project-thermal-zone-mark {
  width: 48px;
  height: 48px;
  position: relative;
  overflow: visible;
  border: 0;
  background: transparent;
}

.project-thermal-zone-mark span {
  position: absolute;
  left: 50%;
  top: 50%;
  color: color-mix(in srgb, var(--designer-card-bg) 82%, var(--brand-charcoal) 18%);
  font-family: var(--font-ui);
  font-size: 93px;
  font-weight: 400;
  line-height: 1;
  transform: translate(-50%, -50%);
}

.project-thermal-main {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.project-thermal-simulator-action {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.project-thermal-simulator-action span {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.35;
}

.project-thermal-simulator-action .btn {
  flex: 0 0 auto;
  white-space: nowrap;
}

.project-thermal-content-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
  min-width: 0;
}

.project-thermal-content-grid > .project-thermal-section {
  align-content: start;
  min-width: 0;
}

.project-thermal-row,
.project-thermal-facts {
  display: grid;
  grid-template-columns: minmax(120px, 0.3fr) minmax(0, 1fr);
  gap: 12px;
  align-items: baseline;
}

.project-thermal-row span,
.project-thermal-facts span {
  color: var(--text-muted);
  font-size: 11px;
}

.project-thermal-row strong,
.project-thermal-facts strong {
  color: var(--text);
  font-weight: 500;
}

.project-thermal-facts > div {
  display: grid;
  gap: 2px;
}

.project-thermal-section p {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}

.project-thermal-section {
  display: grid;
  gap: 7px;
  padding-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--bg) 72%, #000 28%);
}

.project-thermal-section h4 {
  margin: 0;
  color: var(--text);
  font: 500 13px/1.2 var(--font-ui);
}

.project-thermal-table-wrap {
  overflow-x: auto;
}

.project-thermal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.project-thermal-content-grid .project-thermal-table {
  table-layout: fixed;
}

.project-thermal-table th,
.project-thermal-table td {
  padding: 6px 7px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}

.project-thermal-table th {
  color: var(--text-muted);
  font-weight: 500;
}

.project-thermal-table td {
  color: var(--text);
}

.project-thermal-window-select {
  width: 100%;
  min-width: 128px;
  height: 30px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: 400 11px/1.2 var(--font-ui);
  padding: 4px 8px;
}

.project-thermal-table [data-thermal-window-percent] {
  font-weight: 500;
}

.project-thermal-table.is-compact th {
  width: 34%;
}

.project-thermal-component-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.project-thermal-component {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--designer-card-divider);
  background: color-mix(in srgb, var(--designer-card-bg) 92%, #fff 8%);
}

.project-thermal-component-preview {
  display: grid;
  place-items: center;
  min-height: 72px;
  overflow: hidden;
  background: color-mix(in srgb, var(--designer-card-bg) 96%, #fff 4%);
  color: var(--text-muted);
  font-size: 18px;
}

.project-thermal-component-preview img {
  display: block;
  width: 100%;
  height: 72px;
  object-fit: contain;
}

.project-thermal-component-copy {
  display: grid;
  align-content: start;
  gap: 3px;
  min-width: 0;
}

.project-thermal-component-copy > span,
.project-thermal-component-copy > small {
  color: var(--text-muted);
  font-size: 10px;
}

.project-thermal-component-copy > strong {
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-thermal-component-copy > p {
  margin: 2px 0 0;
}

.project-thermal-reference-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.project-thermal-reference-list a {
  color: var(--accent);
  font-size: 11px;
  text-decoration: none;
}

.project-thermal-reference-list a:hover {
  text-decoration: underline;
}

@media (max-width: 1040px) {
  .project-thermal-content-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .project-thermal-card,
  .project-thermal-facts,
  .project-thermal-row {
    grid-template-columns: 1fr;
  }

  .project-thermal-component-grid {
    grid-template-columns: 1fr;
  }

  .project-thermal-simulator-action {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Override Leaflet defaults to fit our design */
.leaflet-container {
  font-family: inherit;
  font-size: 12px;
  background: var(--surface-2);
}

.leaflet-tile {
  filter: var(--osm-tile-filter);
}

.workspace-platform-standard .map-picker .leaflet-tile,
.designer-home .map-picker .leaflet-tile,
.project-logistics-shell .map-picker .leaflet-tile,
.project-location-map-picker .leaflet-tile {
  filter: var(--osm-tile-filter);
}

.map-picker .leaflet-pane,
.map-picker .leaflet-control-container {
  transform: translateZ(0);
}

.owner-dossier {
  gap: 16px;
}

.owner-dossier-top-grid,
.owner-output-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  gap: 14px;
  align-items: start;
}

.owner-location-map-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.owner-location-map {
  height: 340px;
  border-radius: 6px;
}

.owner-map-caption {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: var(--text-muted);
  font-size: 12px;
}

.owner-map-caption strong {
  color: var(--text);
}

.owner-summary-grid {
  margin-bottom: 12px;
}

.owner-summary-grid > div {
  display: grid;
  gap: 5px;
  align-content: start;
}

.owner-summary-grid strong,
.owner-summary-grid span {
  display: block;
  line-height: 1.25;
}

.owner-technical-list {
  display: grid;
  gap: 2px;
}

.owner-output-card {
  min-height: 0;
}

.owner-collapsible-card {
  overflow: hidden;
}

.owner-collapsible-card > summary {
  list-style: none;
}

.owner-collapsible-card > summary::-webkit-details-marker {
  display: none;
}

.owner-card-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px;
  cursor: pointer;
}

.owner-card-summary h3,
.owner-pane-header h4 {
  margin: 0;
}

.owner-card-summary .subtle,
.owner-pane-header span {
  display: block;
  margin-top: 4px;
}

.owner-summary-caret {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.owner-collapsible-card[open] .owner-summary-caret {
  color: var(--accent);
}

.owner-output-pane {
  display: grid;
  gap: 10px;
}

.owner-pane-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
}

.owner-square-frame {
  width: 100%;
  aspect-ratio: 1 / 1;
  min-height: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-2);
}

.owner-model-frame {
  background: #10151d;
}

.owner-viewer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.owner-sidebar .project-item {
  padding: 9px 10px;
}

.owner-sidebar .project-item-name {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.25;
}

.owner-sidebar .project-item-meta {
  flex-wrap: wrap;
}

.owner-bom-shell {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.owner-bom-family:not([open]) {
  background: var(--surface);
}

.owner-bom-table-head,
.owner-bom-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(140px, 0.8fr) minmax(220px, 1fr) minmax(100px, 0.45fr);
  gap: 10px;
  align-items: center;
}

.owner-bom-table-head {
  padding: 8px 10px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
}

.owner-bom-row {
  padding: 10px;
  border-top: 1px solid var(--border);
  font-size: 13px;
}

.owner-bom-row:first-child {
  border-top: 0;
}

.owner-bom-status {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.owner-modification-card {
  border-color: var(--border-strong);
}

.owner-variant-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.owner-variant-card {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  text-decoration: none;
  color: inherit;
}

.owner-variant-card:hover {
  border-color: var(--accent);
}

.owner-variant-link {
  display: grid;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

.owner-variant-delete {
  justify-self: start;
  margin-top: 4px;
}

.owner-variant-inline {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 12px;
}

.owner-project-tree {
  gap: 12px;
}

.owner-project-group {
  display: grid;
  gap: 6px;
}

.owner-variant-list {
  margin-left: 12px;
  padding-left: 10px;
  border-left: 1px solid var(--border);
  display: grid;
  gap: 6px;
}

.owner-variant-head {
  margin-bottom: 0;
}

.owner-variant-item .project-item-name {
  font-size: 12px;
}

.owner-proposal-actions {
  margin-top: 14px;
}

.owner-review-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

.project-logistics-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(380px, 0.85fr);
  gap: 14px;
  align-items: start;
}

.project-bom-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.project-report-generated-at {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.2;
}

.project-report-generated-at span {
  color: var(--text-muted);
}

.project-report-generated-at strong {
  color: color-mix(in srgb, var(--text) 74%, var(--text-muted) 26%);
  font-weight: 400;
}

.project-bom-timing {
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 6px 10px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 72%, transparent);
}

.project-bom-timing strong + span {
  margin-left: 8px;
}

.project-bom-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.project-bom-summary > div {
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
}

.project-bom-summary strong,
.project-bom-summary span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-bom-summary strong {
  font-size: 14px;
  font-weight: 400;
}

.project-bom-summary span {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
}

.project-bom-summary-problem {
  border-color: rgba(220, 38, 38, 0.28) !important;
  background: var(--danger-soft) !important;
}

.project-bom-summary-problem strong {
  color: var(--danger);
}

.project-price-dashboard {
  --price-bar: color-mix(in srgb, var(--designer-card-bg) 76%, var(--brand-charcoal) 24%);
  --price-range: color-mix(in srgb, var(--designer-card-bg) 57%, var(--brand-charcoal) 43%);
  --price-average: var(--brand-charcoal);
  --price-selected: var(--brand-orange);
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--designer-card-divider);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--designer-card-bg) 88%, white 12%);
  font-family: var(--font-ui);
}

.project-price-dashboard-header,
.project-price-chart-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.project-price-dashboard-header > div,
.project-price-chart-header > div {
  min-width: 0;
}

.project-price-dashboard-header > div > span {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
}

.project-price-dashboard-header h3,
.project-price-chart-header h4 {
  margin: 3px 0 0;
  color: var(--text);
  font-weight: 500;
}

.project-price-dashboard-header h3 {
  font-size: 16px;
}

.project-price-chart-header h4 {
  font-size: 13px;
}

.project-price-dashboard-header p,
.project-price-chart-header p {
  margin: 4px 0 0;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.4;
}

.project-price-dashboard-coverage,
.project-price-chart-header > span {
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 10px;
  white-space: nowrap;
}

.project-price-dashboard-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 7px;
}

.project-price-dashboard-kpis > div {
  min-width: 0;
  padding: 9px 10px;
  border-left: 3px solid var(--price-range);
  background: var(--designer-card-button-bg);
}

.project-price-dashboard-kpis > div.is-selected {
  border-left-color: var(--price-selected);
}

.project-price-dashboard-kpis small,
.project-price-dashboard-kpis strong,
.project-price-dashboard-kpis span {
  display: block;
}

.project-price-dashboard-kpis small,
.project-price-dashboard-kpis span {
  color: var(--text-muted);
  font-size: 10px;
}

.project-price-dashboard-kpis strong {
  margin-top: 3px;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-price-chart {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding-top: 12px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-price-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: var(--text-muted);
  font-size: 10px;
}

.project-price-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.project-price-chart-legend span::before {
  width: 14px;
  height: 8px;
  border: 0;
  background: var(--price-bar);
  content: "";
}

.project-price-chart-legend .is-range::before {
  background: var(--price-range);
}

.project-price-chart-legend .is-average::before {
  width: 2px;
  height: 8px;
  background: var(--price-average);
}

.project-price-chart-legend .is-selected::before {
  width: 2px;
  height: 8px;
  background: var(--price-selected);
}

.project-price-chart-rows {
  display: flex;
  flex-direction: column;
}

.project-price-chart-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.72fr) minmax(240px, 1.35fr) minmax(315px, 1.25fr);
  gap: 12px;
  align-items: center;
  min-height: 53px;
  padding: 8px 0;
  border-top: 1px solid color-mix(in srgb, var(--designer-card-divider) 72%, transparent);
}

.project-price-chart-row:first-child {
  border-top: 0;
}

.project-price-chart.is-family .project-price-chart-row {
  min-height: 45px;
  padding: 5px 0;
}

.project-price-chart-row-label {
  min-width: 0;
}

.project-price-chart-row-label strong,
.project-price-chart-row-label small {
  display: block;
}

.project-price-chart-row-label strong {
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  text-overflow: ellipsis;
}

.project-price-chart-row-label small {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 9px;
}

.project-price-chart-plot {
  position: relative;
  height: 18px;
}

.project-price-chart.is-family .project-price-chart-plot {
  max-width: min(100%, 380px);
}

.project-price-chart-bar,
.project-price-chart-range {
  position: absolute;
  top: 4px;
  left: 0;
  min-width: 2px;
  height: 10px;
}

.project-price-chart-bar {
  background: var(--price-bar);
}

.project-price-chart-range {
  z-index: 1;
  background: var(--price-range);
}

.project-price-chart-average,
.project-price-chart-selected {
  position: absolute;
  z-index: 2;
  transform: translateX(-50%);
}

.project-price-chart-average {
  top: 4px;
  width: 2px;
  height: 10px;
  background: var(--price-average);
}

.project-price-chart-selected {
  top: 4px;
  width: 2px;
  height: 10px;
  background: var(--price-selected);
}

.project-price-chart-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.project-price-chart-values.has-selected {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.project-price-chart-values span,
.project-price-chart-values small,
.project-price-chart-values strong {
  display: block;
  min-width: 0;
}

.project-price-chart-values small {
  color: var(--text-muted);
  font-size: 8px;
  text-transform: uppercase;
}

.project-price-chart-values strong {
  margin-top: 2px;
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-procurement-price-results {
  border-top: 1px solid var(--designer-card-divider);
}

@media (max-width: 980px) {
  .project-price-chart-row {
    grid-template-columns: minmax(130px, 0.75fr) minmax(190px, 1.25fr);
  }

  .project-price-chart-values {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  .project-price-dashboard {
    padding: 11px;
  }

  .project-price-dashboard-header,
  .project-price-chart-header {
    display: block;
  }

  .project-price-dashboard-coverage,
  .project-price-chart-header > span {
    display: block;
    margin-top: 6px;
    white-space: normal;
  }

  .project-price-chart-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .project-price-chart-values {
    grid-column: auto;
  }
}

.project-bom-cost-card {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.project-bom-cost-card .project-logistics-side-title {
  margin-bottom: 7px;
  font-weight: 300;
}

.project-bom-cost-card .procurement-cost-table {
  border: 0;
  border-radius: 0;
  background: var(--workspace-card-bg);
}

.project-bom-cost-card .procurement-cost-row {
  border-top-color: var(--designer-card-divider);
  background: var(--workspace-card-bg);
}

.project-bom-cost-card .procurement-cost-row-head,
.project-bom-cost-card .procurement-cost-row-total {
  background: var(--workspace-card-button-bg);
}

.project-bom-cost-card .procurement-cost-row-head,
.project-bom-cost-card .procurement-cost-row-head > span:first-child {
  color: var(--text);
}

.project-bom-cost-card .procurement-cost-row > strong,
.project-bom-cost-card .procurement-cost-row-head > span:nth-child(2) {
  text-align: left;
}

.project-bom-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: end;
  justify-content: flex-start;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.project-bom-controls label {
  display: grid;
  min-width: 180px;
  gap: 4px;
}

.project-bom-controls span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.project-bom-controls select {
  width: 100%;
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.project-bom-family-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}

.project-bom-family {
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

.project-bom-family-problem {
  border-color: transparent;
}

.project-bom-family-head {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(140px, auto) minmax(110px, auto);
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  border-bottom: 1px solid var(--designer-card-divider);
  background: var(--workspace-card-button-bg);
}

.project-bom-family > summary.project-bom-family-head {
  display: grid;
  height: auto;
  min-height: 0;
  padding: 7px 12px;
}

.project-bom-family > summary.project-bom-family-head::after,
.project-bom-item > summary.project-bom-row::after {
  display: none;
  content: none;
}

details.project-bom-family:not([open]) .project-bom-family-head {
  border-bottom: 0;
}

summary.project-bom-family-head {
  cursor: pointer;
  list-style: none;
}

summary.project-bom-family-head::-webkit-details-marker {
  display: none;
}

.project-bom-family-head div {
  min-width: 0;
}

.project-bom-family:not(.owner-bom-family) .project-bom-family-head div > span {
  display: none;
}

.project-bom-family-head strong {
  display: block;
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-bom-family-head span {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
}

.project-bom-family-counts,
.project-bom-family-total {
  justify-self: end;
  text-align: right;
  white-space: nowrap;
}

.project-bom-table-head,
.project-bom-row {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(150px, 0.55fr) 72px 118px 118px auto;
  gap: 10px;
  align-items: center;
}

.project-bom-table-head.is-list-only,
.project-bom-row-list-only {
  grid-template-columns: minmax(220px, 1fr) minmax(140px, 0.46fr) 64px minmax(120px, 0.4fr) minmax(190px, 0.62fr);
}

.project-bom-table-head {
  background: var(--workspace-card-bg);
  padding: 6px 6px;
  border-bottom: 1px solid var(--designer-card-divider);
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.project-bom-table-head span:nth-child(n+3),
.project-bom-row > :nth-child(n+3) {
  text-align: right;
}

.project-bom-list {
  display: flex;
  flex-direction: column;
  background: var(--workspace-card-bg);
}

.project-bom-item {
  border-bottom: 1px solid var(--designer-card-divider);
  background: var(--workspace-card-bg);
}

.project-bom-item:last-child {
  border-bottom: 0;
}

.project-bom-item summary {
  cursor: pointer;
  list-style: none;
}

.project-bom-item > summary.project-bom-row {
  display: grid;
  height: auto;
  min-height: 0;
  justify-content: normal;
  padding: 4px 6px;
  row-gap: 0;
}

.project-bom-item summary::-webkit-details-marker {
  display: none;
}

.project-bom-row {
  min-width: 0;
  padding: 6px 6px;
  border-bottom: 1px solid var(--designer-card-divider);
  background: var(--workspace-card-bg);
  font-size: 12px;
  font-weight: 300;
}

.project-bom-item .project-bom-row {
  border-bottom: 0;
}

.project-bom-item[open] .project-bom-row {
  background: var(--workspace-card-button-bg);
}

.project-bom-item-details {
  border-top: 1px solid var(--designer-card-divider);
  background: var(--workspace-card-bg);
}

.project-bom-house-breakdown {
  padding: 5px 6px 6px 22px;
}

.project-bom-breakdown-title {
  padding: 0 0 4px;
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 400;
  line-height: 1.15;
  text-transform: uppercase;
}

.project-bom-house {
  border-top: 1px solid var(--designer-card-divider);
}

.project-bom-house:first-of-type {
  border-top: 0;
}

.project-bom-house > summary {
  cursor: pointer;
  list-style: none;
}

.project-bom-house > summary::-webkit-details-marker {
  display: none;
}

.project-bom-house > summary.project-bom-house-row::after {
  display: none;
  content: none;
}

.project-bom-house-row {
  display: grid;
  grid-template-columns: 14px minmax(160px, 1fr) auto;
  gap: 7px;
  align-items: center;
  min-height: 29px;
  padding: 3px 4px;
  color: var(--text);
}

.project-bom-house-row::before {
  color: var(--text-muted);
  content: "\203A";
  font-size: 15px;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform 120ms ease;
}

.project-bom-house[open] > .project-bom-house-row::before {
  transform: rotate(90deg);
}

.project-bom-house-row > span,
.project-bom-instance-row > span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
}

.project-bom-house-row > span {
  align-items: center;
  flex-direction: row;
  justify-content: flex-start;
  text-align: left;
  white-space: nowrap;
}

.project-bom-house-row strong,
.project-bom-instance-row strong {
  min-width: 0;
  overflow: hidden;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-bom-instance-row small {
  min-width: 0;
  overflow: hidden;
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 300;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-bom-house-row b,
.project-bom-instance-row b {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 400;
  text-align: right;
  white-space: nowrap;
}

.project-bom-instance-list {
  padding: 0 4px 4px 21px;
}

.project-bom-instance-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 27px;
  padding: 3px 5px 3px 9px;
  border-top: 1px solid color-mix(in srgb, var(--designer-card-divider) 72%, transparent);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 46%, var(--workspace-card-bg));
}

.project-bom-instance-row.is-summary strong {
  color: var(--text-muted);
  font-weight: 300;
}

.project-bom-item:not([open]) > .project-bom-decision {
  display: none;
}

.project-bom-row:last-child {
  border-bottom: 0;
}

.project-bom-shell.is-list-only .project-bom-row-list-only {
  background: var(--workspace-card-bg);
}

.project-bom-catalog-price {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  color: var(--text);
}

.project-bom-catalog-price strong {
  font-size: 12px;
  font-weight: 400;
}

.project-bom-catalog-price small {
  max-width: 100%;
  overflow: hidden;
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 300;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-bom-catalog-price.is-empty {
  color: var(--text-muted);
  font-size: 10px;
}

.project-bom-row-problem {
  background: var(--danger-soft);
}

.project-bom-row-self-fabricated {
  background: var(--workspace-card-bg);
}

.project-bom-row-buy-parts-kit {
  background: var(--workspace-card-bg);
}

.project-bom-row-buy-materials {
  background: var(--workspace-card-bg);
}

.project-bom-row-self-produce {
  background: var(--workspace-card-bg);
}

.project-bom-row-title,
.project-bom-row-provider,
.project-bom-row span,
.project-bom-row strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.18;
}

.project-bom-row-title {
  color: var(--text);
  cursor: pointer;
  font-size: 12px;
  font-weight: 400;
  text-decoration: none;
}

.project-bom-name-cell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  gap: 5px;
  align-items: center;
  min-width: 0;
  overflow: visible !important;
}

.project-bom-row-title.is-component-name-custom {
  color: color-mix(in srgb, var(--text) 72%, var(--accent) 28%);
}

.project-bom-row-title.is-component-name-override {
  color: var(--accent);
}

.project-component-naming-gear {
  display: inline-grid;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  place-items: center;
  justify-self: end;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 17px;
  font-weight: 400;
  line-height: 1;
}

.project-component-naming-gear:hover,
.project-component-naming-gear:focus-visible {
  border-color: var(--border);
  background: var(--workspace-card-bg);
  color: var(--accent);
}

.project-bom-family-head div > .project-component-naming-rule-summary {
  display: block !important;
  margin-top: 2px;
  color: color-mix(in srgb, var(--text-muted) 78%, var(--accent) 22%);
  font-size: 10px;
  font-weight: 300;
  text-transform: none;
}

a.project-bom-row-title:hover {
  color: var(--accent);
  text-decoration: underline;
}

a.project-bom-row-title[data-project-bom-catalog-link] {
  display: inline-block;
  width: auto;
  max-width: 100%;
  justify-self: start;
}

.project-bom-row-provider {
  color: var(--text-muted);
}

.project-bom-row-provider small {
  display: inline;
  margin-left: 6px;
  margin-top: 0;
  color: #0f766e;
  font-size: 10px;
  font-weight: 300;
}

.project-bom-decision {
  grid-column: 1 / -1;
  padding: 0 6px 5px;
  border: 0;
  border-top: 1px solid var(--designer-card-divider);
  border-radius: 0;
  background: var(--workspace-card-bg);
  color: var(--text-muted);
  text-align: left;
}

.project-bom-decision-title {
  margin-top: 5px;
  color: var(--text-muted);
  font-size: 9px;
  font-weight: 400;
  line-height: 1.15;
  text-transform: uppercase;
}

.project-bom-decision-meta {
  margin-top: 3px;
  font-size: 9px;
  font-weight: 300;
  line-height: 1.2;
}

.project-bom-decision-grid {
  display: grid;
  gap: 2px;
  margin-top: 4px;
}

.project-bom-decision-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) 92px 128px 70px 90px;
  gap: 6px;
  align-items: center;
  padding: 3px 0;
  border-top: 1px solid rgba(15, 23, 42, 0.07);
  font-size: 9px;
  line-height: 1.15;
}

.project-bom-decision-row:first-child {
  border-top: 0;
}

.project-bom-decision-row strong,
.project-bom-decision-row span,
.project-bom-decision-row em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 300;
}

.project-bom-decision-row span,
.project-bom-decision-row em {
  text-align: right;
}

.project-bom-decision-row em {
  color: #0f766e;
  font-size: 8px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
}

.project-bom-decision-row-selected {
  color: var(--text);
}

.project-bom-self-fab-btn {
  min-height: 30px;
  padding: 0 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--workspace-sidebar-bg);
  color: var(--workspace-sidebar-text);
  font-size: 11px;
  font-weight: 400;
  white-space: nowrap;
}

.project-bom-self-fab-btn.is-active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--workspace-sidebar-bg) 82%, var(--accent) 18%);
  color: var(--workspace-sidebar-text);
}

.project-bom-procurement-select {
  min-height: 32px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  padding: 0 8px;
  font-size: 11px;
  font-weight: 400;
}

.project-bom-warning-list {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.project-bom-warning-list p {
  margin: 0;
  border-radius: 10px;
  border: 1px solid rgba(217, 119, 6, 0.18);
  background: #fffbeb;
  color: #92400e;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.4;
}

.project-bom-marketplace-action {
  display: flex;
  justify-content: flex-end;
  padding-top: 4px;
}

.project-quote-scope-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.project-bom-inventory-summary {
  margin-bottom: 12px;
}

.project-quote-scope-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.project-quote-scope-summary > div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
}

.project-quote-scope-summary strong,
.project-quote-scope-summary span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-quote-scope-summary strong {
  font-size: 14px;
  font-weight: 400;
}

.project-quote-scope-summary span {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
}

.project-quote-filter-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.project-quote-filter-bar label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.project-quote-filter-bar label > span {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 300;
}

.project-quote-filter-bar select {
  width: 100%;
  min-width: 0;
}

.project-quote-select-all {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 6px 4px;
  border-top: 1px solid var(--designer-card-divider);
  border-bottom: 1px solid var(--designer-card-divider);
  cursor: pointer;
}

.project-quote-select-all input {
  width: 14px;
  height: 14px;
  margin: 0;
}

.project-quote-select-all > span {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 10px;
}

.project-quote-select-all strong {
  color: var(--text);
  font-size: 12px;
  font-weight: 400;
}

.project-quote-select-all small {
  min-width: 0;
  overflow: hidden;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-quote-scope-date {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
  border: 1px solid var(--designer-card-divider);
  background: var(--workspace-card-bg);
  color: var(--text-muted);
  font-size: 12px;
}

.project-quote-scope-date strong {
  color: var(--text);
  font-weight: 400;
}

.project-quote-scope-tree,
.project-quote-house-body,
.project-quote-family-body {
  display: flex;
  flex-direction: column;
}

.project-quote-scope-tree {
  gap: 0;
}

.project-quote-house,
.project-quote-family {
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: hidden;
}

.project-quote-family {
  border-right: 0;
  border-left: 0;
  border-radius: 0;
}

.project-quote-family + .project-quote-family {
  border-top: 0;
}

.project-quote-house > summary,
.project-quote-family > summary {
  list-style: disclosure-closed;
  cursor: pointer;
  border-bottom: 1px solid var(--designer-card-divider);
}

.project-quote-house > summary::-webkit-details-marker,
.project-quote-family > summary::-webkit-details-marker {
  display: initial;
}

.project-quote-checkline,
.project-quote-component-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.project-quote-checkline {
  padding: 4px 8px 4px 4px;
  background: transparent;
}

.project-quote-family .project-quote-checkline {
  padding-left: 22px;
}

.project-quote-component-row {
  padding: 4px 8px 4px 46px;
  border-top: 1px solid var(--designer-card-divider);
  cursor: pointer;
}

.project-quote-checkline input,
.project-quote-component-row input {
  width: 14px;
  height: 14px;
  margin: 0;
}

.project-quote-checkline span,
.project-quote-component-row span {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.project-quote-checkline strong,
.project-quote-component-row strong,
.project-quote-checkline small,
.project-quote-component-row small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-quote-checkline strong,
.project-quote-component-row strong {
  color: var(--text);
  font-size: 12px;
  font-weight: 400;
}

.project-quote-checkline small,
.project-quote-component-row small {
  margin-top: 0;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
}

.project-quote-component-row b {
  color: var(--text);
  font-size: 12px;
  font-weight: 400;
}

.project-quote-scope-actions {
  display: flex;
  justify-content: flex-end;
}

.project-bom-marketplace-button {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  color: var(--text);
}

.project-marketplace-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(17, 24, 22, 0.42);
}

.project-marketplace-modal {
  width: min(520px, 100%);
  display: grid;
  gap: 14px;
  padding: 22px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-strong);
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-lg);
}

.project-marketplace-modal h2,
.project-marketplace-modal p {
  margin: 0;
}

.project-marketplace-modal h2 {
  font-size: 18px;
  font-weight: 500;
}

.project-marketplace-modal p {
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.5;
}

.project-marketplace-modal-summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  font-size: 13px;
}

.project-marketplace-modal-summary span,
.project-marketplace-modal-summary strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-marketplace-modal-summary strong {
  flex: 0 0 auto;
  font-weight: 500;
}

.project-marketplace-modal-actions {
  justify-content: flex-end;
}

.project-component-naming-modal {
  width: min(860px, 100%);
  max-height: min(720px, calc(100vh - 48px));
  overflow: auto;
  gap: 12px;
  padding: 18px;
  border-radius: 6px;
  background: var(--workspace-card-bg);
}

.project-component-naming-manager {
  width: min(760px, 100%);
}

.project-component-naming-family-groups {
  display: grid;
  gap: 14px;
  overflow: auto;
}

.project-component-naming-family-group {
  display: grid;
  gap: 7px;
}

.project-component-naming-family-group h3 {
  margin: 0;
  color: var(--text);
  font-size: 12px;
  font-weight: 500;
}

.project-component-naming-family-list {
  display: grid;
  border-top: 1px solid var(--designer-card-divider);
}

.project-component-naming-family-row {
  display: grid;
  min-height: 48px;
  grid-template-columns: minmax(180px, 0.9fr) minmax(180px, 1.1fr) 30px;
  align-items: center;
  gap: 10px;
  padding: 7px 2px;
  border-bottom: 1px solid var(--designer-card-divider);
}

.project-component-naming-family-row > span:first-child {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.project-component-naming-family-row strong {
  color: var(--text);
  font-size: 11px;
  font-weight: 500;
}

.project-component-naming-family-row small,
.project-component-naming-family-preview {
  overflow: hidden;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 300;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-component-naming-family-preview {
  color: var(--text);
  font-size: 11px;
  font-weight: 400;
}

.project-component-naming-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--designer-card-divider);
}

.project-component-naming-header div {
  min-width: 0;
}

.project-component-naming-header span {
  display: block;
  margin-bottom: 2px;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
}

.project-component-naming-header h2 {
  overflow: hidden;
  color: var(--text);
  font-size: 16px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-component-naming-close {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: var(--text-muted);
  font-size: 20px;
  line-height: 1;
}

.project-component-naming-close:hover,
.project-component-naming-close:focus-visible {
  border-color: var(--border);
  color: var(--text);
}

.project-component-naming-layout {
  display: grid;
  grid-template-columns: minmax(210px, 0.7fr) minmax(320px, 1.3fr);
  gap: 14px;
  min-height: 280px;
}

.project-component-naming-library,
.project-component-naming-composer-column {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 8px;
}

.project-component-naming-library > strong,
.project-component-naming-composer-column > strong {
  color: var(--text);
  font-size: 11px;
  font-weight: 500;
}

.project-component-naming-category {
  border-top: 1px solid var(--designer-card-divider);
}

.project-component-naming-category summary {
  padding: 6px 2px;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 11px;
  font-weight: 400;
}

.project-component-naming-category > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0 0 7px;
}

.project-component-naming-variable {
  min-height: 27px;
  padding: 4px 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--workspace-card-button-bg);
  color: var(--text);
  cursor: grab;
  font-size: 10px;
  font-weight: 400;
}

.project-component-naming-variable:hover,
.project-component-naming-variable:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
}

.project-component-naming-composer {
  display: block;
  min-height: 116px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: color-mix(in srgb, var(--workspace-card-button-bg) 72%, var(--workspace-card-bg));
  color: var(--text);
  cursor: text;
  font-size: 12px;
  font-weight: 400;
  line-height: 32px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.project-component-naming-composer:focus {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
  outline: 2px solid color-mix(in srgb, var(--accent) 12%, transparent);
}

.project-component-naming-composer.is-empty:empty::before {
  content: attr(data-placeholder);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  pointer-events: none;
}

.project-component-naming-token {
  display: inline-flex;
  height: 28px;
  max-width: 100%;
  align-items: center;
  gap: 4px;
  margin: 1px 2px;
  padding: 0 3px 0 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--workspace-card-bg);
  color: var(--text);
  cursor: grab;
  font-size: 10px;
  line-height: 1;
  vertical-align: middle;
}

.project-component-naming-token.is-variable {
  border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
  color: color-mix(in srgb, var(--text) 76%, var(--accent) 24%);
}

.project-component-naming-token span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-component-naming-token button {
  display: grid;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: var(--text-muted);
  font-size: 16px;
  line-height: 1;
}

.project-component-naming-token button:hover {
  background: var(--workspace-card-button-bg);
  color: var(--text);
}

.project-component-naming-preview {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-component-naming-preview span,
.project-component-naming-preview small {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 300;
}

.project-component-naming-preview strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  overflow-wrap: anywhere;
}

.project-component-naming-actions {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  padding-top: 10px;
  border-top: 1px solid var(--designer-card-divider);
}

.project-component-naming-actions .btn {
  width: auto;
  flex: 0 0 auto;
}

.project-component-naming-delete-slot {
  display: flex;
  justify-content: flex-start;
}

.project-component-naming-delete {
  color: var(--danger);
}

@media (max-width: 720px) {
  .project-component-naming-modal {
    max-height: calc(100vh - 24px);
    padding: 14px;
  }

  .project-component-naming-layout {
    grid-template-columns: 1fr;
  }

  .project-component-naming-family-row {
    grid-template-columns: 1fr 30px;
  }

  .project-component-naming-family-preview {
    grid-column: 1;
    grid-row: 2;
  }

  .project-component-naming-family-row .project-component-naming-gear {
    grid-column: 2;
    grid-row: 1 / 3;
  }

  .project-component-naming-actions {
    grid-template-columns: 1fr 1fr;
  }

  .project-component-naming-actions > span {
    display: none;
  }

  .project-component-naming-delete-slot {
    grid-column: 1 / -1;
  }
}

.marketplace-cart-pack-list {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.marketplace-cart-pack {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
}

.marketplace-cart-pack strong,
.marketplace-cart-pack span,
.marketplace-cart-pack em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.marketplace-cart-pack strong {
  font-size: 13px;
  font-weight: 500;
}

.marketplace-cart-pack span,
.marketplace-cart-pack em {
  color: var(--text-muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
}

.constructor-material-nesting-card .card-body {
  display: grid;
  gap: 12px;
}

.constructor-material-nesting-summary {
  margin-bottom: 2px;
}

.constructor-material-family-list {
  display: grid;
  gap: 10px;
}

.constructor-material-family {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  overflow: hidden;
}

.constructor-material-family summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  background: #f0fdfa;
  cursor: pointer;
  list-style: none;
}

.constructor-material-family summary::-webkit-details-marker {
  display: none;
}

.constructor-material-family summary span,
.constructor-material-family summary strong,
.constructor-material-family summary small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.constructor-material-family summary strong {
  display: block;
  color: #0f3d38;
  font-size: 13px;
  font-weight: 850;
}

.constructor-material-family summary small {
  display: block;
  margin-top: 2px;
  color: rgba(15, 61, 56, 0.68);
  font-size: 11px;
}

.constructor-material-family-body {
  display: grid;
  gap: 0;
}

.constructor-material-part-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 8px 12px;
  border-top: 1px solid var(--border);
  font-size: 12px;
}

.constructor-material-part-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-bom-row-problem .project-bom-row-title,
.project-bom-row-problem .project-bom-row-provider {
  color: var(--danger);
}

.project-logistics-map {
  min-height: 420px;
}

.project-logistics-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.project-logistics-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.project-logistics-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.project-logistics-topline .summary-chip,
.project-logistics-provider-badges .summary-chip {
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-weight: 400;
}

.project-logistics-scope-control {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.project-logistics-scope-control label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.project-logistics-scope-control select {
  min-width: 160px;
  max-width: 220px;
  min-height: 30px;
  padding: 4px 28px 4px 9px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 400;
}

.project-logistics-side-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
}

.project-logistics-side > .project-logistics-side-card {
  border-color: transparent;
}

.project-logistics-warning-card {
  border-color: var(--border);
  background: var(--workspace-card-bg);
}

.project-logistics-warning-strip {
  display: grid;
  gap: 4px;
  padding: 9px 11px;
  border: 1px solid #FCD34D;
  border-radius: var(--radius-sm);
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 12px;
  line-height: 1.35;
}

.project-logistics-warning-strip p {
  margin: 0;
}

.project-logistics-card-head,
.project-logistics-row-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}

.project-logistics-card-title,
.project-logistics-provider-title {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  line-height: 1.25;
}

.project-logistics-card-title {
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}

.project-logistics-card-title strong,
.project-logistics-provider-title strong {
  color: var(--text);
  overflow-wrap: anywhere;
  font-weight: 400;
}

.project-logistics-plain-metrics {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 300;
  white-space: nowrap;
}

.project-logistics-side-title {
  font-size: 11px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

.project-logistics-provider-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 0;
  border-radius: var(--radius-sm);
  background: transparent;
}

.project-logistics-provider-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  width: 100%;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.project-logistics-provider-item:hover,
.project-logistics-provider-item.is-selected {
  color: var(--text);
}

.project-logistics-provider-item.is-selected {
  border: 1px solid var(--accent);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
}

.project-logistics-provider-item:last-child {
  padding-bottom: 8px;
}

.project-logistics-unresolved-card {
  border-color: var(--border);
  background: var(--workspace-card-bg);
}

.project-logistics-provider-location {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  white-space: nowrap;
}

.project-logistics-provider-detail {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
}

.project-logistics-provider-detail.is-empty {
  gap: 4px;
  color: var(--text-muted);
  background: var(--workspace-card-bg);
}

.project-logistics-provider-detail.is-empty p {
  margin: 0;
  font-size: 12px;
}

.project-logistics-provider-detail-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.project-logistics-provider-detail-head h3 {
  margin: 2px 0 8px;
  font-size: 1rem;
  line-height: 1.2;
}

.project-logistics-provider-link {
  min-height: 30px;
  padding: 5px 10px;
}

.project-logistics-provider-badges {
  gap: 5px;
}

.project-logistics-provider-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 8px;
}

.project-logistics-provider-metrics > div {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-button-bg);
}

.project-logistics-provider-metrics strong {
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 0.92rem;
  font-weight: 400;
}

.project-logistics-provider-metrics span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.project-logistics-component-table {
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
}

.project-logistics-component-head,
.project-logistics-component-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.6fr) minmax(90px, 0.7fr) 70px minmax(95px, 0.8fr) minmax(95px, 0.8fr) minmax(105px, 0.9fr) minmax(80px, 0.7fr);
  gap: 8px;
  align-items: center;
}

.project-logistics-component-table.has-procurement-actions .project-logistics-component-head,
.project-logistics-component-table.has-procurement-actions .project-logistics-component-row {
  grid-template-columns: minmax(170px, 1.45fr) minmax(78px, 0.55fr) 56px minmax(86px, 0.68fr) minmax(86px, 0.68fr) minmax(94px, 0.72fr) minmax(74px, 0.58fr) minmax(128px, 0.86fr) 70px;
  min-width: 980px;
}

.project-logistics-component-head {
  padding: 8px 10px;
  background: var(--workspace-sidebar-bg);
  color: var(--workspace-sidebar-text);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.project-logistics-component-list {
  max-height: 360px;
  overflow: auto;
  background: var(--workspace-card-bg);
}

.project-logistics-component-row {
  padding: 9px 10px;
  border-top: 1px solid var(--border);
  background: var(--workspace-card-button-bg);
  font-size: 12px;
  font-weight: 300;
}

.project-logistics-component-row small {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.25;
}

.project-logistics-component-row > span,
.project-logistics-component-row > strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 300;
}

.project-logistics-procurement-cell,
.project-logistics-alert-cell {
  display: flex;
  align-items: center;
}

.project-logistics-procurement-select {
  width: 100%;
  min-height: 28px;
  padding: 3px 24px 3px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--workspace-card-bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 300;
}

.project-logistics-alert-button {
  min-height: 28px;
  width: 100%;
  padding: 3px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 300;
  cursor: pointer;
}

.project-logistics-alert-button:hover,
.project-logistics-alert-button.is-active {
  border-color: color-mix(in srgb, var(--accent-hover) 54%, var(--border) 46%);
  background: color-mix(in srgb, var(--accent-soft) 72%, transparent);
  color: var(--text);
}

.project-logistics-procurement-select:disabled,
.project-logistics-alert-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.project-logistics-unresolved-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 300px;
  overflow: auto;
  padding-right: 4px;
}

.project-logistics-unresolved-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid var(--border);
}

.project-logistics-unresolved-item.has-procurement-actions {
  grid-template-columns: minmax(160px, 1fr) 54px minmax(128px, 0.72fr) 70px;
}

.project-logistics-unresolved-item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.project-logistics-component-link {
  font-weight: 400;
  color: var(--text);
  text-decoration: none;
}

.project-logistics-component-link:hover {
  text-decoration: underline;
}

.project-logistics-unresolved-reason {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}

.project-logistics-shell .btn,
.project-logistics-shell button,
.project-logistics-shell select {
  border-color: var(--border);
  background: var(--workspace-card-button-bg);
  color: var(--text);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-weight: var(--type-button-weight);
  box-shadow: none;
}

.project-logistics-shell .btn:hover,
.project-logistics-shell button:hover,
.project-logistics-shell select:hover {
  border-color: var(--selected-border);
  background: #E3E3E3;
  color: var(--text);
}

.project-logistics-shell .project-logistics-provider-item {
  border-color: transparent;
  background: var(--workspace-card-button-bg);
  font-size: var(--type-control-size);
  font-weight: 400;
}

.project-logistics-shell .project-logistics-provider-item.is-selected,
.project-logistics-shell .project-logistics-provider-item.is-selected:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--workspace-card-button-bg) 86%, var(--accent) 14%);
  color: var(--text);
}

.project-logistics-legend {
  align-items: center;
}

.project-logistics-dot {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  display: inline-block;
}

.project-logistics-dot-provider {
  background: #d97706;
}

.project-logistics-dot-outbound {
  background: #2563eb;
}

.leaflet-control-attribution {
  font-size: 10px !important;
}

/* ── Graphics style editor ───────────────────────────────────────────── */
.graphics-card .card-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.output-layout-card .card-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.graphics-page-shell {
  max-width: 1180px;
  width: 100%;
  margin: 0 auto;
  padding: 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.graphics-page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.graphics-page-picker {
  min-width: 280px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.graphics-topbar,
.graphics-preset-bar,
.graphics-toolbar,
.graphics-scope-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.graphics-topbar,
.graphics-preset-bar {
  justify-content: space-between;
}

.graphics-scope-picker,
.graphics-preset-select {
  min-width: 220px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.graphics-groups {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.graphics-group-card {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(248,250,252,0.9), rgba(255,255,255,0.98));
  overflow: hidden;
}

.graphics-group-header {
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
  background: rgba(239,246,255,0.55);
}

.graphics-group-header h4 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.graphics-group-body,
.graphics-subsection {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.graphics-group-body {
  padding: 16px;
}

.graphics-subsection-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.graphics-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.graphics-row-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.graphics-row-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}

.graphics-row-meta {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.45;
}

.graphics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.graphics-grid-line-weights {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.graphics-row-layer {
  gap: 8px;
  padding: 12px 14px;
}

.graphics-grid-layer {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: end;
}

.graphics-control {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.graphics-control-compact {
  gap: 4px;
}

.graphics-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.graphics-input-row input[type="color"] {
  width: 52px;
  min-width: 52px;
  padding: 3px;
  height: 36px;
}

.graphics-checkbox-row {
  min-height: 36px;
}

.graphics-checkbox-row input[type="checkbox"] {
  width: auto;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.graphics-visible-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-muted);
  white-space: nowrap;
}

.graphics-visible-toggle input[type="checkbox"] {
  width: auto;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.graphics-reset-btn {
  padding: 7px 10px;
  font-size: 12px;
}

.processing-sticky-actions {
  top: 64px;
  margin-bottom: 0;
  align-items: stretch;
  gap: 0;
}

.processing-toolbar {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.processing-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.processing-toolbar #saveProjectOutputsBtn,
.processing-toolbar #saveUserProcessingDefaultBtn {
  background: #151A18;
  border-color: #151A18;
  color: #fff;
}

.processing-toolbar #saveProjectOutputsBtn:hover,
.processing-toolbar #saveUserProcessingDefaultBtn:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  box-shadow: var(--selected-ring);
}

.processing-page-card > .card-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.processing-selector-shell {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.processing-master-bar,
.processing-preset-bar {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255,255,255,0.96);
}

.processing-master-actions,
.processing-preset-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.processing-preset-select {
  min-width: 220px;
  display: grid;
  grid-template-columns: minmax(240px, 330px) auto;
  gap: 8px 10px;
  align-items: end;
  flex: 1 1 auto;
}

.processing-preset-select .field-label {
  grid-column: 1 / -1;
}

.processing-preset-select select {
  min-width: 0;
}

.processing-preset-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.processing-selector-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.processing-selector-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.processing-selector-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255,255,255,0.82);
  transition: border-color 0.15s, box-shadow 0.15s, opacity 0.15s, background 0.15s;
}

.processing-selector-row.active {
  border-color: var(--border-strong);
  background: #fff;
}

.processing-selector-row.inactive {
  opacity: 0.76;
}

.processing-selector-row-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}

.processing-selector-row-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

@media (max-width: 1200px) {
  .admin-body-grid {
    grid-template-columns: 1fr;
  }

  .admin-overview-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-rail-stack,
  .admin-kpi-grid,
  .admin-section-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .project-processing-service-shell[data-processing-package="architecture"] {
    grid-template-columns: 1fr;
  }

  .account-main-content .card-grid-account,
  .account-main-content .card-grid-account + .card-grid-account,
  .account-main-content .account-secondary-grid {
    grid-template-columns: 1fr;
  }

  .marketplace-layout {
    grid-template-columns: 1fr;
  }

  .marketplace-cart-panel {
    position: static;
    max-height: none;
  }

  .marketplace-context-grid,
  .marketplace-filter-grid,
  .marketplace-filter-card-date {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .workspace {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    height: auto;
    border-right: none;
    border-bottom: 1px solid var(--border);
    overflow: visible;
  }

  .sidebar-scroll {
    overflow: visible;
  }

  .main-content {
    padding: 20px 16px;
  }

  .workspace-hero,
  .dashboard-grid,
  .stats-strip,
  .admin-kpi-grid,
  .admin-shell > .admin-kpi-grid,
  .admin-body-grid,
  .admin-section-stack,
  .admin-rail-stack,
  .admin-panel-split,
  .admin-rate-grid,
  .warehouse-filter-grid,
  .producer-map-list-grid,
  .warehouse-map-list-grid,
  .defaults-grid,
  .producer-catalog-layout,
  .admin-network-side,
  .producer-review-grid,
  .producer-info-grid,
  .producer-signal-grid,
	  .producer-score-grid,
	  .constructor-package-detail-grid,
	  .constructor-project-resource-grid,
	  .constructor-project-resource-toolbar,
	  .constructor-date-inline-form,
	  .constructor-task-default-grid,
	  .constructor-resource-row,
	  .constructor-task-rule-row,
	  .constructor-task-material-grid {
	    display: grid;
	    grid-template-columns: 1fr;
	  }

  .admin-overview-board {
    grid-template-columns: 1fr;
  }

  .workspace-hero {
    gap: 14px;
  }

  .designer-home .stats-strip {
    grid-template-columns: 1fr;
  }

  .designer-home .stat-block + .stat-block {
    border-left: 0;
    border-top: 1px solid var(--border);
  }

  .defaults-block {
    min-height: auto;
    padding-right: 0;
  }

  .defaults-block + .defaults-block {
    border-left: 0;
    border-top: 1px solid var(--border);
    padding-left: 0;
  }

  .admin-filter-grid {
    grid-template-columns: 1fr;
  }

  .card-grid {
    grid-template-columns: 1fr;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }

  .project-procurement-mode-grid {
    grid-template-columns: 1fr;
  }

  .sticky-project-actions {
    top: 64px;
    flex-direction: column;
    align-items: stretch;
  }

  .sticky-project-actions-buttons {
    width: 100%;
    justify-content: flex-start;
  }

  .processing-grid {
    grid-template-columns: 1fr;
  }

  .processing-selector-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .graphics-grid {
    grid-template-columns: 1fr;
  }

  .graphics-grid-layer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .graphics-grid-line-weights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .graphics-page-shell {
    padding: 20px 16px;
  }

  .main-content-wide {
    padding-inline: 16px;
  }

  .account-main-content {
    padding: 20px 16px 28px;
  }

  .account-main-content > .card > .card-header {
    min-height: 0;
    flex-direction: column;
  }

  .account-main-content > .card > .card-header .subtle {
    text-align: left;
  }

  .account-main-content .card-grid-account,
  .account-main-content .card-grid-account + .card-grid-account,
  .account-main-content .account-secondary-grid {
    grid-template-columns: 1fr;
  }

  .account-collapsible-card > summary.account-collapsible-summary {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .account-collapsible-actions {
    width: 100%;
    justify-content: space-between;
    margin-left: 0;
  }

  .account-kind-select {
    min-width: 0;
    max-width: none;
    flex: 1 1 auto;
  }

  .account-kind-topbar-header,
  .account-kind-topbar-left {
    align-items: stretch;
    flex-direction: column;
  }

  .account-kind-topbar-actions {
    width: 100%;
    justify-content: flex-end;
  }

  .account-username-row {
    grid-template-columns: 1fr;
  }

  .account-username-row .btn {
    width: 100%;
  }

  .account-billing-grid,
  .account-payment-form,
  .account-billing-kpis {
    grid-template-columns: 1fr;
  }

  .account-payment-actions {
    align-items: stretch;
  }

  .account-payment-actions .btn {
    width: 100%;
  }

  .account-transaction-row,
  .account-transaction-side {
    align-items: flex-start;
    grid-template-columns: 1fr;
    justify-content: flex-start;
    text-align: left;
  }

  .account-space-grid {
    grid-template-columns: 1fr;
  }

  .transactions-main-content {
    padding: 20px 16px 28px;
  }

  .transactions-kpi-grid,
  .transactions-layout,
  .transactions-payment-body,
  .transactions-payment-form,
  .transaction-stage-rail,
  .transaction-detail-grid,
  .transaction-trace-grid {
    grid-template-columns: 1fr;
  }

  .transactions-ledger-card > .card-header,
  .transaction-detail-card > .card-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .transactions-filter,
  .transaction-detail-actions,
  .transaction-detail-actions .btn {
    width: 100%;
  }

  .transaction-ledger-list {
    max-height: none;
  }

  .transactions-payment-methods {
    border-left: 0;
    border-top: 1px solid var(--border);
    padding-left: 0;
    padding-top: 12px;
  }

  .transaction-ledger-row,
  .transaction-line-row,
  .transaction-money-list div {
    grid-template-columns: 1fr;
  }

  .transaction-ledger-side {
    justify-items: start;
    text-align: left;
  }

  .producer-map-canvas,
  .producer-inspector,
  .producer-inspector-empty {
    min-height: 420px;
    max-height: none;
  }

  .producer-component-row,
  .producer-component-offer-row,
	  .producer-criteria-row,
	  .producer-partner-row,
	  .producer-resource-row,
	  .producer-storage-row,
	  .producer-team-member-row,
	  .producer-pipeline-row,
  .producer-route-head,
  .producer-history-row,
  .admin-bar-row,
  .admin-table-row,
  .admin-alert-row,
  .admin-source-row,
  .admin-link-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .producer-component-stats {
    align-items: flex-start;
  }

  .producer-component-offer-row,
  .producer-criteria-row,
	  .producer-criteria-add-row,
	  .producer-partner-row,
	  .producer-assignment-row,
	  .producer-resource-row,
	  .producer-storage-row,
	  .producer-workspace-shell,
  .producer-business-grid,
  .producer-business-grid-compact,
  .producer-business-two-col {
	    grid-template-columns: 1fr;
	  }

	  .producer-resource-row-head,
	  .producer-resource-detail-grid,
	  .producer-catalog-toolbar,
	  .producer-catalog-row,
	  .producer-catalog-metrics,
  .producer-line-component-row,
  .producer-material-part-row,
  .producer-calendar-exception-row {
    grid-template-columns: 1fr;
  }

  .producer-pricing-bar {
    flex-direction: column;
  }

  .producer-pricing-segment-stock {
    flex-basis: auto;
  }

  .producer-pricing-production-rail {
    min-height: 94px;
  }

	  .producer-component-offer-row {
	    min-width: 0;
	  }

	  .producer-component-stock-batches,
	  .producer-capacity-actions {
	    grid-column: 1;
	  }

	  .producer-criteria-row textarea {
	    grid-column: 1;
  }

  .producer-role-chip-list,
  .producer-pipeline-stats {
    justify-content: flex-start;
  }

  .producer-component-toolbar,
  .producer-component-family-head {
    align-items: flex-start;
  }

  .producer-component-add-row,
  .producer-component-toolbar {
    grid-template-columns: 1fr;
  }

  .producer-component-family-head span {
    white-space: normal;
  }

  .producer-route-stats {
    align-items: flex-start;
  }

  .admin-bar-row {
    display: flex;
  }

  .admin-source-badges {
    justify-content: flex-start;
  }

  .admin-table-metrics {
    justify-content: flex-start;
  }

  .processing-master-bar,
  .processing-preset-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .processing-toolbar,
  .processing-preset-select {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .processing-selector-row-controls {
    width: 100%;
    justify-content: flex-start;
  }

  .share-add-form {
    grid-template-columns: 1fr 1fr;
  }

  .info-row,
  .info-row-stack {
    flex-direction: column;
    align-items: flex-start;
  }

  .info-value {
    text-align: left;
  }

  .download-item {
    align-items: flex-start;
    flex-direction: column;
  }

  .download-item-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .download-item-actions > * {
    flex: 1 1 120px;
  }

  .project-bom-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-logistics-grid {
    grid-template-columns: 1fr;
  }

  .project-logistics-provider-detail-head {
    grid-template-columns: 1fr;
  }

  .project-logistics-component-head {
    display: none;
  }

  .project-logistics-component-row {
    grid-template-columns: 1fr 1fr;
  }

  .constructor-package-sticky-card {
    top: 60px;
    flex-direction: column;
  }

  .constructor-package-sticky-side {
    width: 100%;
    align-items: flex-start;
  }

  .constructor-transport-grid {
    grid-template-columns: 1fr;
  }

  .constructor-transport-stack-head,
  .constructor-transport-item {
    flex-direction: column;
    align-items: flex-start;
  }

  .constructor-gantt-entry {
    min-width: 98px;
    max-width: 138px;
  }

  .owner-dossier-top-grid,
  .owner-output-grid,
  .owner-bom-table-head,
  .owner-bom-row {
    grid-template-columns: 1fr;
  }

  .owner-bom-table-head {
    display: none;
  }

  .owner-pane-header {
    flex-direction: column;
  }

  .owner-viewer-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 600px) {
  .navbar {
    height: auto;
    min-height: var(--topbar-h);
    padding: 6px 12px;
    flex-wrap: wrap;
    align-items: center;
  }

  .navbar-brand {
    flex: 1 1 150px;
  }

  .navbar-title {
    font-size: 14px;
  }

  .navbar-right {
    flex: 1 1 100%;
    justify-content: flex-start;
    gap: 7px;
  }

  .role-switcher {
    padding: 5px 8px;
  }

  .role-switcher span {
    display: none;
  }

  .role-switcher select {
    min-width: 112px;
    max-width: 128px;
    font-size: 12px;
  }

  .user-chip {
    padding: 4px 7px;
  }

  .project-bom-summary,
  .project-bom-row {
    grid-template-columns: 1fr;
  }

  .project-quote-scope-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-quote-filter-bar {
    grid-template-columns: 1fr;
  }

  .project-quote-scope-date {
    flex-direction: column;
    gap: 4px;
  }

  .project-quote-component-row {
    grid-template-columns: 22px minmax(0, 1fr);
  }

  .project-quote-component-row b {
    grid-column: 2;
  }

  .procurement-cost-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .procurement-cost-row > strong,
  .procurement-cost-row > span:last-child {
    text-align: left;
  }

  .project-bom-table-head {
    display: none;
  }

  .project-bom-row {
    gap: 4px;
    align-items: start;
  }

  .project-bom-row > :nth-child(n+3) {
    text-align: left;
  }

  .project-bom-decision-row {
    grid-template-columns: 1fr;
  }

  .project-bom-decision-row span,
  .project-bom-decision-row em {
    text-align: left;
  }

  .project-bom-house-breakdown {
    padding-left: 8px;
  }

  .project-bom-house-row {
    grid-template-columns: 14px minmax(0, 1fr) auto;
  }

  .project-bom-instance-list {
    padding-left: 12px;
  }

  .project-bom-instance-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .user-name {
    display: none;
  }

  .main-content {
    padding: 18px 16px;
  }

  .stats-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .module-card-grid {
    grid-template-columns: 1fr;
  }

  .marketplace-context-grid,
  .marketplace-filter-grid,
  .marketplace-filter-card-date,
  .marketplace-restriction-filters,
  .marketplace-filter-row,
  .marketplace-item-actions,
  .marketplace-analysis-form .form-grid {
    grid-template-columns: 1fr;
  }

  .marketplace-item-main {
    grid-template-columns: 76px minmax(0, 1fr);
  }

  .marketplace-item-preview {
    width: 76px;
    height: 76px;
  }

  .marketplace-cart-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .project-config-button-row {
    grid-template-columns: 1fr;
  }

  .sticky-project-actions-buttons > * {
    flex: 1 1 auto;
    justify-content: center;
  }

  .constructor-provider-priority-row {
    grid-template-columns: 1fr;
  }

  .construction-project-planner-header,
  .construction-sequence-launch-header,
  .construction-schedule-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .construction-sequence-topbar {
    align-items: stretch;
    flex-direction: column;
  }

  .construction-sequence-topbar-left,
  .construction-sequence-topbar-actions {
    justify-content: flex-start;
  }

  .construction-sequence-launch-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .construction-sequence-scope-group,
  .construction-sequence-house-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .construction-sequence-scope-group {
    flex-direction: column;
  }

  .construction-sequence-house-actions {
    flex-wrap: wrap;
  }

  .construction-schedule-layout {
    grid-template-columns: 1fr;
  }

  .construction-schedule-board {
    min-width: calc(170px + var(--construction-schedule-grid-width, 110px));
  }

  .construction-schedule-axis,
  .construction-schedule-row {
    grid-template-columns: 170px minmax(0, 1fr);
  }

  .construction-schedule-day-axis,
  .construction-schedule-track {
    grid-template-columns: var(--construction-schedule-grid-template, repeat(var(--construction-schedule-days, 1), var(--construction-schedule-day-width, 110px)));
  }

  .construction-schedule-house-axis,
  .construction-schedule-house-cell {
    white-space: normal;
  }

  .construction-project-sequence-page .construction-schedule-side-panel {
    grid-template-columns: 1fr;
  }
}

/* Central platform skin: shared dark workspace, gray cards/controls, Graphik type. */
.workspace-platform-standard,
.workspace-output-layout,
.graphics-page-shell {
  --bg: var(--platform-page-bg);
  --surface: var(--platform-card-bg);
  --surface-2: var(--platform-control-bg);
  --border: var(--platform-border);
  --border-strong: var(--platform-border-strong);
  --text: var(--platform-text);
  --text-muted: var(--platform-muted);
  --accent: var(--platform-accent);
  --accent-hover: var(--platform-accent-hover);
  --accent-soft: var(--platform-selected-bg);
  background: var(--platform-page-bg);
  color: var(--platform-text);
  font-family: var(--platform-font);
  letter-spacing: 0;
}

.workspace-platform-standard *,
.workspace-output-layout *,
.graphics-page-shell * {
  font-family: var(--platform-font);
  letter-spacing: 0;
}

.workspace-platform-standard :where(h1, h2, h3, h4, h5, h6, strong, b, label, button, input, select, textarea, .page-title, .card-title, .field-label),
.workspace-output-layout :where(h1, h2, h3, h4, h5, h6, strong, b, label, button, input, select, textarea, .page-title, .card-title, .field-label),
.graphics-page-shell :where(h1, h2, h3, h4, h5, h6, strong, b, label, button, input, select, textarea, .page-title, .card-title, .field-label) {
  font-weight: var(--platform-type-weight);
}

.workspace-platform-standard .main-content,
.workspace-output-layout .main-content,
.output-layout-main {
  background: var(--platform-page-bg);
  color: var(--platform-text);
}

.workspace-platform-standard .main-content > .page-header .page-title,
.workspace-output-layout .main-content > .page-header .page-title {
  color: var(--platform-text-on-dark);
}

.workspace-platform-standard .main-content > .page-header .page-meta,
.workspace-output-layout .main-content > .page-header .page-meta,
.workspace-platform-standard .main-content > .page-header .subtle,
.workspace-output-layout .main-content > .page-header .subtle {
  color: var(--platform-sidebar-muted);
}

.workspace-platform-standard .sidebar,
.workspace-output-layout .sidebar {
  background: var(--platform-sidebar-bg);
  border-right: 1px solid var(--platform-sidebar-border);
  color: var(--platform-sidebar-text);
}

.workspace-platform-standard .sidebar-scroll,
.workspace-output-layout .sidebar-scroll {
  scrollbar-color: var(--platform-control-bg) var(--platform-page-bg);
}

.workspace-platform-standard .sidebar-label,
.workspace-output-layout .sidebar-label {
  color: var(--platform-sidebar-text);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
  text-transform: none;
}

.workspace-platform-standard .project-item,
.workspace-output-layout .project-item {
  min-height: var(--platform-control-height);
  padding: 7px 10px;
  border: 1px solid var(--platform-sidebar-item-border);
  border-left-width: 1px;
  border-radius: var(--platform-radius-sm);
  background: var(--platform-sidebar-item-bg);
  color: var(--platform-sidebar-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
  box-shadow: none;
}

.workspace-platform-standard .project-item:hover,
.workspace-output-layout .project-item:hover {
  border-color: var(--platform-sidebar-item-border-active);
  background: var(--platform-sidebar-item-bg-hover);
  color: var(--platform-sidebar-text);
}

.workspace-platform-standard .project-item.active,
.workspace-output-layout .project-item.active,
.workspace-platform-standard .project-item[aria-current="true"],
.workspace-output-layout .project-item[aria-current="true"] {
  border-color: var(--platform-sidebar-item-border-active);
  background: var(--platform-sidebar-item-bg-active);
  color: var(--platform-sidebar-text);
  box-shadow: none;
}

.workspace-platform-standard :where(.card, .workspace-panel, .producer-page-head, .producer-route-row, .producer-label-card, .producer-family-card, .producer-score-card, .producer-criteria-row, .producer-component-offer-row, .producer-catalog-toolbar, .producer-catalog-row, .producer-catalog-add-panel, .constructor-day-package, .constructor-gantt-entry, .construction-sequence-launch-card, .construction-schedule-side-panel section, .construction-schedule-block-inspector, .construction-block-inspector-panel),
.workspace-output-layout :where(.card, .workspace-panel, .graphics-row, .graphics-group-card, .output-layout-card, .processing-page-card),
.graphics-page-shell :where(.card, .graphics-row, .graphics-group-card, .output-layout-card) {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius);
  background: var(--platform-card-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-platform-standard :where(.card-header, .workspace-panel-head, .download-group-summary, .graphics-group-header, .producer-catalog-row + .producer-catalog-row, .producer-component-row + .producer-component-row, .producer-history-row + .producer-history-row),
.workspace-output-layout :where(.card-header, .download-group-summary, .graphics-group-header),
.graphics-page-shell :where(.card-header, .download-group-summary, .graphics-group-header) {
  border-color: var(--platform-divider);
}

.workspace-platform-standard :where(.card-title, .workspace-panel-head h2, .producer-page-head h1, .producer-criteria-section h3, .producer-catalog-row strong, .constructor-gantt-day, .constructor-gantt-date),
.workspace-output-layout :where(.card-title, .graphics-row-title, .graphics-group-header h4),
.graphics-page-shell :where(.card-title, .graphics-row-title, .graphics-group-header h4) {
  color: var(--platform-text);
  font-size: var(--platform-card-title-font-size);
  font-weight: var(--platform-type-weight);
  text-transform: none;
}

.workspace-platform-standard :where(.field-label, label, .subtle, .empty-note, .producer-contact-note, .producer-component-meta, .producer-history-row span, .producer-route-stats, .constructor-gantt-stages),
.workspace-output-layout :where(.field-label, label, .subtle, .empty-note),
.graphics-page-shell :where(.field-label, label, .subtle, .empty-note) {
  color: var(--platform-muted);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
  text-transform: none;
}

.workspace-platform-standard :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.workspace-output-layout :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.graphics-page-shell :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  min-height: var(--platform-control-height);
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-control-font-size);
  font-weight: var(--platform-type-weight);
  box-shadow: none;
}

.workspace-platform-standard :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus,
.workspace-output-layout :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus,
.graphics-page-shell :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  border-color: var(--platform-selected-border);
  outline: none;
  box-shadow: none;
}

.workspace-platform-standard :where(select option),
.workspace-output-layout :where(select option),
.graphics-page-shell :where(select option) {
  background: var(--platform-control-bg);
  color: var(--platform-text);
}

.workspace-platform-standard :where(.btn, button, .download-link),
.workspace-output-layout :where(.btn, button, .download-link),
.graphics-page-shell :where(.btn, button, .download-link) {
  min-height: var(--platform-control-height);
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
  justify-content: center;
  box-shadow: none;
}

.workspace-platform-standard :where(.btn:hover, button:hover, .download-link:hover),
.workspace-output-layout :where(.btn:hover, button:hover, .download-link:hover),
.graphics-page-shell :where(.btn:hover, button:hover, .download-link:hover) {
  border-color: var(--platform-selected-border);
  background: var(--platform-control-bg-hover);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-platform-standard :where(.btn.primary, button.primary, .btn.active, button.active, .marketplace-tab.active, .check-pill:has(input:checked)),
.workspace-output-layout :where(.btn.primary, button.primary, .btn.active, button.active),
.graphics-page-shell :where(.btn.primary, button.primary, .btn.active, button.active) {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-platform-standard :where(.summary-chip, .processing-chip, .badge, .badge-role, .badge-shared),
.workspace-output-layout :where(.summary-chip, .processing-chip, .badge, .badge-role, .badge-shared),
.graphics-page-shell :where(.summary-chip, .processing-chip, .badge, .badge-role, .badge-shared) {
  border: 0;
  border-radius: var(--platform-radius-sm);
  background: transparent;
  color: var(--platform-muted);
  font-weight: var(--platform-type-weight);
}

.workspace-platform-standard :where(.sticky-project-actions, .processing-sticky-actions) {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius);
  background: var(--platform-card-bg-strong);
  box-shadow: none;
  backdrop-filter: none;
}

.workspace-producer .producer-page-head {
  padding: 14px 16px;
}

.workspace-producer .producer-page-head p {
  color: var(--platform-muted);
  font-weight: var(--platform-type-weight);
}

.workspace-producer :where(.producer-sticky-save-card, .producer-catalog-metrics span, .producer-evidence-open) {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-producer :where(.producer-route-row.active, .producer-catalog-row.active, .producer-criteria-row.active) {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
}

.workspace-constructor .constructor-provider-priority-row,
.workspace-constructor .constructor-provider-list,
.workspace-constructor .constructor-package-line-card,
.workspace-constructor .construction-project-planner-card,
.workspace-constructor .construction-inline-detail,
.workspace-constructor .construction-block-component-group,
.workspace-constructor .construction-block-phase-row,
.workspace-constructor .construction-block-component-row,
.workspace-constructor .construction-block-resource-row {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius);
  background: var(--platform-card-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor .construction-phase-block.is-selected,
.workspace-constructor .construction-component-block.is-selected,
.workspace-constructor .constructor-day-package.is-selected,
.workspace-constructor .constructor-gantt-entry.is-active {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor .procurement-cost-table {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  box-shadow: none;
}

.workspace-constructor .procurement-cost-row {
  border-color: var(--platform-divider);
  background: var(--platform-control-bg);
  color: var(--platform-text);
}

.workspace-constructor .procurement-cost-row-head {
  background: var(--platform-card-bg);
  color: var(--platform-text);
}

.workspace-constructor .procurement-cost-row-head > span:first-child,
.workspace-constructor .procurement-cost-row > span:first-child,
.workspace-constructor .procurement-cost-row > strong,
.workspace-constructor .procurement-cost-row > span:last-child {
  color: var(--platform-text);
}

.workspace-constructor .procurement-cost-row-total {
  background: var(--platform-control-bg-hover);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-project-sequence-page {
  display: block;
  min-height: calc(100vh - var(--topbar-h));
  height: auto;
  overflow: visible;
  background: var(--platform-page-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-sequence-topbar {
  position: relative;
  top: auto;
  z-index: 10;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: calc(var(--topbar-h) + 8px);
  padding: 4px 10px;
  border-bottom: 1px solid var(--platform-border);
  background: var(--platform-topbar-bg);
  color: var(--platform-text);
  max-height: none;
  overflow: visible;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.workspace-constructor-sequence .construction-project-planner-card {
  display: block;
  border: 0;
  background: var(--platform-page-bg);
  color: var(--platform-text);
  overflow: visible;
}

.workspace-constructor-sequence .construction-project-planner-card.is-chrome-minimal > .card-body {
  display: grid;
  flex: 1 1 auto;
  gap: 6px;
  min-height: 0;
  overflow: visible;
  padding: 6px 10px 12px;
}

.workspace-constructor-sequence .construction-project-planner-card.has-sequence-topbar-tools > .card-body > .construction-schedule-toolbar {
  display: none;
}

.workspace-constructor-sequence .construction-sequence-topbar-left,
.workspace-constructor-sequence .construction-sequence-topbar-actions,
.workspace-constructor-sequence .construction-sequence-topbar-tools {
  min-width: 0;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools {
  overflow: visible;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-toolbar {
  position: static;
  top: auto;
  z-index: auto;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
  scrollbar-color: var(--platform-control-bg) transparent;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-zoom {
  padding: 2px;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-zoom > span {
  padding: 0 5px;
  font-size: 9.5px;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-zoom-button,
.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-zoom-select {
  min-height: 24px;
  font-size: 10.5px;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-zoom-button {
  padding: 3px 7px;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-zoom-select {
  min-width: 78px;
  max-width: 118px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.workspace-constructor-sequence .construction-schedule-toolbar {
  position: sticky;
  top: calc((var(--topbar-h) * 2) + 12px);
  z-index: 62;
  gap: 8px;
  flex-wrap: nowrap;
  justify-content: flex-start;
  margin-bottom: 10px;
  padding: 8px;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius);
  background: var(--platform-card-bg);
  overflow-x: auto;
  scrollbar-color: var(--platform-control-bg) var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-schedule-toolbar > .field-help {
  color: var(--platform-muted);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-schedule-zoom {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 4px;
  padding: 3px;
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-schedule-zoom > span {
  color: var(--platform-muted);
  font-size: 10px;
  font-weight: var(--platform-type-weight);
  letter-spacing: 0;
  text-transform: none;
}

.workspace-constructor-sequence .construction-schedule-zoom-button {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 28px;
  gap: 6px;
  border-color: transparent;
  border-radius: var(--platform-radius-sm);
  background: transparent;
  color: var(--platform-text);
  font-size: 11px;
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-schedule-toolbar-icon {
  width: 16px;
  height: 16px;
  display: block;
  object-fit: contain;
  filter: var(--platform-icon-filter);
  opacity: 0.86;
}

.workspace-constructor-sequence .construction-schedule-select-icon {
  flex: 0 0 auto;
  margin-left: 3px;
}

.workspace-constructor-sequence .construction-schedule-select-control.is-zoom-control > span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.workspace-constructor-sequence .construction-schedule-reset-order-control {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-schedule-reset-order-control .construction-schedule-zoom-select {
  min-width: 82px;
  max-width: 104px;
}

.workspace-constructor-sequence .construction-schedule-zoom-select {
  width: auto;
  min-width: 96px;
  max-width: 136px;
  min-height: 28px;
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-schedule-snap-menu {
  position: relative;
  flex: 0 0 auto;
}

.workspace-constructor-sequence .construction-schedule-snap-menu > summary {
  list-style: none;
}

.workspace-constructor-sequence .construction-schedule-snap-menu > summary::-webkit-details-marker {
  display: none;
}

.workspace-constructor-sequence .construction-schedule-icon-tool-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--platform-control-height);
  min-width: var(--platform-control-height);
  height: var(--platform-control-height);
  padding: 4px;
}

.workspace-constructor-sequence .construction-sequence-topbar-tools .construction-schedule-icon-tool-button {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  padding: 3px;
}

.workspace-constructor-sequence .construction-schedule-snap-popover {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 90;
  display: grid;
  gap: 2px;
  width: max-content;
  min-width: 96px;
  padding: 6px;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.18);
}

.workspace-constructor-sequence .construction-schedule-snap-option {
  min-height: 24px;
  justify-content: flex-start;
  padding: 3px 8px;
  border: 1px solid transparent;
  border-radius: var(--platform-radius-sm);
  background: transparent;
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-schedule-snap-option:hover,
.workspace-constructor-sequence .construction-schedule-snap-option.is-active {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
}

.workspace-constructor-sequence .construction-schedule-resource-filter-menu {
  position: relative;
  flex: 0 0 auto;
}

.workspace-constructor-sequence .construction-schedule-resource-filter-menu > summary {
  list-style: none;
}

.workspace-constructor-sequence .construction-schedule-resource-filter-menu > summary::-webkit-details-marker {
  display: none;
}

.workspace-constructor-sequence .construction-schedule-resource-filter-summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
}

.workspace-constructor-sequence .construction-schedule-resource-filter-popover {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 90;
  display: grid;
  gap: 2px;
  width: max-content;
  min-width: 210px;
  max-height: min(300px, calc(100vh - 140px));
  padding: 6px;
  overflow: auto;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.18);
}

.workspace-constructor-sequence .construction-schedule-resource-filter-option {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 24px;
  padding: 3px 7px;
  border-radius: var(--platform-radius-sm);
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-schedule-resource-filter-option:hover {
  background: var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-schedule-resource-filter-option.is-resource {
  padding-left: 18px;
}

.workspace-constructor-sequence .construction-schedule-resource-filter-option input {
  width: 13px;
  height: 13px;
  accent-color: var(--platform-accent);
}

.workspace-constructor-sequence .construction-schedule-zoom-button:hover,
.workspace-constructor-sequence .construction-schedule-zoom-button.is-active,
.workspace-constructor-sequence .construction-schedule-rule-toggle.is-active {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-schedule-rule-toggle,
.workspace-constructor-sequence .construction-schedule-detail-toggle {
  border-color: var(--platform-border);
  background: var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-schedule-main {
  position: relative;
  height: clamp(420px, 58vh, 680px);
  max-height: none;
  min-height: 0;
  overflow: auto;
  padding-bottom: 8px;
  overscroll-behavior: contain;
  scrollbar-color: var(--platform-control-bg) var(--platform-page-bg);
}

.workspace-constructor-sequence .construction-schedule-layout {
  min-height: 0;
  overflow: visible;
}

.workspace-constructor-sequence .construction-schedule-board {
  min-width: calc(var(--construction-schedule-left-column-width, 340px) + var(--construction-schedule-grid-width, 126px));
  overflow: visible;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  isolation: isolate;
}

.workspace-constructor-sequence .construction-schedule-axis {
  position: sticky;
  top: 0;
  z-index: 58;
}

.workspace-constructor-sequence .construction-schedule-house-axis,
.workspace-constructor-sequence .construction-schedule-house-cell {
  position: sticky;
  left: 0;
  z-index: 18;
  background: var(--platform-card-bg);
  color: var(--platform-text);
  box-shadow: 1px 0 0 var(--platform-divider), 10px 0 14px rgba(0, 0, 0, 0.1);
}

.workspace-constructor-sequence .construction-schedule-house-axis {
  z-index: 60;
}

.workspace-constructor-sequence .construction-schedule-house-axis {
  border: 0;
  border-right: 1px solid var(--platform-divider);
  border-bottom: 1px solid var(--platform-divider);
  border-radius: 0;
  padding: 4px 8px;
  color: var(--platform-text);
  font-size: 10px;
  font-weight: var(--platform-type-weight);
  letter-spacing: 0;
  text-transform: none;
}

.workspace-constructor-sequence .construction-schedule-left-resize::after {
  background: var(--platform-divider);
}

.workspace-constructor-sequence .construction-schedule-left-resize:hover::after,
.workspace-constructor-sequence .construction-schedule-left-resize:focus-visible::after {
  background: var(--platform-accent);
}

.workspace-constructor-sequence .construction-schedule-day-axis {
  border: 0;
  border-bottom: 1px solid var(--platform-divider);
  border-radius: 0;
  background: var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-schedule-day-cell {
  display: grid;
  align-content: center;
  gap: 1px;
  min-height: 26px;
  padding: 3px 6px;
  border-left: 1px solid var(--platform-divider);
  background: var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-schedule-day-main {
  justify-content: center;
  gap: 3px;
}

.workspace-constructor-sequence .construction-schedule-day-cell strong,
.workspace-constructor-sequence .construction-schedule-day-cell span,
.workspace-constructor-sequence .construction-schedule-day-cell small {
  color: var(--platform-text);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-schedule-day-cell strong {
  font-size: 10px;
  line-height: 1.05;
}

.workspace-constructor-sequence .construction-schedule-day-cell span,
.workspace-constructor-sequence .construction-schedule-day-cell small {
  color: var(--platform-muted);
  font-size: 8.5px;
  line-height: 1;
  text-align: center;
}

.workspace-constructor-sequence .construction-schedule-day-cell.is-optional-weekend {
  border-left-color: var(--platform-divider);
  background: color-mix(in srgb, var(--platform-card-bg) 88%, var(--platform-control-bg) 12%);
}

.workspace-constructor-sequence .construction-schedule-day-cell.is-sunday,
.workspace-constructor-sequence .construction-schedule-day-cell.is-blocked-day,
.workspace-constructor-sequence .construction-schedule-day-cell.is-holiday {
  border-left-color: var(--platform-divider);
  background: color-mix(in srgb, var(--platform-card-bg) 78%, var(--platform-page-bg) 22%);
}

.workspace-constructor-sequence .construction-schedule-board.is-avoiding-saturdays .construction-schedule-day-cell.is-optional-weekend {
  border-left-color: var(--platform-divider);
  background: color-mix(in srgb, var(--platform-card-bg) 82%, var(--platform-page-bg) 18%);
}

.workspace-constructor-sequence .construction-schedule-row {
  --construction-row-bg: var(--platform-card-bg);
  --construction-row-track-bg: color-mix(in srgb, var(--platform-card-bg) 78%, var(--platform-control-bg) 22%);
  --construction-row-saturday-bg: color-mix(in srgb, var(--platform-card-bg) 84%, var(--platform-control-bg) 16%);
  --construction-row-sunday-bg: color-mix(in srgb, var(--platform-card-bg) 72%, var(--platform-page-bg) 28%);
  position: relative;
  min-height: calc((var(--construction-row-lanes, 1) * var(--construction-row-lane-height, 24px)) + 4px);
  border: 0;
  border-bottom: 1px solid var(--platform-divider);
  background: var(--construction-row-bg);
}

.workspace-constructor-sequence .construction-schedule-axis,
.workspace-constructor-sequence .construction-schedule-row {
  grid-template-columns: var(--construction-schedule-left-column-width, 340px) minmax(0, 1fr);
}

.workspace-constructor-sequence .construction-schedule-phase-row {
  min-height: 28px;
}

.workspace-constructor-sequence .construction-schedule-component-row {
  min-height: 22px;
}

.workspace-constructor-sequence .construction-schedule-row.is-alt {
  --construction-row-bg: color-mix(in srgb, var(--platform-card-bg) 90%, var(--platform-control-bg) 10%);
  --construction-row-track-bg: color-mix(in srgb, var(--platform-card-bg) 72%, var(--platform-control-bg) 28%);
  --construction-row-saturday-bg: color-mix(in srgb, var(--platform-card-bg) 78%, var(--platform-control-bg) 22%);
  --construction-row-sunday-bg: color-mix(in srgb, var(--platform-card-bg) 66%, var(--platform-page-bg) 34%);
}

.workspace-constructor-sequence .construction-schedule-row.is-custom-task-row {
  --construction-row-bg: color-mix(in srgb, var(--platform-card-bg) 86%, var(--platform-control-bg) 14%);
  --construction-row-track-bg: color-mix(in srgb, var(--platform-card-bg) 68%, var(--platform-control-bg) 32%);
}

.workspace-constructor-sequence .construction-schedule-row[style*="--construction-house-fill"] {
  --construction-row-bg: color-mix(in srgb, var(--platform-card-bg) 82%, var(--construction-house-fill) 18%);
  --construction-row-track-bg: color-mix(in srgb, var(--platform-card-bg) 70%, var(--construction-house-fill) 30%);
}

.workspace-constructor-sequence .construction-schedule-board.is-avoiding-saturdays .construction-schedule-row {
  --construction-row-saturday-bg: color-mix(in srgb, var(--platform-card-bg) 76%, var(--platform-page-bg) 24%);
}

.workspace-constructor-sequence .construction-schedule-board.is-avoiding-saturdays .construction-schedule-row.is-alt {
  --construction-row-saturday-bg: color-mix(in srgb, var(--platform-card-bg) 70%, var(--platform-page-bg) 30%);
}

.workspace-constructor-sequence .construction-schedule-house-group-row {
  background: color-mix(in srgb, var(--platform-card-bg) 88%, var(--platform-control-bg) 12%);
}

.workspace-constructor-sequence .construction-schedule-house-group-row[style*="--construction-house-fill"] {
  border-bottom-color: var(--construction-house-stroke);
  background: color-mix(in srgb, var(--platform-card-bg) 74%, var(--construction-house-fill) 26%);
}

.workspace-constructor-sequence .construction-schedule-row.is-house-selected .construction-schedule-house-cell {
  border-right-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-schedule-row.is-house-selected {
  --construction-row-bg: color-mix(in srgb, var(--platform-card-bg) 68%, var(--platform-accent) 32%);
  --construction-row-track-bg: color-mix(in srgb, var(--platform-card-bg) 70%, var(--platform-accent) 30%);
  --construction-row-saturday-bg: color-mix(in srgb, var(--platform-card-bg) 74%, var(--platform-accent) 22%, var(--platform-page-bg) 4%);
  --construction-row-sunday-bg: color-mix(in srgb, var(--platform-card-bg) 66%, var(--platform-accent) 20%, var(--platform-page-bg) 14%);
  border-bottom-color: color-mix(in srgb, var(--platform-selected-border) 58%, var(--platform-divider) 42%);
  background: var(--construction-row-bg);
}

.workspace-constructor-sequence .construction-schedule-row.is-house-selected .construction-schedule-house-cell,
.workspace-constructor-sequence .construction-schedule-row.is-house-selected .construction-schedule-phase-cell {
  border-right-color: var(--platform-selected-border);
  background: var(--construction-row-bg);
}

.workspace-constructor-sequence .construction-schedule-row.is-house-selected .construction-schedule-track {
  background: var(--construction-row-track-bg);
}

.workspace-constructor-sequence .construction-schedule-row.is-house-selected .construction-packed-task-bar {
  border-color: var(--platform-selected-border);
  background: color-mix(in srgb, var(--platform-control-bg) 62%, var(--platform-accent) 38%);
}

.workspace-constructor-sequence .construction-schedule-house-cell {
  gap: 3px;
  padding: 4px 8px;
  border-right: 1px solid var(--platform-divider);
  background: var(--construction-row-bg);
}

.workspace-constructor-sequence .construction-schedule-house-group-row .construction-schedule-house-cell {
  background: color-mix(in srgb, var(--platform-card-bg) 88%, var(--platform-control-bg) 12%);
}

.workspace-constructor-sequence .construction-schedule-house-group-row.is-expanded .construction-schedule-house-cell,
.workspace-constructor-sequence .construction-schedule-phase-row.is-expanded-group .construction-schedule-phase-cell {
  background: color-mix(in srgb, var(--construction-row-bg) 82%, var(--platform-control-bg) 18%);
}

.workspace-constructor-sequence :where([data-construction-custom-task-title], [data-construction-custom-task-duration]) {
  cursor: text;
}

.workspace-constructor-sequence .construction-schedule-phase-cell {
  padding: 3px 8px;
}

.workspace-constructor-sequence .construction-schedule-phase-group-cell {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
}

.workspace-constructor-sequence .construction-schedule-phase-row.is-nested-row .construction-schedule-phase-cell {
  position: sticky;
  left: 0;
  z-index: 18;
  padding-left: calc(52px + var(--construction-row-indent, 0px));
}

.workspace-constructor-sequence .construction-schedule-phase-row.is-nested-row .construction-schedule-phase-cell::before {
  content: "";
  position: absolute;
  left: calc(32px + var(--construction-row-indent, 0px));
  top: 50%;
  width: 10px;
  border-top: 1px solid color-mix(in srgb, var(--platform-divider) 82%, var(--platform-text) 18%);
  transform: translateY(-50%);
}

.workspace-constructor-sequence .construction-schedule-house-group-cell {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
}

.workspace-constructor-sequence .construction-schedule-house-toggle,
.workspace-constructor-sequence .construction-schedule-phase-toggle {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  padding: 0;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-size: 10px;
  font-weight: var(--platform-type-weight);
  line-height: 1;
}

.workspace-constructor-sequence .construction-schedule-phase-toggle {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-schedule-house-toggle[aria-expanded="true"],
.workspace-constructor-sequence .construction-schedule-phase-toggle[aria-expanded="true"] {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-cell {
  position: sticky;
  left: 0;
  z-index: 18;
  padding-top: 1px;
  padding-bottom: 1px;
  padding-left: 34px;
}

.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-cell::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 50%;
  width: 10px;
  border-top: 1px solid color-mix(in srgb, var(--platform-divider) 82%, var(--platform-text) 18%);
  transform: translateY(-50%);
}

.workspace-constructor-sequence .construction-schedule-component-row.is-nested-row .construction-schedule-phase-cell {
  padding-left: calc(52px + var(--construction-row-indent, 22px));
}

.workspace-constructor-sequence .construction-schedule-component-row.is-nested-row .construction-schedule-phase-cell::before {
  left: calc(32px + var(--construction-row-indent, 22px));
}

.workspace-constructor-sequence .construction-schedule-phase-row.is-sub-phase-row .construction-schedule-phase-cell {
  background: color-mix(in srgb, var(--construction-row-bg) 88%, var(--platform-control-bg) 12%);
}

.workspace-constructor-sequence .construction-schedule-row.is-house-selected .construction-schedule-phase-cell,
.workspace-constructor-sequence .construction-schedule-row.is-house-selected.is-expanded-group .construction-schedule-phase-cell,
.workspace-constructor-sequence .construction-schedule-row.is-house-selected.is-sub-phase-row .construction-schedule-phase-cell {
  background: var(--construction-row-bg);
}

.workspace-constructor-sequence .construction-schedule-phase-row.is-expanded-group .construction-schedule-phase-cell {
  border-right-color: var(--platform-selected-border);
}

.workspace-constructor-sequence .construction-schedule-phase-cell[draggable="true"],
.workspace-constructor-sequence .construction-schedule-house-cell[draggable="true"] {
  cursor: grab;
}

.workspace-constructor-sequence .construction-schedule-phase-cell.is-row-reorder-source,
.workspace-constructor-sequence .construction-schedule-row.is-row-reorder-source {
  opacity: 0.58;
}

.workspace-constructor-sequence .construction-schedule-phase-cell.is-row-reorder-target {
  border-right-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
}

.workspace-constructor-sequence .construction-schedule-row.is-row-insert-before::before,
.workspace-constructor-sequence .construction-schedule-row.is-row-insert-after::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: 28;
  height: 3px;
  background: var(--platform-selected-border);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--platform-accent) 24%, transparent);
  pointer-events: none;
}

.workspace-constructor-sequence .construction-schedule-row.is-row-insert-before::before {
  top: -2px;
}

.workspace-constructor-sequence .construction-schedule-row.is-row-insert-after::after {
  bottom: -2px;
}

.workspace-constructor-sequence .construction-schedule-row.is-row-insert-before .construction-schedule-phase-cell,
.workspace-constructor-sequence .construction-schedule-row.is-row-insert-after .construction-schedule-phase-cell,
.workspace-constructor-sequence .construction-schedule-row.is-row-insert-before .construction-schedule-house-cell,
.workspace-constructor-sequence .construction-schedule-row.is-row-insert-after .construction-schedule-house-cell {
  background: color-mix(in srgb, var(--platform-card-bg) 78%, var(--platform-accent) 22%);
}

.workspace-constructor-sequence .construction-schedule-phase-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 10px;
  width: 100%;
}

.workspace-constructor-sequence .construction-schedule-phase-title {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.workspace-constructor-sequence .construction-schedule-phase-title strong {
  min-width: 0;
}

.workspace-constructor-sequence [data-construction-component-detail-href] {
  cursor: alias;
}

.workspace-constructor-sequence .construction-schedule-phase-meta strong,
.workspace-constructor-sequence .construction-schedule-phase-meta span,
.workspace-constructor-sequence .construction-schedule-phase-meta small {
  overflow: hidden;
  color: var(--platform-text);
  font-weight: var(--platform-type-weight);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-schedule-phase-meta span,
.workspace-constructor-sequence .construction-schedule-phase-meta small {
  color: var(--platform-muted);
  font-size: 9px;
}

.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-meta {
  gap: 0 6px;
}

.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-meta strong,
.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-meta span,
.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-meta small {
  color: var(--platform-text);
  font-size: 10px;
  font-weight: var(--platform-type-weight);
  line-height: 1.05;
}

.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-meta span,
.workspace-constructor-sequence .construction-schedule-component-row .construction-schedule-phase-meta small {
  font-size: 8px;
}

.workspace-constructor-sequence .construction-schedule-house-cell strong {
  color: var(--platform-text);
  font-size: 13px;
  font-weight: var(--platform-type-weight-medium);
}

.workspace-constructor-sequence .construction-schedule-house-cell span {
  color: var(--platform-muted);
  font-size: 10px;
}

.workspace-constructor-sequence .construction-project-planner-card.has-sequence-topbar-tools > .card-body > .construction-schedule-toolbar {
  display: none;
}

.construction-project-planner-card.has-sequence-topbar-tools > .card-body > .construction-schedule-toolbar {
  display: none;
}

.workspace-constructor-sequence .construction-schedule-side-panel {
  display: none;
}

.construction-project-planner-card.has-sequence-topbar-tools .construction-schedule-side-panel {
  display: none;
}

.workspace-constructor-sequence .construction-schedule-house-actions .btn {
  min-height: 24px;
  padding: 3px 7px;
  border-radius: var(--platform-radius-sm);
  font-size: 10px;
}

.workspace-constructor-sequence .construction-schedule-track {
  gap: 4px 0;
  padding: 2px 0;
}

.workspace-constructor-sequence .construction-schedule-phase-row .construction-schedule-track {
  padding: 2px 0;
}

.workspace-constructor-sequence .construction-schedule-phase-row .construction-phase-block {
  min-height: 20px;
  padding: 2px 0;
}

.workspace-constructor-sequence .construction-schedule-track-grid-cell {
  border-left: 1px solid var(--platform-divider);
  background: var(--construction-row-track-bg);
}

.workspace-constructor-sequence .construction-schedule-track-grid-cell.is-optional-weekend {
  border-left-color: var(--platform-divider);
  background: var(--construction-row-saturday-bg);
}

.workspace-constructor-sequence .construction-schedule-track-grid-cell.is-sunday,
.workspace-constructor-sequence .construction-schedule-track-grid-cell.is-blocked-day {
  border-left-color: var(--platform-divider);
  background: var(--construction-row-sunday-bg);
}

.workspace-constructor-sequence .construction-packed-task-bar {
  --construction-packed-height: 14px;
  z-index: 2;
  align-self: center;
  justify-self: start;
  box-sizing: border-box;
  width: calc(var(--construction-block-width, 100%) - var(--construction-block-start-inset, 0px) - var(--construction-block-end-inset, 0px));
  max-width: calc(100% - var(--construction-block-offset, 0%) - var(--construction-block-start-inset, 0px) - var(--construction-block-end-inset, 0px));
  height: var(--construction-packed-height);
  margin-left: calc(var(--construction-block-start-inset, 0px) + var(--construction-block-offset, 0%));
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  box-shadow: none;
  pointer-events: auto;
  cursor: grab;
  will-change: transform;
  transition: opacity 90ms ease, filter 90ms ease;
}

.workspace-constructor-sequence .construction-packed-task-bar.is-packed-dragging {
  opacity: 0.72;
  cursor: grabbing;
  filter: brightness(1.08);
  z-index: 9;
  transition: none;
}

.workspace-constructor-sequence .construction-packed-task-bar.is-segment-start {
  border-radius: var(--platform-radius-sm) 0 0 var(--platform-radius-sm);
}

.workspace-constructor-sequence .construction-packed-task-bar.is-segment-middle {
  border-radius: 0;
}

.workspace-constructor-sequence .construction-packed-task-bar.is-segment-end {
  border-radius: 0 var(--platform-radius-sm) var(--platform-radius-sm) 0;
}

.workspace-constructor-sequence .construction-packed-task-bar span {
  display: block;
  overflow: hidden;
  padding: 0 6px;
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-size: 9px;
  font-weight: var(--platform-type-weight);
  line-height: calc(var(--construction-packed-height) - 2px);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-packed-component-bar {
  background: color-mix(in srgb, var(--platform-control-bg) 90%, var(--platform-text) 10%);
}

.workspace-constructor-sequence .construction-packed-phase-bar {
  background: color-mix(in srgb, var(--platform-control-bg) 78%, var(--platform-muted) 22%);
  border-color: color-mix(in srgb, var(--platform-border) 68%, var(--platform-text) 32%);
}

.workspace-constructor-sequence .construction-packed-house-bar {
  background: color-mix(in srgb, var(--platform-control-bg) 68%, var(--platform-muted) 32%);
  border-color: color-mix(in srgb, var(--platform-border) 58%, var(--platform-text) 42%);
}

.workspace-constructor-sequence .construction-phase-block,
.workspace-constructor-sequence .construction-day-block,
.workspace-constructor-sequence .construction-component-block,
.workspace-constructor-sequence .construction-house-span-block {
  --construction-block-inline-inset: 0px;
  --construction-block-start-inset: var(--construction-block-inline-inset);
  --construction-block-end-inset: var(--construction-block-inline-inset);
  z-index: 2;
  margin: 0;
  box-sizing: border-box;
  width: calc(var(--construction-block-width, 100%) - var(--construction-block-start-inset) - var(--construction-block-end-inset));
  max-width: calc(100% - var(--construction-block-offset, 0%) - var(--construction-block-start-inset) - var(--construction-block-end-inset));
  margin-left: calc(var(--construction-block-start-inset) + var(--construction-block-offset, 0%));
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  box-shadow: none;
  justify-self: start;
}

.workspace-constructor-sequence .construction-phase-block {
  padding: 2px 0;
}

.workspace-constructor-sequence .construction-house-span-block {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 18px;
  padding: 2px 0;
  border-color: color-mix(in srgb, var(--platform-border) 82%, var(--platform-text) 18%);
  background: color-mix(in srgb, var(--platform-control-bg) 82%, var(--platform-card-bg) 18%);
  color: var(--platform-muted);
  font-size: 9px;
  font-weight: var(--platform-type-weight);
  pointer-events: auto;
}

.workspace-constructor-sequence .construction-house-span-block.is-selected {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-phase-block::before {
  display: none;
}

.workspace-constructor-sequence .construction-house-span-block:not(.is-dragging-preview):hover,
.workspace-constructor-sequence .construction-phase-block:not(.is-dragging-preview):hover,
.workspace-constructor-sequence .construction-component-block:not(.is-dragging-preview):hover {
  border-color: var(--platform-selected-border);
  background: var(--platform-control-bg-hover);
  box-shadow: none;
  transform: none;
}

.workspace-constructor-sequence .construction-phase-block.is-custom-task,
.workspace-constructor-sequence .construction-component-block.is-custom-task {
  border-color: color-mix(in srgb, var(--platform-border) 78%, var(--platform-selected-border) 22%);
  background: color-mix(in srgb, var(--platform-control-bg) 82%, var(--platform-card-bg) 18%);
}

.workspace-constructor-sequence :where(.construction-house-span-block, .construction-phase-block, .construction-component-block).is-grouped-task:not(.is-selected):not(.is-dragging-preview) {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--platform-selected-border) 38%, transparent);
}

.workspace-constructor-sequence .construction-packed-task-bar.is-grouped-task:not(.is-selected):not(.is-packed-dragging) {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--platform-selected-border) 38%, transparent);
}

.workspace-constructor-sequence .construction-schedule-row[style*="--construction-house-fill"] :where(.construction-house-span-block, .construction-phase-block, .construction-component-block):not(.is-selected):not(.is-dragging-preview) {
  border-color: var(--construction-house-stroke);
  background: color-mix(in srgb, var(--platform-control-bg) 76%, var(--construction-house-fill) 24%);
}

.workspace-constructor-sequence .construction-house-span-block.is-marquee-preview,
.workspace-constructor-sequence .construction-phase-block.is-selected,
.workspace-constructor-sequence .construction-component-block.is-selected,
.workspace-constructor-sequence .construction-phase-block.is-marquee-preview,
.workspace-constructor-sequence .construction-component-block.is-marquee-preview {
  border-color: var(--platform-selected-border);
  outline: 0;
  background: var(--platform-selected-bg);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-phase-block.is-dragging-preview,
.workspace-constructor-sequence .construction-component-block.is-dragging-preview {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--platform-accent) 24%, transparent);
  pointer-events: none;
  transform: translate3d(var(--construction-drag-x, 0), 0, 0);
  will-change: transform;
}

.workspace-constructor-sequence .construction-phase-block.is-drag-source-hidden,
.workspace-constructor-sequence .construction-component-block.is-drag-source-hidden {
  opacity: 0;
}

.workspace-constructor-sequence .construction-phase-block.is-drag-ghost,
.workspace-constructor-sequence .construction-component-block.is-drag-ghost {
  z-index: 9;
}

.workspace-constructor-sequence .construction-phase-block.is-bridged-start,
.workspace-constructor-sequence .construction-component-block.is-bridged-start {
  --construction-block-end-inset: 0px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.workspace-constructor-sequence .construction-phase-block.is-bridged-middle,
.workspace-constructor-sequence .construction-component-block.is-bridged-middle {
  --construction-block-start-inset: 0px;
  --construction-block-end-inset: 0px;
  border-radius: 0;
}

.workspace-constructor-sequence .construction-phase-block.is-bridged-end,
.workspace-constructor-sequence .construction-component-block.is-bridged-end {
  --construction-block-start-inset: 0px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.workspace-constructor-sequence .construction-phase-block.is-dragging-preview::after,
.workspace-constructor-sequence .construction-component-block.is-dragging-preview::after {
  border-color: var(--platform-selected-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-phase-block.is-dependency-source,
.workspace-constructor-sequence .construction-phase-block.is-dependency-target,
.workspace-constructor-sequence .construction-component-block.is-dependency-source,
.workspace-constructor-sequence .construction-component-block.is-dependency-target {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-phase-block.has-sequence-warning,
.workspace-constructor-sequence .construction-component-block.has-sequence-warning {
  border-color: color-mix(in srgb, #D6A300 72%, var(--platform-border));
  background: var(--platform-control-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-sequence-warning-icon {
  border-right-width: 4px;
  border-bottom-width: 8px;
  border-left-width: 4px;
  border-bottom-color: #D6A300;
  filter: var(--platform-icon-filter);
}

.workspace-constructor-sequence .construction-phase-block.is-expanded {
  min-height: 190px;
}

.workspace-constructor-sequence .construction-phase-block.has-warning,
.workspace-constructor-sequence .construction-phase-block.is-overtime,
.workspace-constructor-sequence .construction-phase-block.is-blocked-time,
.workspace-constructor-sequence .construction-component-block.has-warning,
.workspace-constructor-sequence .construction-component-block.is-overtime,
.workspace-constructor-sequence .construction-component-block.is-blocked-time {
  border-color: color-mix(in srgb, var(--platform-accent) 52%, var(--platform-border));
  background: color-mix(in srgb, var(--platform-control-bg) 86%, var(--platform-accent) 14%);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-phase-main strong,
.workspace-constructor-sequence .construction-phase-main span,
.workspace-constructor-sequence .construction-phase-main small,
.workspace-constructor-sequence .construction-card-time small,
.workspace-constructor-sequence .construction-component-block strong,
.workspace-constructor-sequence .construction-component-block span,
.workspace-constructor-sequence .construction-phase-block.is-selected .construction-phase-main strong,
.workspace-constructor-sequence .construction-phase-block.is-selected .construction-phase-main span,
.workspace-constructor-sequence .construction-phase-block.is-overtime .construction-phase-main strong,
.workspace-constructor-sequence .construction-phase-block.is-overtime .construction-phase-main span,
.workspace-constructor-sequence .construction-phase-block.is-blocked-time .construction-phase-main strong,
.workspace-constructor-sequence .construction-phase-block.is-blocked-time .construction-phase-main span {
  color: var(--platform-text);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-phase-main {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.workspace-constructor-sequence .construction-phase-main span,
.workspace-constructor-sequence .construction-phase-main small,
.workspace-constructor-sequence .construction-card-time small,
.workspace-constructor-sequence .construction-component-block span {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-phase-main span,
.workspace-constructor-sequence .construction-component-block span {
  overflow: hidden;
  font-size: 9px;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-phase-main small {
  font-size: 8px;
  line-height: 1;
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-time-facts div {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-time-facts span,
.workspace-constructor-sequence .construction-time-facts strong {
  font-family: var(--platform-font-family);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-time-facts span {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-time-facts strong {
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-component-block {
  min-height: 16px;
  padding: 1px 0;
  border-radius: var(--platform-radius-sm);
}

.workspace-constructor-sequence .construction-component-block strong {
  color: var(--platform-text);
  font-size: 9px;
  font-weight: var(--platform-type-weight);
  line-height: 1;
}

.workspace-constructor-sequence .construction-dependency-handle {
  position: absolute;
  top: 50%;
  right: -5px;
  z-index: -1;
  width: 10px;
  height: 10px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: transparent;
  overflow: hidden;
  text-indent: -999px;
  transform: translateY(-50%);
}

.workspace-constructor-sequence .construction-dependency-handle::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  margin: 0;
  border-radius: 999px;
  background: var(--platform-text);
  opacity: 0.72;
}

.workspace-constructor-sequence .construction-dependency-handle:hover::before,
.workspace-constructor-sequence .construction-dependency-handle:focus-visible::before {
  background: var(--platform-accent);
  opacity: 1;
}

.workspace-constructor-sequence .construction-schedule-dependency-path {
  stroke: color-mix(in srgb, var(--platform-divider) 54%, var(--platform-control-bg) 46%);
  stroke-width: 0.75;
  stroke-opacity: 0.9;
  filter: none;
}

.workspace-constructor-sequence .construction-schedule-dependency-path.is-selected,
.workspace-constructor-sequence .construction-schedule-dependency-hitbox:focus + .construction-schedule-dependency-path {
  stroke: var(--platform-accent);
  stroke-width: 1.15;
  stroke-opacity: 0.95;
  filter: none;
}

.workspace-constructor-sequence .construction-schedule-dependency-marker {
  fill: context-stroke;
}

.workspace-constructor-sequence .construction-schedule-dependency-path.is-selected + .construction-schedule-dependency-marker {
  fill: var(--platform-accent);
}

.workspace-constructor-sequence .construction-schedule-block-inspector,
.workspace-constructor-sequence .construction-schedule-side-panel section,
.workspace-constructor-sequence .construction-block-inspector-panel,
.workspace-constructor-sequence .construction-block-component-group,
.workspace-constructor-sequence .construction-block-phase-row,
.workspace-constructor-sequence .construction-block-component-row,
.workspace-constructor-sequence .construction-block-resource-row,
.workspace-constructor-sequence .construction-schedule-warning,
.workspace-constructor-sequence .construction-schedule-resource,
.workspace-constructor-sequence .construction-schedule-dependency,
.workspace-constructor-sequence .construction-inline-detail,
.workspace-constructor-sequence .construction-inline-phase-row,
.workspace-constructor-sequence .construction-inline-component-row {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-schedule-block-inspector,
.workspace-constructor-sequence .construction-schedule-side-panel section {
  background: var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-block-inspector-panel,
.workspace-constructor-sequence .construction-schedule-warning,
.workspace-constructor-sequence .construction-schedule-resource,
.workspace-constructor-sequence .construction-schedule-dependency,
.workspace-constructor-sequence .construction-inline-detail {
  background: var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-block-inspector-head h4,
.workspace-constructor-sequence .construction-schedule-side-panel h4 {
  color: var(--platform-text);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
  letter-spacing: 0;
  text-transform: none;
}

.workspace-constructor-sequence .construction-block-inspector-head strong,
.workspace-constructor-sequence .construction-block-phase-row strong,
.workspace-constructor-sequence .construction-block-component-row strong,
.workspace-constructor-sequence .construction-block-resource-row strong,
.workspace-constructor-sequence .construction-schedule-warning strong,
.workspace-constructor-sequence .construction-schedule-resource strong,
.workspace-constructor-sequence .construction-schedule-dependency-title {
  color: var(--platform-text);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-inspector-head span,
.workspace-constructor-sequence .construction-block-phase-row span,
.workspace-constructor-sequence .construction-block-component-row span,
.workspace-constructor-sequence .construction-block-component-row small,
.workspace-constructor-sequence .construction-block-resource-row small,
.workspace-constructor-sequence .construction-schedule-warning span,
.workspace-constructor-sequence .construction-schedule-resource span,
.workspace-constructor-sequence .construction-schedule-dependency span {
  color: var(--platform-muted);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-inline-detail {
  max-height: 136px;
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  scrollbar-color: var(--platform-card-bg) var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-phase-component-toolbar,
.workspace-constructor-sequence .construction-phase-component-toolbar label,
.workspace-constructor-sequence .construction-phase-component-toolbar strong,
.workspace-constructor-sequence .construction-component-main a,
.workspace-constructor-sequence .construction-component-main span,
.workspace-constructor-sequence .construction-component-main small,
.workspace-constructor-sequence .construction-component-duration-input,
.workspace-constructor-sequence .construction-phase-component-row strong {
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-component-main small,
.workspace-constructor-sequence .construction-component-duration-input,
.workspace-constructor-sequence .construction-phase-component-row strong {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-phase-component-toolbar strong {
  color: var(--platform-text);
  font-size: var(--platform-caption-font-size);
}

.workspace-constructor-sequence .construction-component-main small:not(.construction-component-time-range) {
  display: none;
}

.workspace-constructor-sequence .construction-component-time-range {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-component-consumable-chip span,
.workspace-constructor-sequence .construction-component-consumable-chip small,
.workspace-constructor-sequence .construction-component-consumable-editor input,
.workspace-constructor-sequence .construction-component-consumable-editor .btn {
  font-family: var(--platform-font-family);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-phase-component-row {
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-phase-component-row.is-selected,
.workspace-constructor-sequence .construction-phase-component-row.is-row-reorder-target {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
}

.workspace-constructor-sequence .construction-phase-component-row.is-row-insert-before {
  box-shadow: inset 0 2px 0 var(--platform-selected-border);
}

.workspace-constructor-sequence .construction-phase-component-row.is-row-insert-after {
  box-shadow: inset 0 -2px 0 var(--platform-selected-border);
}

.workspace-constructor-sequence .construction-component-drag-handle {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-component-duration-input input {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-size: 10px;
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-component-consumable-chip,
.workspace-constructor-sequence .construction-component-consumable-editor input,
.workspace-constructor-sequence .construction-component-consumable-editor .btn {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-component-consumable-chip small,
.workspace-constructor-sequence .construction-component-consumable-chip button,
.workspace-constructor-sequence .construction-component-consumable-editor input::placeholder {
  color: var(--platform-muted);
}

.workspace-constructor-sequence .construction-block-inspector-badges span,
.workspace-constructor-sequence .construction-block-component-row span {
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-schedule-resource.has-conflict,
.workspace-constructor-sequence .construction-schedule-dependency.has-warning,
.workspace-constructor-sequence .construction-schedule-dependency.is-selected,
.workspace-constructor-sequence .construction-block-resource-row.is-partial,
.workspace-constructor-sequence .construction-block-component-row.is-focused {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-schedule-dependency-controls select,
.workspace-constructor-sequence .construction-schedule-dependency-controls input,
.workspace-constructor-sequence .construction-duration-editor input,
.workspace-constructor-sequence .construction-block-resource-picker select {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-inspector-grid-compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
}

.workspace-constructor-sequence .construction-block-inspector-grid-compact > .construction-block-inspector-panel:first-child .construction-block-phase-list,
.workspace-constructor-sequence .construction-block-inspector-grid-compact > .construction-block-inspector-panel:nth-child(2),
.workspace-constructor-sequence .construction-block-resource-list .construction-block-resource-row:has(input[data-construction-resource-toggle]) {
  display: none;
}

.workspace-constructor-sequence .construction-duration-editor,
.workspace-constructor-sequence .construction-block-resource-picker,
.workspace-constructor-sequence .construction-block-consumable-picker {
  display: grid;
  gap: 7px;
}

.workspace-constructor-sequence .construction-duration-editor label {
  display: grid;
  gap: 5px;
}

.workspace-constructor-sequence .construction-duration-editor label span,
.workspace-constructor-sequence .construction-duration-summary span {
  color: var(--platform-muted);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-duration-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.workspace-constructor-sequence .construction-duration-summary strong {
  color: var(--platform-text);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-duration-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.workspace-constructor-sequence .construction-duration-actions .btn {
  min-height: 24px;
  padding: 4px 8px;
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-resource-picker {
  grid-template-columns: minmax(0, 1fr) auto;
}

.workspace-constructor-sequence .construction-block-resource-picker .btn,
.workspace-constructor-sequence .construction-block-resource-row .btn,
.workspace-constructor-sequence .construction-block-resource-assignment-row .btn,
.workspace-constructor-sequence .construction-block-consumable-row .btn,
.workspace-constructor-sequence .construction-block-consumable-picker .btn {
  min-height: 30px;
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-resource-row {
  align-items: center;
  gap: 8px;
}

.workspace-constructor-sequence .construction-block-resource-assignment-row,
.workspace-constructor-sequence .construction-block-consumable-row {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-block-resource-assignment-row strong,
.workspace-constructor-sequence .construction-block-consumable-row strong {
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-resource-assignment-row span,
.workspace-constructor-sequence .construction-block-consumable-row span,
.workspace-constructor-sequence .construction-block-resource-assignment-row label span,
.workspace-constructor-sequence .construction-block-consumable-row label span {
  color: var(--platform-muted);
  font-family: var(--platform-font-family);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-resource-assignment-row input,
.workspace-constructor-sequence .construction-block-consumable-row input,
.workspace-constructor-sequence .construction-block-consumable-picker input {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-family: var(--platform-font-family);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-block-consumable-picker {
  grid-template-columns: minmax(0, 1fr) 74px 58px auto;
  gap: 6px;
}

.workspace-constructor-sequence .construction-block-resource-assignment-row .btn,
.workspace-constructor-sequence .construction-block-consumable-row .btn {
  min-width: 62px;
  padding: 4px 8px;
}

.workspace-constructor-sequence .construction-sequence-planning-links {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 14px 14px;
  padding: 10px 12px;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-resource-demand-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 14px 10px;
}

.workspace-constructor-sequence .construction-resource-demand-summary section {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
}

.workspace-constructor-sequence .construction-resource-demand-summary h4 {
  margin: 0;
  color: var(--platform-text);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-resource-demand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 5px 7px;
  border: 1px solid var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-resource-demand-row strong {
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-resource-usage-panel {
  position: relative;
  bottom: auto;
  z-index: 1;
  display: block;
  min-width: calc(var(--construction-schedule-left-column-width, 340px) + var(--construction-schedule-grid-width, 0px));
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 1px solid var(--platform-border);
  border-top: 0;
  border-radius: var(--platform-radius-sm);
  background: var(--platform-card-bg);
  color: var(--platform-text);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-resource-usage-head {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  min-width: calc(var(--construction-schedule-left-column-width, 340px) + var(--construction-schedule-grid-width, 0px));
}

.workspace-constructor-sequence .construction-resource-usage-head > div {
  display: grid;
  justify-items: start;
  gap: 6px;
}

.workspace-constructor-sequence .construction-resource-usage-head h4,
.workspace-constructor-sequence .construction-resource-usage-head span {
  display: block;
  margin: 0;
  color: var(--platform-text);
  font-size: var(--platform-caption-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-resource-usage-head span {
  display: none;
}

.workspace-constructor-sequence .construction-resource-usage-head select {
  width: min(260px, 34vw);
  min-height: var(--platform-control-height);
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-resource-usage-board {
  display: grid;
  gap: 0;
  min-width: calc(var(--construction-schedule-left-column-width, 340px) + var(--construction-schedule-grid-width, 0px));
}

.workspace-constructor-sequence .construction-resource-usage-row {
  display: grid;
  grid-template-columns: var(--construction-schedule-left-column-width, 340px) minmax(0, 1fr);
  min-height: 20px;
  border: 0;
  border-top: 1px solid var(--platform-divider);
  border-radius: 0;
  background: var(--platform-control-bg);
}

.workspace-constructor-sequence .construction-resource-usage-axis {
  display: none;
}

.workspace-constructor-sequence .construction-resource-usage-label {
  position: sticky;
  left: 0;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 2px 8px;
  border-right: 1px solid var(--platform-divider);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: 9px;
  font-weight: var(--platform-type-weight);
  box-shadow: 1px 0 0 var(--platform-divider), 8px 0 12px rgba(0, 0, 0, 0.08);
}

.workspace-constructor-sequence .construction-resource-usage-label strong,
.workspace-constructor-sequence .construction-resource-usage-label span {
  overflow: hidden;
  color: var(--platform-text);
  font-size: 9px;
  font-weight: var(--platform-type-weight);
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-constructor-sequence .construction-resource-usage-label span {
  color: var(--platform-muted);
  font-size: 8.5px;
  text-align: right;
}

.workspace-constructor-sequence .construction-resource-usage-track {
  display: grid;
  grid-template-columns: var(--construction-schedule-grid-template);
  min-width: var(--construction-schedule-grid-width);
  min-height: 20px;
}

.workspace-constructor-sequence .construction-resource-usage-slot {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: 100%;
  border-left: 1px solid var(--platform-divider);
  background: color-mix(in srgb, var(--platform-card-bg) 74%, var(--platform-control-bg) 26%);
}

.workspace-constructor-sequence .construction-resource-usage-slot:first-child {
  border-left: 0;
}

.workspace-constructor-sequence .construction-resource-usage-bar {
  z-index: 1;
  width: 58%;
  min-height: 2px;
  border-radius: 2px 2px 0 0;
  background: color-mix(in srgb, var(--platform-text) 24%, var(--platform-control-bg) 76%);
}

.workspace-constructor-sequence .construction-resource-usage-slot.is-overloaded .construction-resource-usage-bar,
.workspace-constructor-sequence .construction-resource-usage-row.is-overloaded .construction-resource-usage-slot.is-overloaded .construction-resource-usage-bar {
  background: color-mix(in srgb, var(--platform-accent) 58%, var(--platform-control-bg) 42%);
}

.workspace-constructor-sequence .construction-resource-capacity-line {
  position: absolute;
  left: 12%;
  right: 12%;
  z-index: 2;
  height: 1px;
  background: color-mix(in srgb, var(--platform-text) 38%, transparent);
}

.workspace-constructor-sequence .construction-resource-usage-empty {
  display: grid;
  align-items: center;
  min-height: 22px;
  padding: 3px 8px;
  color: var(--platform-muted);
  font-size: 9px;
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-sequence-planning-links strong,
.workspace-constructor-sequence .construction-sequence-planning-links span {
  display: block;
  color: var(--platform-text);
  font-size: var(--platform-body-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-sequence-planning-links span {
  color: var(--platform-muted);
  font-size: var(--platform-caption-font-size);
}

.workspace-constructor-sequence .construction-sequence-planning-links .btn {
  min-height: var(--platform-control-height);
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-sequence-topbar :where(.btn, button),
.workspace-constructor-sequence .construction-schedule-toolbar :where(.btn, button, select, .construction-schedule-zoom-button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--platform-control-height);
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-size: var(--platform-button-font-size);
  font-weight: var(--platform-type-weight);
  text-decoration: none;
  box-shadow: none;
}

.workspace-constructor-sequence .construction-sequence-topbar :where(.btn, button):hover,
.workspace-constructor-sequence .construction-schedule-toolbar :where(.btn, button, select, .construction-schedule-zoom-button):hover {
  border-color: var(--platform-selected-border);
  background: var(--platform-control-bg-hover);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-sequence-topbar :where(.btn.primary, button.primary),
.workspace-constructor-sequence .construction-schedule-toolbar :where(.btn.primary, button.primary),
.workspace-constructor-sequence .construction-schedule-toolbar .construction-schedule-zoom-button.is-active,
.workspace-constructor-sequence .construction-schedule-toolbar .construction-schedule-rule-toggle.is-active {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-sequence-warning-button span {
  min-width: 20px;
  height: 20px;
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-text);
  font-weight: var(--platform-type-weight);
}

.workspace-constructor-sequence .construction-sequence-warning-button.has-warning span {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
}

.workspace-constructor-sequence .construction-sequence-icon-button {
  width: var(--platform-control-height);
  min-width: var(--platform-control-height);
  padding: 4px;
}

.workspace-constructor-sequence .construction-sequence-save-button {
  gap: 0;
  padding: 4px;
}

.workspace-constructor-sequence .construction-sequence-icon-button .platform-action-icon {
  width: 20px;
  height: 20px;
}

.workspace-constructor-sequence .construction-schedule-weather-badge,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-sunny,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-cloudy,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-rain,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-unavailable {
  max-width: 48px;
  gap: 3px;
  padding: 1px 4px;
  border-color: var(--platform-border);
  border-radius: var(--platform-radius-sm);
  background: var(--platform-control-bg);
  color: var(--platform-muted);
  font-size: 8px;
  font-weight: var(--platform-type-weight);
  line-height: 1;
}

.workspace-constructor-sequence .construction-schedule-weather-badge::before,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-sunny::before,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-cloudy::before,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-rain::before,
.workspace-constructor-sequence .construction-schedule-weather-badge.is-unavailable::before {
  width: 5px;
  height: 5px;
  background: var(--platform-muted);
  box-shadow: none;
}

.workspace-constructor-sequence .construction-schedule-day-resize {
  top: 0;
  right: -2px;
  bottom: 0;
  width: 4px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.workspace-constructor-sequence .construction-schedule-day-resize::after {
  top: 6px;
  right: 1px;
  bottom: 6px;
  width: 1px;
  border-radius: 0;
  background: var(--platform-divider);
  opacity: 0.45;
}

.workspace-constructor-sequence .construction-schedule-day-cell:hover .construction-schedule-day-resize::after,
.workspace-constructor-sequence .construction-schedule-day-resize:hover::after {
  background: var(--platform-selected-border);
  opacity: 1;
}

.workspace-constructor-sequence .construction-schedule-side-panel {
  display: none;
}

.workspace-output-layout .processing-toolbar #saveProjectOutputsBtn,
.workspace-output-layout .processing-toolbar #saveUserProcessingDefaultBtn {
  border-color: var(--platform-selected-border);
  background: var(--platform-selected-bg);
  color: var(--platform-text);
}

.workspace-output-layout .processing-preset-bar,
.workspace-output-layout .processing-selector-shell,
.workspace-output-layout .processing-selector-group,
.workspace-output-layout .output-layout-row,
.workspace-output-layout #titleBlockEditor .info-row {
  border-color: var(--platform-border);
  border-radius: var(--platform-radius);
  background: var(--platform-card-bg);
  color: var(--platform-text);
  box-shadow: none;
}

/* Sidebar navigation items sit on the sidebar surface; orange tint is reserved for emphasis. */
.workspace .sidebar .project-item,
.workspace .admin-sidebar .project-item,
.workspace .admin-sidebar .admin-nav-item,
.workspace .account-sidebar-space-item,
.workspace .owner-sidebar .project-item,
.workspace .producer-sidebar .project-item,
.workspace .constructor-sidebar .project-item,
.workspace .marketplace-sidebar .project-item,
.workspace-output-layout .sidebar .project-item {
  border-color: var(--platform-sidebar-item-border, transparent);
  background: var(--platform-sidebar-item-bg, transparent);
  color: var(--platform-sidebar-text, var(--workspace-sidebar-text));
  box-shadow: none;
}

.workspace .sidebar .project-item-name,
.workspace .sidebar .project-item-meta,
.workspace .sidebar .project-item-meta .badge,
.workspace .admin-sidebar .project-item-name,
.workspace .admin-sidebar .project-item-meta,
.workspace .admin-sidebar .project-item-meta .badge,
.workspace .account-sidebar-space-title,
.workspace .account-sidebar-space-status,
.workspace .owner-sidebar .project-item-name,
.workspace .owner-sidebar .project-item-meta,
.workspace .producer-sidebar .project-item-name,
.workspace .constructor-sidebar .project-item-name,
.workspace .marketplace-sidebar .project-item-name,
.workspace-output-layout .sidebar .project-item-name,
.workspace-output-layout .sidebar .project-item-meta {
  color: var(--platform-sidebar-text, var(--workspace-sidebar-text));
}

.workspace .sidebar .project-item:hover,
.workspace .admin-sidebar .project-item:hover,
.workspace .admin-sidebar .admin-nav-item:hover,
.workspace .account-sidebar-space-item:hover,
.workspace .owner-sidebar .project-item:hover,
.workspace .producer-sidebar .project-item:hover,
.workspace .constructor-sidebar .project-item:hover,
.workspace .marketplace-sidebar .project-item:hover,
.workspace-output-layout .sidebar .project-item:hover {
  border-color: var(--platform-sidebar-item-border-active, var(--accent));
  background: var(--platform-sidebar-item-bg-hover, color-mix(in srgb, var(--workspace-sidebar-bg) 78%, var(--accent) 22%));
  color: var(--platform-sidebar-text, var(--workspace-sidebar-text));
}

.workspace .sidebar .project-item.active,
.workspace .sidebar .project-item[aria-current="true"],
.workspace .admin-sidebar .project-item.active,
.workspace .admin-sidebar .admin-nav-item.active,
.workspace .account-sidebar-space-item.is-active,
.workspace .account-sidebar-space-item.active,
.workspace .owner-sidebar .project-item.active,
.workspace .producer-sidebar .project-item.active,
.workspace .constructor-sidebar .project-item.active,
.workspace .marketplace-sidebar .project-item.active,
.workspace-output-layout .sidebar .project-item.active,
.workspace-output-layout .sidebar .project-item[aria-current="true"] {
  border-color: var(--platform-sidebar-item-border-active, var(--accent));
  background: var(--platform-sidebar-item-bg-active, color-mix(in srgb, var(--workspace-sidebar-bg) 68%, var(--accent) 32%));
  color: var(--platform-sidebar-text, var(--workspace-sidebar-text));
  box-shadow: none;
}

.workspace .sidebar .project-item:hover :where(.project-item-name, .project-item-meta, .badge),
.workspace .sidebar .project-item.active :where(.project-item-name, .project-item-meta, .badge),
.workspace .admin-sidebar .project-item:hover :where(.project-item-name, .project-item-meta, .badge),
.workspace .admin-sidebar .project-item.active :where(.project-item-name, .project-item-meta, .badge),
.workspace .producer-sidebar .project-item:hover :where(.project-item-name, .project-item-meta, .badge),
.workspace .producer-sidebar .project-item.active :where(.project-item-name, .project-item-meta, .badge),
.workspace .constructor-sidebar .project-item:hover :where(.project-item-name, .project-item-meta, .badge),
.workspace .constructor-sidebar .project-item.active :where(.project-item-name, .project-item-meta, .badge),
.workspace-output-layout .sidebar .project-item:hover :where(.project-item-name, .project-item-meta, .badge),
.workspace-output-layout .sidebar .project-item.active :where(.project-item-name, .project-item-meta, .badge) {
  color: var(--platform-sidebar-text, var(--workspace-sidebar-text));
}
.personal-component-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(320px, 1.1fr);
  gap: 16px;
  align-items: start;
}

.personal-component-form,
.personal-component-card {
  border: 1px solid var(--border-subtle, #d7dde8);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface, #fff);
}

.personal-component-list {
  display: grid;
  gap: 12px;
}

.personal-component-card-head,
.personal-component-asset-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.personal-component-card-head {
  margin-bottom: 10px;
}

.personal-component-asset-list {
  display: grid;
  gap: 8px;
  margin: 10px 0;
}

.personal-component-asset-row {
  padding: 8px 0;
  border-top: 1px solid var(--border-subtle, #d7dde8);
}

.personal-component-validation {
  display: grid;
  gap: 6px;
  margin: 10px 0;
}

@media (max-width: 860px) {
  .personal-component-layout {
    grid-template-columns: 1fr;
  }

  .personal-component-card-head,
  .personal-component-asset-row {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Contextual help mode for the main platform interface */
.context-help-toggle {
  width: 26px;
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: #7b807d;
  font-family: var(--font-ui);
  font-size: var(--type-caption-size);
  font-weight: var(--type-control-weight);
  cursor: pointer;
}

.context-help-toggle:hover,
.context-help-toggle.is-active {
  background: rgba(82, 87, 84, 0.05);
  color: #747a76;
}

.context-help-toggle:focus,
.context-help-toggle:focus-visible {
  outline: none;
  box-shadow: none;
}

.context-help-toggle-icon {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  background: transparent;
  color: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
}

.context-help-banner-icon {
  width: 17px;
  height: 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 17px;
  border-radius: 50%;
  background: #555a57;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

body.context-help-active .app-root :is(
  [data-help-key],
  button,
  a[href],
  summary,
  select,
  [role="button"],
  [role="combobox"],
  input[type="button"],
  input[type="submit"],
  input[type="reset"]
) {
  cursor: help !important;
}

body.context-help-active [data-context-help-ui],
body.context-help-active [data-context-help-ui] * {
  cursor: pointer !important;
}

.context-help-target-hover {
  outline: 3px solid var(--brand-orange) !important;
  outline-offset: 3px !important;
  border-radius: var(--radius, 6px) !important;
  box-shadow: 0 0 0 5px rgba(242, 138, 46, 0.2) !important;
}

.context-help-banner {
  position: fixed;
  top: calc(var(--topbar-h) + 10px);
  left: 50%;
  z-index: 2190;
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: min(620px, calc(100vw - 24px));
  padding: 9px 13px;
  border: 1px solid color-mix(in srgb, var(--brand-orange) 55%, var(--border));
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 8px 24px rgba(17, 24, 22, 0.16);
  color: var(--text);
  font-size: var(--type-body-small-size);
  line-height: 1.35;
  pointer-events: none;
  transform: translateX(-50%);
}

.context-help-banner[hidden],
.context-help-panel[hidden] {
  display: none;
}

.context-help-panel {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2200;
  width: min(460px, calc(100vw - 24px));
  max-height: min(78vh, 760px);
  overflow: auto;
  border: 1px solid #a8aca9;
  border-radius: var(--radius-lg);
  background: #cfd1cf;
  box-shadow: 0 18px 48px rgba(17, 24, 22, 0.22);
  color: var(--text);
  font-family: var(--font-ui);
}

.context-help-panel-head {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px 8px 14px;
  border-bottom: 1px solid #a8aca9;
  background: #5f6461;
  color: var(--color-on-charcoal);
  font-size: var(--type-control-size);
  font-weight: 600;
}

.context-help-panel-close {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: inherit;
  font-size: 22px;
  line-height: 1;
}

.context-help-panel-close:hover {
  background: rgba(255, 255, 255, 0.12);
}

.context-help-panel-body {
  display: grid;
  gap: 12px;
  padding: 16px;
  background: #cfd1cf;
}

.context-help-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.context-help-panel-body p {
  margin: 0;
}

.context-help-preview {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 10px;
  overflow: hidden;
  border: 1px solid #aeb2af;
  border-radius: var(--radius);
  background: #bfc2bf;
}

.context-help-preview[hidden] {
  display: none;
}

.context-help-preview-snapshot {
  max-width: 100% !important;
  margin: 0 !important;
  pointer-events: none !important;
  cursor: default !important;
}

.context-help-preview :is(button, a, summary, select, [role="button"], [role="combobox"], [data-help-key]) {
  max-width: 100%;
  pointer-events: none !important;
  cursor: default !important;
}

.context-help-preview .project-site-house-card,
.context-help-preview .defaults-action,
.context-help-preview .project-item,
.context-help-preview .stat-block,
.context-help-preview .workspace-panel {
  width: 100%;
}

.context-help-description,
.context-help-detail p {
  color: #3f4541;
  font-size: var(--type-body-small-size);
  line-height: 1.5;
}

.context-help-detail {
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  border: 1px solid #b4b8b5;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.24);
}

.context-help-detail[hidden] {
  display: none;
}

.context-help-detail strong {
  color: #343735;
  font-size: var(--type-caption-size);
  font-weight: 600;
}

.context-help-options {
  display: grid;
  gap: 8px;
  padding-top: 2px;
}

.context-help-options[hidden] {
  display: none;
}

.context-help-options > strong {
  color: #343735;
  font-size: var(--type-caption-size);
  font-weight: 600;
}

.context-help-options-list {
  display: grid;
  gap: 7px;
}

.context-help-option {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid #b7bbb8;
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.2);
}

.context-help-option.is-selected {
  border-color: #8f9591;
  background: rgba(255, 255, 255, 0.38);
}

.context-help-option.is-disabled {
  opacity: 0.62;
}

.context-help-option-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.context-help-option-head strong {
  color: #343735;
  font-size: var(--type-body-small-size);
  font-weight: 600;
}

.context-help-option-state {
  flex: 0 0 auto;
  padding: 2px 5px;
  border-radius: 999px;
  background: #aeb2af;
  color: #343735;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
}

.context-help-option p {
  margin: 0;
  color: #4c524e;
  font-size: var(--type-caption-size);
  line-height: 1.4;
}

@media (max-width: 600px) {
  .context-help-toggle {
    width: 26px;
    justify-content: center;
    padding: 0;
  }

  .context-help-banner {
    top: 84px;
  }

  .context-help-panel {
    right: 12px;
    bottom: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .context-help-target-hover {
    transition: none;
  }
}
/* Unified technical library and lifecycle passport */
.admin-library-system {
  grid-column: 1 / -1;
  display: grid;
  gap: 18px;
  overflow: hidden;
}

.admin-library-actions,
.admin-library-selection,
.admin-library-kpis,
.admin-library-hierarchy {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-library-hierarchy {
  display: grid;
  grid-template-columns: repeat(8, minmax(105px, 1fr));
  padding: 12px;
  border: 1px solid var(--border, #d9dee8);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface, #fff) 88%, #eef4ff);
}

.admin-library-node {
  position: relative;
  min-height: 70px;
  padding: 10px 12px;
  border: 1px solid var(--border, #d9dee8);
  border-radius: 12px;
  background: var(--surface, #fff);
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.admin-library-node span,
.admin-library-node strong {
  display: block;
}

.admin-library-node span {
  color: var(--muted, #697386);
  font-size: 0.72rem;
  line-height: 1.2;
}

.admin-library-node strong {
  margin-top: 6px;
  font-size: 1.15rem;
}

.admin-library-node i {
  position: absolute;
  right: -10px;
  top: 25px;
  z-index: 2;
  color: var(--muted, #697386);
  font-style: normal;
}

.admin-library-node.is-selected {
  border-color: #3867d6;
  box-shadow: 0 0 0 2px rgba(56, 103, 214, 0.13);
}

.admin-library-node.is-instance {
  cursor: default;
  background: #f5f0ff;
}

.admin-library-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.admin-library-kpis > div {
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--surface-subtle, #f6f8fb);
}

.admin-library-kpis strong,
.admin-library-kpis span {
  display: block;
}

.admin-library-kpis strong {
  font-size: 1.15rem;
}

.admin-library-kpis span {
  margin-top: 3px;
  color: var(--muted, #697386);
  font-size: 0.76rem;
}

.admin-library-selection {
  align-items: end;
}

.admin-library-selection .field {
  min-width: 180px;
  margin: 0;
}

.admin-library-selection .admin-library-entity-field {
  flex: 1 1 360px;
}

.admin-library-entity-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.admin-library-entity-search .btn {
  min-height: 38px;
}

.admin-library-passport-grid,
.admin-library-editor-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(300px, 0.8fr);
  gap: 14px;
}

.admin-library-passport-card,
.admin-library-impact-card,
.admin-library-form {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--border, #d9dee8);
  border-radius: 14px;
  background: var(--surface, #fff);
}

.admin-library-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.admin-library-card-head span {
  color: var(--muted, #697386);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.admin-library-fact-status {
  display: inline-flex;
  margin-top: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 700;
}

.admin-library-fact-status.is-seed {
  color: #7a4800;
  background: #fff0c7;
}

.admin-library-card-head h3 {
  margin: 3px 0 0;
}

.admin-library-domain-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 14px 0;
}

.admin-library-domain-list > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border-radius: 999px;
  background: #eef3ff;
  color: #304a83;
  font-size: 0.73rem;
}

.admin-library-missing {
  padding: 10px 12px;
  border-left: 3px solid #e0a423;
  border-radius: 8px;
  background: #fff8e7;
}

.admin-library-missing p {
  margin: 4px 0 0;
  color: #785d21;
  font-size: 0.77rem;
}

.admin-library-record-list {
  display: grid;
  gap: 1px;
  max-height: 360px;
  margin-top: 12px;
  overflow: auto;
  border: 1px solid var(--border, #d9dee8);
  border-radius: 10px;
}

.admin-library-record {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  background: var(--surface, #fff);
  border-bottom: 1px solid var(--border, #d9dee8);
}

.admin-library-record:last-child {
  border-bottom: 0;
}

.admin-library-record strong,
.admin-library-record span {
  display: block;
}

.admin-library-record span {
  margin-top: 2px;
  color: var(--muted, #697386);
  font-size: 0.7rem;
}

.admin-library-record b {
  max-width: 45%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.76rem;
}

.admin-library-impact-stages {
  display: grid;
  gap: 8px;
  margin: 16px 0 12px;
}

.admin-library-impact-stage {
  display: grid;
  grid-template-columns: 30px minmax(60px, 1fr) 72px;
  align-items: center;
  gap: 8px;
  font-size: 0.74rem;
}

.admin-library-impact-stage i {
  display: block;
  width: var(--impact-width, 0%);
  min-width: 0;
  height: 7px;
  border-radius: 999px;
  background: #456dd0;
}

.admin-library-impact-stage.is-module-d i {
  background: #3b9c6c;
}

.admin-library-impact-stage strong {
  text-align: right;
}

.admin-library-impact-card > p {
  color: var(--muted, #697386);
  font-size: 0.75rem;
}

.admin-library-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-library-form h3,
.admin-library-form button,
.admin-library-form .field:has(textarea) {
  grid-column: 1 / -1;
}

.admin-library-form .field {
  margin: 0;
}

.admin-library-form.is-wide {
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-library-traceability {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid var(--border, #d9dee8);
  border-radius: 14px;
  background: var(--surface, #fff);
}

.admin-library-traceability-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 12px;
}

.admin-library-traceability h4 {
  margin: 0 0 8px;
  font-size: 0.78rem;
}

.admin-library-event-list {
  display: grid;
  gap: 6px;
}

.admin-library-event-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 10px;
  padding: 8px 10px;
  border-radius: 9px;
  background: var(--surface-soft, #f6f8fb);
}

.admin-library-event-list strong,
.admin-library-event-list span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-library-event-list span {
  grid-column: 1;
  color: var(--muted, #697386);
  font-size: 0.68rem;
}

.admin-library-event-list a {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  font-size: 0.72rem;
}

@media (max-width: 1180px) {
  .admin-library-hierarchy {
    grid-template-columns: repeat(4, minmax(110px, 1fr));
  }

  .admin-library-node i {
    display: none;
  }
}

@media (max-width: 820px) {
  .admin-library-kpis,
  .admin-library-passport-grid,
  .admin-library-editor-grid,
  .admin-library-traceability-grid {
    grid-template-columns: 1fr;
  }

  .admin-library-hierarchy {
    grid-template-columns: repeat(2, minmax(110px, 1fr));
  }

  .admin-library-form {
    grid-template-columns: 1fr;
  }

  .admin-library-form .field,
  .admin-library-form h3,
  .admin-library-form button,
  .admin-library-form.is-wide {
    grid-column: 1;
  }

  .admin-library-form.is-wide {
    grid-template-columns: 1fr;
  }
}

/* ── Admin configuration: design-stage icon and interface managers ───── */
.admin-system-design-stage {
  display: grid;
  gap: 14px;
  margin-bottom: 14px;
}

.admin-system-design-stage-head,
.admin-system-design-manager-head,
.admin-system-design-location,
.admin-icon-manager-toolbar,
.admin-interface-preview-toolbar,
.admin-interface-panel-title,
.admin-system-design-stage-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.admin-system-design-stage-head {
  padding: 2px 2px 4px;
}

.admin-system-design-stage-head h2,
.admin-system-design-stage-head p,
.admin-system-design-manager-title h3,
.admin-system-design-manager-title span,
.admin-icon-manager-toolbar strong,
.admin-icon-manager-toolbar span,
.admin-interface-panel-title strong,
.admin-interface-panel-title span,
.admin-system-design-stage-note p {
  margin: 0;
}

.admin-system-design-stage-head h2 {
  margin-top: 3px;
  color: var(--admin-text, var(--text));
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 500;
  letter-spacing: -0.02em;
}

.admin-system-design-stage-head p {
  max-width: 720px;
  margin-top: 6px;
  color: var(--admin-muted, var(--text-muted));
  font-size: 12px;
  line-height: 1.5;
}

.admin-system-design-kicker,
.admin-system-design-eyebrow {
  color: var(--admin-muted, var(--text-muted));
  font-size: 9px;
  font-weight: 650;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.admin-system-design-stage-badge,
.admin-system-design-readonly {
  flex: 0 0 auto;
  border: 1px solid rgba(202, 138, 4, 0.32);
  border-radius: 999px;
  background: rgba(202, 138, 4, 0.08);
  color: #9a6700;
  font-size: 10px;
  font-weight: 600;
  padding: 6px 9px;
}

.admin-system-design-stage-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-system-design-stage-badge.is-connected {
  border-color: rgba(31, 93, 80, 0.28);
  background: rgba(31, 93, 80, 0.1);
  color: #1f5d50;
}

.admin-system-design-manager {
  overflow: hidden;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 12px;
  background: var(--admin-card-bg, var(--surface));
  box-shadow: 0 8px 26px rgba(15, 23, 42, 0.04);
}

.admin-system-design-manager-head {
  min-height: 66px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--admin-card-border, var(--border));
}

.admin-system-design-manager-title,
.admin-system-design-manager-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-system-design-manager-title > div {
  display: grid;
  gap: 2px;
}

.admin-system-design-manager-title span:not(.admin-system-design-manager-mark) {
  color: var(--admin-muted, var(--text-muted));
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.admin-system-design-manager-title h3 {
  color: var(--admin-text, var(--text));
  font-size: 14px;
  font-weight: 550;
}

.admin-system-design-manager-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 9px;
  background: rgba(31, 93, 80, 0.12);
  color: #1f5d50;
  font-size: 19px;
}

.admin-system-design-manager-mark.is-interface {
  background: rgba(50, 86, 145, 0.12);
  color: #325691;
}

.admin-system-design-manager-mark img {
  width: 18px;
  height: 18px;
  object-fit: contain;
  filter: grayscale(1) saturate(0);
}

.admin-system-design-manager-mark.is-viewer {
  background: rgba(119, 78, 154, 0.12);
  color: #774e9a;
}

.admin-system-design-manager-mark.is-viewer2d {
  background: rgba(48, 105, 137, 0.12);
  color: #306989;
}

.admin-system-design-manager-actions :is(button, select),
.admin-icon-manager-toolbar select {
  min-height: 32px;
  font-size: 11px;
}

.admin-system-design-manager :is(button, input, select):disabled {
  cursor: not-allowed;
  opacity: 0.58;
  pointer-events: none;
}

.admin-system-design-location {
  justify-content: flex-start;
  padding: 9px 14px;
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 76%, transparent);
  border-bottom: 1px solid var(--admin-card-border, var(--border));
}

.admin-system-design-location > span:first-child {
  color: var(--admin-muted, var(--text-muted));
  font-size: 10px;
}

.admin-system-design-location code {
  min-width: 0;
  overflow: hidden;
  color: var(--admin-text, var(--text));
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-system-design-readonly {
  margin-left: auto;
  padding: 3px 7px;
  font-size: 9px;
}

.admin-icon-manager-layout {
  display: grid;
  grid-template-columns: 170px minmax(360px, 1fr) 210px;
  min-height: 360px;
}

.admin-icon-manager-sidebar,
.admin-icon-inspector,
.admin-interface-token-panel,
.admin-interface-editor-panel {
  padding: 14px;
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 48%, transparent);
}

.admin-icon-manager-sidebar,
.admin-interface-token-panel {
  border-right: 1px solid var(--admin-card-border, var(--border));
}

.admin-icon-inspector,
.admin-interface-editor-panel {
  border-left: 1px solid var(--admin-card-border, var(--border));
}

.admin-icon-manager-sidebar label,
.admin-icon-inspector label {
  display: grid;
  gap: 5px;
}

.admin-icon-manager-sidebar label > span,
.admin-icon-inspector label > span {
  color: var(--admin-muted, var(--text-muted));
  font-size: 9px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.admin-icon-manager-sidebar input,
.admin-icon-inspector :is(input, select) {
  width: 100%;
  height: 32px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 7px;
  background: var(--admin-card-bg, var(--surface));
  color: var(--admin-text, var(--text));
  font: inherit;
  font-size: 11px;
  padding: 0 9px;
}

.admin-icon-manager-sidebar nav {
  display: grid;
  gap: 3px;
  margin-top: 14px;
}

.admin-icon-manager-sidebar nav > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 31px;
  padding: 0 8px;
  border-radius: 7px;
  color: var(--admin-muted, var(--text-muted));
  font-size: 10px;
}

.admin-icon-manager-sidebar nav > span.is-active {
  background: rgba(31, 93, 80, 0.1);
  color: #1f5d50;
}

.admin-icon-manager-sidebar nav b {
  font-weight: 550;
}

.admin-icon-manager-sidebar nav small {
  font-size: 9px;
}

.admin-icon-manager-canvas {
  min-width: 0;
  padding: 14px;
}

.admin-icon-manager-toolbar strong,
.admin-icon-manager-toolbar span,
.admin-interface-panel-title strong,
.admin-interface-panel-title span {
  display: block;
}

.admin-icon-manager-toolbar strong,
.admin-interface-panel-title strong {
  color: var(--admin-text, var(--text));
  font-size: 11px;
  font-weight: 550;
}

.admin-icon-manager-toolbar span,
.admin-interface-panel-title span {
  margin-top: 2px;
  color: var(--admin-muted, var(--text-muted));
  font-size: 9px;
}

.admin-icon-sample-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(72px, 1fr));
  gap: 9px;
  margin-top: 14px;
}

.admin-icon-sample {
  display: grid;
  min-width: 0;
  min-height: 126px;
  place-items: center;
  align-content: center;
  gap: 5px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 9px;
  background: var(--admin-card-bg, var(--surface));
}

.admin-icon-sample-glyph {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  color: var(--admin-text, var(--text));
  font-family: Arial, sans-serif;
  font-size: 25px;
  font-weight: 300;
}

.admin-icon-sample strong {
  max-width: 90%;
  overflow: hidden;
  color: var(--admin-text, var(--text));
  font-size: 10px;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-icon-sample small {
  color: var(--admin-muted, var(--text-muted));
  font-size: 8px;
}

.admin-icon-inspector {
  display: grid;
  align-content: start;
  gap: 11px;
}

.admin-icon-inspector-preview {
  display: grid;
  height: 96px;
  place-items: center;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 9px;
  background: var(--admin-card-bg, var(--surface));
  color: var(--admin-text, var(--text));
  font-size: 42px;
}

.admin-icon-inspector-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.admin-icon-inspector-meta span {
  padding: 3px 5px;
  border-radius: 5px;
  background: rgba(31, 93, 80, 0.09);
  color: #1f5d50;
  font-size: 8px;
}

.admin-interface-manager-layout {
  display: grid;
  grid-template-columns: 210px minmax(420px, 1fr) 205px;
  min-height: 400px;
}

.admin-interface-token-panel,
.admin-interface-editor-panel {
  display: grid;
  align-content: start;
  gap: 16px;
}

.admin-interface-section {
  display: grid;
  gap: 3px;
}

.admin-interface-section > .admin-system-design-eyebrow {
  margin-bottom: 4px;
}

.admin-interface-section label {
  display: flex;
  min-height: 30px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--admin-text, var(--text));
  font-size: 9px;
}

.admin-interface-section label > span {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
}

.admin-interface-section label i {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 5px;
  background: var(--token-color);
}

.admin-interface-section label code {
  color: var(--admin-muted, var(--text-muted));
  font-size: 8px;
}

.admin-interface-preview-stage {
  min-width: 0;
  padding: 14px;
  background: #e8ebe8;
}

.admin-interface-preview-toolbar {
  margin-bottom: 11px;
  color: #65706a;
  font-size: 9px;
}

.admin-interface-preview-toolbar > div {
  display: flex;
  gap: 4px;
}

.admin-interface-preview-toolbar > div span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #b7bfba;
}

.admin-interface-preview-window {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  min-height: 330px;
  overflow: hidden;
  border: 1px solid rgba(31, 44, 37, 0.16);
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(29, 42, 35, 0.12);
}

.admin-interface-preview-window > aside {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
  padding: 10px 0;
  background: #173e36;
}

.admin-interface-preview-logo {
  display: grid;
  width: 23px;
  height: 23px;
  place-items: center;
  margin-bottom: 6px;
  border-radius: 6px;
  background: #f3f0e8;
  color: #173e36;
  font-size: 11px;
  font-weight: 700;
}

.admin-interface-preview-window > aside i {
  width: 15px;
  height: 3px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.34);
}

.admin-interface-preview-window > aside i.is-active {
  height: 15px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.9);
}

.admin-interface-preview-window > main {
  display: grid;
  min-width: 0;
  grid-template-rows: 51px minmax(0, 1fr);
}

.admin-interface-preview-window > main > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 12px;
  border-bottom: 1px solid #dfe4df;
}

.admin-interface-preview-window > main > header div,
.admin-interface-preview-window > main > header :is(small, strong) {
  display: block;
}

.admin-interface-preview-window > main > header small {
  color: #818a84;
  font-size: 7px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-interface-preview-window > main > header strong {
  margin-top: 2px;
  color: #202522;
  font-size: 10px;
  font-weight: 600;
}

.admin-interface-preview-window > main > header button {
  min-height: 25px;
  padding: 0 9px;
  border: 0;
  border-radius: 6px;
  background: #1f5d50;
  color: #fff;
  font-size: 8px;
}

.admin-interface-preview-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 105px;
  min-width: 0;
}

.admin-interface-preview-content > section {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  background-color: #f4f5f2;
  background-image: radial-gradient(circle, rgba(74, 88, 79, 0.18) 0.7px, transparent 0.8px);
  background-size: 11px 11px;
}

.admin-interface-preview-content > section > span {
  position: absolute;
  top: 9px;
  left: 10px;
  color: #818a84;
  font-size: 7px;
  text-transform: uppercase;
}

.admin-interface-preview-object {
  position: relative;
  width: 94px;
  height: 74px;
  transform: skewY(-7deg);
  border: 1px solid #1f5d50;
  background: rgba(31, 93, 80, 0.08);
}

.admin-interface-preview-object :is(i, b, em) {
  position: absolute;
  display: block;
  border: 1px solid #1f5d50;
  background: rgba(255, 255, 255, 0.72);
}

.admin-interface-preview-object i {
  inset: 12px 40px 12px 14px;
}

.admin-interface-preview-object b {
  inset: 17px 10px 39px 60px;
}

.admin-interface-preview-object em {
  right: 11px;
  bottom: 11px;
  width: 28px;
  height: 21px;
}

.admin-interface-preview-content > aside {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 11px;
  border-left: 1px solid #dfe4df;
  background: #fff;
}

.admin-interface-preview-content > aside small {
  color: #818a84;
  font-size: 6px;
  letter-spacing: 0.09em;
}

.admin-interface-preview-content > aside label {
  display: grid;
  gap: 3px;
  color: #67716b;
  font-size: 7px;
}

.admin-interface-preview-content > aside label i {
  height: 16px;
  border: 1px solid #d9dfda;
  border-radius: 4px;
  background: #f8f9f7;
}

.admin-interface-editor-list {
  display: grid;
  gap: 5px;
}

.admin-interface-editor-list > span {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 8px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 7px;
  background: var(--admin-card-bg, var(--surface));
}

.admin-interface-editor-list i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c58b27;
}

.admin-interface-editor-list b {
  overflow: hidden;
  color: var(--admin-text, var(--text));
  font-size: 9px;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-interface-editor-list small {
  color: var(--admin-muted, var(--text-muted));
  font-size: 8px;
}

.admin-system-design-stage-note {
  justify-content: flex-start;
  padding: 10px 12px;
  border: 1px dashed var(--admin-card-border, var(--border));
  border-radius: 9px;
  color: var(--admin-muted, var(--text-muted));
}

.admin-system-design-stage-note > span {
  display: grid;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-family: serif;
  font-size: 11px;
  font-style: italic;
}

.admin-system-design-stage-note p {
  font-size: 10px;
  line-height: 1.45;
}

.admin-viewer-manager-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(100px, 0.35fr)) minmax(240px, 1fr);
  border-bottom: 1px solid var(--admin-card-border, var(--border));
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 48%, transparent);
}

.admin-viewer-manager-summary > div {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  border-right: 1px solid var(--admin-card-border, var(--border));
}

.admin-viewer-manager-summary > div:last-child {
  border-right: 0;
}

.admin-viewer-manager-summary span {
  color: var(--admin-muted, var(--text-muted));
  font-size: 9px;
  line-height: 1.35;
}

.admin-viewer-manager-summary strong {
  color: var(--admin-text, var(--text));
  font-size: 18px;
  font-weight: 500;
}

.admin-viewer-manager-summary-note {
  justify-content: flex-start !important;
}

.admin-viewer-manager-summary-note i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #c58b27;
  box-shadow: 0 0 0 4px rgba(197, 139, 39, 0.12);
}

.admin-viewer-manager-layout {
  display: grid;
  grid-template-columns: 205px minmax(440px, 1fr) 290px;
  min-height: 490px;
}

.admin-viewer-profile-panel,
.admin-viewer-preview-panel {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 14px;
  padding: 14px;
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 48%, transparent);
}

.admin-viewer-profile-panel {
  border-right: 1px solid var(--admin-card-border, var(--border));
}

.admin-viewer-preview-panel {
  border-left: 1px solid var(--admin-card-border, var(--border));
}

.admin-viewer-profile-list {
  display: grid;
  gap: 5px;
}

.admin-viewer-profile-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  min-height: 54px;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--admin-muted, var(--text-muted));
}

.admin-viewer-profile-row.is-active {
  border-color: rgba(119, 78, 154, 0.2);
  background: rgba(119, 78, 154, 0.1);
  color: #6d438f;
}

.admin-viewer-profile-cube {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 7px;
  background: var(--admin-card-bg, var(--surface));
  font-size: 13px;
}

.admin-viewer-profile-row div,
.admin-viewer-profile-row :is(strong, small) {
  display: block;
  min-width: 0;
}

.admin-viewer-profile-row strong {
  overflow: hidden;
  color: var(--admin-text, var(--text));
  font-size: 9px;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-viewer-profile-row small,
.admin-viewer-profile-row > span:last-child {
  margin-top: 2px;
  color: var(--admin-muted, var(--text-muted));
  font-size: 7px;
}

.admin-viewer-profile-add {
  display: flex;
  min-height: 35px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px dashed var(--admin-card-border, var(--border));
  border-radius: 8px;
  background: transparent;
  color: var(--admin-muted, var(--text-muted));
  font: inherit;
  font-size: 9px;
}

.admin-viewer-profile-add span {
  font-size: 14px;
  font-weight: 300;
}

.admin-viewer-workspace {
  min-width: 0;
  padding: 14px;
}

.admin-viewer-workspace-head {
  display: flex;
  min-height: 43px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--admin-card-border, var(--border));
}

.admin-viewer-workspace-head h4 {
  margin: 3px 0 0;
  color: var(--admin-text, var(--text));
  font-size: 13px;
  font-weight: 550;
}

.admin-viewer-workspace-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.admin-viewer-workspace-tabs span {
  padding: 5px 7px;
  border-radius: 6px;
  color: var(--admin-muted, var(--text-muted));
  font-size: 8px;
}

.admin-viewer-workspace-tabs span.is-active {
  background: rgba(119, 78, 154, 0.1);
  color: #6d438f;
  font-weight: 600;
}

.admin-viewer-tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(105px, 1fr));
  gap: 7px;
  margin-top: 12px;
}

.admin-viewer-tool-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  min-height: 49px;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 8px;
  background: var(--admin-card-bg, var(--surface));
}

.admin-viewer-tool-row.is-hidden {
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 56%, transparent);
  opacity: 0.66;
}

.admin-viewer-tool-glyph {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 7px;
  background: rgba(119, 78, 154, 0.09);
  color: #6d438f;
  font-family: Arial, sans-serif;
  font-size: 13px;
}

.admin-viewer-tool-row :is(strong, small) {
  display: block;
}

.admin-viewer-tool-row strong {
  color: var(--admin-text, var(--text));
  font-size: 9px;
  font-weight: 550;
}

.admin-viewer-tool-row small {
  margin-top: 2px;
  color: var(--admin-muted, var(--text-muted));
  font-size: 7px;
}

.admin-viewer-tool-switch {
  position: relative;
  width: 23px;
  height: 13px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--admin-muted, #8b938f) 30%, transparent);
}

.admin-viewer-tool-switch i {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.18);
}

.admin-viewer-tool-switch.is-on {
  background: #77509a;
}

.admin-viewer-tool-switch.is-on i {
  left: 12px;
}

.admin-viewer-advanced-mock {
  margin-top: 12px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 8px;
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 42%, transparent);
}

.admin-viewer-advanced-mock summary {
  padding: 9px 10px;
  color: var(--admin-text, var(--text));
  cursor: default;
  font-size: 9px;
  font-weight: 550;
  list-style-position: inside;
}

.admin-viewer-advanced-mock > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(105px, 1fr));
  gap: 8px;
  padding: 0 10px 10px;
}

.admin-viewer-advanced-mock label {
  display: grid;
  gap: 4px;
}

.admin-viewer-advanced-mock label > span {
  color: var(--admin-muted, var(--text-muted));
  font-size: 7px;
}

.admin-viewer-advanced-mock :is(input, select) {
  width: 100%;
  min-width: 0;
  height: 27px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 6px;
  background: var(--admin-card-bg, var(--surface));
  color: var(--admin-text, var(--text));
  font: inherit;
  font-size: 8px;
  padding: 0 7px;
}

.admin-viewer-preview {
  overflow: hidden;
  border: 1px solid rgba(20, 27, 24, 0.18);
  border-radius: 9px;
  background: #303432;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.13);
}

.admin-viewer-preview-toolbar,
.admin-viewer-preview-footer {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 30px;
  padding: 0 8px;
  background: #f7f8f6;
}

.admin-viewer-preview-toolbar span {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid #dfe4df;
  border-radius: 5px;
  color: #3c4640;
  font-family: Arial, sans-serif;
  font-size: 9px;
}

.admin-viewer-preview-stage {
  position: relative;
  height: 245px;
  overflow: hidden;
  perspective: 650px;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.08), transparent 38%),
    linear-gradient(160deg, #3d4240, #292d2b);
}

.admin-viewer-preview-grid {
  position: absolute;
  left: -25%;
  right: -25%;
  bottom: -27%;
  height: 68%;
  transform: rotateX(62deg);
  transform-origin: bottom;
  background-image:
    linear-gradient(rgba(194, 208, 199, 0.13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(194, 208, 199, 0.13) 1px, transparent 1px);
  background-size: 18px 18px;
}

.admin-viewer-model {
  position: absolute;
  top: 46%;
  left: 50%;
  width: 112px;
  height: 86px;
  transform: translate(-50%, -50%) rotateX(59deg) rotateZ(-38deg);
  transform-style: preserve-3d;
}

.admin-viewer-model i,
.admin-viewer-model b {
  position: absolute;
  display: block;
  border: 1px solid rgba(218, 234, 224, 0.82);
  background: rgba(112, 159, 132, 0.28);
  box-shadow: inset 0 0 18px rgba(204, 237, 216, 0.08);
}

.admin-viewer-model .is-floor,
.admin-viewer-model .is-roof {
  inset: 8px 4px;
}

.admin-viewer-model .is-roof {
  transform: translateZ(58px);
  background: rgba(142, 182, 157, 0.16);
}

.admin-viewer-model .is-left {
  left: 4px;
  top: 8px;
  width: 58px;
  height: 69px;
  transform: rotateY(90deg);
  transform-origin: left;
}

.admin-viewer-model .is-right {
  right: 4px;
  top: 8px;
  width: 58px;
  height: 69px;
  transform: rotateY(90deg) translateZ(104px);
  transform-origin: right;
}

.admin-viewer-model b {
  width: 4px;
  height: 4px;
  transform: translateZ(30px);
  border: 0;
  background: #d5e8db;
  box-shadow: 0 0 0 1px rgba(213, 232, 219, 0.3), 0 0 14px rgba(169, 217, 185, 0.25);
}

.admin-viewer-model .is-post-one { left: 20px; top: 22px; }
.admin-viewer-model .is-post-two { left: 72px; top: 22px; }
.admin-viewer-model .is-post-three { left: 48px; top: 61px; }

.admin-viewer-axis {
  position: absolute;
  z-index: 3;
  display: grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  font-size: 7px;
  font-weight: 650;
}

.admin-viewer-axis.is-x { right: 10px; bottom: 10px; background: #bc5656; }
.admin-viewer-axis.is-y { right: 28px; bottom: 10px; background: #4f8b62; }
.admin-viewer-axis.is-z { right: 10px; bottom: 28px; background: #5277a6; }

.admin-viewer-preview-footer {
  justify-content: space-between;
  min-height: 24px;
  color: #727b75;
  font-size: 7px;
}

.admin-viewer-preview-flags {
  display: grid;
  gap: 5px;
}

.admin-viewer-preview-flags span {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 23px;
  color: var(--admin-text, var(--text));
  font-size: 8px;
}

.admin-viewer-preview-flags i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4f8b62;
}

.admin-viewer-preview-flags span.is-off {
  color: var(--admin-muted, var(--text-muted));
}

.admin-viewer-preview-flags span.is-off i {
  background: #a3aaa6;
}

.admin-viewer2d-manager .admin-viewer-manager-summary-note i {
  background: #306989;
  box-shadow: 0 0 0 4px rgba(48, 105, 137, 0.12);
}

.admin-viewer2d-manager-layout {
  display: grid;
  grid-template-columns: 205px minmax(440px, 1fr) 320px;
  min-height: 540px;
}

.admin-viewer2d-profile-panel {
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 48%, transparent);
}

.admin-viewer2d-profile-panel .admin-viewer-profile-row.is-active {
  border-color: rgba(48, 105, 137, 0.2);
  background: rgba(48, 105, 137, 0.1);
  color: #306989;
}

.admin-viewer2d-profile-panel .admin-viewer-profile-cube,
.admin-viewer2d-tool-grid .admin-viewer-tool-glyph {
  color: #306989;
}

.admin-viewer2d-tool-grid .admin-viewer-tool-glyph {
  background: rgba(48, 105, 137, 0.09);
}

.admin-viewer2d-tool-grid .admin-viewer-tool-switch.is-on {
  background: #306989;
}

.admin-viewer2d-workspace .admin-viewer-workspace-tabs span.is-active {
  background: rgba(48, 105, 137, 0.1);
  color: #306989;
}

.admin-viewer2d-graphics-mock > .admin-viewer2d-line-standards {
  display: grid;
  grid-template-columns: repeat(5, minmax(76px, 1fr));
  gap: 6px;
  padding: 0 10px 8px;
}

.admin-viewer2d-line-standards > span {
  display: grid;
  min-width: 0;
  min-height: 48px;
  align-content: center;
  gap: 4px;
  padding: 6px 7px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 7px;
  background: var(--admin-card-bg, var(--surface));
}

.admin-viewer2d-line-standards i {
  display: block;
  width: 100%;
  height: 1px;
  background: var(--admin-text, var(--text));
}

.admin-viewer2d-line-standards i.is-cut { height: 4px; }
.admin-viewer2d-line-standards i.is-projection { height: 2px; }
.admin-viewer2d-line-standards i.is-secondary { opacity: 0.62; }
.admin-viewer2d-line-standards i.is-axis { background: repeating-linear-gradient(90deg, var(--admin-text, var(--text)) 0 9px, transparent 9px 13px, var(--admin-text, var(--text)) 13px 15px, transparent 15px 19px); }
.admin-viewer2d-line-standards i.is-hatch { background: repeating-linear-gradient(135deg, var(--admin-text, var(--text)) 0 1px, transparent 1px 4px); }

.admin-viewer2d-line-standards b,
.admin-viewer2d-line-standards code {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-viewer2d-line-standards b {
  color: var(--admin-text, var(--text));
  font-size: 8px;
  font-weight: 550;
}

.admin-viewer2d-line-standards code {
  color: var(--admin-muted, var(--text-muted));
  font-size: 7px;
}

.admin-viewer2d-graphics-mock > .admin-viewer2d-field-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(90px, 1fr));
  gap: 8px;
  padding: 0 10px 10px;
}

.admin-viewer2d-field-grid label {
  display: grid;
  gap: 4px;
}

.admin-viewer2d-field-grid label > span {
  color: var(--admin-muted, var(--text-muted));
  font-size: 7px;
}

.admin-viewer2d-field-grid :is(input, select) {
  width: 100%;
  min-width: 0;
  height: 27px;
  border: 1px solid var(--admin-card-border, var(--border));
  border-radius: 6px;
  background: var(--admin-card-bg, var(--surface));
  color: var(--admin-text, var(--text));
  font: inherit;
  font-size: 8px;
  padding: 0 7px;
}

.admin-viewer2d-preview-panel {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 14px;
  padding: 14px;
  border-left: 1px solid var(--admin-card-border, var(--border));
  background: color-mix(in srgb, var(--admin-button-bg, var(--surface-muted)) 48%, transparent);
}

.admin-viewer2d-preview {
  overflow: hidden;
  border: 1px solid rgba(36, 48, 42, 0.18);
  border-radius: 9px;
  background: #f7f7f4;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
}

.admin-viewer2d-preview-toolbar,
.admin-viewer2d-preview-footer {
  display: flex;
  min-height: 30px;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  border-bottom: 1px solid #dde1dc;
  background: #fff;
}

.admin-viewer2d-preview-toolbar span {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid #dfe4df;
  border-radius: 5px;
  color: #35423c;
  font-family: Arial, sans-serif;
  font-size: 9px;
}

.admin-viewer2d-sheet {
  position: relative;
  min-height: 310px;
  padding: 13px 10px 7px;
  background: #e8ebe7;
}

.admin-viewer2d-sheet-label {
  position: absolute;
  top: 8px;
  right: 9px;
  z-index: 2;
  color: #69746d;
  font-size: 7px;
}

.admin-viewer2d-sheet svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 290px;
  border: 1px solid #d7dbd6;
  border-radius: 3px;
  background: #f9f9f6;
  color: #778079;
  box-shadow: 0 6px 18px rgba(29, 42, 35, 0.09);
}

.admin-viewer2d-svg-grid {
  opacity: 0.24;
}

.admin-viewer2d-svg-axes {
  fill: #f9f9f6;
  stroke: #68736c;
  stroke-dasharray: 8 4 2 4;
  stroke-width: 0.9;
}

.admin-viewer2d-svg-axes circle {
  stroke-dasharray: none;
}

.admin-viewer2d-svg-axes text,
.admin-viewer2d-svg-dimensions text,
.admin-viewer2d-svg-section text {
  fill: #465049;
  stroke: none;
  font-family: Arial, sans-serif;
  font-size: 8px;
}

.admin-viewer2d-svg-cut {
  fill: none;
  stroke: #202823;
  stroke-linecap: square;
  stroke-linejoin: miter;
  stroke-width: 2.8;
}

.admin-viewer2d-svg-hatch {
  fill: rgba(72, 89, 79, 0.16);
  color: #69766d;
  stroke: none;
}

.admin-viewer2d-svg-secondary {
  fill: none;
  stroke: #4e5b53;
  stroke-width: 1.05;
}

.admin-viewer2d-svg-dimensions {
  fill: none;
  stroke: #56665c;
  stroke-width: 0.65;
}

.admin-viewer2d-svg-section {
  fill: none;
  stroke: #2e6f8f;
  stroke-dasharray: 6 3;
  stroke-width: 1;
}

.admin-viewer2d-preview-footer {
  min-height: 24px;
  justify-content: space-between;
  border-top: 1px solid #dde1dc;
  border-bottom: 0;
  color: #727b75;
  font-size: 7px;
}

.admin-viewer2d-preview-flags i {
  background: #306989;
}

@media (max-width: 1280px) {
  .admin-icon-manager-layout {
    grid-template-columns: 155px minmax(320px, 1fr);
  }

  .admin-icon-inspector {
    display: none;
  }

  .admin-interface-manager-layout {
    grid-template-columns: 190px minmax(360px, 1fr);
  }

  .admin-interface-editor-panel {
    display: none;
  }

  .admin-viewer-manager-layout {
    grid-template-columns: 180px minmax(360px, 1fr);
  }

  .admin-viewer-preview-panel {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.72fr);
    border-top: 1px solid var(--admin-card-border, var(--border));
    border-left: 0;
  }

  .admin-viewer-preview-panel > .admin-interface-panel-title {
    grid-column: 1 / -1;
  }

  .admin-viewer2d-manager-layout {
    grid-template-columns: 180px minmax(360px, 1fr);
  }

  .admin-viewer2d-preview-panel {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.72fr);
    border-top: 1px solid var(--admin-card-border, var(--border));
    border-left: 0;
  }

  .admin-viewer2d-preview-panel > .admin-interface-panel-title {
    grid-column: 1 / -1;
  }
}

@media (max-width: 860px) {
  .admin-system-design-stage-head,
  .admin-system-design-manager-head,
  .admin-system-design-location {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-system-design-stage-badge,
  .admin-system-design-readonly {
    margin-left: 0;
  }

  .admin-system-design-manager-actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .admin-icon-manager-layout,
  .admin-interface-manager-layout {
    grid-template-columns: 1fr;
  }

  .admin-icon-manager-sidebar,
  .admin-interface-token-panel {
    border-right: 0;
    border-bottom: 1px solid var(--admin-card-border, var(--border));
  }

  .admin-icon-manager-sidebar nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-icon-sample-grid {
    grid-template-columns: repeat(2, minmax(72px, 1fr));
  }

  .admin-interface-preview-stage {
    padding: 10px;
  }

  .admin-viewer-manager-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-viewer-manager-summary-note {
    grid-column: 1 / -1;
    min-height: 38px !important;
    border-top: 1px solid var(--admin-card-border, var(--border));
  }

  .admin-viewer-manager-layout,
  .admin-viewer-preview-panel,
  .admin-viewer2d-manager-layout,
  .admin-viewer2d-preview-panel {
    grid-template-columns: 1fr;
  }

  .admin-viewer-profile-panel {
    border-right: 0;
    border-bottom: 1px solid var(--admin-card-border, var(--border));
  }

  .admin-viewer-profile-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-viewer-tool-grid,
  .admin-viewer-advanced-mock > div {
    grid-template-columns: repeat(2, minmax(105px, 1fr));
  }

  .admin-viewer-workspace-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-viewer-preview-panel > .admin-interface-panel-title {
    grid-column: auto;
  }

  .admin-viewer2d-preview-panel > .admin-interface-panel-title {
    grid-column: auto;
  }

  .admin-viewer2d-graphics-mock > .admin-viewer2d-line-standards {
    grid-template-columns: repeat(3, minmax(76px, 1fr));
  }

  .admin-viewer2d-graphics-mock > .admin-viewer2d-field-grid {
    grid-template-columns: repeat(2, minmax(90px, 1fr));
  }
}

@media (max-width: 520px) {
  .admin-viewer-manager-summary,
  .admin-viewer-profile-list,
  .admin-viewer-tool-grid,
  .admin-viewer-advanced-mock > div,
  .admin-viewer2d-graphics-mock > .admin-viewer2d-line-standards,
  .admin-viewer2d-graphics-mock > .admin-viewer2d-field-grid {
    grid-template-columns: 1fr;
  }

  .admin-viewer-manager-summary-note {
    grid-column: auto;
  }
}