.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px;
    background:
        radial-gradient(circle at 12% 10%, rgba(217,173,69,.16), transparent 25%),
        linear-gradient(135deg, #edf5f1, #f8faf9);
}
.auth-card {
    width: min(480px, 100%);
    padding: 30px;
    background: #fff;
    border: 1px solid var(--line, #e2e8e5);
    border-top: 5px solid var(--safat-green, #007d42);
    border-radius: 17px;
    box-shadow: 0 18px 48px rgba(23,50,40,.12);
}
.auth-brand { display: flex; align-items: center; gap: 13px; padding-bottom: 22px; border-bottom: 1px solid #e6ebe8; }
.auth-logo { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: #009b55; color: #fff; border: 2px solid #d9ad45; font-weight: 800; }
.auth-brand span { color: #007d42; font-size: 9px; font-weight: 750; letter-spacing: 1px; }
.auth-brand h1 { margin: 4px 0 0; font-size: 18px; }
.auth-intro { margin: 25px 0 18px; }
.auth-eyebrow { color: #007d42; font-size: 9px; font-weight: 750; letter-spacing: 1.1px; }
.auth-intro h2 { margin: 7px 0 5px; font-size: 24px; }
.auth-intro p, .auth-footer, .password-rule { color: #6b7781; font-size: 12px; }
.auth-card label { display: block; margin: 14px 0 6px; color: #25313b; font-size: 12px; font-weight: 650; }
.auth-card input {
    width: 100%;
    height: 44px;
    padding: 0 12px;
    border: 1px solid #dce4e0;
    border-radius: 9px;
    outline: none;
}
.auth-card input:focus { border-color: #009b55; box-shadow: 0 0 0 3px rgba(0,155,85,.12); }
.password-field { position: relative; }
.password-field input { padding-right: 65px; }
.password-field button { position: absolute; right: 7px; top: 6px; height: 32px; border: 0; background: #eef4f1; color: #007d42; border-radius: 7px; }
.auth-submit {
    display: block;
    width: 100%;
    margin-top: 20px;
    padding: 12px 16px;
    border: 0;
    border-radius: 9px;
    background: linear-gradient(90deg, #007d42, #009b55);
    color: #fff;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}
.auth-alert, .auth-success { padding: 12px 14px; border-radius: 9px; font-size: 12px; margin: 16px 0; }
.auth-alert { color: #a52b34; background: #fdecee; border: 1px solid #f6d5d8; }
.auth-success { color: #087647; background: #e8f6ef; border: 1px solid #cfeadd; }
.auth-security { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 17px; }
.auth-security span { padding: 5px 7px; border-radius: 99px; background: #f1f5f3; color: #64716a; font-size: 9px; }
.auth-footer { text-align: center; margin: 20px 0 0; }
.auth-link-button { box-sizing: border-box; }
.signed-user { padding: 10px 0 12px; }
.signed-user span, .signed-user small { display: block; }
.signed-user span { color: #fff; font-size: 12px; font-weight: 650; }
.signed-user small { color: #91a0ab; margin-top: 3px; font-size: 10px; }
.admin-page { min-height: 100vh; padding: 35px; background: #f3f6f5; }
.admin-card { max-width: 1000px; margin: auto; padding: 30px; background: #fff; border-radius: 15px; box-shadow: 0 12px 35px rgba(20,45,35,.08); }
.admin-card h1 { color: #007d42; }
.admin-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 25px 0; }
.admin-grid article { padding: 20px; border: 1px solid #e2e8e5; border-radius: 11px; }
.admin-grid strong, .admin-grid span { display: block; }
.admin-grid span { margin-top: 8px; color: #6b7781; font-size: 12px; }
.admin-actions { display: flex; gap: 10px; }
.admin-actions a { padding: 10px 14px; background: #182535; color: #fff; border-radius: 8px; text-decoration: none; }
@media (max-width: 650px) { .admin-grid { grid-template-columns: 1fr; } }