.vertical-workspace {
  --vertical-accent: #168a5a;
  --vertical-accent-strong: #0f6f49;
  --vertical-accent-soft: #e8f5ef;
  --vertical-ink: #102a43;
  --vertical-line: #d8e2ea;
  gap: 18px;
}

.vertical-command-bar {
  display: grid;
  grid-template-columns: 52px minmax(260px, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 92px;
  padding: 17px 20px;
  color: var(--vertical-ink);
  border: 1px solid var(--vertical-line);
  border-left: 5px solid var(--vertical-accent);
  background: #fff;
}

.vertical-command-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  color: var(--vertical-accent-strong);
  border: 1px solid color-mix(in srgb, var(--vertical-accent) 26%, #fff);
  border-radius: 6px;
  background: var(--vertical-accent-soft);
}

.vertical-command-icon svg { width: 23px; height: 23px; }
.vertical-command-bar > div:nth-child(2) { display: grid; gap: 3px; }
.vertical-command-bar > div:nth-child(2) > span {
  color: var(--vertical-accent-strong);
  font-size: 0.67rem;
  font-weight: 850;
  text-transform: uppercase;
}
.vertical-command-bar > div:nth-child(2) > strong { font-size: 1.24rem; }
.vertical-command-bar > div:nth-child(2) > small { color: var(--muted); font-size: 0.76rem; }
.vertical-command-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.vertical-demo-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  color: #7a5800;
  border: 1px solid #ead27a;
  border-radius: 4px;
  background: #fff7d6;
  font-size: 0.7rem;
  font-weight: 760;
  white-space: nowrap;
}
.vertical-demo-badge svg { width: 14px; height: 14px; }

.vertical-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--vertical-line);
  background: var(--vertical-line);
}

.vertical-metric {
  display: grid;
  grid-template-columns: 36px 1fr;
  align-items: start;
  gap: 10px;
  min-height: 88px;
  padding: 15px;
  background: #fff;
}
.vertical-metric-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  color: #0f6f49;
  border-radius: 4px;
  background: #e8f5ef;
}
.vertical-metric-icon svg { width: 17px; height: 17px; }
.vertical-metric > div { display: grid; gap: 2px; min-width: 0; }
.vertical-metric strong { overflow-wrap: anywhere; color: var(--vertical-ink); font-size: 1.12rem; }
.vertical-metric span:not(.vertical-metric-icon) { color: #526779; font-size: 0.69rem; font-weight: 720; }
.vertical-metric small { color: #768797; font-size: 0.64rem; }
.vertical-metric.gold .vertical-metric-icon { color: #755600; background: #fff5c2; }
.vertical-metric.sky .vertical-metric-icon { color: #12648f; background: #e4f4fb; }
.vertical-metric.navy .vertical-metric-icon { color: #fff; background: #123856; }
.vertical-metric.amber .vertical-metric-icon { color: #845300; background: #fff0ce; }
.vertical-metric.red .vertical-metric-icon { color: #a02d39; background: #fdecee; }

.vertical-two-column,
.construction-control-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 18px;
  align-items: start;
}
.construction-control-grid { grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.45fr); }
.vertical-panel { min-width: 0; margin: 0; }
.vertical-panel .card-head { border-bottom: 1px solid var(--vertical-line); }
.vertical-panel .card-head > div { display: grid; gap: 3px; }
.vertical-panel .card-head h3 { color: var(--vertical-ink); }
.vertical-report-title {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 18px;
  color: #fff;
  background: var(--vertical-ink);
}
.vertical-report-title > span { display: grid; place-items: center; }
.vertical-report-title svg { width: 22px; height: 22px; }
.vertical-report-title > div { display: grid; gap: 2px; }
.vertical-report-title strong { font-size: 0.92rem; }
.vertical-report-title small { color: #d6e2eb; font-size: 0.72rem; }

.vertical-progress { display: grid; grid-template-columns: minmax(80px, 1fr) auto; align-items: center; gap: 8px; }
.vertical-progress > span { display: block; height: 6px; overflow: hidden; background: #e5ebef; }
.vertical-progress > span b { display: block; height: 100%; background: var(--vertical-accent); }
.vertical-progress small { color: #596b78; font-size: 0.66rem; white-space: nowrap; }
.vertical-bars { display: grid; gap: 18px; padding: 20px; }
.vertical-bars > div { display: grid; grid-template-columns: 1fr auto; gap: 7px 12px; align-items: center; }
.vertical-bars span { color: #536675; font-size: 0.72rem; font-weight: 720; }
.vertical-bars strong { color: var(--vertical-ink); font-size: 0.74rem; }
.vertical-bars i { grid-column: 1 / -1; height: 8px; overflow: hidden; background: #e6ecef; }
.vertical-bars i b { display: block; height: 100%; background: var(--vertical-accent); }
.danger-text { color: #b12f3d !important; font-weight: 760; }

/* Construction: dense, measured and site-oriented. */
.construction-workspace {
  --vertical-accent: #e5ac14;
  --vertical-accent-strong: #795600;
  --vertical-accent-soft: #fff6d4;
  --vertical-ink: #142f42;
  --vertical-line: #cfd9df;
}
.construction-workspace .vertical-command-bar {
  background-image: linear-gradient(90deg, transparent 0 72%, rgba(229, 172, 20, 0.09) 72% 73%, transparent 73% 100%);
  background-size: 22px 100%;
}
.construction-workspace .erp-card { border-radius: 2px; box-shadow: none; }
.construction-project-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(150px, 0.7fr) minmax(140px, 0.6fr) minmax(120px, 0.45fr);
  align-items: center;
  gap: 18px;
  min-height: 88px;
  padding: 14px 18px;
  border-bottom: 1px solid #d9e1e6;
  background: #fff;
}
.construction-project-row:last-child { border-bottom: 0; }
.construction-project-row > div { display: grid; gap: 3px; min-width: 0; }
.construction-project-row > div:first-child > span { color: #8b6800; font-size: 0.63rem; font-weight: 850; }
.construction-project-row > div:first-child > strong { color: #142f42; font-size: 0.8rem; }
.construction-project-row small { color: #687986; font-size: 0.65rem; }
.construction-project-signal > strong { color: #142f42; font-size: 1.02rem; }
.construction-project-cost > span { color: #687986; font-size: 0.64rem; }
.construction-project-cost > strong { color: #142f42; font-size: 0.8rem; }
.vertical-timeline { display: grid; gap: 0; margin: 0; padding: 4px 18px 18px; list-style: none; }
.vertical-timeline li { display: grid; grid-template-columns: 80px 1fr; gap: 14px; padding: 15px 0; border-bottom: 1px solid #e0e6ea; }
.vertical-timeline li:last-child { border: 0; }
.vertical-timeline li > span { color: #826300; font-size: 0.66rem; font-weight: 820; }
.vertical-timeline li div { display: grid; gap: 4px; }
.vertical-timeline strong { color: #142f42; font-size: 0.76rem; }
.vertical-timeline p { margin: 0; color: #435967; font-size: 0.7rem; line-height: 1.45; }
.vertical-timeline small { color: #71818d; font-size: 0.63rem; }

/* Hospitality: a glanceable live room board with service warmth. */
.hospitality-workspace {
  --vertical-accent: #167f73;
  --vertical-accent-strong: #0d655c;
  --vertical-accent-soft: #e4f6f2;
  --vertical-ink: #26364a;
  --vertical-line: #d7e2e3;
}
.hospitality-workspace .vertical-command-bar { border-top: 4px solid #ab4059; border-left-width: 1px; }
.hospitality-workspace .vertical-metrics { border-color: #d6e3e1; background: #d6e3e1; }
.hotel-room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 8px;
  padding: 16px;
}
.hotel-room {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 5px;
  min-height: 125px;
  padding: 12px;
  border: 1px solid #cddddd;
  border-top: 4px solid #168a5a;
  border-radius: 4px;
  background: #fff;
}
.hotel-room header { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: baseline; }
.hotel-room header strong { color: #26364a; font-size: 1rem; }
.hotel-room header span { color: #718084; font-size: 0.6rem; }
.hotel-room > div { color: #167f73; }
.hotel-room > div svg { width: 24px; height: 24px; }
.hotel-room p { grid-column: 1 / -1; margin: 0; color: #485c67; font-size: 0.68rem; }
.hotel-room small { color: #65777d; font-size: 0.63rem; }
.hotel-room b { text-align: right; color: #26364a; font-size: 0.65rem; }
.hotel-room.occupied { border-top-color: #ab4059; background: #fff8fa; }
.hotel-room.dirty,
.hotel-room.cleaning,
.hotel-room.inspecting { border-top-color: #e5ac14; background: #fffdf5; }
.hotel-room.out_of_order { border-top-color: #6c7785; background: #f2f4f5; }
.hotel-service-queue { display: grid; gap: 0; margin: 0; padding: 4px 17px 17px; list-style: none; }
.hotel-service-queue li { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid #e0e7e7; }
.hotel-service-queue li:last-child { border: 0; }
.hotel-service-priority { display: grid; width: 32px; height: 32px; place-items: center; color: #167f73; background: #e4f6f2; }
.hotel-service-priority.urgent { color: #a02d46; background: #fdecee; }
.hotel-service-priority svg { width: 16px; height: 16px; }
.hotel-service-queue li > div { display: grid; gap: 3px; }
.hotel-service-queue strong { color: #26364a; font-size: 0.72rem; }
.hotel-service-queue small,
.hotel-service-queue time { color: #6b7c82; font-size: 0.63rem; }

/* Healthcare: restrained clinical flow and protected records. */
.healthcare-workspace {
  --vertical-accent: #168a79;
  --vertical-accent-strong: #0f6f62;
  --vertical-accent-soft: #e2f5f1;
  --vertical-ink: #123149;
  --vertical-line: #d7e3e7;
}
.healthcare-workspace .vertical-command-bar { border-left-color: #168a79; border-bottom: 3px solid #d14c5a; }
.clinical-flow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid #d8e4e7;
  background: #d8e4e7;
}
.clinical-flow-step { display: grid; gap: 8px; min-height: 116px; padding: 15px; background: #fff; }
.clinical-flow-step header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.clinical-flow-step header span { color: #0f6f62; font-size: 0.63rem; font-weight: 850; text-transform: uppercase; }
.clinical-flow-step strong { color: #123149; font-size: 0.78rem; }
.clinical-flow-step small { color: #667a85; font-size: 0.65rem; line-height: 1.4; }
.clinical-flow-step.emergency { box-shadow: inset 4px 0 #c63f4c; }
.clinical-order-queue { display: grid; gap: 0; margin: 0; padding: 4px 17px 17px; list-style: none; }
.clinical-order-queue li { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; padding: 12px 0; border-bottom: 1px solid #e0e8eb; }
.clinical-order-queue li:last-child { border: 0; }
.clinical-order-queue strong { color: #123149; font-size: 0.72rem; }
.clinical-order-queue small { color: #687b85; font-size: 0.64rem; }
.clinical-order-queue time { grid-column: 1 / -1; color: #7b8890; font-size: 0.61rem; }

/* IMS: configurable architecture and data-quality control. */
.information_management-workspace {
  --vertical-accent: #2275a8;
  --vertical-accent-strong: #155a86;
  --vertical-accent-soft: #e4f1f8;
  --vertical-ink: #132d42;
  --vertical-line: #d6e1e8;
}
.information_management-workspace .vertical-command-bar { border-left-color: #2275a8; border-right: 5px solid #168a5a; }
.information-registry-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 1px;
  padding: 1px;
  background: #d9e3e9;
}
.information-registry-tile { display: grid; gap: 8px; min-height: 142px; padding: 16px; background: #fff; }
.information-registry-tile header { display: flex; justify-content: space-between; align-items: center; }
.information-registry-tile header > span:first-child { color: #2275a8; }
.information-registry-tile header svg { width: 20px; height: 20px; }
.information-registry-tile > strong { color: #132d42; font-size: 0.8rem; }
.information-registry-tile > small { color: #697c88; font-size: 0.62rem; }
.information-registry-tile > div { display: grid; grid-template-columns: auto 1fr auto 1fr; align-items: baseline; gap: 4px 7px; padding-top: 7px; border-top: 1px solid #e1e8ec; }
.information-registry-tile > div b { color: #155a86; font-size: 1rem; }
.information-registry-tile > div b.attention { color: #b57000; }
.information-registry-tile > div span { color: #71818b; font-size: 0.58rem; }
.information-submission-list { display: grid; gap: 0; margin: 0; padding: 4px 17px 17px; list-style: none; }
.information-submission-list li { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 9px; padding: 12px 0; border-bottom: 1px solid #e0e7ec; }
.information-submission-list li:last-child { border: 0; }
.information-submission-list li > span:first-child { color: #2275a8; }
.information-submission-list li > span:first-child svg { width: 17px; height: 17px; }
.information-submission-list li > div { display: grid; gap: 2px; }
.information-submission-list strong { color: #132d42; font-size: 0.7rem; }
.information-submission-list small,
.information-submission-list time { color: #73838d; font-size: 0.61rem; }
.information-submission-list time { grid-column: 2 / -1; }
.record-data-preview { display: grid; gap: 2px; min-width: 150px; }
.record-data-preview span { display: grid; grid-template-columns: minmax(75px, 0.65fr) 1fr; gap: 6px; color: #566a78; font-size: 0.62rem; }
.record-data-preview b { color: #203c50; }

/* Professional services: engagement economics and reviewed delivery. */
.professional_services-workspace {
  --vertical-accent: #21845f;
  --vertical-accent-strong: #126343;
  --vertical-accent-soft: #e6f4ee;
  --vertical-ink: #1f2e3c;
  --vertical-line: #d9e1e5;
}
.professional_services-workspace .vertical-command-bar { border-left-color: #21845f; border-top: 4px solid #283d50; }
.practice-engagement-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 1px; padding: 1px; background: #dde4e7; }
.practice-engagement { display: grid; gap: 9px; min-height: 164px; padding: 16px; background: #fff; }
.practice-engagement header,
.practice-engagement footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.practice-engagement header > span:first-child { color: #126343; font-size: 0.63rem; font-weight: 850; }
.practice-engagement > strong { color: #1f2e3c; font-size: 0.83rem; }
.practice-engagement > small { color: #687985; font-size: 0.64rem; }
.practice-engagement footer { padding-top: 8px; border-top: 1px solid #e2e8eb; color: #697a85; font-size: 0.61rem; }
.practice-engagement footer b { color: #1f2e3c; font-size: 0.7rem; }
.practice-deliverable-list { display: grid; gap: 0; margin: 0; padding: 4px 17px 17px; list-style: none; }
.practice-deliverable-list li { display: grid; grid-template-columns: 30px 1fr auto; align-items: center; gap: 9px; padding: 12px 0; border-bottom: 1px solid #e0e6e9; }
.practice-deliverable-list li:last-child { border: 0; }
.practice-deliverable-list li > span:first-child { color: #21845f; }
.practice-deliverable-list li > span:first-child svg { width: 18px; height: 18px; }
.practice-deliverable-list li > div { display: grid; gap: 2px; }
.practice-deliverable-list strong { color: #1f2e3c; font-size: 0.7rem; }
.practice-deliverable-list small,
.practice-deliverable-list time { color: #71818b; font-size: 0.61rem; }
.practice-deliverable-list time { grid-column: 2 / -1; }

@media (max-width: 1120px) {
  .vertical-two-column,
  .construction-control-grid { grid-template-columns: 1fr; }
  .construction-project-row { grid-template-columns: minmax(210px, 1fr) minmax(150px, 0.6fr) minmax(130px, 0.5fr); }
  .construction-project-row > div:last-child { grid-column: 1 / -1; display: flex; justify-content: space-between; }
}

@media (max-width: 760px) {
  .vertical-command-bar { grid-template-columns: 42px minmax(0, 1fr); padding: 14px; }
  .vertical-command-icon { width: 40px; height: 40px; }
  .vertical-command-actions { grid-column: 1 / -1; justify-content: stretch; flex-wrap: wrap; }
  .vertical-command-actions .erp-button { flex: 1; }
  .vertical-demo-badge { flex: 1 0 100%; justify-content: center; }
  .vertical-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vertical-metric { grid-template-columns: 30px 1fr; min-height: 82px; padding: 12px 10px; }
  .vertical-metric-icon { width: 28px; height: 28px; }
  .vertical-metric strong { font-size: 0.9rem; }
  .construction-project-row { grid-template-columns: 1fr; gap: 10px; }
  .construction-project-row > div:last-child { grid-column: auto; }
  .hotel-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px; }
  .information-registry-grid,
  .practice-engagement-grid { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .vertical-metrics { grid-template-columns: 1fr; }
  .hotel-room-grid { grid-template-columns: 1fr 1fr; }
}