.cd-janela { left: 20px; top: 66px; width: 1160px; height: 718px; }
.cd-janela .app-corpo { position: relative; flex: 1; min-height: 0; padding: 0; }
.cd-vistas { position: absolute; inset: 10px 12px 26px; }
.cd-vista { position: absolute; inset: 0; display: flex; gap: 12px; min-height: 0; color: var(--grafite); font-size: 13px; }

.cd-v1 { align-items: stretch; }
.cd-editor { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #20272B; border-radius: 10px; overflow: hidden; color: #DDE5E1; }
.cd-fita { flex: none; display: flex; gap: 4px; padding: 7px 10px; background: #2B3338; }
.cd-fita span { padding: 4px 11px; border-radius: 6px; font-size: 12px; font-weight: 600; color: #B5C2BC; }
.cd-fita span.ativo { background: var(--verde-sispeq); color: var(--branco); }
.cd-area { flex: 1; min-height: 0; display: flex; }
.cd-tela { flex: 1; min-width: 0; }
.cd-svg { display: block; width: 100%; height: 100%; background: #1A2024; }
.cd-grade { stroke: #2A3237; stroke-width: 1; }
.cd-tubo { fill: none; stroke: #7FD8B6; stroke-width: 5; stroke-linecap: round; }
.cd-junta { fill: #1A2024; stroke: #F0B24A; stroke-width: 3; }
.cd-valvula { fill: #1A2024; stroke: #7FD8B6; stroke-width: 2.5; }
.cd-cota { fill: none; stroke: #8FB8E8; stroke-width: 1.5; }
.cd-rotulo { font: 700 13px var(--fonte-mono); fill: #F0B24A; }
.cd-rotulo-cota { font: 600 12px var(--fonte-mono); fill: #8FB8E8; }
.cd-carimbo rect { fill: none; stroke: #E6ECE9; stroke-width: 1.5; }
.cd-carimbo text { font: 600 12.5px var(--fonte-mono); fill: #E6ECE9; }
.cd-camadas { flex: none; width: 124px; display: flex; flex-direction: column; gap: 9px; padding: 12px 11px; background: #2B3338; font-size: 12px; }
.cd-camadas b { font-size: 12px; color: var(--branco); }
.cd-camadas span { display: flex; align-items: center; gap: 7px; }
.cd-camadas i { width: 11px; height: 11px; border-radius: 3px; }
.cd-comando { flex: none; padding: 7px 12px; background: #14191C; font: 500 12px var(--fonte-mono); color: #B5C2BC; }
.cd-comando b { color: #7FD8B6; }
.cd-lado { flex: none; width: 212px; display: flex; flex-direction: column; gap: 10px; }
.cd-num { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 5px; padding: 14px 16px; background: var(--verde-profundo); border-radius: 10px; color: var(--branco); }
.cd-num b { font: 800 30px/1.1 var(--fonte-display); }
.cd-num span { font-size: 13px; line-height: 1.35; color: rgba(255, 255, 255, 0.84); }

.cd-v2, .cd-v3 { flex-direction: column; }
.cd-etapas { flex: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cd-etapa { display: flex; flex-direction: column; gap: 7px; padding: 16px 18px; background: var(--verde-claro); border-radius: 10px; }
.cd-etapa em { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--verde-sispeq); color: var(--branco); font: 700 13px var(--fonte-sans); }
.cd-etapa b { font: 700 17px/1.25 var(--fonte-display); color: var(--verde-profundo); }
.cd-etapa p { margin: 0; font-size: 13.5px; line-height: 1.45; color: var(--grafite); }
.cd-cartao { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 8px; padding: 15px 18px; background: var(--branco); border: 1px solid var(--ui-borda); border-radius: 10px; }
.cd-tit { font: 700 16px/1.25 var(--fonte-display); color: var(--verde-profundo); }
.cd-sub { font-size: 13px; line-height: 1.4; color: var(--texto-secundario); }
.cd-lista { flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: space-evenly; gap: 6px; }
.cd-linha { display: grid; grid-template-columns: 130px 1fr auto; align-items: center; gap: 14px; padding: 11px 13px; background: var(--ui-fundo); border-radius: 8px; }
.cd-linha b { color: var(--verde-profundo); }
.cd-linha small { font-size: 12.5px; color: var(--texto-secundario); }

.cd-fluxo { flex: none; display: flex; align-items: stretch; gap: 8px; }
.cd-passo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; padding: 15px 16px; background: var(--verde-profundo); border-radius: 10px; color: var(--branco); }
.cd-passo span { font-size: 12px; font-weight: 700; color: #9FD3BF; }
.cd-passo b { font: 700 17px/1.25 var(--fonte-display); }
.cd-passo small { font-size: 12.5px; line-height: 1.35; color: rgba(255, 255, 255, 0.84); }
.cd-seta { align-self: center; font-style: normal; font-size: 20px; font-weight: 700; color: var(--verde-sispeq); }
.cd-duas { flex: 1; min-height: 0; display: grid; grid-template-columns: 1.5fr 1fr; gap: 12px; }
.cd-destaque { justify-content: center; background: var(--verde-claro); border-color: transparent; }
.cd-destaque .cd-sub { font-size: 14.5px; line-height: 1.5; color: var(--grafite); }