*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{
  font-family:'Nunito',system-ui,sans-serif;font-size:var(--fs-base);
  background:var(--bg);color:var(--text-1);min-height:100dvh;
}
a{color:var(--brand-primary);}

.auth-shell{max-width:460px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);}
.auth-topbar{padding:var(--s-4) var(--s-5) 0;}
.auth-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-3);}
.auth-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-2);font-family:'Nunito',sans-serif;font-size:var(--fs-sm);font-weight:700;cursor:pointer;padding:var(--s-1);text-decoration:none;}
.auth-back svg{width:18px;height:18px;}
.auth-skip{background:none;border:none;color:var(--text-3);font-family:'Nunito',sans-serif;font-size:var(--fs-sm);font-weight:700;cursor:pointer;text-decoration:none;}

.a11y-quick{display:flex;align-items:center;gap:6px;}
.a11y-theme-form{display:flex;gap:4px;margin:0;}
.a11y-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--r-full);border:1.5px solid var(--border);background:var(--surface);font-size:13px;font-weight:800;line-height:1;cursor:pointer;color:var(--text-2);text-decoration:none;padding:0;font-family:'Nunito',sans-serif;transition:all var(--dur-fast) var(--ease);}
.a11y-btn:hover{border-color:var(--brand-primary);color:var(--brand-primary);}
.a11y-btn.is-active{border-color:var(--brand-primary);background:var(--brand-primary-light);color:var(--brand-primary);}
.a11y-btn:focus-visible{outline:3px solid var(--brand-primary-light);outline-offset:2px;}

.step-track{display:flex;gap:6px;}
.step-dot{flex:1;height:5px;border-radius:var(--r-full);background:var(--border-subtle);}
.step-dot.done{background:var(--brand-secondary);}
.step-dot.current{background:var(--brand-primary);}
.step-caption{font-size:var(--fs-xs);color:var(--text-3);font-weight:700;text-transform:uppercase;letter-spacing:.4px;margin-top:var(--s-2);}

.auth-content{flex:1;padding:var(--s-4) var(--s-5) var(--s-8);display:flex;flex-direction:column;gap:var(--s-4);}

.badge{display:inline-flex;align-items:center;gap:4px;padding:3px var(--s-2);border-radius:var(--r-full);font-size:var(--fs-xs);font-weight:700;line-height:1;}
.badge-primary{background:var(--brand-primary-light);color:var(--brand-primary);}
.badge-secondary{background:var(--brand-secondary-light);color:var(--brand-secondary);}

.card{background:var(--surface);border-radius:var(--r-lg);padding:var(--s-4);box-shadow:var(--sh-sm);border:1px solid var(--border-subtle);}

.modal-overlay{position:fixed;inset:0;background:rgba(44,31,20,.55);display:flex;align-items:center;justify-content:center;padding:var(--s-4);z-index:100;}
.modal-overlay[hidden]{display:none;}
.modal-card{max-width:380px;width:100%;box-shadow:var(--sh-lg);}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);padding:var(--s-3) var(--s-5);border-radius:var(--r-full);font-family:'Nunito',sans-serif;font-size:var(--fs-base);font-weight:700;cursor:pointer;border:none;transition:all var(--dur-fast) var(--ease);text-decoration:none;width:100%;}
.btn-primary{background:var(--brand-primary);color:var(--text-inv);}
.btn-primary:hover:not(:disabled){background:var(--brand-primary-hover);transform:translateY(-1px);box-shadow:var(--sh-md);}
.btn-primary:disabled{background:var(--border);color:var(--text-3);cursor:not-allowed;}
.btn-text{background:none;border:none;color:var(--brand-primary);font-family:'Nunito',sans-serif;font-weight:700;font-size:var(--fs-sm);cursor:pointer;width:auto;padding:var(--s-2);text-decoration:none;display:inline-block;text-align:center;}
.btn-secondary{background:var(--surface);color:var(--text-1);border:1.5px solid var(--border);}
.btn-secondary:hover{border-color:var(--brand-primary);color:var(--brand-primary);background:var(--brand-primary-light);transform:translateY(-1px);}
.btn-lg{padding:var(--s-4) var(--s-8);font-size:var(--fs-lg);}

.dashboard-actions{display:flex;flex-direction:column;gap:var(--s-3);}

/* Desktop / pantallas anchas (notebook, escritorio): panel centrado con
   chrome visible en vez de una sola columna móvil estirada de borde a borde. */
@media (min-width:700px){
  body{background:var(--surface-alt);}
  .auth-shell{max-width:640px;margin:var(--s-6) auto;min-height:calc(100dvh - var(--s-6) * 2);border-radius:var(--r-xl);box-shadow:var(--sh-lg);border:1px solid var(--border-subtle);overflow:hidden;}
}
@media (min-width:1024px){
  .auth-shell{max-width:760px;}
  .dashboard-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);}
}

.form-field{display:flex;flex-direction:column;gap:var(--s-1);margin-bottom:var(--s-3);}
.form-label{font-size:var(--fs-sm);font-weight:700;color:var(--text-2);display:block;margin-bottom:2px;}
.form-label .req{color:var(--c-danger);margin-left:2px;}
.form-label .opt{color:var(--text-3);font-weight:600;}
.form-input,.form-select{
  width:100%;padding:var(--s-3) var(--s-4);border:1.5px solid var(--border);border-radius:var(--r-md);
  background:var(--surface);color:var(--text-1);font-family:'Nunito',sans-serif;font-size:var(--fs-base);
  outline:none;transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
}
.form-input:focus,.form-select:focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px var(--brand-primary-light);}
.form-input.is-invalid{border-color:var(--c-danger);}
input[type="file"]{width:100%;padding:var(--s-3) var(--s-4);border:1.5px dashed var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text-2);font-family:'Nunito',sans-serif;font-size:var(--fs-sm);}
.form-hint{font-size:var(--fs-xs);color:var(--text-3);line-height:1.4;}
.form-errors{list-style:none;color:var(--c-danger);font-size:var(--fs-xs);margin-top:2px;}
.form-errors li::before{content:"⚠ ";}

.pw-meter{display:flex;gap:4px;margin-top:6px;}
.pw-seg{flex:1;height:4px;border-radius:var(--r-full);background:var(--border-subtle);transition:background var(--dur-fast) var(--ease);}
.pw-rules{display:flex;flex-direction:column;gap:4px;margin-top:6px;}
.pw-rule{display:flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--text-3);transition:color var(--dur-fast) var(--ease);}
.pw-rule svg{width:14px;height:14px;flex-shrink:0;color:var(--border);}
.pw-rule.met{color:var(--c-success);}
.pw-rule.met svg{color:var(--c-success);}

/* Consentimiento: checkbox nativo real, estilizado como tarjeta.
   Sigue funcionando sin JS (required en el input + validación de servidor). */
.consent-label{display:flex;gap:var(--s-3);align-items:flex-start;border-radius:var(--r-lg);border:1.5px solid var(--border-subtle);background:var(--surface);padding:var(--s-4);cursor:pointer;transition:all var(--dur-fast) var(--ease);}
.consent-label.optional{border-style:dashed;}
.consent-input{position:absolute;opacity:0;width:24px;height:24px;margin:0;cursor:pointer;}
.consent-box{width:24px;height:24px;border-radius:6px;border:2px solid var(--border);background:var(--surface);flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-top:2px;position:relative;transition:all var(--dur-fast) var(--ease);}
.consent-box svg{width:14px;height:14px;color:white;opacity:0;transition:opacity var(--dur-fast) var(--ease);}
.consent-input:checked ~ .consent-box{background:var(--brand-primary);border-color:var(--brand-primary);}
.consent-input:checked ~ .consent-box svg{opacity:1;}
.consent-label.optional .consent-input:checked ~ .consent-box{background:var(--brand-secondary);border-color:var(--brand-secondary);}
.consent-input:focus-visible ~ .consent-box{outline:3px solid var(--brand-primary-light);outline-offset:2px;}
.consent-label:has(.consent-input:checked).required{border-color:var(--brand-primary);background:var(--brand-primary-light);}
.consent-text{font-size:var(--fs-sm);color:var(--text-2);line-height:1.55;}
.consent-text strong{color:var(--text-1);}
.consent-label-row{display:flex;align-items:center;gap:var(--s-2);margin-bottom:4px;flex-wrap:wrap;}

.accordion{border:1px solid var(--border-subtle);border-radius:var(--r-md);overflow:hidden;}
.accordion-btn{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--s-3) var(--s-4);background:var(--surface-alt);border:none;cursor:pointer;font-family:'Nunito',sans-serif;font-size:var(--fs-sm);font-weight:700;color:var(--text-2);}
.accordion-btn svg{width:16px;height:16px;transition:transform var(--dur-fast) var(--ease);}
.accordion-btn.open svg{transform:rotate(180deg);}
.accordion-panel{max-height:0;overflow:hidden;transition:max-height var(--dur-mid) var(--ease);background:var(--surface);}
.accordion-panel.open{max-height:400px;}
.accordion-inner{padding:var(--s-3) var(--s-4);font-size:var(--fs-xs);color:var(--text-3);line-height:1.6;}

.custodian-box{background:var(--brand-secondary-light);border-radius:var(--r-lg);padding:var(--s-4);display:flex;gap:var(--s-3);}
.custodian-box .ic{font-size:24px;flex-shrink:0;}
.custodian-box p{font-size:var(--fs-sm);color:var(--text-2);line-height:1.6;}

.alert{display:flex;align-items:flex-start;gap:var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--r-md);font-size:var(--fs-sm);}
.alert-warning{background:var(--c-warning-bg);color:#7A5010;border-left:3px solid var(--c-warning);}
.alert-danger{background:var(--c-danger-bg);color:#7A1810;border-left:3px solid var(--c-danger);}
.alert-icon{font-size:16px;flex-shrink:0;}

.hero-mini{text-align:center;padding:var(--s-4) 0 var(--s-2);}
.hero-mini .ic-circle{width:64px;height:64px;border-radius:50%;background:var(--brand-primary-light);display:flex;align-items:center;justify-content:center;font-size:30px;margin:0 auto var(--s-4);}
.hero-mini h1{font-size:var(--fs-2xl);font-weight:800;color:var(--text-1);margin-bottom:var(--s-2);}
.hero-mini p{font-size:var(--fs-sm);color:var(--text-2);line-height:1.55;max-width:340px;margin:0 auto;}

.profile-grid{display:flex;flex-direction:column;gap:var(--s-3);}
.profile-option{position:relative;display:flex;gap:var(--s-3);align-items:flex-start;background:var(--surface);border-radius:var(--r-xl);padding:var(--s-4);border:2px solid var(--border-subtle);box-shadow:var(--sh-sm);cursor:pointer;transition:all var(--dur-mid) var(--ease);}
.profile-option:hover{border-color:var(--brand-primary);}
.profile-radio{position:absolute;opacity:0;width:1px;height:1px;}
.profile-radio:checked ~ .profile-emoji{background:var(--brand-primary-light);}
.profile-option:has(.profile-radio:checked){border-color:var(--brand-primary);background:var(--brand-primary-light);}
.profile-emoji{font-size:30px;width:52px;height:52px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;background:var(--surface-alt);flex-shrink:0;}
.profile-title{font-weight:800;font-size:var(--fs-base);color:var(--text-1);margin-bottom:2px;}
.profile-desc{font-size:var(--fs-xs);color:var(--text-2);line-height:1.5;}
.profile-check{margin-left:auto;align-self:center;width:22px;height:22px;border-radius:50%;border:2px solid var(--border);flex-shrink:0;}
.profile-option:has(.profile-radio:checked) .profile-check{background:var(--brand-primary);border-color:var(--brand-primary);}

.size-selector{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-2);}
.size-option{position:relative;}
.size-option input{position:absolute;opacity:0;}
.size-option label{display:block;padding:var(--s-3) var(--s-2);border-radius:var(--r-md);border:2px solid var(--border);background:var(--surface);cursor:pointer;text-align:center;font-weight:700;transition:all var(--dur-fast) var(--ease);color:var(--text-2);}
.size-option input:checked ~ label{border-color:var(--brand-primary);background:var(--brand-primary-light);color:var(--brand-primary);}

.theme-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3);}
.theme-option{position:relative;}
.theme-option input{position:absolute;opacity:0;}
.theme-option label{padding:var(--s-3) var(--s-2);border-radius:var(--r-md);border:2px solid var(--border);background:var(--surface);cursor:pointer;text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--s-2);font-size:var(--fs-xs);font-weight:700;color:var(--text-2);transition:all var(--dur-fast) var(--ease);}
.theme-option input:checked ~ label{border-color:var(--brand-primary);background:var(--brand-primary-light);color:var(--brand-primary);}
.theme-swatch{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;}

.email-icon-wrap{width:88px;height:88px;border-radius:50%;background:var(--brand-primary-light);display:flex;align-items:center;justify-content:center;margin:var(--s-4) auto;}
.email-icon-wrap svg{width:40px;height:40px;color:var(--brand-primary);}
.resend-row{display:flex;align-items:center;justify-content:center;gap:6px;font-size:var(--fs-sm);color:var(--text-3);flex-wrap:wrap;}

.success-check{width:88px;height:88px;border-radius:50%;background:var(--c-success-bg);display:flex;align-items:center;justify-content:center;margin:var(--s-4) auto;}
.success-check svg{width:44px;height:44px;color:var(--c-success);}

.messages{list-style:none;display:flex;flex-direction:column;gap:var(--s-2);}
.messages li{padding:var(--s-3) var(--s-4);border-radius:var(--r-md);font-size:var(--fs-sm);background:var(--c-success-bg);color:#1A5C3A;}
.messages li.error{background:var(--c-danger-bg);color:#7A1810;}

/* Panel de administración (uso interno SyncMed) — layout ancho, no el
   shell móvil angosto del resto de la app. */
.admin-shell{min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);}
.admin-topbar{display:flex;align-items:center;justify-content:space-between;padding:var(--s-3) var(--s-5);background:var(--surface);border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;gap:var(--s-3);}
.admin-brand{font-weight:800;font-size:var(--fs-lg);color:var(--text-1);text-decoration:none;}
.admin-brand span{color:var(--brand-primary);}
.admin-nav{display:flex;gap:var(--s-4);flex-wrap:wrap;}
.admin-nav a{color:var(--text-2);text-decoration:none;font-weight:700;font-size:var(--fs-sm);padding:var(--s-2) 0;border-bottom:2px solid transparent;}
.admin-nav a:hover,.admin-nav a.is-active{color:var(--brand-primary);border-color:var(--brand-primary);}
.admin-user{display:flex;align-items:center;gap:var(--s-3);font-size:var(--fs-sm);color:var(--text-2);}
.admin-main{flex:1;padding:var(--s-6) var(--s-5) var(--s-8);max-width:1100px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:var(--s-5);}

.admin-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--s-3);}
.admin-kpi{background:var(--surface);border-radius:var(--r-lg);padding:var(--s-4);box-shadow:var(--sh-sm);border:1px solid var(--border-subtle);}
.admin-kpi .value{font-size:var(--fs-2xl);font-weight:800;color:var(--brand-primary);}
.admin-kpi .label{font-size:var(--fs-xs);color:var(--text-3);text-transform:uppercase;letter-spacing:.4px;}

.table-scroll{overflow-x:auto;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-sm);border:1px solid var(--border-subtle);}
.admin-table{width:100%;border-collapse:collapse;}
.admin-table th{background:var(--surface-alt);text-align:left;padding:var(--s-3);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.4px;color:var(--text-3);white-space:nowrap;}
.admin-table td{padding:var(--s-3);border-top:1px solid var(--border-subtle);font-size:var(--fs-sm);white-space:nowrap;}

@media(max-width:700px){
  .admin-topbar{flex-direction:column;align-items:flex-start;}
  .admin-main{padding:var(--s-4);}
}

.app-footer{padding:var(--s-4) var(--s-5);text-align:center;border-top:1px solid var(--border-subtle);}
.app-footer p{font-size:var(--fs-xs);color:var(--text-3);}
.app-footer a{color:var(--brand-primary);font-weight:700;text-decoration:none;}