/* Diagramas de sala: topología y proceso. Usan tokens de restart.css. */
.diag{margin:8px 0 4px}
.diag-k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.diag-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:10px}
.diag-n{background:var(--surface);border:1px solid var(--line);padding:10px 12px;min-width:120px;flex:1;max-width:220px}
.diag-n b{display:block;font-size:13px;font-weight:600;margin-bottom:4px}
.diag-n small,.diag-n span{display:block;font-size:12px;color:var(--muted);line-height:1.35;font-weight:400}
.diag-n.diag-core{flex:1 1 100%;max-width:none;background:var(--petrol-soft);border-style:dashed;border-color:var(--petrol)}
.diag-n.diag-ops{flex:1 1 100%;max-width:none;background:#1e22aa;color:#edeffe;border-color:#1e22aa}
.diag-n.diag-ops small,.diag-n.diag-ops span{color:#edeffe;opacity:.85}
.diag-n.diag-out{border-color:var(--amber);background:var(--note)}
.diag-n.diag-soon{border-color:var(--amber)}
.diag-n.diag-plant{border-style:dashed}
.diag-join{text-align:center;font-size:12px;color:var(--muted);margin:6px 0 8px}
.diag-arr{display:flex;align-items:center;color:var(--petrol);font-weight:700;font-size:18px;padding:0 2px}
.diag-flow .diag-n{max-width:160px;flex:1 1 90px;min-width:90px;text-align:center}
.diag-flow .diag-n b{font-family:var(--mono);font-size:12px;color:var(--petrol)}
.diag-bits{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}
.diag-bits i{font-style:normal;font-family:var(--mono);font-size:11px;border:1px solid var(--line);
  background:var(--surface);padding:3px 7px}
/* Ejemplo del moderador: lo que escribe vs lo que sale al vendor */
.ex-vs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 8px;align-items:stretch}
.ex-vs .col{background:var(--surface);border:1px solid var(--line);padding:12px 14px;min-width:0}
.ex-vs .col.bad{border-color:var(--stop)}
.ex-vs .col.good{border-color:var(--go);background:var(--surface)}
.ex-vs .k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-weight:600}
.ex-vs .who{font-family:var(--mono);font-size:11px;color:var(--muted);margin:0 0 6px}
.ex-vs .quote{font-size:14.5px;line-height:1.45;margin:0}
.ex-vs .secret{font-family:var(--mono);font-size:13px;color:var(--stop);font-weight:500}
.ex-vs .token{font-family:var(--mono);font-size:13px;color:var(--petrol);font-weight:500}
.ex-vs .gone{margin:10px 0 0;padding:10px 12px;border:1px dashed var(--stop);color:var(--stop);
  font-family:var(--mono);font-size:13px;line-height:1.4;background:var(--note)}
.ex-vs .same{margin:10px 0 0;padding:10px 12px;border:1px solid var(--stop);color:var(--stop);
  font-family:var(--mono);font-size:13px;line-height:1.4}
.ex-vs .ok-payload{margin:10px 0 0;padding:10px 12px;border:1px solid var(--go);font-family:var(--mono);
  font-size:13px;line-height:1.4}
.ex-vs .hint{display:block;font-size:12px;color:var(--muted);margin-top:8px;line-height:1.35;font-weight:400}
.ex-mod{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:8px;align-items:stretch;margin:14px 0 8px}
.ex-mod .col{background:var(--surface);border:1px solid var(--line);padding:12px 14px;min-width:0}
.ex-mod .col.cut{border-color:var(--stop);background:var(--note)}
.ex-mod .k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-weight:600}
.ex-mod .quote{font-size:14.5px;line-height:1.45;margin:0}
.ex-mod .secret{font-family:var(--mono);font-size:13px;color:var(--stop)}
.ex-mod .token{font-family:var(--mono);font-size:13px;color:var(--petrol)}
.ex-mod .gone{margin:8px 0 0;padding:8px 10px;border:1px dashed var(--stop);color:var(--stop);
  font-family:var(--mono);font-size:12.5px;line-height:1.35;background:transparent}
.ex-mod .arr{display:flex;align-items:center;color:var(--petrol);font-weight:700;font-size:20px;padding:0 2px}
@media(max-width:720px){
  .diag-arr{display:none}
  .diag-flow .diag-n{max-width:none}
  .ex-vs,.ex-mod{grid-template-columns:1fr}
  .ex-mod .arr{display:none}
}
@media print{
  .diag-n,.diag-n.diag-core,.ex-vs .col,.ex-mod .col{break-inside:avoid}
}
