/* Estilo complementar. Base visual via Tailwind (CDN). */
:root { --brand: #1f6feb; }
html { -webkit-text-size-adjust: 100%; }
body { font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
.help { font-size: 0.75rem; color: #64748b; margin-top: 0.25rem; line-height: 1.4; }
.label-required::after { content: ' *'; color: #dc2626; }
.block-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 0.75rem; padding: 1.25rem; }
.block-number { display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; border-radius: 9999px; background: #eef6ff; color: #1a5fd0; font-size: .8rem; font-weight: 600; margin-right: .5rem; }
[data-tip] { position: relative; }
[data-tip]:hover::after, [data-tip]:focus::after {
  content: attr(data-tip); position: absolute; left: 50%; transform: translateX(-50%); bottom: 125%;
  background: #0f172a; color: #fff; font-size: 12px; padding: .4rem .6rem; border-radius: .375rem; white-space: normal; width: max-content; max-width: 240px; z-index: 50;
}
.photo-thumb { width: 72px; height: 72px; object-fit: cover; border-radius: .5rem; }