:root { --ink:#132b35; --muted:#60717a; --brand:#0d6776; --brand-dark:#0a4e59; --bg:#f2f6f6; --card:#fff; --line:#d9e3e5; --warn:#b75d00; --ok:#167542; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.4 system-ui,-apple-system,Segoe UI,sans-serif; }
.app { max-width:540px; min-height:100dvh; margin:auto; padding:24px 18px calc(28px + env(safe-area-inset-bottom)); }
.brand { color:var(--brand); font-size:14px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.version { display:inline-block; padding:2px 7px; border-radius:999px; background:#dff2f3; font-size:11px; letter-spacing:.02em; }
h1 { margin:7px 0 8px; font-size:30px; line-height:1.05; } h2 { font-size:21px; margin:0 0 8px; } p { margin:0 0 14px; } .muted { color:var(--muted); }
.card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; margin:16px 0; box-shadow:0 3px 12px #0c30340b; }
.family { display:flex; gap:13px; align-items:flex-start; padding:13px 0; border-bottom:1px solid var(--line); min-width:0; } .family:last-child { border:0; padding-bottom:0; } .family>div:first-child{min-width:0;flex:1}.family>div:first-child span{display:block;overflow-wrap:anywhere}.family .result{flex:0 1 42%;min-width:0;}
.family-choice { display:flex; align-items:center; gap:12px; width:100%; margin:0; padding:13px 0; border-radius:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); text-align:left; }.family-choice:last-child{border-bottom:0}.family-choice:hover{background:#f5fafa;color:var(--brand-dark)}.family-choice span:nth-child(2){flex:1}.family-choice small{display:block;color:var(--muted);font-size:13px;font-weight:400}.family-choice>b{font-size:20px;color:var(--brand)}
.badge { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; color:var(--brand-dark); background:#dff2f3; font-weight:800; }
.family strong { display:block;overflow-wrap:anywhere; }.family span { color:var(--muted); font-size:14px;overflow-wrap:anywhere; }
/* Evidencias: el bloque debe ocupar todo el ancho; los botones no deben
   estrechar la referencia hasta romperla carácter a carácter. */
.family:has(.evidence) { display:block; }
.family:has(.evidence)>div:first-child { width:100%; }
.family:has(.evidence) .evidence { display:inline-block; width:calc(50% - 7px); vertical-align:top; margin-right:8px; }
.family:has(.evidence) .evidence:last-child { margin-right:0; }
button, .file-button { width:100%; border:0; border-radius:13px; padding:15px 16px; margin-top:10px; color:#fff; background:var(--brand); font:inherit; font-weight:750; text-align:center; cursor:pointer; display:block; }
button:hover,.file-button:hover { background:var(--brand-dark); } button.secondary { background:#e3eff0; color:var(--brand-dark); } button.ghost { background:transparent; color:var(--brand); padding:10px; }
.step { color:var(--brand); font-weight:700; font-size:14px; } .progress { height:8px; overflow:hidden; border-radius:6px; background:#dde7e8; margin:12px 0 22px; }.progress i { display:block; height:100%; background:var(--brand); }
.photo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.photo { aspect-ratio:1; border-radius:10px; overflow:hidden; background:#eaf0f1; }.photo img { width:100%;height:100%;object-fit:cover; }.empty { border:1px dashed #adc0c4; display:grid;place-items:center;color:var(--muted);font-size:13px;text-align:center;padding:8px; }
input[type=file] { display:none; }.notice { padding:12px; background:#fff5e7; border-radius:12px; color:#774000; font-size:14px; }.check { color:var(--ok); font-weight:750; }
.warning { color:#a34d00; font-weight:750; }.loading { color:var(--brand); font-weight:750; }.result { margin-left:auto; text-align:right; font-weight:750; white-space:normal; overflow-wrap:anywhere; }.result small { display:block; color:var(--muted); font-size:12px; font-weight:500; line-height:1.3; }.result.ok { color:var(--ok); }.result.need { color:#a34d00; }.result.pending { color:#a34d00; }
.diagnostic { padding:11px 0; border-bottom:1px solid var(--line); }.diagnostic:last-child{border-bottom:0}.diagnostic strong,.diagnostic span{display:block}.diagnostic span{color:var(--muted);font-size:13px;margin-top:3px}.diagnostic .location-hint{color:var(--brand-dark);font-weight:700}
.manual-row{padding:12px 0;border-bottom:1px solid var(--line)}.manual-row:last-of-type{border-bottom:0}.manual-fields{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(70px,.7fr) minmax(70px,.7fr);gap:8px}.manual-fields label{color:var(--muted);font-size:12px;font-weight:700}.manual-fields input{width:100%;margin-top:4px;border:1px solid var(--line);border-radius:9px;padding:9px 7px;color:var(--ink);font:inherit;font-size:14px;min-width:0}.manual-meta{color:var(--muted);font-size:13px;margin-top:6px;overflow-wrap:anywhere}.manual-meta strong{color:var(--brand-dark)}
.tiny { font-size:13px; } textarea { width:100%; min-height:360px; border:1px solid var(--line); border-radius:12px; padding:12px; font:13px/1.35 ui-monospace,monospace; color:var(--ink); } button:disabled { opacity:.45; cursor:not-allowed; }.tabs { display:flex; gap:6px; margin:16px 0; }.tabs b { flex:1; padding:10px 5px; text-align:center; border-bottom:2px solid var(--line); color:var(--muted); font-size:12px; }.tabs .active { color:var(--brand); border-color:var(--brand); }