/* v1.240 AUTH-1: Smartrise sign-in — one design for every sign-in screen.
   Brand panel (deep teal, lift scene) beside a calm ivory form panel. */
:root{
  --au-deep:#00262C; --au-teal:#003841; --au-teal-2:#0b4a54; --au-mint:#9FD8D0;
  --au-orange:#F69810; --au-orange-d:#D97F00; --au-orange-ink:#8a4b00;
  --au-ivory:#F7F5F0; --au-card:#FFFFFF; --au-ink:#14242A; --au-soft:#5A6B70; --au-line:#DCE3E3;
  --au-err:#B42318; --au-err-bg:#FDECEA; --au-ok:#1D6B3E; --au-ok-bg:#E6F4EC; --au-info-bg:#EAF2F3;
  --au-focus:rgba(246,152,16,.22);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{ --au-ivory:#0E1A1D; --au-card:#13242A; --au-ink:#E8F0F1; --au-soft:#9DB2B6; --au-line:#26393E;
    --au-err:#FF8A80; --au-err-bg:#3A1C1A; --au-ok:#7FD8A4; --au-ok-bg:#16301F; --au-info-bg:#18303A; color-scheme:dark; }
}
*{ box-sizing:border-box; }
html,body{ margin:0; min-height:100%; }
body.au{ font-family:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; color:var(--au-ink); background:var(--au-ivory); -webkit-font-smoothing:antialiased; }
.au a{ color:inherit; }
.au-shell{ min-height:100vh; display:grid; grid-template-columns:minmax(min(360px,100%), 42%) 1fr; }

/* ---------- brand panel ---------- */
.au-brand{ position:relative; overflow:hidden; color:#fff; padding:40px 48px; display:flex; flex-direction:column; gap:24px;
  background:radial-gradient(120% 80% at 0% 0%, #0d5662 0%, transparent 55%), radial-gradient(90% 70% at 100% 100%, rgba(246,152,16,.18) 0%, transparent 60%), linear-gradient(160deg, var(--au-teal) 0%, var(--au-deep) 70%); }
.au-brand::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:36px 36px; mask-image:linear-gradient(180deg, #000 0%, transparent 85%); }
.au-logo{ position:relative; z-index:1; display:inline-block; width:max-content; }
.au-logo img{ height:30px; display:block; }
.au-brand-copy{ position:relative; z-index:1; max-width:440px; }
.au-eyebrow{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--au-mint); font-weight:700; }
.au-claim{ font-family:'Sora', 'Inter', sans-serif; font-weight:700; font-size:clamp(1.6rem, 2.4vw, 2.3rem); line-height:1.15; margin:10px 0 18px; text-wrap:balance; letter-spacing:-.01em; }
.au-chips{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.au-chips li{ font-size:.78rem; padding:6px 12px; border-radius:99px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); color:rgba(255,255,255,.88); }
.au-scene{ position:relative; z-index:1; flex:1; display:flex; align-items:flex-end; justify-content:center; min-height:220px; }
.au-scene .elevator-scene{ width:min(300px, 70%); height:auto; opacity:.92; filter:drop-shadow(0 30px 40px rgba(0,0,0,.25)); }
.au-status{ position:relative; z-index:1; font-family:'JetBrains Mono', monospace; font-size:.72rem; color:rgba(255,255,255,.72); display:flex; align-items:center; gap:8px; }
.au-dot{ width:8px; height:8px; border-radius:50%; background:#7fe3a8; box-shadow:0 0 0 0 rgba(127,227,168,.6); animation:au-pulse 2.4s ease-out infinite; }
@keyframes au-pulse{ 0%{ box-shadow:0 0 0 0 rgba(127,227,168,.55); } 100%{ box-shadow:0 0 0 10px rgba(127,227,168,0); } }
.au-floor{ position:relative; display:inline-block; width:.7em; height:1.1em; overflow:hidden; vertical-align:bottom; }
.au-floor i{ position:absolute; left:0; font-style:normal; color:var(--au-orange); animation:au-floor 14s linear infinite; }
.au-floor i + i{ animation-name:au-floor-b; opacity:0; }
@keyframes au-floor{ 0%,60%{ opacity:1; } 66%,92%{ opacity:0; } 100%{ opacity:1; } }
@keyframes au-floor-b{ 0%,60%{ opacity:0; } 66%,92%{ opacity:1; } 100%{ opacity:0; } }
.au-trust{ position:relative; z-index:1; margin:0; font-size:.74rem; color:rgba(255,255,255,.6); display:flex; align-items:center; gap:6px; }

/* ---------- form panel ---------- */
.au-main{ display:flex; flex-direction:column; align-items:center; justify-content:center; padding:48px 24px 28px; gap:14px; }
.au-card{ width:100%; max-width:420px; animation:au-in .55s cubic-bezier(.22,1,.36,1) both; }
.au-card--wide{ max-width:470px; }
@keyframes au-in{ from{ opacity:0; transform:translateY(14px); } }
.au-h1{ font-family:'Sora', 'Inter', sans-serif; font-size:1.75rem; line-height:1.2; margin:0 0 6px; letter-spacing:-.015em; color:var(--au-ink); text-wrap:balance; }
.au-sub{ margin:0 0 26px; color:var(--au-soft); font-size:.95rem; line-height:1.55; }
.au-sub b{ color:var(--au-ink); }
.au-steps{ list-style:none; margin:0 0 22px; padding:0; display:flex; gap:6px; }
.au-steps li{ flex:1; display:flex; flex-direction:column; gap:6px; font-size:.72rem; color:var(--au-soft); }
.au-steps li::before{ content:""; height:3px; border-radius:3px; background:var(--au-line); }
.au-steps li.is-done::before{ background:var(--au-teal-2); }
.au-steps li.is-now::before{ background:var(--au-orange); }
.au-steps li b{ display:none; }
.au-steps li.is-now span{ color:var(--au-ink); font-weight:600; }

.au-form{ display:flex; flex-direction:column; gap:16px; }
.au-field{ display:flex; flex-direction:column; gap:6px; }
.au-field > label{ font-size:.82rem; font-weight:600; color:var(--au-ink); display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.au-label-link{ font-weight:500; font-size:.8rem; color:var(--au-orange-d) !important; text-decoration:none; }
.au-label-link:hover{ text-decoration:underline; }
.au-input{ position:relative; display:flex; align-items:center; }
.au-ico{ position:absolute; left:13px; width:18px; height:18px; color:var(--au-soft); pointer-events:none; }
.au-input input{ width:100%; height:48px; padding:0 46px 0 42px; font:inherit; font-size:.98rem; color:var(--au-ink); background:var(--au-card);
  border:1.5px solid var(--au-line); border-radius:12px; outline:none; transition:border-color .18s, box-shadow .18s, background .18s; }
.au-input input::placeholder{ color:#9aa9ad; }
.au-input input:hover{ border-color:#c2cdcd; }
.au-input input:focus{ border-color:var(--au-orange); box-shadow:0 0 0 4px var(--au-focus); }
.au-field.is-bad .au-input input, .au-input input[aria-invalid="true"]{ border-color:var(--au-err); box-shadow:none; }
.au-field.is-good .au-input input{ border-color:#7cbf98; }
.au-eye{ position:absolute; right:6px; width:38px; height:38px; display:grid; place-items:center; border:0; background:transparent; color:var(--au-soft); border-radius:9px; cursor:pointer; }
.au-eye:hover{ background:rgba(0,56,65,.06); color:var(--au-ink); }
.au-eye:focus-visible{ outline:2px solid var(--au-orange); }
.au-eye svg{ width:20px; height:20px; }
.au-eye[aria-pressed="true"] .au-eye-x{ display:none; }
.au-err{ margin:0; min-height:0; font-size:.8rem; color:var(--au-err); }
.au-err:empty{ display:none; }
.au-hint{ margin:0; font-size:.8rem; color:var(--au-soft); }
.au-hint button{ font:inherit; border:0; background:none; padding:0; color:var(--au-orange-d); text-decoration:underline; cursor:pointer; }
.au-caps{ margin:0; font-size:.78rem; color:var(--au-orange-ink); display:flex; align-items:center; gap:6px; }
.au-caps::before{ content:"⇪"; font-weight:700; }

.au-meter{ display:grid; grid-template-columns:repeat(4, 1fr); gap:4px; margin-top:2px; }
.au-meter i{ height:4px; border-radius:4px; background:var(--au-line); transition:background .2s; }
.au-meter[data-score="1"] i:nth-child(-n+1){ background:#d64545; }
.au-meter[data-score="2"] i:nth-child(-n+2){ background:#e8902a; }
.au-meter[data-score="3"] i:nth-child(-n+3){ background:#c8b02a; }
.au-meter[data-score="4"] i{ background:#2f9e61; }
.au-rules{ list-style:none; margin:4px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; font-size:.76rem; color:var(--au-soft); }
.au-rules li{ display:flex; gap:6px; align-items:flex-start; }
.au-rules li::before{ content:"○"; flex:0 0 auto; }
.au-rules li.ok{ color:var(--au-ok); }
.au-rules li.ok::before{ content:"✓"; font-weight:700; }

.au-otp{ display:grid; grid-template-columns:repeat(6, 1fr); gap:8px; }
.au-otp input[type=text]{ width:100%; height:56px; text-align:center; font-family:'JetBrains Mono', monospace; font-size:1.4rem; font-weight:600; color:var(--au-ink);
  background:var(--au-card); border:1.5px solid var(--au-line); border-radius:12px; outline:none; transition:border-color .15s, box-shadow .15s, transform .15s; }
.au-otp input[type=text]:focus{ border-color:var(--au-orange); box-shadow:0 0 0 4px var(--au-focus); transform:translateY(-1px); }
.au-otp.is-bad input[type=text]{ border-color:var(--au-err); animation:au-shake .35s; }
@keyframes au-shake{ 25%{ transform:translateX(-4px); } 75%{ transform:translateX(4px); } }

.au-btn{ position:relative; height:50px; border:0; border-radius:12px; background:var(--au-orange); color:#1a1200; font:inherit; font-weight:700; font-size:1rem; letter-spacing:.01em;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px; box-shadow:0 10px 24px rgba(246,152,16,.28); transition:transform .15s, box-shadow .15s, background .15s; }
.au-btn:hover{ background:#ffa524; transform:translateY(-1px); box-shadow:0 14px 28px rgba(246,152,16,.36); }
.au-btn:active{ transform:none; }
.au-btn:focus-visible{ outline:3px solid var(--au-teal); outline-offset:2px; }
.au-btn[disabled]{ cursor:progress; opacity:.85; transform:none; }
.au-btn.is-busy::before{ content:""; width:16px; height:16px; border-radius:50%; border:2.5px solid rgba(26,18,0,.25); border-top-color:#1a1200; animation:au-spin .7s linear infinite; }
@keyframes au-spin{ to{ transform:rotate(360deg); } }
.au-btn--ghost{ background:transparent; color:var(--au-ink); border:1.5px solid var(--au-line); box-shadow:none; height:46px; font-weight:600; font-size:.92rem; }
.au-btn--ghost:hover{ background:rgba(0,56,65,.05); box-shadow:none; }
.au-btn--link{ height:auto; background:none; border:0; box-shadow:none; color:var(--au-soft); font-weight:500; font-size:.86rem; text-decoration:underline; padding:4px; }
.au-btn--link:hover{ background:none; color:var(--au-ink); box-shadow:none; }
.au-btn--link[disabled]{ text-decoration:none; opacity:.7; }

.au-alert{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border-radius:12px; font-size:.88rem; line-height:1.45; margin:0 0 16px; }
.au-alert b{ flex:0 0 22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:.78rem; color:#fff; }
.au-alert--error{ background:var(--au-err-bg); color:var(--au-err); } .au-alert--error b{ background:var(--au-err); }
.au-alert--success{ background:var(--au-ok-bg); color:var(--au-ok); } .au-alert--success b{ background:var(--au-ok); }
.au-alert--info{ background:var(--au-info-bg); color:var(--au-ink); } .au-alert--info b{ background:var(--au-teal-2); }
.au-row{ display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; font-size:.85rem; color:var(--au-soft); }
.au-check{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.au-check input{ width:16px; height:16px; accent-color:var(--au-teal); }
.au-divider{ display:flex; align-items:center; gap:10px; color:var(--au-soft); font-size:.78rem; margin:6px 0; }
.au-divider::before, .au-divider::after{ content:""; flex:1; height:1px; background:var(--au-line); }
.au-links{ display:flex; justify-content:center; gap:18px; flex-wrap:wrap; margin-top:22px; font-size:.86rem; }
.au-links a{ color:var(--au-soft); text-decoration:none; }
.au-links a:hover{ color:var(--au-ink); text-decoration:underline; }
.au-note{ max-width:420px; text-align:center; font-size:.78rem; color:var(--au-soft); line-height:1.6; margin:4px 0 0; }
.au-foot{ font-size:.72rem; color:var(--au-soft); opacity:.8; margin:10px 0 0; }
.au-apps{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin-top:22px; }
.au-apps div{ border:1px solid var(--au-line); border-radius:12px; padding:10px; font-size:.74rem; color:var(--au-soft); background:var(--au-card); }
.au-apps strong{ display:block; color:var(--au-ink); font-size:.82rem; }
.au-method{ display:flex; gap:12px; align-items:flex-start; padding:14px; border:1.5px solid var(--au-line); border-radius:12px; cursor:pointer; background:var(--au-card); }
.au-method:has(input:checked){ border-color:var(--au-orange); box-shadow:0 0 0 4px var(--au-focus); }
.au-method input{ margin-top:3px; accent-color:var(--au-orange); }
.au-method strong{ display:block; font-size:.92rem; }
.au-method small{ color:var(--au-soft); font-size:.8rem; }
.au-qr{ display:flex; justify-content:center; padding:14px; background:#fff; border:1px solid var(--au-line); border-radius:14px; width:max-content; margin:0 auto; }
.au-secret{ font-family:'JetBrains Mono', monospace; font-size:.86rem; letter-spacing:.06em; background:var(--au-card); border:1px dashed var(--au-line); border-radius:10px; padding:10px 12px; text-align:center; word-break:break-all; }
.au-codes{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.au-codes span{ font-family:'JetBrains Mono', monospace; text-align:center; padding:9px; border-radius:10px; background:var(--au-card); border:1px solid var(--au-line); }
.au-steplist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; counter-reset:s; }
.au-steplist > li{ counter-increment:s; display:flex; flex-direction:column; gap:8px; font-size:.9rem; }
.au-steplist > li > p{ margin:0; display:flex; gap:10px; align-items:center; }
.au-steplist > li > p::before{ content:counter(s); flex:0 0 24px; height:24px; border-radius:50%; background:var(--au-orange); color:#1a1200; display:grid; place-items:center; font-size:.78rem; font-weight:700; }

/* ---------- lift scene (moved from auth-glass) ---------- */
.ev-door--l{ animation:ev-door-l 14s ease-in-out infinite; } .ev-door--r{ animation:ev-door-r 14s ease-in-out infinite; }
@keyframes ev-door-l{ 0%,15%{ transform:translateX(0); } 25%,45%{ transform:translateX(-52px); } 57%,100%{ transform:translateX(0); } }
@keyframes ev-door-r{ 0%,15%{ transform:translateX(0); } 25%,45%{ transform:translateX(52px); } 57%,100%{ transform:translateX(0); } }
.ev-person{ animation:ev-person 14s linear infinite; }
@keyframes ev-person{ 0%,17%{ transform:translate(-160px,0); } 20%{ transform:translate(-70px,-1px); } 23%{ transform:translate(-30px,0); } 26%{ transform:translate(6px,-1.5px); } 29%{ transform:translate(40px,0); } 32%{ transform:translate(74px,-1.5px); } 35%{ transform:translate(108px,0); } 38%{ transform:translate(138px,-1px); } 41%,100%{ transform:translate(150px,0); } }
.ev-person .limb{ transform-box:fill-box; transform-origin:top center; animation:ev-swing-a 14s linear infinite; }
.ev-person .limb--b{ animation-name:ev-swing-b; } .ev-person .limb--far{ opacity:.75; }
@keyframes ev-swing-a{ 0%,17%,41%,100%{ transform:rotate(0deg); } 20%{ transform:rotate(24deg); } 23%{ transform:rotate(-22deg); } 26%{ transform:rotate(24deg); } 29%{ transform:rotate(-22deg); } 32%{ transform:rotate(22deg); } 35%{ transform:rotate(-20deg); } 38%{ transform:rotate(14deg); } }
@keyframes ev-swing-b{ 0%,17%,41%,100%{ transform:rotate(0deg); } 20%{ transform:rotate(-22deg); } 23%{ transform:rotate(24deg); } 26%{ transform:rotate(-22deg); } 29%{ transform:rotate(24deg); } 32%{ transform:rotate(-20deg); } 35%{ transform:rotate(22deg); } 38%{ transform:rotate(-14deg); } }
.ev-ind--a{ animation:ev-ind-a 14s linear infinite; } .ev-ind--b{ animation:ev-ind-b 14s linear infinite; opacity:0; }
@keyframes ev-ind-a{ 0%,60%{ opacity:1; } 66%,92%{ opacity:0; } 100%{ opacity:1; } }
@keyframes ev-ind-b{ 0%,60%{ opacity:0; } 66%,92%{ opacity:1; } 100%{ opacity:0; } }
.ev-dot{ animation:ev-dot 14s ease-in-out infinite; } @keyframes ev-dot{ 0%,60%,72%,100%{ opacity:.25; } 65%{ opacity:1; } }
.ev-light{ animation:ev-light 14s ease-in-out infinite; } @keyframes ev-light{ 0%,58%,88%,100%{ opacity:.55; } 70%{ opacity:1; } }

/* ---------- phones & tablets ---------- */
@media (max-width: 900px){
  .au-shell{ grid-template-columns:1fr; grid-template-rows:auto 1fr; }
  .au-brand{ padding:18px 20px 20px; gap:10px; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; }
  .au-brand-copy{ flex:1 1 100%; order:3; }
  .au-claim{ font-size:1.15rem; margin:4px 0 0; }
  .au-eyebrow{ font-size:.68rem; }
  .au-chips, .au-scene, .au-trust{ display:none; }
  .au-status{ order:2; font-size:.66rem; }
  .au-main{ justify-content:flex-start; padding:28px 16px 24px; }
  .au-h1{ font-size:1.45rem; }
  .au-rules{ grid-template-columns:1fr; }
  .au-apps{ grid-template-columns:1fr; }
}
@media (max-width: 380px){ .au-otp{ gap:5px; } .au-otp input[type=text]{ height:50px; font-size:1.2rem; } }
@media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation:none !important; transition:none !important; } }
