/* ── Login ── */
  .login{
    position: fixed; inset:0; z-index: 50;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap: 22px; padding: 28px;
    padding-top: calc(28px + env(safe-area-inset-top));
    background-color: var(--bg);
    background-image: var(--wall-default);
    background-size: cover;
    background-position: center;
}

.ys-remember{ display:flex; align-items:center; gap:8px; color:var(--text-soft); font-size:12px; text-align:left; }
.ys-remember input{ width:auto!important; margin:0; }
  .login .orb{
    width:72px; height:72px; border-radius:50%;
    background-image: var(--avatar-default);
    background-size: cover;
    box-shadow: 0 20px 42px rgba(24,46,67,0.2);
    animation: breathe 4.5s ease-in-out infinite;
  }
  .login h1{ margin:0; font-size:34px; font-weight:500; letter-spacing:0; }
  .login .sub{ margin:-12px 0 0; color: var(--text-soft); font-size:16px; text-align:center; }
  .login form{ display:flex; flex-direction:column; gap:11px; width:100%; max-width:320px; }
  .login input{
    width:100%; padding: 14px 16px; font: inherit; color: var(--text);
    background: var(--field-bg); border:1px solid var(--field-line); border-radius:18px; outline:none;
    transition: border-color .2s ease;
    box-shadow: var(--soft-shadow);
  }
  .login input:focus{ border-color: var(--accent); }
  .login button{
    width:100%; padding: 14px; font: inherit; font-weight:600;
    background: var(--accent); color: var(--accent-fg); border:none; border-radius:18px; cursor:pointer;
  }
  .login button:active{ transform: scale(.99); }
  .login .err{ color:#c0533f; font-size:13px; min-height:16px; text-align:center; margin:0; }
  .hidden{ display:none !important; }
