#acceso-dialog{width:min(640px,90vw);max-height:85vh;overflow:auto;border:1px solid #bcd2dc;border-radius:12px;padding:24px;color:#193e4c;background:white;font:inherit}
#acceso-dialog::backdrop{background:rgb(19 48 60 / 45%)}
#acceso-dialog label{display:block;margin:16px 0}
#acceso-dialog input{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:10px}
#acceso-dialog button{margin:4px}
#acceso-dialog #status{padding:12px;background:#eef5f7}
#acceso-dialog [hidden]{display:none!important}
#cerrar-cuenta{float:right}
#acceso-contexto{border-left:3px solid #17788d;padding:10px;background:#eef5f7}
#abrir-cuenta{white-space:normal;width:194px;max-width:100%;min-height:44px}
@media(max-width:700px){.cabecera-app{flex-wrap:wrap}#abrir-cuenta{margin-left:auto}}
.pagina-cuenta{background:#eef4f6;color:#193e4c;min-height:100vh;margin:0;padding:32px 16px;box-sizing:border-box}
.tarjeta-cuenta{max-width:560px!important;margin:3vh auto;padding:32px!important;background:#fff;border:1px solid #d3e2e7;border-radius:16px;box-shadow:0 12px 40px #193e4c0b}
.acceso-marca{display:flex;gap:12px;align-items:center;margin-bottom:24px}.acceso-marca>span{display:grid;place-items:center;background:#193e4c;color:white;font-size:28px;font-weight:700;border-radius:10px;width:48px;height:48px}.acceso-marca p{font-weight:650;margin:0}.acceso-marca small{display:block;font-weight:400;color:#58727e;margin-top:3px;font-size:12px}
#acceso-titulo{font-size:26px;line-height:1.2;margin:12px 0;color:#193e4c}.acceso-intro,.acceso-nota{font-size:14px;line-height:1.6;color:#526e7b}
.tarjeta-cuenta #status,#acceso-dialog #status{font-size:14px;border-radius:6px;padding:12px;background:#eef5f7}
.tarjeta-cuenta label,#acceso-dialog label{display:block;margin:16px 0 6px;font-weight:600;font-size:14px}.tarjeta-cuenta input,#acceso-dialog input{width:100%;box-sizing:border-box;border:1px solid #adc8d3;border-radius:7px;padding:12px;font:inherit;background:white;color:#193e4c}
#password-help{display:block;margin-top:6px;color:#58727e;font-size:12px}.acceso-acciones{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.tarjeta-cuenta button,#acceso-dialog button,.acceso-acciones .action{border:1px solid #17788d;background:#17788d;color:white;border-radius:7px;padding:11px 16px;font:inherit;font-size:14px;cursor:pointer;text-decoration:none}
.tarjeta-cuenta .acceso-secundario,#acceso-dialog .acceso-secundario,#acceso-dialog #cerrar-cuenta{background:white;color:#17687c;border-color:#adc8d3}
.tarjeta-cuenta .acceso-enlace,#acceso-dialog .acceso-enlace{background:transparent;border:0;color:#17687c;padding:12px 0;text-decoration:underline;text-underline-offset:3px}
.acceso-pie{display:flex;gap:20px;flex-wrap:wrap;border-top:1px solid #d3e2e7;margin-top:22px;padding-top:16px;font-size:13px}.acceso-pie a{color:#17687c}.acceso-identidad{overflow-wrap:anywhere}
.tarjeta-cuenta [hidden]{display:none!important}#demo-output table{width:100%;border-collapse:collapse}#demo-output th,#demo-output td{text-align:right;padding:9px;border-bottom:1px solid #d3e2e7;font-size:13px}
.demo-ejemplo{margin-top:24px;border:1px solid #bfd4dd;border-radius:10px;padding:18px}.demo-ejemplo summary{font-weight:650;color:#17687c;cursor:pointer}.demo-fichas{display:flex;flex-wrap:wrap;gap:16px;background:#edf5f7;padding:14px;border-radius:8px}.demo-ejemplo th,.demo-ejemplo td{text-align:right!important;font-size:13px;padding:9px}.demo-ejemplo svg{width:100%;height:auto}.demo-ejemplo svg text{fill:#405e6b;font-size:13px}.demo-ejemplo h3{margin-top:22px}
#demo-ejemplo .perfil-leyenda-item svg{width:36px!important;height:12px!important;min-width:36px;max-width:36px!important;flex:0 0 36px}
#demo-ejemplo table{table-layout:fixed;width:100%}#demo-ejemplo th,#demo-ejemplo td{width:auto!important;text-align:center!important;font-variant-numeric:tabular-nums}
/* One project toolbar, with the file help below its actions. */
.espacio-trabajo .cabecera-app .logo-cbal{margin-left:auto;margin-right:24px}.espacio-trabajo #abrir-cuenta{flex:none;margin:0}
.espacio-trabajo #proyecto-barra{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:4px 24px;align-items:center}
.espacio-trabajo #proyecto-barra .proyecto-identidad{grid-column:1;grid-row:1 / span 2;display:grid;grid-template-columns:minmax(200px,390px);gap:7px}
.espacio-trabajo #proyecto-barra .proyecto-identidad input{width:100%;max-width:none;box-sizing:border-box}
.espacio-trabajo #proyecto-barra .proyecto-acciones{grid-column:2;grid-row:1;justify-content:flex-end;display:flex;gap:8px}
.espacio-trabajo #proyecto-barra .proyecto-nota{grid-column:2;grid-row:2;max-width:380px;text-align:right;margin:3px 0 0;font-size:11px}
.espacio-trabajo #proyecto-estado,.espacio-trabajo #borrador-local,.espacio-trabajo #proyecto-reintentar{grid-column:1 / -1}.espacio-trabajo #proyecto-estado:empty{display:none}
.inicio-planes{display:inline-block;margin:8px 0 14px;font-size:13px}
@media(max-width:650px){.espacio-trabajo #proyecto-barra{grid-template-columns:1fr}.espacio-trabajo #proyecto-barra .proyecto-identidad{grid-row:auto;grid-column:1;grid-template-columns:1fr}.espacio-trabajo #proyecto-barra .proyecto-acciones{grid-column:1;grid-row:auto;justify-content:flex-start;flex-wrap:wrap;margin-top:8px}.espacio-trabajo #proyecto-barra .proyecto-nota{grid-column:1;grid-row:auto;text-align:left}.espacio-trabajo .cabecera-app .logo-cbal{margin-right:0}.espacio-trabajo #abrir-cuenta{margin-left:auto;margin-top:8px}}
/* Refined shared dialog geometry and brand. */
#acceso-dialog,#planes-dialog{box-sizing:border-box;border:1px solid #d4e1e6;border-radius:14px;padding:30px;max-height:90vh;box-shadow:0 20px 70px #173f5026;color:#193e4c;background:#fff}
#acceso-dialog{width:min(570px,calc(100vw - 32px))}#planes-dialog{width:min(940px,calc(100vw - 32px))}
#planes-dialog::backdrop{background:rgb(19 48 60 / 45%)}
#acceso-dialog .dialog-cerrar,#planes-dialog .dialog-cerrar{position:absolute;right:14px;top:12px;float:none;display:grid;place-items:center;width:32px;height:32px;min-height:0;padding:0;margin:0;border:0;border-radius:6px;background:transparent;color:#526e7b;font:400 25px/1 sans-serif;cursor:pointer}
#acceso-dialog .dialog-cerrar:hover,#planes-dialog .dialog-cerrar:hover{background:#edf4f6}
.acceso-marca>span{width:42px;height:42px;flex:0 0 42px;border-radius:12px 12px 12px 3px;font-size:23px;font-weight:650;background:#173f50}
#acceso-dialog .acceso-marca,#planes-dialog .acceso-marca{margin:2px 34px 22px 0}
#acceso-contexto{margin:18px 24px 18px 0;font-size:13px;line-height:1.5}
#acceso-dialog .acceso-acciones{align-items:center;gap:10px}
#acceso-dialog .acceso-acciones button,#acceso-dialog .acceso-acciones .action{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:42px;padding:10px 16px;margin:0;line-height:1.35;font-size:14px;text-align:center;cursor:pointer}
#acceso-dialog .acceso-pie{padding:16px 0 0;margin-top:20px;gap:12px 20px}
#planes-dialog h2{font-size:27px;margin:8px 0 12px}#planes-dialog .planes-dialog-opciones{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}
#planes-dialog .plan{border:1px solid #c9dce4;border-radius:10px;padding:22px}#planes-dialog .completo{border:2px solid #17788d;padding:21px}
#planes-dialog .plan-etiqueta{font-size:10px;letter-spacing:1px;font-weight:700;color:#176c80}#planes-dialog .plan h2{font-size:22px;margin:10px 0}#planes-dialog .plan p{font-size:13px;line-height:1.6;color:#526e7b}
#planes-dialog .plan-precio{font-size:34px;font-weight:700;margin:20px 0}#planes-dialog .plan-precio span{font-size:13px;font-weight:400}#planes-dialog .plan-boton{width:100%;min-height:42px;border:1px solid #c5d7df;border-radius:6px;background:#eaf1f4;color:#486471;padding:10px;font:inherit;font-size:13px;opacity:1}
#planes-dialog h3{font-size:14px;margin:20px 0 12px}#planes-dialog ul{padding-left:18px}#planes-dialog li{font-size:13px;line-height:1.5;margin-bottom:8px}#planes-dialog .plan-nota{border-top:1px solid #dbe5ea;padding-top:12px;font-size:11px}
#planes-dialog .planes-dialog-aviso{font-size:12px;color:#526e7b;margin:16px 0}.planes-dialog-pie{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid #dbe5ea;padding-top:16px}.planes-dialog-pie button{background:white;color:#176c80;border:1px solid #b8d1db;border-radius:6px;padding:10px 14px;font:inherit;font-size:13px}.planes-dialog-pie a{font-size:13px;color:#176c80}
@media(max-width:640px){#acceso-dialog,#planes-dialog{padding:22px}#planes-dialog .planes-dialog-opciones{grid-template-columns:1fr}#acceso-dialog .acceso-acciones>*{flex:1 1 auto}}

#planes-dialog .plan-boton[data-pago]{background:#17788d;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}#pago-estado{padding:12px 16px;border-left:3px solid #17788d;background:#edf5f7;color:#193e4c;font-size:14px;line-height:1.5;max-width:1050px;margin:16px auto}

@media(min-width:641px){#planes-dialog .planes-dialog-opciones{row-gap:0}#planes-dialog .plan{display:grid;grid-template-rows:subgrid;grid-row:span 8;row-gap:0}#planes-dialog .plan>.plan-boton{align-self:start}#planes-dialog .plan>.plan-nota{align-self:end}}

/* Los planes tienen el mismo peso; el énfasis responde a la interacción. */
#planes-dialog .plan,#planes-dialog .plan.completo{border:1px solid #c8dce4;padding:22px;transition:border-color .18s ease,box-shadow .18s ease;}
#planes-dialog .plan .plan-boton:not(:disabled){background:#fff;color:#176c80!important;border:1px solid #17788d;transition:background .18s ease,color .18s ease;}
#planes-dialog .plan:focus-within{border-color:#17788d;box-shadow:0 0 0 1px #17788d,0 8px 24px #173f500c;}
#planes-dialog .plan:focus-within .plan-boton:not(:disabled){background:#17788d;color:#fff!important;}
#planes-dialog .plan-boton:focus-visible{outline:2px solid #193e4c;outline-offset:4px;}
@media(hover:hover){
 #planes-dialog .plan:hover{border-color:#17788d;box-shadow:0 0 0 1px #17788d,0 8px 24px #173f500c;}
 #planes-dialog .plan:hover .plan-boton:not(:disabled){background:#17788d;color:#fff!important;}
}
@media(prefers-reduced-motion:reduce){#planes-dialog .plan,#planes-dialog .plan .plan-boton{transition:none;}}
/* Comparación completa dentro del estudio, sin abrir otra pestaña. */
@media(min-width:1000px){#planes-dialog{max-width:1180px;width:calc(100vw - 64px)}#planes-dialog .planes-dialog-opciones{grid-template-columns:repeat(3,minmax(0,1fr))}}
#gestionar-suscripcion,#mis-facturas{margin:8px 10px 8px 0;min-height:42px}
#lista-portales,#lista-facturas{font-size:.9rem;overflow-wrap:anywhere}

.acceso-modos{display:flex;gap:8px;padding:5px;background:#edf4f6;border-radius:10px;margin:20px 0}.acceso-modos button{flex:1}.tarjeta-cuenta .acceso-modos button,#acceso-dialog .acceso-modos button{background:transparent;color:#17687c;border-color:transparent}.tarjeta-cuenta .acceso-modos button[aria-pressed="true"],#acceso-dialog .acceso-modos button[aria-pressed="true"]{background:white;border-color:#adc8d3;box-shadow:0 2px 5px #193e4c12}.verificacion-ayuda{background:#edf6f7;padding:14px 18px;border-radius:10px;line-height:1.6;font-size:14px}#verificacion-titulo{font-size:22px}#acceso-submit{width:100%}.tarjeta-cuenta button:disabled,#acceso-dialog button:disabled{opacity:.65;cursor:wait}.tarjeta-cuenta button:focus-visible,#acceso-dialog button:focus-visible{outline:3px solid #49a6bc;outline-offset:3px}
