*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--text);
  min-height:100vh;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
button{cursor:pointer;font-family:inherit;}
input,textarea,select{font-family:inherit;}
img{max-width:100%;display:block;}

/* ── Botones globales ── */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 22px;border-radius:var(--radius-full);
  font-size:.88rem;font-weight:700;border:none;
  transition:all var(--transition);cursor:pointer;
}
.btn-primary{background:var(--accent);color:#000;}
.btn-primary:hover{opacity:.88;transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,229,160,.3);}
.btn-outline{background:transparent;border:1.5px solid var(--border);color:var(--text);}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);}
.btn-ghost{background:transparent;border:1.5px solid var(--border);color:var(--muted);padding:8px 16px;}
.btn-ghost:hover{border-color:var(--text);color:var(--text);}
.btn-sm{padding:7px 16px;font-size:.82rem;}
.btn-danger{background:rgba(255,79,106,.12);border:1px solid rgba(255,79,106,.3);color:var(--danger);}
.btn-danger:hover{background:rgba(255,79,106,.22);}

/* ── Inputs globales ── */
.input{
  width:100%;background:var(--surface2);
  border:1px solid var(--border);border-radius:var(--radius-md);
  padding:11px 14px;color:var(--text);font-size:.88rem;
  transition:border-color var(--transition);
}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,229,160,.1);}
.input.err{border-color:var(--danger);}
.input-label{display:block;font-size:.78rem;color:var(--muted);font-weight:600;margin-bottom:5px;}

/* ── Alertas ── */
.alert{font-size:.82rem;min-height:20px;margin-top:6px;border-radius:var(--radius-sm);padding:2px 0;}
.alert.bad{color:var(--danger);}
.alert.ok{color:var(--success);}

/* ── Error hints ── */
.err-hint{font-size:.75rem;color:var(--danger);display:none;margin-top:3px;}
.err-hint.on{display:block;}

/* ── Animations ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes spin{to{transform:rotate(360deg)}}
.fade-up{animation:fadeUp .5s ease both;}
.hidden{display:none!important;}