*{box-sizing:border-box}body.auth-page{margin:0;min-height:100svh;display:grid;place-items:center;padding:40px 20px;font-family:'Segoe UI',Arial,sans-serif;color:#252a2b;background:#302b20 url('../images/background.png') center/cover no-repeat fixed}.auth-card{width:100%;max-width:460px;background:rgba(255,252,245,.97);border:1px solid #e8d7b2;border-radius:24px;padding:34px 38px 22px;box-shadow:0 28px 90px #0007;border-top:4px solid #c6a052}.auth-brand{display:flex;align-items:center;justify-content:center;gap:13px;color:#303834;text-decoration:none;font-size:13px;letter-spacing:2px;font-weight:700}.auth-brand small{display:block;font-size:10px;letter-spacing:4px;color:#96712f;margin-top:5px}.brand-seal{font-size:32px;color:#a67c31;border:1px solid #d7bc82;border-radius:50%;width:55px;height:55px;display:grid;place-items:center}.auth-heading{text-align:center;margin:28px 0 24px}.eyebrow{color:#9b7839;font-size:10px;font-weight:700;letter-spacing:2px}.auth-heading h1{font-family:Georgia,serif;font-weight:400;font-size:35px;margin:10px 0}.auth-heading p{font-size:14px;line-height:1.6;color:#70736d;margin:0}.auth-tabs{display:flex;background:#eeeae1;border-radius:10px;padding:4px;margin-bottom:24px}.auth-tabs a{flex:1;text-align:center;padding:10px;color:#656962;text-decoration:none;font-size:14px;border-radius:7px}.auth-tabs a[aria-current]{background:#fffdf7;color:#72541f;box-shadow:0 2px 6px #0001;font-weight:600}.auth-field{margin-bottom:16px}.auth-field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px}.auth-field input{width:100%;border:1px solid #d6d5cb;border-radius:9px;padding:12px 14px;background:#fffefb;font:inherit;font-size:15px;color:#25322c;min-height:46px}.auth-field small{display:block;margin-top:6px;font-size:11px;line-height:1.5;color:#73776f}.auth-field input:focus{outline:3px solid #bd974c33;border-color:#ac833b}.auth-field input[aria-invalid=true]{border-color:#b44035}.auth-field .field-error,.error-summary{color:#a52e28;font-size:12px}.error-summary,.status-message{padding:12px;background:#fbebe6;border-radius:8px;line-height:1.5;margin-bottom:16px}.status-message{background:#e6efe4;color:#356443;font-size:13px}.password-wrap{position:relative}.password-wrap input{padding-right:65px}.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;color:#786037;cursor:pointer;padding:7px}.remember{display:flex;gap:8px;align-items:center;font-size:13px;color:#686e65;margin:8px 0 22px}.remember input{accent-color:#927035;width:16px;height:16px}.auth-submit{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;border:0;border-radius:9px;padding:14px;background:linear-gradient(110deg,#253f35,#3c5647);color:#fff7e8;font:600 15px 'Segoe UI',sans-serif;cursor:pointer;box-shadow:0 5px 14px #253f3526}.auth-submit:hover{background:#233b31}.auth-submit:disabled{cursor:wait;opacity:.75}.loading-status{font-size:12px;text-align:center;min-height:16px;margin:8px 0;color:#73776f}.auth-footer{text-align:center;border-top:1px solid #e8e3d7;padding-top:17px;font-size:10px;color:#86877d;line-height:1.7}.auth-footer span{margin:0 5px;color:#b68e45}.spinner{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:auth-spin .7s linear infinite;display:inline-block}.spinner[hidden]{display:none}@keyframes auth-spin{to{transform:rotate(360deg)}}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #bb974c;outline-offset:4px}.profile-menu{position:relative;margin-left:auto;flex-shrink:0}.profile-menu summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;padding:7px 12px;border:1px solid #ded9ce;border-radius:30px;background:#fffdf7;font-size:13px}.profile-menu summary::-webkit-details-marker{display:none}.profile-avatar{display:grid;place-items:center;background:#304b3e;color:#f4db9e;width:34px;height:34px;border-radius:50%;font-weight:700}.profile-name{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-dropdown{position:absolute;right:0;top:calc(100% + 10px);width:260px;background:#fffdf7;border:1px solid #e0d8c5;border-radius:13px;box-shadow:0 12px 35px #0002;padding:18px;z-index:100;overflow-wrap:anywhere}.profile-dropdown strong,.profile-dropdown small{display:block;margin-bottom:6px}.profile-dropdown small{color:#74786d}.profile-dropdown form{margin-top:16px}.profile-dropdown .loading-status:empty{display:none}.topbar{gap:20px}.profile-dropdown .auth-submit{font-size:13px;padding:10px}@media(max-width:520px){body.auth-page{padding:20px 12px}.auth-card{padding:28px 23px 18px;border-radius:18px}.auth-heading h1{font-size:30px}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}

/* Full-screen authentication backdrop and polished account card. */
html:has(body.auth-page) {
    min-height: 100%;
    background: #302b20;
}
body.auth-page {
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    padding: clamp(20px, 4vh, 48px) 16px;
    background: #302b20;
    isolation: isolate;
}
body.auth-page::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    background: url('../images/background.png') center center / 100% 100% no-repeat;
    pointer-events: none;
}
.auth-page .auth-card {
    max-width: 470px;
    padding: 32px 38px 22px;
    border: 1px solid rgba(236, 210, 154, .9);
    border-top: 4px solid #c39a49;
    border-radius: 26px;
    background: linear-gradient(145deg, rgba(255, 253, 246, .97), rgba(247, 239, 219, .94));
    box-shadow: 0 24px 70px rgba(20, 15, 5, .4), inset 0 0 0 5px rgba(255, 255, 255, .35);
}
.auth-page .brand-seal {
    width: 62px;
    height: 62px;
    flex-shrink: 0;
    background: linear-gradient(145deg, #fff9e9, #ecd29a);
    border-color: #c9a453;
    box-shadow: 0 5px 16px #8b642022, inset 0 0 0 4px #fff9ec;
}
.auth-page .auth-heading h1 { color: #263d32; }
.auth-page .auth-tabs {
    background: #e8e2d4;
    border: 1px solid #dfd5c1;
    border-radius: 12px;
}
.auth-page .auth-tabs a { transition: background .18s ease, box-shadow .18s ease; }
.auth-page .auth-tabs a[aria-current] {
    background: linear-gradient(135deg, #fffdf7, #f7ecd3);
    box-shadow: 0 2px 7px #70522420;
}
.auth-page .auth-field input {
    border-radius: 11px;
    background: rgba(255, 255, 255, .85);
    box-shadow: inset 0 1px 3px #243b3010;
    font-size: 16px;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.auth-page .auth-field input:focus { box-shadow: 0 0 0 4px #bb93451a; }
.auth-page .auth-submit {
    min-height: 49px;
    border: 1px solid #4f6655;
    border-radius: 11px;
    background: linear-gradient(120deg, #203f32, #44634c);
    box-shadow: 0 7px 18px #203f3233, inset 0 1px 0 #ffffff25;
    transition: transform .18s ease, box-shadow .18s ease;
}
.auth-page .auth-submit:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px #203f3244;
}
.auth-page .auth-submit:active:not(:disabled) { transform: translateY(0); }
@media (max-width: 520px) {
    .auth-page .auth-card { padding: 25px 22px 18px; border-radius: 20px; }
    .auth-page .auth-brand { font-size: 11px; letter-spacing: 1.5px; }
    .auth-page .auth-heading { margin: 22px 0 20px; }
}
@media (max-height: 740px) and (min-width: 521px) {
    body.auth-page { padding: 18px 16px; }
    .auth-page .auth-card { padding-top: 24px; padding-bottom: 16px; }
    .auth-page .auth-heading { margin: 18px 0; }
}
@media (prefers-reduced-motion: reduce) {
    .auth-page .auth-submit, .auth-page .auth-tabs a, .auth-page .auth-field input { transition: none; }
    .auth-page .auth-submit:hover:not(:disabled) { transform: none; }
}

.auth-page img.brand-seal { display: block; object-fit: contain; background: #fff; }

/* Readable text sizes throughout the account forms. */
.auth-page .auth-brand { font-size: 17px; letter-spacing: 1.2px; line-height: 1.5; }
.auth-page .auth-brand small { font-size: 13px; letter-spacing: 2.5px; }
.auth-page .eyebrow { font-size: 13px; letter-spacing: 1.5px; color: #78591f; }
.auth-page .auth-heading h1 { font-size: 40px; }
.auth-page .auth-heading p,
.auth-page .auth-tabs a,
.auth-page .auth-field label,
.auth-page .remember { font-size: 16px; line-height: 1.5; }
.auth-page .auth-heading p,
.auth-page .remember { color: #51594f; }
.auth-page .auth-field input { font-size: 17px; }
.auth-page .password-toggle { font-size: 14px; }
.auth-page .auth-submit { font-size: 18px; }
.auth-page .auth-field small,
.auth-page .error-summary,
.auth-page .status-message,
.auth-page .loading-status,
.auth-page .auth-footer { font-size: 14px; line-height: 1.6; }
.auth-page .auth-footer { color: #596052; }
@media (max-width: 380px) {
    .auth-page .auth-brand { font-size: 15px; letter-spacing: .5px; gap: 9px; }
    .auth-page .auth-brand small { letter-spacing: 1.5px; }
    .auth-page .auth-heading h1 { font-size: 34px; }
}
