:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#1b2f38;background:#f4f7f5}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:flex;flex-direction:column}a{color:#0a6866}header{background:#164e55;color:white;padding:1rem 0}header a{color:white}header .wrap{display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap}nav{display:flex;gap:.8rem;flex-wrap:wrap}.wrap{width:min(1100px,92%);margin:auto}main{flex:1;padding:1.5rem 0 3rem}h1{font-size:clamp(1.8rem,4vw,2.6rem);margin:.3rem 0 1.5rem}h2{margin-top:0}.card{background:white;border:1px solid #dce6e2;border-radius:14px;padding:1.25rem;margin:1rem 0;box-shadow:0 4px 16px #153a3610}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.8rem}label{display:block;font-weight:600;margin:.5rem 0}input,select,textarea,button{font:inherit}input,select,textarea{display:block;width:100%;padding:.65rem;border:1px solid #a7bdb7;border-radius:8px;margin-top:.3rem}button,.button{display:inline-block;border:0;border-radius:8px;background:#0b756e;color:white;padding:.65rem 1rem;cursor:pointer;text-decoration:none}button:hover,.button:hover{background:#075e59;color:white}.muted{color:#536b6a}.error{background:#ffe7e2;border-left:4px solid #ba4733;padding:1rem}.ok{background:#e1f4e7;border-left:4px solid #267d49;padding:1rem}.tag{display:inline-block;background:#e6f2f0;padding:.2rem .5rem;border-radius:50px;font-size:.85rem}.list{display:grid;gap:.7rem}.row{display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap}.bar{height:24px;background:#e2e9e6;border-radius:99px;overflow:hidden}.bar span{display:block;height:100%;background:#0b756e}.pie{width:160px;height:160px;border-radius:50%;background:conic-gradient(#eb8157 0 var(--pct),#197e83 var(--pct) 100%);box-shadow:0 12px 0 #155a5e,0 14px 12px #1235;margin:1rem auto 2rem}footer{background:#dce8e3;padding:1.2rem 0}table{width:100%;border-collapse:collapse}td,th{padding:.55rem;border-bottom:1px solid #ddd;text-align:left}@media(max-width:650px){table{font-size:.85rem}}
.copy-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-top:1px solid #dce6e2}.copy-row>div{min-width:0}.copy-row code{overflow-wrap:anywhere;font-size:.9rem}.copy-button{display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap;flex-shrink:0}.copy-button svg{display:block}@media(max-width:650px){.copy-row{align-items:flex-start;flex-direction:column}}
/* Registro de familias y representantes */
.registration-form{padding:0;overflow:hidden}
.register-intro{line-height:1.55}
.register-intro p:last-child{margin-bottom:0}
.form-section{padding:1.5rem 1.75rem}
.form-section+.form-section{border-top:1px solid #dce6e2;background:#fbfcfb}
.section-heading{display:flex;align-items:flex-start;gap:.85rem;margin-bottom:1.25rem}
.section-heading h2{margin:0;font-size:1.28rem;line-height:1.25}
.section-heading p{margin:.35rem 0 0;color:#536b6a}
.section-step{display:inline-grid;place-items:center;min-width:2rem;height:2rem;border-radius:50%;background:#dcefeb;color:#075e59;font-weight:700}
.registration-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:1rem;row-gap:1.1rem;align-items:start}
.registration-grid label{display:flex;flex-direction:column;gap:.45rem;min-width:0;margin:0;line-height:1.3}
.registration-grid input,.registration-grid select{min-width:0;min-height:2.9rem;margin:0}
.form-actions{padding:1.25rem 1.75rem;border-top:1px solid #dce6e2}
.form-actions button{min-width:10rem}
.form-hint{margin:1rem 0 0;color:#536b6a}
@media(max-width:820px){.registration-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.wrap{width:min(100% - 1.5rem,1100px)}main{padding:1rem 0 2rem}h1{font-size:clamp(1.65rem,7vw,2.2rem);line-height:1.12}.card{padding:1rem}.registration-form{padding:0}.form-section{padding:1.2rem 1rem}.registration-grid{grid-template-columns:minmax(0,1fr);row-gap:1rem}.section-heading{gap:.7rem}.section-heading h2{font-size:1.15rem}.form-actions{padding:1rem}.form-actions button{width:100%}}
.section-title{min-width:0;flex:1}
.heading-role{display:flex;flex-direction:column;gap:.4rem;width:min(18rem,32%);min-width:13rem;margin:0 0 0 auto;line-height:1.3}
.heading-role select{min-height:2.9rem;margin:0}
@media(max-width:700px){.section-heading:has(.heading-role){flex-wrap:wrap}.section-heading:has(.heading-role) .heading-role{width:100%;margin:.6rem 0 0 2.85rem;min-width:0}}
@media(max-width:600px){.section-heading:has(.heading-role) .heading-role{margin-left:0}}