html[data-theme] header .header-account {
 display:inline-flex; align-items:center; justify-content:center; gap:8px;
 min-height:44px; padding:0 13px; border:1px solid #c8a569; border-radius:10px;
 color:var(--ink); background:var(--ff-soft); text-decoration:none; white-space:nowrap;
}
html[data-theme] header .header-account[aria-current="page"] {background:var(--gold);color:var(--ff-paper,#142b38)}
.header-account:focus-visible {outline:2px solid var(--gold);outline-offset:3px}
#page-cuenta .account-entry-grid [data-auth="login"] {border-color:#c8a569}
@media(max-width:700px) {
 html[data-theme] header .header-account {width:44px;padding:0}
 .header-account span {display:none}
}
@media(max-width:360px) {
 html[data-theme] header .brand small {display:none}
 html[data-theme] header .header-tools {gap:4px}
}
@media(prefers-reduced-motion:no-preference) {
 html:not([data-motion="off"]) .account-entry-grid {animation:va-account-arrive 200ms ease-out both}
 html:not([data-motion="off"]) .header-account svg {transition:transform 150ms ease-out}
 html:not([data-motion="off"]) .header-account:focus-visible svg {transform:translateY(-2px)}
 @media(hover:hover) {
  html:not([data-motion="off"]) .header-account:hover svg {transform:translateY(-2px)}
 }
 @keyframes va-account-arrive {from{opacity:.65;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
}

#page-cuenta .account-entry-grid {width:min(100%,530px);margin:24px auto 0}
.account-entry-tabs {display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;padding:5px;border:1px solid var(--line);border-radius:14px;background:var(--ff-soft)}
.account-entry-tabs button,.auth-password button {min-height:44px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--ink);font:inherit;cursor:pointer}
.account-entry-tabs button[aria-selected="true"] {background:var(--gold);color:#142b38}
#page-cuenta .account-entry-grid [data-auth] {margin:0;border-color:var(--line)}
.auth-password {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
.auth-password button {padding:0 9px;border-color:var(--line)}
.account-entry-tabs button:focus-visible,.auth-password button:focus-visible {outline:2px solid var(--gold);outline-offset:2px}
@media(prefers-reduced-motion:no-preference) {
 html:not([data-motion="off"]) .account-entry-grid [role="tabpanel"]:not([hidden]) {animation:va-account-arrive 200ms ease-out both}
}

#page-cuenta:has(.account-entry-grid) > .page-heading {display:none}
#page-cuenta:has(.account-entry-grid) {
 min-height: min(760px, calc(100svh - var(--nav-height, 110px)));
 display:grid;
 place-items:center;
 padding: clamp(32px,7vw,88px) 20px;
}
#page-cuenta[hidden] {display:none}
html[data-theme="light"] #page-cuenta:has(.account-entry-grid) {background:#faf9f6}
#page-cuenta:has(.account-entry-grid) #account-content {width:min(100%,460px);margin:0;padding:0}
#page-cuenta .account-entry-grid {
 width:100%;margin:0;padding:clamp(22px,5vw,42px);
 box-sizing:border-box;border:1px solid var(--line);border-radius:24px;
 background:var(--ff-surface);box-shadow:var(--ff-shadow);
}
.account-entry-grid h1 {margin:0;text-align:center;font-size:clamp(28px,4vw,38px);line-height:1.15}
.account-entry-intro {margin:12px auto 24px;text-align:center;color:var(--muted);max-width:29ch}
html[data-theme] #page-cuenta .account-entry-grid [data-auth] {
 padding:12px 0 0;background:transparent;border:0;box-shadow:none;
}
.account-entry-grid [data-auth] h2 {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.account-entry-grid [data-auth] button[type="submit"] {width:100%;margin-top:8px}
.account-entry-grid [data-auth="login"] .auth-help {display:none}
.account-entry-grid .recovery-link {display:block;text-align:center;margin-top:14px}

html[data-theme="light"] header .header-account[aria-current="page"],
html[data-theme="light"] .account-entry-tabs button[aria-selected="true"] {
 background:var(--ff-soft);color:var(--ink);border-color:#c8a569;
}
#page-cuenta .account-entry-grid .form-status:empty {min-height:0;margin:0;padding:0}

html[data-theme] body>header{background:color-mix(in srgb,var(--ff-surface) 74%,transparent);backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%)}
html[data-theme] header .header-account{width:auto;min-height:44px;border-radius:999px;padding-inline:13px}
.header-account span{display:inline}
@media(min-width:1200px){html[data-theme] header nav{column-gap:clamp(16px,1.65vw,31px)}}
@media(max-width:360px){html[data-theme] header .header-account{padding-inline:8px;font-size:12px}html[data-theme] header .theme-toggle{width:66px;flex-basis:66px}html[data-theme] header .brand span{font-size:12px}}
.account-entry-form .auth-field{position:relative;margin-bottom:12px}
.account-entry-form .auth-field label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.account-entry-form .auth-field input{width:100%;min-width:0;margin:0;box-sizing:border-box}
.account-entry-form .auth-password{display:block}
.account-entry-form .auth-password input{padding-right:48px}
.account-entry-form .auth-password button{position:absolute;inset:0 2px 0 auto;width:44px;padding:0;display:grid;place-items:center;border:0}
.eye-slash{display:none}
[data-password-toggle][aria-pressed="true"] .eye-slash{display:block}
.account-entry-grid .recovery-link{margin:0 0 12px;text-align:left}
.auth-divider{display:flex;align-items:center;gap:10px;margin:20px 0 12px;color:var(--muted);font-size:14px}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.auth-google{width:100%;display:flex;justify-content:center;align-items:center;gap:8px}
.auth-switch{text-align:center;margin:18px 0 0;color:var(--muted);font-size:14px}
.auth-switch button{background:none;border:0;padding:0;color:var(--gold);font:inherit;cursor:pointer;text-decoration:underline}
@media(prefers-reduced-motion:no-preference){
 html:not([data-motion="off"]) .account-entry-grid{animation:va-account-arrive 340ms ease-out both}
 html:not([data-motion="off"]) #preview-navigation a{transition:transform 160ms ease-out,color 160ms ease-out}
 html:not([data-motion="off"]) #preview-navigation a[aria-current="page"]::after{animation:va-nav-select 230ms ease-out both;transform-origin:center}
 @media(hover:hover){html:not([data-motion="off"]) #preview-navigation a:hover{transform:translateY(-2px);color:var(--gold)}}
 @keyframes va-nav-select{from{transform:scaleX(.55);opacity:.35}to{transform:scaleX(1);opacity:1}}
}

#page-cuenta .account-entry-switched{animation:none}
html[data-theme="dark"] #page-cuenta .recovery-link{color:rgb(255 255 255 / 76%)}
html[data-theme="light"] #page-cuenta .recovery-link{color:var(--muted)}
html[data-theme] header #preview-navigation a{font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:.025em}
@media(max-width:700px){html[data-theme] header #preview-navigation a{font-size:13px}}
@media(prefers-reduced-motion:no-preference) and (hover:hover){
 html:not([data-motion="off"]) .header-account{position:relative;overflow:hidden}
 html:not([data-motion="off"]) .header-account::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(112deg,transparent 32%,#fff7df99 49%,transparent 67%);
  transform:translateX(-105%);
 }
 html:not([data-motion="off"]) .header-account:hover::before{animation:va-account-reflection 520ms ease-out both}
 @keyframes va-account-reflection{to{transform:translateX(105%)}}
}

/* El acceso conserva su composición mientras se resuelve la sesión. */
html[data-route-pending] #page-inicio,
#page-cuenta > .page-heading { display:none }
#page-cuenta #account-content:empty { min-height: min(480px, 65vh) }
#page-cuenta .account-entry-grid { animation:none }

#page-cuenta .verification-actions {justify-content:center}
#page-cuenta .verification-expiry {text-align:center;color:var(--muted);font-size:.875rem;margin:12px 0 0}