/* Login-only styles. Keep the authenticated workspace and auth contracts intact. */
#login-screen { width:100%; height:100dvh; min-height:0; overflow:auto; overscroll-behavior:contain; color:#172b49; }
#login-screen .login-card { grid-template-columns:minmax(0, 56.5fr) minmax(0, 43.5fr); min-height:100vh; min-height:100dvh; overflow:visible; }
#login-screen .login-brand { min-height:100%; padding:0; display:block; background:#e9f1fc; }
#login-screen .login-brand::before { content:""; position:absolute; inset:0; background:url('./assets/login-chemistry-hero.png') center / cover no-repeat; transform:scale(.85); transform-origin:left bottom; mask-image:linear-gradient(to right,#000 85%,transparent),linear-gradient(to bottom,transparent,#000 18%); mask-composite:intersect; pointer-events:none; }
#login-screen .login-wordmark { position:absolute; top:6.4%; left:6.5%; width:clamp(160px,16vw,264px); height:clamp(29px,2.8vw,46px); object-fit:cover; mix-blend-mode:multiply; }
#login-screen .login-brand-copy { position:absolute; top:26%; left:8.5%; width:83%; text-align:left; transform:none; }
#login-screen .login-brand h1 { color:#08245e; font-size:clamp(32px,2.5vw,40px); line-height:1.3; letter-spacing:0; font-weight:750; }
#login-screen .login-brand p { color:#1743b5; margin-top:16px; font-size:clamp(16px,1.2vw,18px); line-height:1.6; font-weight:400; letter-spacing:.035em; }
#login-screen .login-panel { min-height:100vh; min-height:100dvh; padding:64px clamp(32px,5.4vw,90px); }
#login-screen .login-panel-inner { width:100%; max-width:440px; min-width:0; }
#login-screen h2 { color:#08245e; font-size:clamp(30px,2vw,32px); font-weight:750; line-height:1.3; margin:0 0 8px; }
#login-screen .login-subtitle { font-size:16px; margin:0 0 36px; color:#1640b5; }
#login-screen .login-tabs.is-account-only { display:none; }
#login-screen .login-method label { display:block; font-size:15px; font-weight:400; color:#243650; line-height:1.5; margin-bottom:8px; }
#login-screen .login-method input:not([type=checkbox]):not([type=hidden]) { width:100%; min-width:0; height:52px; border:1px solid #ccd6e5; border-radius:7px; padding:0 16px; font-size:16px; line-height:normal; background:#fff; color:#172b49; box-shadow:none; }
#login-screen input::placeholder { color:#8a95a5; opacity:1; }
#login-screen input:focus-visible, #login-screen button:focus-visible { outline:3px solid #a5bef8; outline-offset:3px; }
#login-screen .login-password-label { margin-top:22px; }
#login-screen .login-password-field { position:relative; }
#login-screen #login-password { padding-right:62px; }
#login-screen #login-password-toggle { position:absolute; right:10px; top:50%; transform:translateY(-50%); width:40px; height:40px; min-width:0; min-height:0; display:grid; place-items:center; border:0; background:transparent; border-radius:5px; padding:8px; }
#login-screen #login-password-toggle img { width:20px; height:20px; opacity:.75; }
#login-screen .login-options { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:18px 0 22px; }
#login-screen .login-method .login-remember { display:flex; align-items:center; gap:8px; margin:0; font-size:14px; font-weight:400; cursor:pointer; }
#login-screen #login-remember { width:18px; height:18px; min-height:0; margin:0; accent-color:#1645cc; }
#login-screen .text-link { font-size:14px; font-weight:400; color:#1743bc; min-height:32px; }
#login-screen .login-submit { width:100%; height:52px; min-height:52px; padding:10px 20px; background:#1643c4; border:1px solid #1643c4; border-radius:7px; color:white; font-size:18px; font-weight:650; }
#login-screen .login-submit:hover { background:#1035a3; }
#login-screen .login-status { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
@media (min-width:861px) and (max-height:700px) {
  #login-screen .login-panel { padding-top:36px; padding-bottom:28px; }
  #login-screen .login-subtitle { margin-bottom:28px; }
  #login-screen .login-brand-copy { top:24%; }
}
@media (max-width:860px) {
  #login-screen .login-card { grid-template-columns:1fr; }
  #login-screen .login-brand { min-height:210px; }
  #login-screen .login-brand::before { background-position:center 26%; }
  #login-screen .login-wordmark { top:24px; left:16px; width:192px; height:32px; }
  #login-screen .login-brand-copy { top:92px; left:32px; width:calc(100% - 64px); }
  #login-screen .login-brand h1 { font-size:28px; }
  #login-screen .login-brand p { font-size:16px; margin-top:12px; }
  #login-screen .login-panel { min-height:0; padding:40px 28px; }
  #login-screen .login-panel-inner { max-width:440px; }
  #login-screen .login-subtitle { margin-bottom:32px; }
}
@media (max-width:400px) {
  #login-screen .login-brand h1 { font-size:26px; }
  #login-screen .login-brand-copy { left:24px; width:calc(100% - 48px); }
  #login-screen .login-panel { padding:32px 24px; }
}