/* Isolated login concept. Colors and control sizing follow public/styles.css. */
:root {
  --bg:#10181c;
  --bg-2:#151f23;
  --card:#192329;
  --line:#2a353c;
  --text:#e8eef0;
  --muted:#8b9aa3;
  --teal:#3d9b8f;
  --btn:#243038;
  --hover:#182228;
}
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; }
body { font-family:"Segoe UI",system-ui,sans-serif; background:var(--bg); color:var(--text); }
button,input { font:inherit; }
button { cursor:pointer; }
.back-home { position:fixed; top:22px; left:24px; z-index:20; color:#78aaa9; font-size:13px; line-height:1.3; text-decoration:none; transition:color .18s ease; }
.back-home:hover { color:#b9ded8; text-decoration:underline; }
.page { min-height:100vh; min-height:100dvh; display:grid; grid-template-columns:44% 56%; overflow:hidden; }
.sign-in { min-height:100vh; min-height:100dvh; display:grid; place-items:center; position:relative; z-index:2; background:linear-gradient(135deg,#10181c 0%,#111a1e 68%,#0f181c 100%); border-right:1px solid #304047; }
.sign-in-inner { width:min(100% - 112px,450px); min-width:0; position:relative; top:-34px; }
.brand { display:flex; align-items:center; gap:11px; color:var(--text); font-size:15px; font-weight:750; letter-spacing:.085em; }
.brand img { width:31px; height:34px; object-fit:contain; flex:none; }
.form-area { margin-top:86px; }
.eyebrow { display:block; font-size:11px; font-weight:700; letter-spacing:.15em; color:#8ac5bd; }
.heading h1 { margin:12px 0 5px; font-size:clamp(34px,3vw,44px); line-height:1.12; letter-spacing:-.035em; font-weight:720; }
.heading p { margin:0; color:var(--muted); font-size:15px; line-height:1.5; }
form { margin-top:37px; }
.field { margin:0 0 18px; }
.field label { display:block; margin:0 0 8px; color:#dce6e7; font-size:13px; font-weight:600; }
.field input { display:block; width:100%; height:47px; padding:0 14px; border:1px solid #36434b; border-radius:3px; outline:0; background:var(--bg-2); color:var(--text); color-scheme:dark; font-size:14px; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.field input::placeholder { color:#91a2aa; opacity:1; }
.field input:hover { border-color:#52616a; }
.field input:focus { border-color:#5ba99e; box-shadow:0 0 0 3px rgba(61,155,143,.12); background:#151f23; }
.field input:-webkit-autofill { -webkit-text-fill-color:var(--text); box-shadow:0 0 0 1000px var(--bg-2) inset; }
.password-wrap { position:relative; }
.password-wrap input { padding-right:53px; }
.eye-button { position:absolute; top:0; right:0; width:48px; height:47px; display:grid; place-items:center; border:0; border-radius:0 3px 3px 0; background:transparent; color:#91a0a8; }
.eye-button:hover { color:#dbe5e7; }
.eye-button svg { width:19px; height:19px; }
.eye-closed { display:none; }
.eye-button[aria-pressed="true"] .eye-open { display:none; }
.eye-button[aria-pressed="true"] .eye-closed { display:block; }
.form-options { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:1px 0 21px; }
.remember { display:inline-flex; align-items:center; gap:8px; color:#d6e0e2; font-size:13px; cursor:pointer; }
.remember input { width:15px; height:15px; margin:0; accent-color:var(--teal); }
.text-button { border:0; padding:4px 0; background:none; color:#a0dcd1; font-size:13px; font-weight:700; }
.text-button:hover { color:#b5e0d8; text-decoration:underline; }
.action-row { display:grid; grid-template-columns:minmax(0,44fr) minmax(0,56fr); gap:10px; }
.primary-button,.google-button { min-width:0; width:100%; height:46px; border-radius:3px; font-size:14px; font-weight:700; transition:background .18s ease,border-color .18s ease; }
.primary-button { border:1px solid #5b9e94; background:#28383c; color:#f2f7f6; }
.primary-button:hover { background:#34474b; border-color:#82c5ba; }
.google-button { display:flex; align-items:center; justify-content:center; gap:8px; padding:0 8px; border:1px solid #354149; background:#171f25; color:#e4ebec; white-space:nowrap; }
.google-button:hover { background:#202a30; border-color:#61767a; }
.google-button svg { width:17px; height:17px; flex:none; }
.preview-note { margin:11px 0 0; padding:10px 12px; border:1px solid var(--line); border-radius:6px; color:#b8d5d0; background:#142522; font-size:12px; line-height:1.4; }
.preview-note[hidden] { display:none; }
:focus-visible { outline:2px solid #7ec9bf; outline-offset:3px; }

.world-panel { min-width:0; min-height:100vh; min-height:100dvh; overflow:hidden; position:relative; isolation:isolate; background:radial-gradient(ellipse 82% 70% at 78% 39%,#193337 0%,#13262b 48%,#101b21 76%,#0c151b 100%); }
.world-panel::before { content:""; position:absolute; z-index:0; inset:0; background:linear-gradient(90deg,rgba(11,25,30,.92) 0%,rgba(12,29,34,.62) 16%,rgba(14,34,39,.24) 34%,transparent 54%),radial-gradient(ellipse 48% 50% at 65% 42%,rgba(61,155,143,.11),transparent 72%); pointer-events:none; }
.world-panel::after { content:""; position:absolute; z-index:1; bottom:0; left:0; right:0; height:27%; background:linear-gradient(0deg,rgba(10,20,27,.91) 0%,rgba(10,20,27,.46) 48%,rgba(10,20,27,0) 100%); pointer-events:none; }
.world-topline { position:absolute; top:44px; left:clamp(34px,5vw,84px); right:clamp(34px,5vw,84px); display:flex; align-items:center; gap:12px; z-index:3; color:#94adae; font-size:10px; font-weight:700; letter-spacing:.16em; white-space:nowrap; }
.signal-dot { width:6px; height:6px; border-radius:50%; background:#66bdb0; box-shadow:0 0 9px rgba(102,189,176,.4); }
.topline-rule { height:1px; flex:1; position:relative; overflow:hidden; background:rgba(157,189,187,.20); }
.topline-rule::before,.topline-rule::after { content:""; position:absolute; top:0; left:-20%; width:18%; height:1px; background:linear-gradient(90deg,transparent,rgba(174,226,215,.72),transparent); animation:signal-sweep 5.5s linear infinite; }
.topline-rule::before { animation-delay:-2.75s; }
@keyframes signal-sweep { 0%,8% { transform:translateX(0); opacity:0; } 18% { opacity:.9; } 78% { opacity:.9; } 92%,100% { transform:translateX(680%); opacity:0; } }
.status-end { animation:status-arrival 5.5s ease-in-out infinite; }
@keyframes status-arrival { 0%,72%,100% { color:#94adae; text-shadow:none; } 84% { color:#c7e6e1; text-shadow:0 0 8px rgba(113,211,198,.28); } }
.globe-stage { position:absolute; z-index:1; width:108%; aspect-ratio:1; top:4%; right:-21%; pointer-events:none; -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.12) 12%,rgba(0,0,0,.66) 31%,rgba(0,0,0,.94) 50%,#000 68%); mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.12) 12%,rgba(0,0,0,.66) 31%,rgba(0,0,0,.94) 50%,#000 68%); }
.globe-halo { position:absolute; inset:13%; border-radius:50%; background:radial-gradient(circle at 63% 42%,rgba(62,142,154,.10),rgba(32,88,108,.025) 48%,transparent 73%); filter:blur(22px); }
#globe { position:absolute; inset:0; width:100%; height:100%; display:block; }
.world-copy { position:absolute; z-index:3; left:clamp(34px,5vw,84px); right:36px; bottom:clamp(105px,13vh,160px); max-width:680px; text-shadow:0 1px 10px rgba(6,14,18,.6); }
.world-copy h2 { margin:13px 0 13px; color:#e8eef0; font-size:clamp(27px,2.3vw,35px); line-height:1.23; letter-spacing:-.025em; font-weight:690; }
.world-copy h2 em { color:#bed9d5; font-style:normal; }
.world-copy p { margin:0; color:#a0b3b5; font-size:14px; line-height:1.5; }
.world-footer { position:absolute; z-index:3; bottom:30px; left:clamp(34px,5vw,84px); right:clamp(34px,5vw,84px); display:flex; justify-content:space-between; gap:14px; color:#718c90; font-size:9px; font-weight:700; letter-spacing:.13em; border-top:1px solid rgba(151,187,185,.14); padding-top:17px; }

@media (max-width:1050px) {
  .page { grid-template-columns:48% 52%; }
  .sign-in-inner { width:min(100% - 68px,440px); }
  .world-copy h2 { font-size:29px; }
  .globe-stage { width:126%; right:-38%; top:5%; }
}
@media (max-width:760px) {
  .back-home { top:16px; left:18px; font-size:12px; }
  .page { display:block; overflow:auto; }
  .sign-in { min-height:100vh; min-height:100dvh; border-right:0; background:radial-gradient(ellipse 80% 35% at 90% 0%,rgba(37,90,86,.15),transparent 75%),var(--bg); }
  .sign-in-inner { width:min(100% - 48px,460px); padding:32px 0; top:-14px; }
  .form-area { margin-top:55px; }
  .sign-in .field input { font-size:16px !important; }
  .world-panel { display:none; }
}
@media (max-width:880px) {
  .action-row { grid-template-columns:minmax(0,42fr) minmax(0,58fr); gap:8px; }
  .action-row .primary-button,.action-row .google-button { padding-left:6px; padding-right:6px; font-size:12px; }
  .action-row .google-button { gap:5px; }
}
@media (max-width:420px) {
  .sign-in-inner { width:calc(100% - 36px); }
  .form-area { margin-top:42px; }
  .heading h1 { font-size:36px; }
  .form-options { align-items:flex-start; }
}
@media (max-height:730px) and (min-width:761px) {
  .sign-in-inner { top:-10px; }
  .form-area { margin-top:35px; }
  .world-copy { bottom:70px; }
  .globe-stage { top:-20%; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; }
}

/* Working authentication states */
form[hidden], [hidden] { display:none !important; }
.brand { text-decoration:none; }
.sign-in { overflow:auto; padding:28px 0; }
.sign-in-inner { margin:auto; }
.form-area form:not(#loginForm) { margin-top:28px; }
.form-area .muted { color:var(--muted); line-height:1.5; }
.login-name-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.sign-in .field input { height:47px !important; border-radius:3px !important; background:var(--bg-2) !important; border:1px solid #36434b !important; color:var(--text) !important; }
.sign-in .eye-button { top:0 !important; right:0 !important; width:48px !important; min-width:48px !important; height:47px !important; padding:0 !important; border-radius:0 3px 3px 0 !important; }
.sign-in .primary-button,.sign-in .google-button { min-height:46px; border-radius:3px !important; }
.sign-in .google-btn { margin:0; opacity:1; }
.sign-in .google-btn:disabled { opacity:.72; cursor:not-allowed; }
.sign-in .google-btn .google-icon { position:static; width:17px; height:17px; transform:none; }
.sign-in .google-btn .google-icon svg { width:17px; height:17px; }
.sign-in .login-go { display:inline-flex; align-items:center; justify-content:center; }
.sign-in .secondary-auth-form { margin-top:28px; }
.login-status { min-height:42px; margin-top:12px; }
.sign-in .banner { display:block !important; min-height:42px; margin:0; visibility:hidden; opacity:0; }
.sign-in .banner.show { visibility:visible; opacity:1; }
.sign-in .text-button { margin-top:8px; }
.sign-in .form-options .text-button { margin-top:0; }
@media (max-width:880px) { .login-name-grid { grid-template-columns:1fr; gap:0; } }

/* Fix719: grey eye at the password ring end; reserved Wrong login slot. */
.sign-in input[type="password"]::-ms-reveal,
.sign-in input[type="password"]::-ms-clear{display:none!important;width:0!important;height:0!important;}
.sign-in .password-wrap,.sign-in .pass-wrap{position:relative!important;overflow:visible!important;}
.sign-in .password-wrap input,.sign-in .pass-wrap input{padding-right:48px!important;}
.sign-in .eye-button.eye{
  position:absolute!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  width:46px!important;
  min-width:46px!important;
  height:47px!important;
  padding:0!important;
  margin:0!important;
  transform:none!important;
  display:grid!important;
  place-items:center!important;
  z-index:3!important;
  color:#9aa6ad!important;
  font-size:0!important;
  line-height:0!important;
  opacity:1!important;
  background:transparent!important;
  border:0!important;
}
.sign-in .eye-button.eye svg{display:none!important;}
.sign-in .eye-button.eye::before{
  content:"";
  width:18px;
  height:18px;
  display:block;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M2.6 12s3.5-6 9.4-6 9.4 6 9.4 6-3.5 6-9.4 6-9.4-6-9.4-6Z'/%3E%3Ccircle cx='12' cy='12' r='2.7' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M2.6 12s3.5-6 9.4-6 9.4 6 9.4 6-3.5 6-9.4 6-9.4-6-9.4-6Z'/%3E%3Ccircle cx='12' cy='12' r='2.7' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center / contain no-repeat;
}
.sign-in .eye-button.eye[aria-pressed="true"]::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' d='M3 3l18 18M9.8 6.3A12 12 0 0 1 12 6c6 0 9.5 6 9.5 6a18 18 0 0 1-3.2 3.8M6.1 7.1A19 19 0 0 0 2.5 12s3.5 6 9.5 6a13 13 0 0 0 4.3-.8M10 10a2.8 2.8 0 0 0 4 4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' d='M3 3l18 18M9.8 6.3A12 12 0 0 1 12 6c6 0 9.5 6 9.5 6a18 18 0 0 1-3.2 3.8M6.1 7.1A19 19 0 0 0 2.5 12s3.5 6 9.5 6a13 13 0 0 0 4.3-.8M10 10a2.8 2.8 0 0 0 4 4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.sign-in .eye-button.eye:hover{color:#dbe5e7!important;}

/* 730: stable auth layout and reset visibility controls. */
.sign-in{overflow-anchor:none}
.sign-in-inner,.form-area{animation:none!important;transition:none!important}
.login-status{height:54px;min-height:54px}
.sign-in .banner{min-height:42px;max-height:54px;overflow:auto}

/* Local authentication: fixed top anchor across sign-in, registration and verification. */
.sign-in{display:block;padding:clamp(82px,13vh,170px) 0 48px;overflow:auto}
.sign-in-inner{top:0!important;margin:0 auto!important}
.sign-in .form-area{margin-top:32px!important}
.sign-in .eye-button.eye:focus-visible{outline:none!important;box-shadow:inset 0 0 0 1px #7ec9bf!important;border-radius:3px!important;color:#dbe5e7!important}
.password-choice select{width:100%;height:47px;padding:0 12px;background:var(--bg-2);border:1px solid #36434b;border-radius:3px;color:var(--text);font:inherit;font-size:13px}
.generate-buttons{display:flex;gap:18px;margin:10px 0}
.generated-confirm{font-size:12px;margin:10px 0}
.password-requirements{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px;padding:0;margin:-6px 0 20px;list-style:none;font-size:12px;color:var(--muted)}
.password-requirements .met{color:#70c6ac}
.pin-row{display:flex;gap:9px;margin:22px 0 14px}
.sign-in .pin-row .pin-box{width:calc((100% - 45px)/6);height:52px!important;min-width:0;text-align:center;font-size:23px!important;padding:0!important}
.verification-address{color:var(--muted);font-size:14px;overflow-wrap:anywhere}
.verification-actions{display:flex;justify-content:space-between;gap:14px;margin-top:20px}
#verifyForm>.primary-button{width:100%}
@media(max-width:720px){.sign-in{padding-top:80px}.sign-in-inner{padding:0!important}.sign-in .form-area{margin-top:28px!important}}
@media(max-width:380px){.password-requirements{grid-template-columns:1fr}.pin-row{gap:6px}.sign-in .pin-row .pin-box{width:calc((100% - 30px)/6)}}
.sign-in .password-choice .generated-confirm{display:flex;align-items:center;gap:8px;font-weight:400}.sign-in .password-choice .generated-confirm input{width:15px!important;height:15px!important;min-height:0!important;flex:none;margin:0;appearance:auto}.sign-in .password-choice .generated-confirm span{display:inline}

/* Compact Create Account password area. */
#registerForm .password-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px}
#registerForm .password-label-row label{margin:0}
#registerForm .password-actions{display:flex;align-items:center;gap:14px}
#registerForm .password-actions button{padding:1px 0;background:transparent;border:0;border-radius:2px;font-size:12px;font-weight:400;line-height:18px;white-space:nowrap}
#registerForm .password-actions button:disabled{opacity:.4;cursor:default}
#registerForm .password-requirements{gap:5px 12px;margin:-6px 0 6px;font-size:11px;line-height:16px}
#registerForm .password-requirements li{display:flex;align-items:baseline;gap:4px}
#registerForm .password-requirements li>span{display:inline-block;width:10px;flex:none}
#registerForm .password-feedback{min-height:18px;margin:0 0 12px;font-size:12px;line-height:18px;color:var(--muted);background:none;border:0;max-height:none;overflow:visible;overflow-wrap:anywhere}
#registerForm .password-feedback.is-error{color:#e9a5a5}
.sign-in #registerForm :is(input,select):focus{border-color:#7ec9bf!important;outline:none!important;box-shadow:none!important}
.sign-in #registerForm :is(input,select):focus-visible{outline:1px solid #7ec9bf!important;outline-offset:-1px!important;box-shadow:none!important}
.sign-in #registerForm .eye-button.eye:focus-visible{outline:none!important;box-shadow:inset 0 0 0 1px #7ec9bf!important}
#registerForm .password-actions button:focus-visible{outline:1px solid #7ec9bf;outline-offset:3px;box-shadow:none}

/* Themed authentication methods. */
.auth-provider-option .google-button{width:100%;display:flex;align-items:center;justify-content:center}
.auth-email-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:20px 0}
.auth-email-divider::before,.auth-email-divider::after{content:"";height:1px;flex:1;background:#304047}
#loginForm>.action-row,#registerForm>.action-row{grid-template-columns:1fr}
#loginForm>.action-row>.primary-button,#registerForm>.action-row>.primary-button{width:100%}
@media(max-width:350px){.auth-email-divider{gap:6px;font-size:11px}}


/* Compact auth controls and desktop page fit. Keep content reachable on small screens. */
.sign-in{padding:clamp(54px,6vh,82px) 0 20px;overflow:visible}
.sign-in .brand{gap:6px;font-size:14px}
.sign-in .brand img{width:25px;height:27px}
.sign-in .form-area{margin-top:20px!important}
.heading h1{font-size:36px;margin:9px 0 5px}
.heading p{font-size:13px;line-height:1.45}
.sign-in form,.sign-in .form-area form:not(#loginForm){margin-top:20px}
.sign-in .field{margin-bottom:12px}
.sign-in .login-name-grid{grid-template-columns:1fr 1fr;gap:10px}
.sign-in .field label{font-size:12px;line-height:16px;margin-bottom:5px}
.sign-in .field input{height:32px!important;min-height:32px!important;padding:0 10px;font-size:13px!important;line-height:20px}
.sign-in .password-wrap input,.sign-in .pass-wrap input{padding-right:36px!important}
.sign-in .eye-button.eye{width:34px!important;min-width:34px!important;height:32px!important}
.sign-in .eye-button.eye::before{width:16px;height:16px}
.sign-in .primary-button,.sign-in .google-button{height:34px;min-height:34px;font-size:13px}
.auth-email-divider{margin:12px 0;font-size:11px}
.form-options{margin:0 0 14px}
.remember,.sign-in .text-button{font-size:12px}
.sign-in .auth-switch{font-size:12px;margin:12px 0 0;line-height:20px}
.sign-in .auth-switch .text-button{margin-top:0}
/* Shared inline feedback has a reserved slot; it never resizes the auth panel. */
.sign-in .login-status{height:36px;min-height:36px;margin:4px 0 0;display:flex;align-items:center}
.sign-in .login-status .banner{display:block!important;margin:0;padding:0;min-height:0;max-height:36px;overflow:auto;overflow-wrap:anywhere;background:transparent;border:0;border-radius:0;color:#f0aaa5;font-size:12px;line-height:18px;visibility:hidden;opacity:0}
.sign-in .login-status .banner.show{visibility:visible;opacity:1}
.sign-in .login-status .banner.info{color:var(--muted)}
.sign-in .login-status + .auth-form-stack{margin-top:4px}
#registerForm .password-label-row{margin-bottom:5px;min-height:18px}
#registerForm .password-actions button{font-size:11px;margin-top:0;line-height:16px}
#registerForm .password-requirements{margin:-3px 0 9px;gap:2px 10px;font-size:10px;line-height:14px}
#registerForm .password-feedback{min-height:0;margin:0;font-size:11px;line-height:16px}
#registerForm .password-feedback:not(:empty){margin:0 0 9px}
.registration-email-note{display:flex;align-items:center;gap:9px;padding:9px 10px;margin:2px 0 12px;border:1px solid #36434b;border-radius:3px;background:var(--bg-2)}
.registration-email-note img{width:20px;height:22px;object-fit:contain;flex:none}
.registration-email-note p{margin:0;flex:1;color:#dce6e7;font-size:12px;line-height:16px}
.registration-email-note p span{display:block;color:var(--muted);font-size:10px;line-height:15px}
.registration-email-note nav{display:flex;gap:8px;align-self:flex-end;white-space:nowrap}
.registration-email-note a{font-size:10px;color:#a0dcd1;text-decoration:none}
.registration-email-note a:hover{text-decoration:underline}
.sign-in .pin-row .pin-box{height:38px!important;font-size:20px!important}
@media(min-width:761px) and (max-height:800px){
 .sign-in{padding-top:48px;padding-bottom:12px}
 .sign-in .brand{flex-direction:row;justify-content:center;height:28px;gap:9px}
 .sign-in .form-area{margin-top:16px!important}
 .heading h1{font-size:31px;margin-top:6px}
 .eyebrow{font-size:10px}
 .sign-in form,.sign-in .form-area form:not(#loginForm){margin-top:14px}
 .sign-in .field{margin-bottom:9px}
 .auth-email-divider{margin:9px 0}
 .registration-email-note{padding:7px 9px;margin-bottom:9px}
 .sign-in .auth-switch{margin-top:8px}
}
@media(max-width:760px){
 .sign-in{padding-top:58px;padding-bottom:20px}
 .sign-in-inner{padding:0!important}
 .sign-in .form-area{margin-top:20px!important}
 .sign-in .field input{font-size:16px!important}
 .login-name-grid{grid-template-columns:1fr 1fr;gap:10px}
 .registration-email-note{flex-wrap:wrap}
 .registration-email-note nav{margin-left:auto}
}
@media(max-width:360px){.registration-email-note p span{max-width:190px}}

/* Genuine local bot verification, followed by the existing email PIN step. */
.registration-bot{margin:3px 0 12px}
.human-card{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:66px;padding:9px 12px;border:1px solid #36434b;border-radius:3px;background:var(--bg-2)}
.human-check{display:inline-flex;align-items:center;gap:10px;padding:5px 0;border:0;background:transparent;color:var(--text);font-size:12px;font-weight:400;text-align:left}
.human-check:disabled{opacity:1;cursor:default}
.human-square{width:22px;height:22px;display:grid;place-items:center;flex:none;border:1px solid #91a2aa;border-radius:2px}
.human-square svg{display:none;width:20px;height:20px;fill:none;stroke:#70c6ac;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.human-card.is-checking .human-square{border:2px solid #36434b;border-top-color:#70c6ac;border-radius:50%;animation:laizo-human-spin .8s linear infinite}
.human-card.is-verified .human-square{border-color:transparent}
.human-card.is-verified .human-square svg{display:block}
.human-card.is-verified #humanText{color:#70c6ac}
.human-identity{display:flex;flex-direction:column;align-items:center;gap:4px;flex:none;min-width:61px}
.human-identity img{width:25px;height:27px;object-fit:contain}
.human-identity nav{display:flex;gap:7px;font-size:9px;line-height:12px}
.human-identity a{color:var(--muted);text-decoration:none}
.human-identity a:hover{color:#a0dcd1;text-decoration:underline}
.registration-bot>p{margin:0;color:#e9a5a5;font-size:11px;line-height:16px}
.registration-bot>p:not(:empty){margin-top:6px}
@keyframes laizo-human-spin{to{transform:rotate(360deg)}}
@media(min-width:761px){
 .sign-in{display:flex;align-items:center;padding:64px 0 36px;min-height:100dvh}
 .sign-in-inner{margin:auto!important;flex:none}
 .sign-in .brand{height:auto;flex-direction:column;gap:6px}
}
@media(min-width:761px) and (max-height:800px){.sign-in{padding:44px 0 12px}}

/* A shared shell reserves both original forms, so switching never recentres it. */
.sign-in .sign-in-inner{width:min(calc(100% - 64px),486px);padding:16px;border:1px solid #29363c;border-radius:4px}
.sign-in .heading{min-height:88px}
.sign-in .heading h1{min-height:41px}
.sign-in .heading p{min-height:19px}
.auth-form-stack{display:grid;align-items:start;margin-top:20px}
.sign-in .auth-form-stack>form,.sign-in .auth-form-stack>section{grid-area:1/1;margin:0!important;min-width:0}
.sign-in #loginForm[hidden],.sign-in #registerForm[hidden]{display:block!important;visibility:hidden;pointer-events:none}
.sign-in .auth-switch{min-height:20px}
.human-card{height:52px;min-height:52px;padding:6px 10px}
.human-check{gap:9px;padding:4px 0}
.human-square{width:21px;height:21px;position:relative}
.human-identity{gap:2px;min-width:53px;align-self:stretch;justify-content:flex-end}
.human-identity img{width:18px;height:20px}
.human-identity nav{font-size:8px;line-height:10px;gap:6px}
.human-card.is-checking .human-square{border:0;border-radius:0;animation:none}
.human-card.is-checking .human-square::before{content:"";position:absolute;width:3px;height:3px;left:9px;top:9px;border-radius:50%;box-shadow:0 -9px #70c6ac,6.4px -6.4px #70c6ac,9px 0 rgba(112,198,172,.8),6.4px 6.4px rgba(112,198,172,.65),0 9px rgba(112,198,172,.5),-6.4px 6.4px rgba(112,198,172,.35),-9px 0 rgba(112,198,172,.2),-6.4px -6.4px rgba(112,198,172,.1);animation:laizo-human-spin .9s linear infinite}
.human-card.is-verified .human-square{width:26px;height:26px;border:0;border-radius:50%;background:#218b4d}
.human-card.is-verified .human-square svg{width:18px;height:18px;stroke:#fff;stroke-width:3}
.human-card.is-verified #humanText{color:var(--text)}
.returning-account{padding-top:4px}
.last-account-row{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:9px 11px;border:1px solid #36434b;border-radius:3px;background:var(--bg-2);color:var(--text);font-size:12px;text-align:left}
.last-account-row:hover{border-color:#679b92;background:#1a282d}
.last-account-row img{width:16px;height:18px;flex:none}
.last-account-row .last-account-email{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.last-account-row .last-used{flex:none;color:#a0dcd1;background:#203b3b;border-radius:8px;padding:2px 7px;font-size:10px;line-height:14px}
.last-account-row svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.3}
.returning-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:11px;margin:20px 0}
.returning-divider::before,.returning-divider::after{content:"";height:1px;flex:1;background:#304047}
.sign-in .other-account{display:block;margin:0 auto;padding:4px 0;font-weight:400}
.has-returning-session .heading h1{font-size:25px;line-height:41px;white-space:nowrap;letter-spacing:-.02em}
@media(min-width:761px) and (max-height:800px){
 .sign-in{padding:38px 0 12px}
 .sign-in .sign-in-inner{padding:12px 16px}
 .sign-in .heading{min-height:76px}
 .sign-in .heading h1{min-height:35px}
 .auth-form-stack{margin-top:14px}
 .has-returning-session .heading h1{line-height:35px}
}
@media(max-width:760px){
 .sign-in .sign-in-inner{width:calc(100% - 32px);padding:14px!important}
 .sign-in .heading{min-height:115px}
 .sign-in .heading p{min-height:38px}
 .has-returning-session .heading h1{font-size:clamp(18px,5.2vw,22px);white-space:nowrap}
 .last-account-row{gap:7px;padding:8px;font-size:11px}
}

/* Narrower controls, a little more room below the shared footer. */
.sign-in .sign-in-inner{width:min(calc(100% - 64px),454px);padding-bottom:28px}
.auth-form-stack{position:relative;overflow:hidden}
.sign-in .auth-form-stack>#loginForm{display:flex!important;flex-direction:column;align-self:stretch}
.login-context{flex:1;display:flex;flex-direction:column;justify-content:center;margin-top:18px;padding:16px 0 4px;border-top:1px solid #29363c}
.login-context strong{color:#c8d9da;font-size:12px;line-height:18px;font-weight:600}
.login-context p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:18px}
.sign-in .auth-form-stack>.auth-motion-leave[hidden]{display:block!important;visibility:visible!important;pointer-events:none}
.sign-in .auth-form-stack>#loginForm.auth-motion-leave[hidden]{display:flex!important}
@media(min-width:761px) and (max-height:800px){.sign-in .sign-in-inner{padding-bottom:24px}}
@media(max-width:760px){.sign-in .sign-in-inner{width:calc(100% - 40px);padding-bottom:24px!important}}

/* Keep the shared logo/heading anchor, but fit the separate PIN panel to its content. */
.auth-panel-anchor{display:contents}
.auth-panel-anchor[data-view="measure-verify"] #registerFoot[hidden]{display:block!important;visibility:hidden}
.auth-panel-anchor[data-view="verify"]{display:block;position:relative;flex:none;width:var(--auth-anchor-width);height:var(--auth-anchor-height);margin:auto}
.sign-in .auth-panel-anchor[data-view="verify"] .sign-in-inner{width:100%;margin:0!important}
.sign-in .auth-panel-anchor[data-view="verify"] #loginForm[hidden],
.sign-in .auth-panel-anchor[data-view="verify"] #registerForm[hidden]{display:none!important}
.auth-panel-anchor[data-view="verify"] .verification-address{margin-top:0}

/* Temporary compositor layers exist only during the original-form slide. */
.auth-form-stack>.auth-motion-leave{will-change:transform,opacity}

/* Six compact digit cells; preserve the verification panel and action widths. */
.sign-in #verifyForm .pin-row{width:min(100%,308px);gap:8px}
.sign-in #verifyForm .pin-row .pin-box{flex:1 1 0;width:0;max-width:44px;height:42px!important}

/* Align only the separate verification step around its compact PIN row. */
.auth-panel-anchor[data-view="verify"] .heading{text-align:center}
.sign-in #verifyForm .pin-row{margin-left:auto;margin-right:auto}
#verifyForm .verification-address,#verifyForm #pinExpiry{text-align:center}

/* Password feedback occupies a stable slot before Remember me/Forgot password. */
.sign-in #loginForm .field:has(#pass){margin-bottom:0}
.sign-in #loginForm>.login-status{height:36px;min-height:36px;margin:4px 0 6px}
.sign-in #loginForm>.login-status .banner{max-height:36px}
.sign-in .sign-in-inner{padding-bottom:16px}
@media(min-width:761px) and (max-height:800px){.sign-in .sign-in-inner{padding-bottom:16px}}
@media(max-width:760px){.sign-in .sign-in-inner{padding-bottom:16px!important}}

/* Keep both original forms in the shared grid during the existing slide.
   Permanent feedback slots retain their size when the single live region moves. */
.sign-in .field input{height:34px!important;min-height:34px!important}
.sign-in .eye-button.eye{height:34px!important}
.sign-in .auth-form-stack{margin-top:14px}
.sign-in .auth-feedback-login{height:46px;min-height:46px;padding:4px 0 6px}
.sign-in .auth-feedback-register{height:24px;min-height:24px}
.sign-in .auth-feedback-slot>.login-status{height:100%;min-height:0;margin:0}
.sign-in .auth-feedback-register .banner{max-height:24px}
.sign-in :is(#loginFoot,#registerFoot){height:28px;min-height:28px;box-sizing:border-box}