:root { --login-ink:#123149; --login-muted:#5b7487; --login-line:#c9dce7; --login-surface:#fff; --login-pale:#eef7fb; --login-blue:#0875ad; --login-blue-dark:#075b89; }
html { background:var(--login-pale); }
body.login-page { min-height:100vh; color:var(--login-ink); background:linear-gradient(135deg,#f7fbfd 0%,var(--login-pale) 100%); }
body.login-page::before { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 12% 18%,rgba(77,178,220,.13),transparent 28%),radial-gradient(circle at 86% 82%,rgba(16,110,163,.08),transparent 30%); }
main.login-shell { position:relative; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr); width:100%; min-height:100vh; margin:0; overflow:hidden; }
main.login-shell > section.login-story { position:relative; display:flex; flex-direction:column; min-height:100vh; padding:clamp(2rem,6vw,5.5rem); overflow:hidden; background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(230,245,251,.72)); border:0; border-radius:0; isolation:isolate; }
.login-story::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,transparent 72%,rgba(238,247,251,.86)); }
.login-brand { position:relative; z-index:3; display:flex; align-items:center; gap:.8rem; width:max-content; color:var(--login-ink); }
.login-brand img { width:42px; height:42px; }
.brand-lockup { display:grid; line-height:1; }
.brand-lockup strong { font-size:1rem; letter-spacing:-.025em; }
.brand-lockup strong span,.brand-lockup em,.splash-master span,.brand-copy em { color:var(--login-blue); font-style:normal; }
.brand-lockup small { margin-top:.38rem; color:var(--login-blue); font-size:.62rem; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
.evidence-wave { position:absolute; inset:0; z-index:-2; width:100%; height:100%; opacity:.34; }
.wave-layer { transform-origin:50% 50%; will-change:transform; }
.wave-layer-far { animation:wave-drift-far 20s ease-in-out infinite alternate; }.wave-layer-mid { animation:wave-drift-mid 16s ease-in-out infinite alternate; }.wave-layer-near { animation:wave-drift-near 13s ease-in-out infinite alternate; }
.evidence-wave.is-paused .wave-layer,.evidence-wave.is-paused .signal,.evidence-wave.is-paused .connections { animation-play-state:paused; }
.signal { fill:none; stroke-width:1.5; opacity:.3; stroke-dasharray:12 190; }.signal-a { animation:signal-travel 17s linear infinite; }.signal-b { animation:signal-travel 19s -8s linear infinite reverse; opacity:.18; }.connections { opacity:0; animation:connection-breathe 14s ease-in-out infinite; }.static-nodes { opacity:.35; }
.login-message { position:relative; z-index:2; margin-top:auto; max-width:530px; padding-top:5rem; }
.login-master-brand { margin:0 0 .55rem; color:var(--login-blue); font-size:.78rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.login-message h1 { margin:0; color:var(--login-ink); font-size:clamp(3rem,6vw,5.9rem); font-weight:720; line-height:.95; letter-spacing:-.065em; }
.login-tagline { margin:1.1rem 0 0; color:var(--login-muted); font-size:clamp(1.05rem,1.5vw,1.3rem); }
main.login-shell > section.login-access { position:relative; z-index:5; display:grid; place-items:center; min-height:100vh; padding:clamp(1.5rem,5vw,5rem); background:rgba(255,255,255,.84); border:0; border-left:1px solid var(--login-line); }
.login-panel { position:relative; width:min(100%,410px); padding:clamp(1.8rem,4vw,3rem); background:var(--login-surface); border:1px solid var(--login-line); border-radius:12px; box-shadow:0 18px 50px rgba(34,86,113,.1); }
.login-panel-eyebrow { margin:0 0 .7rem; color:var(--login-blue); font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.login-panel h2 { margin:0; color:var(--login-ink); font-size:1.9rem; letter-spacing:-.035em; }.login-panel-intro { margin:.55rem 0 1.65rem; color:var(--login-muted); }.login-page .login-panel .flash { margin-bottom:1.15rem; }.login-error[hidden],.login-splash[hidden] { display:none; }
.login-form { display:grid; gap:1.05rem; margin:0; padding:0; background:transparent; border:0; }.login-form label { margin:0; color:var(--login-ink); font-size:.82rem; font-weight:700; }.login-form input { min-height:48px; margin-top:.5rem; padding:.75rem .85rem; color:var(--login-ink); background:#fbfdfe; border:1px solid #aec8d6; border-radius:6px; box-shadow:none; }.login-form input:hover { border-color:#7aa9bd; }.login-form input:focus { outline:2px solid #6cc3e6; outline-offset:2px; border-color:var(--login-blue); }.login-form button { min-height:48px; margin-top:.45rem; color:#fff; background:var(--login-blue-dark); border-color:var(--login-blue-dark); box-shadow:0 7px 18px rgba(7,91,137,.18); }.login-form button:hover { background:var(--login-blue); }.login-form button:disabled { cursor:wait; opacity:.78; }
.login-recovery { margin:1.1rem 0 0; font-size:.82rem; }.login-recovery a { color:var(--login-blue-dark); }.login-signup { display:grid; gap:.2rem; margin:1.7rem 0 0; padding-top:1.25rem; color:var(--login-muted); border-top:1px solid #e0ebf0; font-size:.84rem; }.login-signup strong { color:var(--login-blue-dark); font-weight:750; }.login-signup small { color:#7891a0; font-size:.72rem; }.login-progress { min-height:1.3rem; margin:1.25rem 0 -1.3rem; color:var(--login-muted); font-size:.78rem; }
.login-splash { position:absolute; inset:0; display:grid; align-content:center; justify-items:center; gap:.35rem; padding:2rem; color:var(--login-ink); background:rgba(255,255,255,.98); text-align:center; }.login-splash img { width:54px; height:54px; margin-bottom:.55rem; }.splash-master { margin:0; color:var(--login-muted); font-size:.8rem; font-weight:750; letter-spacing:.1em; text-transform:uppercase; }.login-splash > strong { font-size:2.2rem; letter-spacing:-.05em; }.login-splash > small { margin-top:.35rem; color:var(--login-muted); }.login-page.is-authenticated .login-panel { border-color:#a8d3e2; }.login-page.is-leaving { opacity:0; transition:opacity .24s ease; }
@keyframes wave-drift-far { to { transform:translate3d(-12px,8px,0) scale(1.015); } } @keyframes wave-drift-mid { to { transform:translate3d(16px,-10px,0) scale(1.018); } } @keyframes wave-drift-near { to { transform:translate3d(-8px,6px,0) scale(1.01); } } @keyframes signal-travel { to { stroke-dashoffset:-404; } } @keyframes connection-breathe { 0%,38%,72%,100% { opacity:0; } 48%,61% { opacity:.18; } }
@media (max-width:900px) { main.login-shell { grid-template-columns:1fr; min-height:100svh; } main.login-shell > section.login-story { min-height:42svh; padding:1.5rem clamp(1.25rem,6vw,3rem); }.login-message { padding-top:3.5rem; }.login-message h1 { font-size:clamp(3rem,12vw,5rem); } main.login-shell > section.login-access { min-height:58svh; padding:1.5rem clamp(1rem,5vw,2.5rem) 2.5rem; border-top:1px solid var(--login-line); border-left:0; }.login-panel { width:min(100%,520px); }.wave-layer-far { display:none; } }
@media (max-width:560px) { main.login-shell > section.login-story { min-height:36svh; }.login-message { padding-top:2.5rem; }.login-message h1 { font-size:clamp(2.8rem,16vw,4rem); } main.login-shell > section.login-access { min-height:64svh; align-items:start; padding-top:1.2rem; }.login-panel { padding:1.4rem; } }
@media (prefers-reduced-motion:reduce) { .wave-layer,.signal,.connections { animation:none!important; }.connections { opacity:.08; }.travelling-nodes { display:none; }.login-page.is-leaving { transition:none; } }
