:root{--navy:#123d46;--navy2:#204b55;--teal:#1c807b;--mint:#d9f0e9;--bg:#f3f6f5;--paper:#fff;--line:#dce6e5;--muted:#62777c;--text:#19383f;--shadow:0 10px 35px rgba(20,58,67,.055);--red:#b94549;--gold:#ac6f26}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 'DM Sans',system-ui,-apple-system,Segoe UI,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.48;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #40a7c7;outline-offset:2px}a{color:var(--teal)}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Manrope,'DM Sans',sans-serif;letter-spacing:-.035em}h1{font-size:clamp(25px,3.4vw,37px);line-height:1.2}h2{font-size:22px;line-height:1.25}h3{font-size:16px}.subtle{color:var(--muted)}.tiny{font-size:12px}.small{font-size:13px}.strong{font-weight:700}.brand{display:flex;align-items:center;gap:12px;font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.04em;font-size:24px;color:var(--navy)}.logo{width:42px;height:42px;background:var(--navy);border-radius:13px;display:grid;place-items:center;color:#fff;font-size:25px;font-weight:800;position:relative}.logo:after{content:'';position:absolute;width:9px;height:9px;background:#83cdc4;border-radius:50%;right:7px;top:8px}.app-shell{min-height:100vh;display:grid;grid-template-columns:256px minmax(0,1fr)}aside.sidebar{background:var(--paper);border-right:1px solid var(--line);padding:28px 20px;display:flex;flex-direction:column;gap:30px;position:sticky;top:0;height:100vh}.sidebar .kicker{font-size:10px;letter-spacing:.18em;font-weight:800;color:#799096;margin-top:3px}.sidebar nav{display:grid;gap:7px}.nav-btn{display:flex;align-items:center;gap:12px;padding:13px 14px;border:0;background:transparent;color:var(--muted);border-radius:12px;text-align:left;font-weight:700;width:100%}.nav-btn:hover{background:#f1f6f5;color:var(--navy)}.nav-btn.active{background:var(--mint);color:var(--navy)}.nav-icon{width:20px;flex:none;text-align:center;font-size:17px}.sidebar-bottom{margin-top:auto;display:grid;gap:12px}.avatar-row{display:flex;align-items:center;gap:9px;padding-top:16px;border-top:1px solid var(--line)}.avatar{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#e3edeb;color:var(--navy);font-weight:800;flex:none}.main{min-width:0;padding:30px clamp(18px,4vw,62px) 68px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px;flex-wrap:wrap}.top-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.chip{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:100px;background:#edf2f1;color:#42656b;font-size:12px;font-weight:700}.chip.demo{background:#fff2d9;color:#805818}.pill{font-size:12px;border-radius:50px;padding:6px 10px;display:inline-block;background:#eef3f3;color:#42656b;font-weight:750}.pill.urgent{color:#a04e24;background:#fff0e0}.pill.done{color:#186655;background:#ddf3e9}.pill.waiting{color:#705e9e;background:#f0eaff}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.15em;font-weight:800;color:var(--teal);margin-bottom:9px}.page-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:22px;flex-wrap:wrap}.page-head p{margin-top:10px;color:var(--muted);max-width:700px}.hero{background:linear-gradient(118deg,#174850,#0b3540);color:#fff;border-radius:22px;padding:30px 34px;display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;margin-bottom:24px;overflow:hidden;position:relative}.hero:after{content:'';position:absolute;width:240px;height:240px;border:1px solid #ffffff22;border-radius:50%;right:-60px;top:-95px;box-shadow:0 0 0 45px #ffffff07,0 0 0 90px #ffffff06;pointer-events:none}.hero h1{font-size:clamp(25px,3vw,34px);max-width:560px}.hero p{max-width:610px;color:#d5e8e6;margin-top:10px}.hero .btn{position:relative;z-index:1}.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 26px}.metric{padding:21px;border-radius:16px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow)}.metric small{display:block;font-weight:700;color:var(--muted);font-size:13px}.metric strong{display:block;font-family:Manrope,sans-serif;color:var(--navy);font-size:32px;letter-spacing:-.06em;margin-top:5px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:28px 0 15px}.stack{display:grid;gap:12px}.task-card{border:1px solid var(--line);border-radius:17px;padding:19px;background:#fff;box-shadow:var(--shadow);display:grid;grid-template-columns:42px 1fr auto;align-items:start;gap:15px}.task-icon{width:42px;height:42px;border-radius:12px;background:#e4f4ef;display:grid;place-items:center;font-size:21px}.task-main{min-width:0}.task-main h3{margin:3px 0 5px}.task-main p{font-size:13px;color:var(--muted);margin-top:5px}.task-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.task-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.btn{border:0;background:var(--navy);color:#fff;padding:12px 17px;border-radius:11px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:43px;text-decoration:none;transition:transform .1s,background .1s}.btn:hover:not(:disabled){background:#205762;transform:translateY(-1px)}.btn:active{transform:none}.btn.secondary{color:var(--navy);background:#e7f1ef}.btn.secondary:hover{background:#d5e9e5}.btn.outline{background:#fff;color:var(--navy);border:1px solid #bbceca}.btn.outline:hover{background:#eff7f4}.btn.ghost{background:transparent;color:var(--navy)}.btn.danger{background:var(--red)}.btn.white{background:#fff;color:var(--navy)}.btn.small{padding:9px 12px;min-height:34px;font-size:13px}.btn.wide{width:100%}.form-card,.panel{border:1px solid var(--line);border-radius:20px;background:#fff;padding:25px;box-shadow:var(--shadow)}.form-card{max-width:920px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:grid;gap:7px;min-width:0}.field.full{grid-column:1/-1}.field label,.field .label{font-weight:750;font-size:13px;color:#33535b}.field input,.field textarea,.field select{min-width:0;width:100%;padding:12px 13px;border:1px solid #ccdbd8;border-radius:10px;background:#fff;color:var(--text);outline:0}.field textarea{min-height:100px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:#378781;box-shadow:0 0 0 3px #def0eb}.field .hint{font-size:12px;color:var(--muted)}.form-divider{height:1px;background:var(--line);margin:23px 0}.step-title{display:flex;gap:12px;align-items:center;margin-bottom:16px}.step-num{width:28px;height:28px;border-radius:50%;background:var(--mint);color:var(--navy);display:grid;place-items:center;font-size:13px;font-weight:800}.recorder{background:#f2f7f6;border:1px dashed #adcdc8;border-radius:15px;padding:20px;display:grid;gap:13px}.recorder .rec-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.rec-dot{width:13px;height:13px;border-radius:50%;background:#c7575b;display:inline-block;box-shadow:0 0 0 6px #ffe2e3}.recorder audio{max-width:100%;width:100%}.voice-box{display:grid;gap:8px}.voice-box button{justify-self:start}.alert{background:#fff6e6;border:1px solid #f6dfb6;border-radius:12px;padding:13px 15px;color:#6d501c;font-size:13px}.notice{background:#eaf4f1;border:1px solid #c6e4dc;border-radius:12px;padding:13px 15px;color:#225e54;font-size:13px}.dangerbox{background:#fff0f0;border:1px solid #f3c9c9;border-radius:12px;padding:13px 15px;color:#963b3b;font-size:13px}.grid2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(275px,1fr);gap:20px}.detail-header{display:flex;justify-content:space-between;align-items:start;gap:14px;flex-wrap:wrap;margin-bottom:22px}.detail-header h1{margin:4px 0}.concepts{display:flex;gap:9px;flex-wrap:wrap;margin-top:10px}.concept{border-radius:12px;padding:10px 14px;background:#e7f3ee;color:#145b55;font-weight:800}.detail-line{margin:19px 0;border:0;border-top:1px solid var(--line)}.audio-player{width:100%;margin:10px 0}.evidence-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;margin:14px 0}.photo{aspect-ratio:1;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#edf2f0;display:grid;place-items:center}.photo img{width:100%;height:100%;object-fit:cover}.photo figcaption{font-size:11px}.drop-photo{min-height:120px;border:1px dashed #b4cfc8;border-radius:13px;padding:17px;text-align:center;background:#f6faf8;display:grid;place-items:center;gap:7px}.drop-photo input{max-width:100%}.evaluation{display:flex;gap:9px;flex-wrap:wrap}.choice{display:flex;align-items:center;gap:6px;border:1px solid #cddcd9;border-radius:11px;padding:11px 13px;cursor:pointer;flex:1;min-width:130px}.choice:has(input:checked){border-color:#318276;background:#eaf6f1}.choice input{accent-color:var(--teal)}.calendar-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:17px;flex-wrap:wrap}.calendar-month{font-family:Manrope,sans-serif;font-weight:800;font-size:20px}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.calendar-weekday{font-size:12px;color:var(--muted);text-align:center;font-weight:800;padding:5px}.calendar-day{min-height:94px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:9px;text-align:left;display:flex;flex-direction:column;gap:7px}.calendar-day.off{opacity:.4}.calendar-day.today{border-color:#68ada4;box-shadow:0 0 0 1px #68ada4 inset}.calendar-day:hover{border-color:#2b8880}.calendar-day .num{font-weight:800}.calendar-day .dot-row{display:flex;gap:4px;flex-wrap:wrap}.calendar-day .dot{height:7px;width:7px;border-radius:50%;background:var(--teal)}.calendar-day .count{font-size:10px;color:var(--muted)}.calendar-day.active{background:#e3f3ee;border-color:#208377}.empty{padding:50px 30px;border:1px dashed #c9dad5;text-align:center;border-radius:17px;background:#fbfdfc}.empty .big{font-size:44px;margin-bottom:8px}.empty h3{margin-bottom:5px}.login-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-left{background:linear-gradient(135deg,#123d46,#0d3038);color:#fff;padding:8vw 6vw;display:flex;flex-direction:column;justify-content:space-between;gap:60px}.login-left .brand{color:#fff}.login-left p{color:#c7dfdb}.login-left h1{font-size:clamp(32px,4vw,52px);max-width:510px}.login-right{display:grid;place-items:center;padding:30px}.login-box{width:min(430px,100%);background:#fff;border-radius:20px;padding:32px;border:1px solid var(--line)}.login-box h2{margin-bottom:7px}.login-box form{display:grid;gap:15px;margin-top:24px}.toast{position:fixed;right:22px;bottom:22px;max-width:450px;background:var(--navy);color:#fff;padding:14px 19px;border-radius:13px;box-shadow:0 15px 30px #122e3350;opacity:0;transform:translateY(10px);transition:opacity .2s,transform .2s;z-index:100;pointer-events:none}.toast.show{opacity:1;transform:translateY(0)}.loading{height:30vh;display:grid;place-items:center;font-weight:700;color:var(--muted)}.linklike{border:0;background:transparent;color:#1d7771;font-weight:800;padding:0;text-decoration:underline;text-underline-offset:3px}.divider{height:1px;background:var(--line);margin:22px 0}.two-col-split{display:grid;grid-template-columns:1fr 1fr;gap:15px}.compact{padding:17px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.rec-indicator{background:#fff0f0;color:#ae4045;padding:5px 10px;border-radius:30px;font-size:12px;font-weight:800}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.help-value{display:block;margin-top:5px;color:#53707a;font-size:13px}.footer-note{padding-top:26px;color:var(--muted);font-size:12px}.spinner{display:inline-block;width:15px;height:15px;border:2px solid #fff7;border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1080px){.app-shell{grid-template-columns:210px minmax(0,1fr)}.sidebar{padding:22px 13px}.main{padding:25px 24px 50px}.grid2{grid-template-columns:1fr}}
@media(max-width:760px){.app-shell{display:block;padding-bottom:69px}aside.sidebar{height:auto;position:fixed;inset:auto 0 0 0;padding:6px 8px calc(5px + env(safe-area-inset-bottom));background:#fff;z-index:50;box-shadow:0 -5px 25px #122e3314;border-top:1px solid var(--line)}aside.sidebar>div:first-child,.sidebar-bottom{display:none}.sidebar nav{display:flex;justify-content:space-around;gap:4px}.nav-btn{flex:1;flex-direction:column;gap:1px;font-size:10px;min-width:0;padding:7px 2px;text-align:center}.nav-icon{width:auto;font-size:20px}.main{padding:17px 16px 35px}.topbar{margin-bottom:18px}.hero{padding:23px 22px;grid-template-columns:1fr}.cards3{gap:8px}.metric{padding:15px 13px}.metric strong{font-size:27px}.metric small{font-size:11px}.form-grid,.two-col-split{grid-template-columns:1fr}.task-card{grid-template-columns:38px 1fr;gap:10px}.task-actions{grid-column:2}.task-icon{width:38px;height:38px}.form-card,.panel{padding:18px}.calendar-grid{gap:3px}.calendar-day{min-height:76px;padding:6px;border-radius:7px}.calendar-day .num{font-size:12px}.calendar-weekday{font-size:10px}.login-shell{grid-template-columns:1fr}.login-left{padding:25px;min-height:210px;gap:22px}.login-left h1{font-size:27px}.login-right{padding:17px}.login-box{padding:23px}.top-right .chip{padding:6px 9px}}

/* ECO · formulario familiar a la vista (auditoría UI) */
.family-response-card{scroll-margin-top:18px}
.family-response-card .card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.family-response-card .reply-photo-actions{display:flex;gap:9px;flex-wrap:wrap}
.family-response-card .upload-label{flex:1;min-width:125px;display:flex;text-align:center;cursor:pointer}
.family-response-card .family-recorder{padding:14px;gap:9px}
.family-response-card .stack{gap:17px}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.upload-label:focus-within,.upload-label:focus-visible{outline:3px solid #40a7c7;outline-offset:2px}
@media(max-width:760px){.family-response-card{padding:19px}.family-response-card .reply-photo-actions .btn{min-height:49px}}

/* ECO PUENTE · Acceso por dos portales — solo demostración */
.eco-brand-icon{width:47px;height:47px;object-fit:contain;border-radius:11px;background:#f5f9f7;border:1px solid #d8e7e3;padding:4px;flex:none}
.eco-gate{min-height:100vh;max-width:1100px;padding:20px 20px 62px;margin:0 auto;display:flex;flex-direction:column;justify-content:center;gap:20px}
.eco-gate-brand{text-align:center}.eco-gate-bridge{display:block;width:min(720px,100%);height:auto;margin:0 auto -4px}.eco-gate-brand h1{font-size:clamp(40px,5vw,62px);color:#113e46;letter-spacing:.05em}.eco-gate-brand .subtitle{font-size:17px;letter-spacing:.16em;font-weight:800;color:#235963}.eco-gate-brand .strapline{font-size:16px;font-style:italic;color:#4d7580;margin:8px 0 6px}
.eco-gate-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.eco-role-card{background:#fff;border:1px solid #cbdedd;border-radius:20px;padding:27px;box-shadow:0 8px 24px #19475211}
.eco-role-card.family{border-color:#eed6b5;background:#fffcf7}
.eco-role-heading{display:flex;align-items:center;gap:13px;margin-bottom:15px}.eco-role-symbol{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#d5f0ea;color:#14544e;font-size:27px}.eco-role-card.family .eco-role-symbol{background:#ffdfab;color:#855617}
.eco-role-heading h2{font-size:22px}.eco-role-heading p{font-size:13px;color:#5e7880;margin-top:4px}
.eco-role-card form{display:grid;gap:13px}.eco-role-card input{width:100%;min-height:48px;border-radius:11px;padding:12px 14px;background:#fff;border:1px solid #bdcdcd;font-size:17px}
.eco-role-card .btn{width:100%;min-height:49px}.eco-role-card.family .btn{background:#b77b2a}.eco-role-card.family .btn:hover{background:#946018}
.eco-gate-disclaimer{text-align:center;padding:11px 18px;background:#fff2dd;border-radius:12px;color:#805515;max-width:830px;margin:0 auto;font-size:13px}
.eco-gate-features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;text-align:center;color:#345e62;font-size:13px}.eco-gate-features>div{padding:12px 4px}.eco-gate-features b{display:block;font-size:20px;margin-bottom:5px}
.eco-session-btn{white-space:nowrap}
@media(max-width:690px){.eco-gate{padding:9px 15px 92px;gap:15px;justify-content:flex-start}.eco-gate-grid{grid-template-columns:1fr;gap:12px}.eco-role-card{padding:20px}.eco-role-heading h2{font-size:19px}.eco-gate-bridge{width:100%}.eco-gate-features{grid-template-columns:repeat(2,1fr)}.eco-gate-brand h1{font-size:40px}.eco-gate-brand .strapline{font-size:14px}}