/* Login shares the depth scene and glass form from the approved HTML mockup. */
body.login-page {
  --text:#334958; --muted:#607b91; --accent:#2d6fb3;
  margin:0; min-height:100dvh; padding:0; background:#eff7fd; color:var(--text);
}
.login-depth-scene { position:fixed; inset:0; z-index:0; pointer-events:none; background:radial-gradient(ellipse at 78% 25%,rgba(67,145,226,.42),transparent 35%),#eff7fd; }
.login-depth-scene canvas { position:absolute; inset:0; display:block; width:100%; height:100%; }
.login-depth-scene canvas[hidden] { display:none; }
.login-depth-water { opacity:.76; }
body.login-page .login-shell { position:relative; z-index:1; display:grid; place-items:center; width:100%; min-height:100dvh; padding:24px; }
body.login-page .login-panel {
  display:grid; width:min(100%,376px); gap:18px; padding:clamp(24px,3vw,38px);
  border:1px solid rgba(255,255,255,.78); border-radius:22px; background:rgba(246,252,255,.66);
  box-shadow:0 24px 52px rgba(47,91,124,.14),inset 1px 1px rgba(255,255,255,.72);
  backdrop-filter:blur(20px) saturate(1.08);
}
body.login-page .eyebrow { margin:0 0 12px; color:#3275b1; font-size:10px; font-weight:760; letter-spacing:.055em; }
body.login-page h1 { margin:0; color:#263d4d; font-size:clamp(30px,3vw,42px); font-weight:650; letter-spacing:-.045em; line-height:1; }
body.login-page .login-form { gap:14px; }
body.login-page label { gap:7px; color:var(--muted); font-size:12px; font-weight:620; }
body.login-page input:not([type="checkbox"]) {
  width:100%; min-height:46px; padding:11px 13px; border:1px solid rgba(75,119,151,.2); border-radius:11px;
  background:rgba(220,236,251,.72); color:var(--text); font-size:14px; transition:border-color 160ms,box-shadow 160ms,background 160ms;
}
body.login-page #login-password { padding-right:44px; }
body.login-page input:not([type="checkbox"]):focus { border-color:rgba(45,111,179,.68); background:rgba(249,253,255,.86); box-shadow:0 0 0 3px rgba(78,150,223,.16); outline:none; }
body.login-page input:not([type="checkbox"]):autofill { box-shadow:inset 0 0 0 1000px #ddecfb; -webkit-text-fill-color:var(--text); }
body.login-page .password-toggle { right:8px; width:30px; height:30px; border:0; border-radius:8px; background:transparent; color:#5f7f94; }
body.login-page .password-toggle:hover { background:rgba(255,255,255,.7); color:#315f87; }
body.login-page .remember-row { gap:9px; font-size:12px; line-height:1.3; font-weight:400; }
body.login-page .remember-row input { width:16px; height:16px; margin:0; accent-color:var(--accent); }
body.login-page .primary-button { min-height:48px; border:0; border-radius:11px; background:var(--accent); color:#f8fcff; font-size:14px; font-weight:720; box-shadow:0 10px 20px rgba(45,111,179,.22); }
body.login-page .primary-button:hover { background:#245f9c; }
body.login-page :is(button,input[type="checkbox"]):focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
body.login-page .form-error { margin:0; font-size:12px; line-height:1.45; color:#a53c45; }
html[data-theme="dark"] body.login-page { --text:#dbeaf5; --muted:#a2b9cb; --accent:#5496da; }
html[data-theme="dark"] .login-depth-scene { background:#102331; }
html[data-theme="dark"] body.login-page .login-panel { background:rgba(16,35,49,.72); border-color:rgba(153,189,216,.24); box-shadow:0 24px 52px rgba(0,0,0,.2); }
html[data-theme="dark"] body.login-page h1 { color:var(--text); }
html[data-theme="dark"] body.login-page .eyebrow { color:#589bd7; }
html[data-theme="dark"] body.login-page input:not([type="checkbox"]) { background:rgba(29,51,68,.8); color:var(--text); border-color:rgba(153,189,216,.24); }
html[data-theme="dark"] body.login-page input:not([type="checkbox"]):autofill { box-shadow:inset 0 0 0 1000px #1d3344; }
html[data-theme="dark"] body.login-page .form-error { color:#f0a0a7; }
@media(max-width:480px) {
  body.login-page .login-shell { padding:16px; }
  body.login-page input:not([type="checkbox"]) { font-size:16px; }
}