/* O desenho do modelo padrão (`DrycoProjeto.desenho`, em projeto.js): cada
   cômodo como retângulo na proporção dos lados, horizontal em cima, vertical
   do lado, área no meio. É o mesmo no ERP (sistema.php: o modelo padrão do
   Levantamento e os pedidos do site) e na página pública do orçamento online
   (orcar.php) — por isso um arquivo só, carregado pelas duas. Só tokens do
   tema.css: vale no tema claro e no escuro. */

.modelo-desenho { width: 100%; max-width: 300px; height: auto; display: block; margin: 0 auto; }
.modelo-desenho .mp-sala { fill: var(--superficie-alt); stroke: var(--texto-suave); stroke-width: 1.2; }
.modelo-desenho .mp-sala.sem { stroke-dasharray: 4 3; fill: none; }
.modelo-desenho .mp-linha { stroke: var(--texto-fraco); stroke-width: .8; }
.modelo-desenho .mp-cota { fill: var(--texto-suave); font-size: 10px; font-variant-numeric: tabular-nums; }
.modelo-desenho .mp-area, .modelo-desenho .mp-pd { paint-order: stroke; stroke: var(--superficie-alt); stroke-width: 3px; stroke-linejoin: round; }
.modelo-desenho .mp-area { fill: var(--texto); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.modelo-desenho .mp-pd { fill: var(--texto-fraco); font-size: 9px; }

/* a grade compacta: o projeto inteiro de uma vez (site e pedido no ERP) */
.modelo-mini { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.modelo-mini figure { margin: 0; padding: 6px 8px 8px; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); min-width: 0; }
.modelo-mini figcaption { font-size: 12px; font-weight: 700; color: var(--texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.modelo-mini .modelo-desenho { max-width: 220px; }