* {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    body {
      background: #f4f6f9;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 100vh;
      padding: 24px 16px 0;
      flex-direction: column;
      gap: 24px;
    }

    body > .site-footer {
      margin-top: auto;
      margin-left: -16px;
      margin-right: -16px;
      width: calc(100% + 32px);
    }

    .auth-container {
      background: #fff;
      padding: 40px;
      border-radius: 8px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
      width: 100%;
      max-width: 400px;
      text-align: center;
    }

    .brand-npa {
      font-weight: 800;
      color: #0056b3;
      font-size: 28px;
      margin-bottom: 5px;
    }

    .subtitle {
      color: #7f8c8d;
      margin-bottom: 30px;
      font-size: 14px;
    }

    .form-group {
      text-align: left;
      margin-bottom: 20px;
    }

    label {
      display: block;
      margin-bottom: 8px;
      font-weight: bold;
      color: #333;
      font-size: 14px;
    }

    input {
      width: 100%;
      padding: 12px;
      border: 1px solid #ddd;
      border-radius: 4px;
      outline: none;
      transition: 0.3s;
    }

    input:focus {
      border-color: #3498db;
      box-shadow: 0 0 5px rgba(52, 152, 219, 0.3);
    }

    .btn-submit {
      width: 100%;
      padding: 12px;
      background: #0056b3;
      color: white;
      border: none;
      border-radius: 4px;
      font-size: 16px;
      font-weight: bold;
      cursor: pointer;
      transition: 0.3s;
      margin-top: 10px;
    }

    .btn-submit:hover {
      background: #004494;
    }

    .links {
      margin-top: 20px;
      font-size: 14px;
    }

    .links a {
      color: #3498db;
      text-decoration: none;
      font-weight: bold;
    }

    .links a:hover {
      text-decoration: underline;
    }

    .msg {
      padding: 10px;
      border-radius: 4px;
      margin-bottom: 20px;
      font-size: 14px;
      font-weight: bold;
    }

    .msg.error {
      background: #f8d7da;
      color: #721c24;
      border: 1px solid #f5c6cb;
    }

    .msg.locked {
      background: linear-gradient(135deg, #fff1f1, #ffe0e0);
      color: #8b0000;
      border: 2px solid #e74c3c;
      box-shadow: 0 8px 22px rgba(231, 76, 60, 0.18);
      display: flex;
      gap: 10px;
      align-items: flex-start;
      text-align: left;
      line-height: 1.5;
      animation: lockPulse 1.8s ease-in-out infinite;
    }

    .msg.locked .msg-icon {
      font-size: 22px;
      line-height: 1.2;
      flex: 0 0 auto;
    }

    @keyframes lockPulse {
      0%, 100% { transform: translateY(0); box-shadow: 0 8px 22px rgba(231, 76, 60, 0.15); }
      50% { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(231, 76, 60, 0.25); }
    }


    .brand-logo {
      display: block;
      width: 92px;
      height: 92px;
      max-width: 92px;
      margin: 0 auto 8px;
      object-fit: cover;
      border-radius: 12px;
      box-shadow: 0 5px 16px rgba(220, 38, 38, .22);
      flex: 0 0 auto;
    }

    .auth-hotline {
      display: block;
      margin: 0 auto 14px;
      color: #e50914;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: .2px;
      text-decoration: none;
    }

    .auth-hotline:hover,
    .auth-hotline:focus-visible {
      color: #b8000a;
      text-decoration: underline;
    }

    @media (max-width: 480px) {
      .auth-container { padding: 28px 22px; }
      .brand-logo { width: 82px; height: 82px; max-width: 82px; }
    }

    .password-field {
      position: relative;
      display: flex;
      align-items: center;
    }

    .password-field input {
      padding-right: 72px;
    }

    .password-toggle {
      position: absolute;
      right: 8px;
      top: 50%;
      transform: translateY(-50%);
      min-width: 52px;
      padding: 7px 8px;
      border: 0;
      border-radius: 5px;
      background: #eef3f8;
      color: #0056b3;
      font-size: 12px;
      font-weight: 700;
      line-height: 1;
      cursor: pointer;
    }

    .password-toggle:hover,
    .password-toggle:focus-visible {
      background: #dfeaf5;
      outline: 2px solid rgba(0, 86, 179, 0.25);
      outline-offset: 1px;
    }

    .auth-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: #8a94a0; font-size: 13px; }
    .auth-divider::before, .auth-divider::after { content: ''; height: 1px; background: #e4e8ed; flex: 1; }
    .google-auth-btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 11px 14px; border: 1px solid #ccd4dc; border-radius: 4px; background: #fff; color: #263238; text-decoration: none; font-weight: 700; transition: .2s; }
    .google-auth-btn:hover, .google-auth-btn:focus-visible { border-color: #4285f4; background: #f8fbff; box-shadow: 0 2px 8px rgba(66,133,244,.15); }
    .google-g { color: #4285f4; font-size: 19px; font-weight: 900; font-family: Arial, sans-serif; }