/* Presentación de acceso. Las pantallas de gestión conservan sus estilos. */
.access-page { background: #f7f6f4; }
.access-page .access-header {
  height: 84px;
  position: static;
  padding: 0 48px;
  border-bottom-color: #e9e6e2;
}
.access-header nav { margin-left: auto; color: #62616b; font-size: 13px; }
.access-header nav span { margin-left: 10px; color: var(--brand); font-size: 18px; }
.access-board-link:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 4px; }
.access-page #main {
  margin: 0;
  padding: 40px 48px;
  min-height: calc(100vh - 84px);
  display: flex;
  align-items: center;
}
.access-page .workspace { width: 100%; max-width: 1020px; }
.access-shell {
  display: grid;
  grid-template-columns: 410px minmax(0, 1fr);
  min-height: 550px;
  border: 1px solid #e8e2e2;
  border-radius: 20px;
  overflow: hidden;
  background: white;
  box-shadow: 0 18px 60px -28px #38272e35, 0 2px 8px #38272e04;
}
.access-identity {
  padding: 48px 44px 42px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  color: white;
  background: radial-gradient(ellipse at 8% 8%, #b4456038, transparent 62%), linear-gradient(145deg, #8b1c3a, #51172e);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.access-identity::after {
  content: '';
  position: absolute;
  width: 360px;
  height: 430px;
  bottom: -250px;
  right: -150px;
  border: 1px solid #ffffff14;
  border-radius: 180px 180px 0 0;
  box-shadow: 0 0 0 28px #ffffff03, 0 0 0 56px #ffffff03, 0 0 0 84px #ffffff03;
  pointer-events: none;
  z-index: -1;
}
.access-photo {
  margin: 24px 0 0;
  padding: 6px;
  border: 1px solid #e9c7aa48;
  border-radius: 15px;
  background: #ffffff0a;
  box-shadow: 0 18px 35px -14px #290c1c80;
}
.access-photo img { display: block; width: 100%; height: auto; border-radius: 9px; }
.access-identity .access-eyebrow { display: flex; align-items: center; gap: 10px; color: #efd7bf; font-size: 10px; font-weight: 600; letter-spacing: 1.8px; text-transform: uppercase; margin-bottom: 16px; }
.access-eyebrow::before { content: ''; flex: 0 0 20px; height: 1px; background: #d8b493; }
.access-identity h2 { font-size: 28px; font-weight: 600; line-height: 1.3; letter-spacing: -.35px; overflow-wrap: break-word; text-wrap: balance; }
.access-identity-bottom::before { content: ''; display: block; width: 30px; height: 2px; margin-bottom: 14px; background: #dc9cb0; }
.access-identity-bottom p { font-size: 14px; line-height: 1.6; color: #f2e3dd; text-wrap: pretty; }
.access-content { padding: 40px 48px; align-self: center; }
.access-intro { margin-bottom: 28px; }
.access-intro h1 { font-size: 28px; font-weight: 650; letter-spacing: -.8px; color: #282632; line-height: 1.25; }
.access-intro p { color: #716b74; margin-top: 10px; font-size: 14px; line-height: 1.6; }
.access-content .stack { gap: 20px; }
.access-content .field > span,
.access-password > label { display: block; font-size: 13px; color: #37333e; font-weight: 600; margin-bottom: 8px; }
.access-content .field input {
  min-height: 48px;
  border: 1px solid #dcd7dc;
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 14px;
  background: #fff;
}
.access-content .field input::placeholder { color: #969099; opacity: 1; }
.access-content .field input:hover { border-color: #bdb2ba; }
.access-content .field input:focus { border-color: var(--brand); outline: 3px solid #f6e8ed; }
.access-password-input { position: relative; }
.access-password-input input { padding-right: 82px !important; }
.access-password-input button {
  position: absolute;
  top: 4px;
  right: 5px;
  height: 40px;
  padding: 0 10px;
  color: #78616e;
  font-size: 12px;
  font-weight: 600;
  border-radius: 5px;
}
.access-password-input button:hover { color: var(--brand); background: #faf3f6; }
.access-password-input button[hidden] { display: none; }
.access-content .field small { color: #7d7580; font-size: 12px; }
.access-content .primary {
  width: 100%;
  min-height: 48px;
  font-size: 14px;
  border-radius: 8px;
  background: #961b3d;
  box-shadow: 0 3px 5px #70152b10;
}
.access-content .primary:hover { background: #7f1533; }
.access-content .primary:active { background: #6b112a; }
.access-page a:focus-visible,
.access-page button:focus-visible,
.access-help summary:focus-visible { outline: 3px solid #b4617c; outline-offset: 4px; }
.access-help { margin-top: 20px; font-size: 13px; }
.access-help > summary { font-size: 13px; font-weight: 500; padding: 0; color: #766471; }
.access-help[open] > summary { margin-bottom: 8px; }
.access-help p { color: #716b74; font-size: 13px; line-height: 1.6; }
.access-footer { margin-top: 28px; padding-top: 24px; border-top: 1px solid #eee9ed; font-size: 13px; line-height: 1.7; color: #716b74; }
.access-footer span { display: block; margin-bottom: 3px; }
.access-link { color: var(--brand); font-weight: 600; }
.access-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.access-note { margin-top: 20px; color: #7d7580; font-size: 12px; line-height: 1.6; }
.access-message { padding: 13px 16px; margin-bottom: 22px; border-radius: 8px; font-size: 13px; line-height: 1.55; }
.access-error { background: #fcf0f3; color: #88213c; border: 1px solid #edd1da; }
.access-success { background: #edf6f1; color: #2b6652; border: 1px solid #d4e8de; }
