:root{
  --navy:#003f5c;
  --navy-dark:#042f43;
  --navy-deep:#03283a;
  --turq:#00a6a6;
  --green:#75c900;
  --green-soft:#edf8f0;
  --green-soft-2:#f6fbf7;
  --bg:#f7fbf8;
  --text:#082f43;
  --muted:#536b7b;
  --line:#d8e7e9;
  --card:#ffffff;
  --shadow:0 16px 42px rgba(0,63,92,.10);
}
*{box-sizing:border-box}
html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--text);background:linear-gradient(120deg,#fff 0%,#f8fbfb 62%,#eef9ef 100%)}
button,input,select,textarea{font-family:inherit}button{cursor:pointer}

/* Pantalla de acceso: similar a la Rueda, compacta y sin scroll */
.access-page{height:100%;display:grid;grid-template-rows:154px 1fr 30px;overflow:hidden;background:linear-gradient(120deg,#fff 0%,#fbfdfd 62%,#edf8ef 100%)}
.access-head{position:relative;border-bottom:1px solid var(--line);background:rgba(255,255,255,.94)}
.access-logo{position:absolute;left:4.6vw;top:12px;height:130px;width:auto;display:block}
.access-center-title{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--navy)}
.access-center-title h1{font-size:44px;line-height:1;margin:0 0 7px;font-weight:950;letter-spacing:-.4px}.access-center-title p{margin:0;color:#66798a;font-size:17px;font-weight:850}
.access-main{min-height:0;display:flex;align-items:flex-start;justify-content:center;padding:36px 24px 0}.access-wrap{width:min(780px,82vw);text-align:center}.kicker{font-weight:950;letter-spacing:7px;color:#35a442;text-transform:uppercase;font-size:11px;margin-bottom:10px}.access-title{font-size:30px;line-height:1.05;margin:0 0 9px;color:var(--navy);font-weight:950;letter-spacing:-.8px}.access-desc{font-size:15px;color:var(--muted);max-width:660px;margin:0 auto 18px;line-height:1.25}.access-card{background:var(--card);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);padding:20px 26px;text-align:left}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}.card-title{font-size:24px;font-weight:950;color:var(--navy);margin:0 0 5px}.card-note{font-size:13px;color:var(--muted);margin:0}.pill{border:1px solid #dfece2;background:#f2f8f2;color:#597062;border-radius:999px;padding:7px 14px;font-size:11px;font-weight:950;white-space:nowrap}.actions{display:flex;align-items:center;gap:12px}.btn{border:0;border-radius:12px;padding:14px 26px;font-size:15px;font-weight:950;color:white;background:linear-gradient(135deg,var(--navy),var(--turq),var(--green));cursor:pointer}.foot{display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:850;color:#677885;border-top:1px solid #edf3f3;background:rgba(255,255,255,.7)}

/* Evaluación */
.eval-page{height:100%;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
.eval-top{height:128px;flex:0 0 128px;display:flex;align-items:center;justify-content:space-between;padding:0 4.2vw 0 3.1vw;background:linear-gradient(90deg,#bfe8c6 0%,#d8f2dd 54%,#aee2ba 100%);border-bottom:1px solid #85ca94}
.eval-titleblock{display:flex;align-items:center;gap:14px}.eval-titleblock img{height:106px;width:auto;display:block}.eval-head-text strong{display:block;font-size:38px;color:var(--navy);font-weight:950;line-height:1}.eval-head-text span{font-size:17px;font-weight:950;color:#19485f}.eval-chip{background:rgba(117,201,0,.12);border:1px solid rgba(117,201,0,.35);color:#276b2d;border-radius:999px;padding:7px 16px;font-size:12px;font-weight:950}
.eval-main{flex:1;min-height:0;display:grid;grid-template-rows:auto auto 1fr;background:linear-gradient(120deg,#fff 0,#f8fbfa 62%,#edf8f0 100%);overflow:hidden}.eval-hero{padding:8px 5.0vw 3px}.eval-hero .kicker{font-size:10px;margin-bottom:4px;letter-spacing:6px}.eval-hero h1{margin:0;color:#0e3b2e;font-size:28px;letter-spacing:-.7px;line-height:1}.eval-hero p{margin:4px 0 0;color:#3f586b;font-size:13px;font-weight:950}.progress-wrap{padding:0 5.0vw 5px}.progress-meta{display:flex;justify-content:space-between;font-weight:950;color:var(--navy);font-size:13px;margin-bottom:5px}.progress-bar{height:7px;background:#e1efe7;border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--turq),var(--green));width:0}
.eval-scroll{min-height:0;overflow:hidden;padding:7px 5.0vw 12px}.area-card{height:100%;background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:0 12px 32px rgba(0,63,92,.06);padding:14px 18px;display:grid;grid-template-rows:auto 1fr auto;align-content:stretch;overflow:hidden}.area-top{display:block;margin-bottom:6px}.area-num{font-size:11px;letter-spacing:5px;color:#37a03e;font-weight:950;text-transform:uppercase}.area-title{font-size:28px;color:var(--navy);margin:3px 0}.area-help{font-size:14px;color:#233f54;margin:0;line-height:1.16;font-weight:1000}.ind-list{min-height:0;height:100%;overflow:hidden;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:9px}.indicator{border:1px solid var(--line);border-radius:13px;padding:10px 12px;display:grid;grid-template-columns:1.08fr 202px 1.28fr;gap:12px;align-items:center;min-height:0;height:100%}.ind-title{font-size:15px;font-weight:1000;color:var(--navy);margin-bottom:3px}.ind-mide{font-size:13px;color:#2a465a;line-height:1.14;font-weight:1000}.score-row{display:grid;grid-template-columns:repeat(5,32px);gap:5px;align-content:start}.score{width:32px;height:29px;border:1px solid #cfdde3;border-radius:8px;background:#fff;color:var(--navy);font-weight:950;font-size:13px}.score.active{background:linear-gradient(135deg,var(--turq),var(--green));color:#fff;border-color:transparent}.comment-label{font-size:13px;font-weight:950;color:var(--navy);margin-bottom:5px}.comment{width:100%;height:58px;resize:none;border:1px solid #cfdde3;border-radius:11px;padding:9px 12px;font-size:13px;line-height:1.2}.nav-row{display:flex;justify-content:space-between;gap:16px;margin-top:10px}.nav-btn{border:1px solid #cbdde3;background:#fff;color:var(--navy);border-radius:12px;padding:11px 22px;font-weight:950;font-size:14px}.nav-btn.primary{background:var(--navy);border-color:var(--navy);color:white}.nav-btn:disabled{opacity:.4;cursor:not-allowed}
.sent-card{height:100%;display:flex;align-items:center;justify-content:center;text-align:center}.sent-box{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:34px;max-width:620px}.sent-box h2{font-size:32px;color:var(--navy);margin:0 0 10px}.sent-box p{font-size:16px;color:var(--muted);font-weight:800;line-height:1.4}
@media(max-width:1100px){.indicator{grid-template-columns:1fr}.score-row{grid-template-columns:repeat(10,34px)}.ind-list{overflow:auto}.area-card{overflow:hidden}.access-title{font-size:28px}.access-logo{left:20px}}
@media(max-width:720px){.access-page{grid-template-rows:96px 1fr 28px}.access-logo{height:68px;left:16px;top:8px}.access-center-title h1{font-size:23px}.access-center-title p{display:none}.access-main{padding-top:24px}.access-title{font-size:27px}.access-card{padding:18px}.card-head{display:block}.pill{display:inline-block;margin-top:10px}.eval-top{height:76px;flex-basis:76px;padding-left:18px;padding-right:18px}.eval-hero{padding:10px 18px 5px}.progress-wrap,.eval-scroll{padding-left:18px;padding-right:18px}.area-card{padding:12px}.score-row{grid-template-columns:repeat(5,32px)}.eval-titleblock img{height:62px}.eval-head-text strong{font-size:24px}}

.validation-msg{display:none;margin:10px 0 8px;padding:10px 14px;border:1px solid #f2c94c;background:#fff8df;color:#704c00;border-radius:14px;font-weight:800;font-size:14px;}
.validation-msg.show{display:block;}

.missing-area-link{border:0;background:transparent;color:#004b70;font:inherit;font-weight:950;text-decoration:underline;cursor:pointer;padding:0 2px;}
.missing-area-link:hover{color:#0a8f39;}
.session-picker{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}.session-option{border:1px solid #cbdde3;background:#fff;color:var(--navy);border-radius:11px;padding:10px 18px;font-weight:950;font-size:14px}.session-option.active{background:linear-gradient(135deg,var(--navy),var(--turq),var(--green));color:#fff;border-color:transparent}.sent-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:20px}

/* v17: información pendiente, sin guardado local */
.pending-storage-note{margin:8px 0 2px;padding:9px 12px;border:1px solid #84bd67;background:#eef8e9;color:#2f6f2a;border-radius:11px;font-size:12.5px;line-height:1.25;font-weight:750;text-align:center}.pending-storage-note strong{color:#2f7d32;font-weight:950}

/* v18: validación real de Cliente_ID + Email + Autorizacion_ID + sesión */
.access-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 14px}
.access-field{display:flex;flex-direction:column;gap:6px}
.access-field span{font-size:12px;font-weight:950;color:var(--navy)}
.access-field input{width:100%;height:44px;border:1px solid #cbdde3;border-radius:10px;padding:0 12px;font-size:14px;color:var(--text);background:#fff;outline:none}
.access-field input:focus{border-color:var(--turq);box-shadow:0 0 0 3px rgba(0,166,166,.12)}
.access-field input:disabled,.session-option:disabled,.btn:disabled{opacity:.65;cursor:not-allowed}
#accessValidationMsg{margin:0 0 12px}
@media(max-width:820px){.access-fields{grid-template-columns:1fr}.access-page{overflow:auto;height:auto;min-height:100%}.access-main{padding-bottom:28px}.access-wrap{width:min(780px,94vw)}}