/* Poyntia · web v2 · PANTALLA DE ACCESO a la manera de Scale (17-oct-2026; referencia: ~/Downloads/scale 1.mov, hoja login.jpg): pantalla completa con degradado AZUL suave (no lavanda), logo arriba a la izquierda
   desplazado del borde, titular pequeño, botones en píldora con el icono en un segmento blanco (el primero azul, el segundo negro), campos rectangulares con icono, sin tarjeta; y POLVO en movimiento
   (Space FS: grano fino en arco, assets/acceso-polvo-v2.js). Se carga DESPUÉS de acceso-space/acceso.css y lo sustituye (acceso.css lo regenera heredadas.py desde _rediseno/). La maqueta sigue simulada y noindex. */
html, html[data-modo="oscuro"], html[data-modo="claro"] {
  color-scheme: light;
  --bg: transparent; --bg-2: transparent; --ink: #111827; --ink-2: #4b5775; --ink-3: #46506b; --line: rgba(17,24,39,.1); --line-2: rgba(17,24,39,.18); --acento: #2551d6;
  --seg: rgba(255,255,255,.55); --pulgar: #fff; --pulgar-sombra: 0 1px 2px rgba(17,24,39,.1), 0 6px 14px -8px rgba(17,24,39,.25);
  --cta-bg: #0a0a0c; --cta-fg: #fff; --cta-hover: #26282e; --sur: #fff; --ficha-bg: #fff;
  --sans: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --ok: #1c8a4e; --pend: #8a5a12; --err: #b3261e;
  background: #f5f7fb;
}
body { min-height: 100vh; min-height: 100svh; background: var(--v2-grad-acceso) no-repeat; background-attachment: fixed; color: var(--ink); font-family: var(--sans); letter-spacing: -.012em; font-synthesis: none; }
#grano, .tema, .tema-tog, .lg-o, .ac-ficha { display: none !important; }
.lg-c { display: block !important; }
#polvo { position: fixed; left: 0; top: 0; width: 100%; height: 100vh; height: 100lvh; z-index: 0; pointer-events: none; opacity: 0; transition: opacity 1.6s ease; }
#polvo.listo { opacity: 1; }

/* arriba: sólo la marca, desplazada del borde como en Scale; a la derecha el idioma y, con acceso, la cuenta */
.ac-top { top: calc(30 * var(--u)); padding: 0 clamp(24px, 13vw, calc(380 * var(--u))); }
.ac-logo { width: auto; height: auto; min-width: 44px; min-height: 44px; border-radius: 0; background: none; box-shadow: none; display: inline-flex; align-items: center; }
.ac-logo img.v2-ac-marca { display: block; width: auto; height: calc(26 * var(--u)); min-height: 22px; }
.ac-logo::after { inset: -4px; }
.ac-lang, .ac-cuenta { background: rgba(255,255,255,.55); box-shadow: none; }

/* el bloque: sin tarjeta, una columna de ~400 px, titular pequeño de una línea */
.ac-v { width: min(100%, calc(400 * var(--u))); }
.ac-h1 { width: 100%; margin-top: 0; font-size: max(22px, calc(25 * var(--u))); font-weight: 500; line-height: 1.25; letter-spacing: -.02em; color: var(--ink); }
.ac-h1 span, .ac-h1 .t2 { display: block; }
.ac-h1 .t2 { color: var(--ink-2); font-weight: 400; }
.ac-lede { color: var(--ink-2); }
.ac-tabs { margin-top: calc(22 * var(--u)); border-radius: 12px; background: rgba(255,255,255,.5); box-shadow: none; }
.ac-tabs button, .ac-pulgar { border-radius: 9px; }
.ac-panel { margin-top: calc(14 * var(--u)); gap: calc(12 * var(--u)); }

/* botones de entrada: píldora con el icono en un segmento blanco a la izquierda (Scale); Google en azul, Microsoft en negro */
.ac-btn { box-shadow: 0 1px 2px rgba(17,24,39,.08), inset 0 0 0 1px rgba(17,24,39,.1); }
.ac-btn[data-entrar] { position: relative; overflow: hidden; justify-content: flex-start; gap: 0; height: calc(52 * var(--u)); min-height: 48px; padding: 0 20px 0 calc(58 * var(--u) + 18px); border-radius: 999px;
  font-size: max(16px, calc(17 * var(--u))); font-weight: 500; color: #fff; box-shadow: 0 6px 16px -8px rgba(17,24,39,.5); }
.ac-btn[data-entrar]::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: calc(58 * var(--u)); min-width: 50px; background: #fff; }
.ac-btn[data-entrar] svg { position: absolute; left: calc(29 * var(--u)); top: 50%; width: max(20px, calc(22 * var(--u))); transform: translate(-50%, -50%); z-index: 1; }
.ac-btn[data-entrar="google"] { background: #0b1c47; }
.ac-btn[data-entrar="microsoft"] { background: #17181c; }
.ac-btn[data-entrar]:hover { box-shadow: 0 8px 20px -8px rgba(17,24,39,.6); }
.ac-btn[data-entrar="google"]:hover { background: #12285f; } .ac-btn[data-entrar="microsoft"]:hover { background: #2a2c33; }
.ac-btn-prim { background: var(--cta-bg); color: var(--cta-fg); box-shadow: none; border-radius: 999px; }
.ac-o { color: var(--ink-3); }

/* campos: rectángulos redondeados con icono (persona en el correo, candado en la invitación) y el botón de continuar a la derecha */
.ac-campo input { height: calc(52 * var(--u)); min-height: 48px; border-radius: 10px; background-color: #e7ecf6; box-shadow: none; padding-left: 50px; color: var(--ink);
  background-repeat: no-repeat; background-position: 17px center; background-size: 18px 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23161a26'%3E%3Ccircle cx='12' cy='7.5' r='4.2'/%3E%3Cpath d='M3.5 21c.4-4.4 3.6-7 8.5-7s8.1 2.6 8.5 7z'/%3E%3C/svg%3E"); }
#inInv { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23161a26'%3E%3Cpath d='M7 10V7.5a5 5 0 0 1 10 0V10h1.2c.9 0 1.8.8 1.8 1.8v8.4c0 1-.9 1.8-1.8 1.8H5.8c-1 0-1.8-.8-1.8-1.8v-8.4C4 10.8 4.8 10 5.8 10zm2.4 0h5.2V7.5a2.6 2.6 0 0 0-5.2 0z'/%3E%3C/svg%3E"); }
.ac-campo input::placeholder { color: #566079; }
.ac-campo input:focus-visible { box-shadow: 0 0 0 2px var(--acento); }
.ac-ir { border-radius: 8px; }
.ac-link { color: var(--acento); }
.ac-nota { color: var(--ink-3); }
.ac-legal, .ac-legal a { color: var(--ink-3); } .ac-legal a:hover { color: var(--ink); }
.ac-ins.pend, .ac-pend { color: var(--pend); }

/* la barra de estados de la maqueta no se ve en la web pública (es monoespaciada y dice «datos de muestra»): sólo con ?barra=1 */
.mq { display: none; font-family: var(--sans); background: rgba(255,255,255,.92); color: #111827; border-color: rgba(17,24,39,.25); }
.mq *, .mq button { font-family: var(--sans) !important; letter-spacing: 0 !important; }
html.v2-barra .mq { display: flex; }
.mq button[aria-current="true"], .mq button[aria-pressed="true"] { background: #0a0a0c; color: #fff; }
@media (max-width: 720px) { .ac-top { padding: 0 var(--gut); } .ac-h1 { font-size: 24px; } .ac-btn[data-entrar] { height: 54px; } .ac-campo input { height: 54px; } }
@media (prefers-reduced-motion: reduce) { body { background-attachment: scroll; } #polvo { transition: none; } }
