/* Home sign-in panel: clear primary action, readable secondary options. */
@media screen {
  .login .login-form-side { min-width:0; padding:32px 24px; }
  .login .login-form {
    position:relative; width:100%; max-width:480px; padding:38px;
    border:1px solid #dfe5ef; border-radius:24px; background:#fff;
    box-shadow:0 18px 55px #283c6010;
  }
  .login .login-form::before {
    content:""; position:absolute; top:0; left:38px; width:64px; height:4px;
    border-radius:0 0 4px 4px; background:#344d7b;
  }
  .login .section-kicker { font-size:14px; font-weight:650; letter-spacing:.08em; color:#66758e; }
  .login .login-form h2 { margin:10px 0 0; font-size:32px; font-weight:750; line-height:1.4; letter-spacing:0; color:#253b61; }
  .login .login-form>.muted { margin:10px 0 28px; color:#66758d; font-size:16px; line-height:1.7; }
  .login .login-qr-entry { margin:0; }
  .login .login-form .btn.login-qr-button {
    min-height:76px; padding:14px 18px; gap:13px; border:1px solid #304775;
    border-radius:14px; color:#fff; background:#304775; font-size:21px; font-weight:750;
    box-shadow:0 6px 16px #30477520; transition:background .18s,box-shadow .18s;
  }
  .login .login-qr-button>svg { flex:0 0 42px; width:42px; height:42px; padding:7px; border-radius:10px; background:#ffffff17; }
  .login .login-qr-button>span:last-child { font-size:24px; font-weight:500; }
  .login .login-form .btn.login-qr-button:hover { color:#fff; background:#24395f; border-color:#24395f; box-shadow:0 8px 20px #3047752b; }
  .login .login-qr-entry>p { margin:10px 2px 0; font-size:14px; line-height:1.65; color:#60718b; }
  .login #google-login { margin:26px 0 0; }
  .login .login-form .google-login-button {
    min-height:58px; padding:13px 12px; font-size:18px; font-weight:700; line-height:1.5;
    border-radius:12px; border-color:#cbd5e6!important; color:#30466b!important;
    background:#fff!important; box-shadow:0 2px 6px #30477505!important;
  }
  .login .login-form .google-login-button:hover { background:#f4f7fc!important; border-color:#7a90b3!important; }
  .login .google-domain-help { margin:12px 2px 0; font-size:14px; line-height:1.8; color:#60718b; text-align:left; }
  .login .google-domain-help .login-domain { white-space:nowrap; font-weight:650; color:#405b84; }
  .login .login-privacy-link { margin:8px 2px 0; color:#526b91; font-size:14px; line-height:1.7; text-underline-offset:4px; }
  .login .google-pending { font-size:14px; line-height:1.6; }
  .login .password-login { margin:24px 0 0; padding:0; border:1px solid #dfe5ef; border-radius:12px; background:#f7f9fc; }
  .login .password-login>summary {
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    min-height:54px; margin:0; padding:14px 17px; list-style:none;
    color:#405676; font-size:16px; font-weight:650; line-height:1.6; border-radius:11px;
  }
  .login .password-login>summary::-webkit-details-marker { display:none; }
  .login .password-login>summary::after {
    content:""; width:8px; height:8px; flex-shrink:0; margin-right:3px;
    border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg);
  }
  .login .password-login[open]>summary::after { transform:rotate(225deg); }
  .login .password-login>summary:hover { background:#edf2fa; }
  .login #login-form { padding:3px 17px 18px; }
  .login #login-form>.field { margin:0 0 16px; }
  .login #login-form label { font-size:15px; line-height:1.6; color:#405676; }
  .login #login-form :is(input,select) { min-height:50px; padding:11px 12px; font-size:16px; border-radius:9px; background-color:#fff; }
  .login #login-form>button[type=submit] { min-height:52px; margin:4px 0 0; font-size:17px; border-radius:10px; }
  .login .login-form .footnote { margin:22px 0 0; color:#718097; font-size:13px; line-height:1.8; }
  .login .login-form :is(button,summary,a,input,select):focus-visible { outline:3px solid #7195c6; outline-offset:3px; }
}
@media screen and (max-width:1100px) {
  .login .login-form-side { padding:24px 12px; }
  .login .login-form { padding:30px; }
  .login .login-form::before { left:30px; }
  .login .login-form h2 { font-size:30px; }
}
@media screen and (max-width:600px) {
  .login .login-form-side { padding:20px 16px 30px; }
  .login .login-form { max-width:480px; padding:28px 23px; border-radius:20px; }
  .login .login-form::before { left:23px; }
  .login .login-form h2 { font-size:27px; }
  .login .login-form>.muted { margin-bottom:24px; font-size:15px; }
  .login .login-form .btn.login-qr-button { min-height:68px; padding:12px 14px; gap:10px; font-size:20px; }
  .login .login-qr-button>svg { flex-basis:36px; width:36px; height:36px; padding:5px; }
  .login .login-qr-entry>p { font-size:13px; }
  .login #google-login { margin-top:22px; }
  .login .login-form .google-login-button { font-size:17px; }
}
@media screen and (max-width:360px) {
  .login .login-form-side { padding-inline:12px; }
  .login .login-form { padding-inline:18px; }
  .login .login-form::before { left:18px; }
  .login .login-form h2 { font-size:25px; }
  .login .login-form .btn.login-qr-button { font-size:18px; }
  .login .login-form .google-login-button { font-size:16px; }
}