/* GaIA Trade -- sistema visual del diseño aprobado (Claude Design, 19-10-2026). No cambiar colores ni tipografías. */
html,body{margin:0;min-height:100%}
*{box-sizing:border-box}
.g{--bg:#140B24;--sky:#22123E;--p:#1E1335;--p2:#2A1D47;--ln:#3A2A5E;--ink:#F4EEFF;--ink2:#C9BBE3;--ink3:#A08FBF;--ac:#B58CFF;--acbg:rgba(181,140,255,.16);--ac2:#FF9AD5;--ok:#5FD6A0;--okbg:rgba(95,214,160,.14);--ko:#FF8A95;--kobg:rgba(255,138,149,.14);--am:#FFC562;--ambg:rgba(255,197,98,.15);--rb:#FF6FAE;--dm:#8EE6F2;--hot:#FFFFFF;--glass:rgba(30,19,53,.72);font-family:'Figtree',system-ui,sans-serif;color:var(--ink);background:radial-gradient(130% 50% at 10% -8%,rgba(150,90,255,.32),transparent 62%),radial-gradient(90% 40% at 110% 18%,rgba(255,130,210,.12),transparent 60%),var(--bg)}
.g.claro{--bg:#F7F2FC;--sky:#DCCBF5;--p:#FFFFFF;--p2:#F0E8FA;--ln:#E2D5F2;--ink:#1F1233;--ink2:#4E3D6B;--ink3:#6A5888;--ac:#5A2A9C;--acbg:rgba(90,42,156,.09);--ac2:#C23C8A;--ok:#137A50;--okbg:rgba(19,122,80,.09);--ko:#B42F48;--kobg:rgba(180,47,72,.08);--am:#8C5A00;--ambg:rgba(140,90,0,.1);--rb:#A8255A;--dm:#0F7183;--hot:#FFFFFF;--glass:rgba(255,255,255,.82);background:radial-gradient(130% 50% at 10% -8%,rgba(120,60,220,.16),transparent 62%),radial-gradient(90% 40% at 110% 18%,rgba(220,90,170,.08),transparent 60%),var(--bg)}
body.g{min-height:100vh;min-height:100dvh}
html{background:#140B24}
html.claro{background:#F7F2FC}
.n{font-family:'Figtree',system-ui,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.005em}
.d{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto;letter-spacing:-.02em}
.g h1,.g .tit{font-family:'Fraunces',Georgia,serif;font-weight:600;letter-spacing:-.015em}
.g :focus-visible{outline:2px solid var(--ac);outline-offset:2px}
a{color:var(--ac)}a:hover{color:var(--ink)}
button{cursor:pointer}
.oculto{display:none!important}
.nw{white-space:nowrap}
@media (max-width:399px){.largo{display:none}}
.movil{position:relative;width:100%;max-width:480px;margin:0 auto}

/* --- la onda que GaIA está contando (gráfica) --- */
.pulse{transform-box:fill-box;transform-origin:center;animation:pl 1.4s ease-in-out infinite}
.halo{transform-box:fill-box;transform-origin:center;animation:hl 1.4s ease-out infinite}
@keyframes pl{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes hl{0%{transform:scale(.4);opacity:.7}100%{transform:scale(2);opacity:0}}

/* --- rayo de fondo del Inicio (cada 7 s, detrás del contenido) --- */
.bf,.bb,.bc{stroke-dasharray:100;stroke-dashoffset:100}
.bf{animation:fall 7s linear infinite}
.bb{animation:fallb 7s linear infinite}
.bc{animation:fallc 7s linear infinite}
.bl{opacity:0;animation:lit 7s linear infinite}
@keyframes fall{0%{stroke-dashoffset:100;opacity:1}2.5%{stroke-dashoffset:0;opacity:1}3.5%{opacity:.25}4.5%{opacity:1}6%{opacity:.5}7.5%{opacity:1}15%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes fallb{0%,1%{stroke-dashoffset:100;opacity:1}3.5%{stroke-dashoffset:0;opacity:1}4.5%{opacity:.2}6%{opacity:.8}12%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes fallc{0%,2%{stroke-dashoffset:100;opacity:1}4.5%{stroke-dashoffset:0;opacity:1}5.5%{opacity:.15}7%{opacity:.7}11%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes lit{0%,2%{opacity:0}3%{opacity:1}4%{opacity:.2}5%{opacity:.8}8%{opacity:.15}16%,100%{opacity:0}}

/* --- pantalla de carga: el rayo de las 5 ondas (cada 4 s) --- */
.carga{position:fixed;inset:0;z-index:50;overflow:hidden;background:linear-gradient(180deg,var(--sky) 0%,var(--bg) 55%);transition:opacity .45s ease}
.carga.fuera{opacity:0;pointer-events:none}
.carga .lienzo{position:relative;width:390px;height:844px;margin:0 auto;max-width:100%}
.cbf,.cbb,.cbc{stroke-dasharray:100;stroke-dashoffset:100}
.cbf{animation:cfall 3s linear infinite}
.cbb{animation:cfallb 3s linear infinite}
.cbc{animation:cfallc 3s linear infinite}
.cbl{opacity:0;animation:clit 3s linear infinite}
.clb{opacity:0;animation:clab 3s ease-out infinite}
@keyframes cfall{0%{stroke-dashoffset:100;opacity:1}4%{stroke-dashoffset:0;opacity:1}6%{opacity:.2}8%{opacity:1}10.67%{opacity:.45}13.33%{opacity:1}32%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes cfallb{0%,2%{stroke-dashoffset:100;opacity:1}5.33%{stroke-dashoffset:0;opacity:1}6.67%{opacity:.2}8.67%{opacity:.9}12%{opacity:.4}24%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes cfallc{0%,3.33%{stroke-dashoffset:100;opacity:1}6.67%{stroke-dashoffset:0;opacity:1}8%{opacity:.15}10%{opacity:.8}20%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes clit{0%,3.33%{opacity:0}4.67%{opacity:1}6.67%{opacity:.15}8.67%{opacity:.85}12%{opacity:.25}14.67%{opacity:.6}34.67%,100%{opacity:0}}
@keyframes clab{0%,4%{opacity:0}6.67%{opacity:1}40%{opacity:1}56%,100%{opacity:0}}
.comet{animation:go 1.8s cubic-bezier(.6,0,.4,1) infinite}
@keyframes go{0%{left:-70px}100%{left:100%}}

/* --- acceso --- */
.scan{animation:scan 2.2s ease-in-out infinite}
@keyframes scan{0%,100%{transform:translateY(-14px);opacity:0}20%,80%{opacity:1}50%{transform:translateY(14px)}}
.campo{width:100%;min-height:52px;padding:0 16px;border-radius:14px;border:1px solid var(--ln);background:var(--p);color:var(--ink);font-family:inherit;font-size:16px}
.campo:focus{border-color:var(--ac);outline:none;box-shadow:0 0 0 3px var(--acbg)}
.campo::placeholder{color:var(--ink3)}

/* --- piezas comunes --- */
.tarjeta{border-radius:16px;background:var(--p);border:1px solid var(--ln)}
.sec{margin:0;font-size:12px;font-weight:600;color:var(--ac);letter-spacing:0}
.chip{flex:none;height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--ln);background:transparent;color:var(--ink2);font-family:inherit;font-size:14px;font-weight:500;display:flex;align-items:center;gap:6px}
.chip.sombra{border-style:dashed}
.chip[aria-pressed="true"]{border:1px solid var(--ac);background:var(--ac);color:var(--bg);font-weight:600}
.chip .et{font-size:11px;color:var(--ink3)}
.chip[aria-pressed="true"] .et{color:inherit;font-weight:500;opacity:.75}
.fichas{display:flex;gap:8px;overflow-x:auto;padding:0 16px;scrollbar-width:none}
.fichas::-webkit-scrollbar{display:none}
.tf{height:38px;min-width:44px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:var(--ink3);font-family:inherit;font-size:12px;font-weight:500}
.tf[aria-pressed="true"]{background:var(--p);color:var(--ink);font-weight:600}
.vacio{color:var(--ink3)!important;font-weight:400!important}
.nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:50px;text-decoration:none;color:var(--ink3);font-size:11px;font-weight:500}
.nav a[aria-current="page"]{color:var(--ink);font-weight:600}
.aviso-pronto{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:30;max-width:340px;padding:12px 16px;border-radius:14px;background:var(--p2);border:1px solid var(--ln);font-size:13px;color:var(--ink2);box-shadow:0 8px 30px rgba(0,0,0,.35)}

@media (prefers-reduced-motion:reduce){
  .pulse,.halo{animation:none}
  .bf,.bb,.bc{animation:none;stroke-dashoffset:0;opacity:.35}.bl{animation:none}
  .cbf,.cbb,.cbc{animation:none;stroke-dashoffset:0;opacity:.9}.cbl{animation:none;opacity:.12}.clb{animation:none;opacity:1}.comet{animation:none;left:40%}
  .scan{animation:none;opacity:0}
  .carga{transition:none}
}